@fluentui/react-spinner 9.2.7 → 9.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +60 -1
- package/CHANGELOG.md +21 -2
- package/dist/index.d.ts +16 -1
- package/lib/components/Spinner/Spinner.types.js.map +1 -1
- package/lib/components/Spinner/useSpinner.js +3 -1
- package/lib/components/Spinner/useSpinner.js.map +1 -1
- package/lib/components/Spinner/useSpinnerStyles.styles.js +15 -1
- package/lib/components/Spinner/useSpinnerStyles.styles.js.map +1 -1
- package/lib/contexts/SpinnerContext.js +10 -0
- package/lib/contexts/SpinnerContext.js.map +1 -0
- package/lib/contexts/index.js +1 -0
- package/lib/contexts/index.js.map +1 -0
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Spinner/useSpinner.js +3 -1
- package/lib-commonjs/components/Spinner/useSpinner.js.map +1 -1
- package/lib-commonjs/components/Spinner/useSpinnerStyles.styles.js +18 -1
- package/lib-commonjs/components/Spinner/useSpinnerStyles.styles.js.map +1 -1
- package/lib-commonjs/contexts/SpinnerContext.js +21 -0
- package/lib-commonjs/contexts/SpinnerContext.js.map +1 -0
- package/lib-commonjs/contexts/index.js +6 -0
- package/lib-commonjs/contexts/index.js.map +1 -0
- package/lib-commonjs/index.js +4 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +5 -5
package/CHANGELOG.json
CHANGED
|
@@ -2,7 +2,66 @@
|
|
|
2
2
|
"name": "@fluentui/react-spinner",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
5
|
+
"date": "Thu, 20 Jul 2023 18:24:25 GMT",
|
|
6
|
+
"tag": "@fluentui/react-spinner_v9.3.1",
|
|
7
|
+
"version": "9.3.1",
|
|
8
|
+
"comments": {
|
|
9
|
+
"none": [
|
|
10
|
+
{
|
|
11
|
+
"author": "olfedias@microsoft.com",
|
|
12
|
+
"package": "@fluentui/react-spinner",
|
|
13
|
+
"commit": "5a4b16715e8e929f11d8113f710e578ca73acaa6",
|
|
14
|
+
"comment": "chore: migrate to monosize"
|
|
15
|
+
}
|
|
16
|
+
],
|
|
17
|
+
"patch": [
|
|
18
|
+
{
|
|
19
|
+
"author": "beachball",
|
|
20
|
+
"package": "@fluentui/react-spinner",
|
|
21
|
+
"comment": "Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.12",
|
|
22
|
+
"commit": "5a4b16715e8e929f11d8113f710e578ca73acaa6"
|
|
23
|
+
},
|
|
24
|
+
{
|
|
25
|
+
"author": "beachball",
|
|
26
|
+
"package": "@fluentui/react-spinner",
|
|
27
|
+
"comment": "Bump @fluentui/react-label to v9.1.21",
|
|
28
|
+
"commit": "5a4b16715e8e929f11d8113f710e578ca73acaa6"
|
|
29
|
+
}
|
|
30
|
+
]
|
|
31
|
+
}
|
|
32
|
+
},
|
|
33
|
+
{
|
|
34
|
+
"date": "Mon, 17 Jul 2023 21:27:36 GMT",
|
|
35
|
+
"tag": "@fluentui/react-spinner_v9.3.0",
|
|
36
|
+
"version": "9.3.0",
|
|
37
|
+
"comments": {
|
|
38
|
+
"minor": [
|
|
39
|
+
{
|
|
40
|
+
"author": "ololubek@microsoft.com",
|
|
41
|
+
"package": "@fluentui/react-spinner",
|
|
42
|
+
"commit": "3f65c7cfb7dad7a2c55b649778ced4c43cfc5bb1",
|
|
43
|
+
"comment": "feat: add extra-tiny value to size prop of Spinner"
|
|
44
|
+
}
|
|
45
|
+
]
|
|
46
|
+
}
|
|
47
|
+
},
|
|
48
|
+
{
|
|
49
|
+
"date": "Thu, 13 Jul 2023 21:25:45 GMT",
|
|
50
|
+
"tag": "@fluentui/react-spinner_v9.2.7",
|
|
51
|
+
"version": "9.2.7",
|
|
52
|
+
"comments": {
|
|
53
|
+
"none": [
|
|
54
|
+
{
|
|
55
|
+
"author": "martinhochel@microsoft.com",
|
|
56
|
+
"package": "@fluentui/react-spinner",
|
|
57
|
+
"commit": "8a9e1018f2abb2c7608c49d32acf44e93c43cba6",
|
|
58
|
+
"comment": "chore: update devDependencies to use * for inner workspace dependencies"
|
|
59
|
+
}
|
|
60
|
+
]
|
|
61
|
+
}
|
|
62
|
+
},
|
|
63
|
+
{
|
|
64
|
+
"date": "Tue, 11 Jul 2023 18:46:36 GMT",
|
|
6
65
|
"tag": "@fluentui/react-spinner_v9.2.7",
|
|
7
66
|
"version": "9.2.7",
|
|
8
67
|
"comments": {
|
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,31 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-spinner
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Thu, 20 Jul 2023 18:24:25 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.3.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.3.1)
|
|
8
|
+
|
|
9
|
+
Thu, 20 Jul 2023 18:24:25 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.3.0..@fluentui/react-spinner_v9.3.1)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- Bump @fluentui/react-jsx-runtime to v9.0.0-alpha.12 ([PR #26826](https://github.com/microsoft/fluentui/pull/26826) by beachball)
|
|
15
|
+
- Bump @fluentui/react-label to v9.1.21 ([PR #26826](https://github.com/microsoft/fluentui/pull/26826) by beachball)
|
|
16
|
+
|
|
17
|
+
## [9.3.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.3.0)
|
|
18
|
+
|
|
19
|
+
Mon, 17 Jul 2023 21:27:36 GMT
|
|
20
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.2.7..@fluentui/react-spinner_v9.3.0)
|
|
21
|
+
|
|
22
|
+
### Minor changes
|
|
23
|
+
|
|
24
|
+
- feat: add extra-tiny value to size prop of Spinner ([PR #28249](https://github.com/microsoft/fluentui/pull/28249) by ololubek@microsoft.com)
|
|
25
|
+
|
|
7
26
|
## [9.2.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.2.7)
|
|
8
27
|
|
|
9
|
-
Tue, 11 Jul 2023 18:
|
|
28
|
+
Tue, 11 Jul 2023 18:46:36 GMT
|
|
10
29
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.2.6..@fluentui/react-spinner_v9.2.7)
|
|
11
30
|
|
|
12
31
|
### Patches
|
package/dist/index.d.ts
CHANGED
|
@@ -18,6 +18,16 @@ export declare const Spinner: ForwardRefComponent<SpinnerProps>;
|
|
|
18
18
|
|
|
19
19
|
export declare const spinnerClassNames: SlotClassNames<SpinnerSlots>;
|
|
20
20
|
|
|
21
|
+
/**
|
|
22
|
+
* @internal
|
|
23
|
+
*/
|
|
24
|
+
export declare const SpinnerContextProvider: React_2.Provider<SpinnerContextValue | undefined>;
|
|
25
|
+
|
|
26
|
+
/**
|
|
27
|
+
* @internal
|
|
28
|
+
*/
|
|
29
|
+
export declare type SpinnerContextValue = Pick<SpinnerProps, 'size'>;
|
|
30
|
+
|
|
21
31
|
/**
|
|
22
32
|
* Spinner Props
|
|
23
33
|
*/
|
|
@@ -41,7 +51,7 @@ export declare type SpinnerProps = Omit<ComponentProps<SpinnerSlots>, 'size'> &
|
|
|
41
51
|
* The size of the spinner.
|
|
42
52
|
* @default 'medium'
|
|
43
53
|
*/
|
|
44
|
-
size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';
|
|
54
|
+
size?: 'extra-tiny' | 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';
|
|
45
55
|
};
|
|
46
56
|
|
|
47
57
|
export declare type SpinnerSlots = {
|
|
@@ -84,6 +94,11 @@ export declare type SpinnerState = ComponentState<SpinnerSlots> & Required<Pick<
|
|
|
84
94
|
*/
|
|
85
95
|
export declare const useSpinner_unstable: (props: SpinnerProps, ref: React_2.Ref<HTMLElement>) => SpinnerState;
|
|
86
96
|
|
|
97
|
+
/**
|
|
98
|
+
* @internal
|
|
99
|
+
*/
|
|
100
|
+
export declare const useSpinnerContext: () => SpinnerContextValue;
|
|
101
|
+
|
|
87
102
|
/**
|
|
88
103
|
* Apply styling to the Spinner slots based on the state
|
|
89
104
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["Spinner.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\n\nexport type SpinnerSlots = {\n /**\n * The root of the Spinner.\n * The root slot receives the `className` and `style` specified directly on the `<Spinner>`.\n */\n root: NonNullable<Slot<'div'>>;\n /**\n * The slot for the animated svg.\n * The spinner slot receives the `className` and `style` that handles the spinning animation.\n * An svg is also rendered as a child of this slot\n */\n spinner?: Slot<'span'>;\n /**\n * The label of the Slider.\n * The label slot receives the styling related to the text associated with the Spinner.\n */\n label?: Slot<typeof Label>;\n};\n\n/**\n * Spinner Props\n */\nexport type SpinnerProps = Omit<ComponentProps<SpinnerSlots>, 'size'> & {\n /**\n * The appearance of the Spinner.\n * @default 'primary'\n */\n appearance?: 'primary' | 'inverted';\n\n /**\n * Time in milliseconds after component mount before spinner is visible.\n * @default 0\n */\n delay?: number;\n\n /**\n * Where the label is positioned relative to the Spinner\n * @default 'after'\n */\n labelPosition?: 'above' | 'below' | 'before' | 'after';\n\n /**\n * The size of the spinner.\n * @default 'medium'\n */\n size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n};\n\n/**\n * State used in rendering Spinner\n */\nexport type SpinnerState = ComponentState<SpinnerSlots> &\n Required<Pick<SpinnerProps, 'appearance' | 'delay' | 'labelPosition' | 'size'>> & {\n /**\n * Should the spinner be rendered in the DOM\n */\n shouldRenderSpinner: boolean;\n };\n"],"names":[],"mappings":"AAAA,WA4DI"}
|
|
1
|
+
{"version":3,"sources":["Spinner.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\n\nexport type SpinnerSlots = {\n /**\n * The root of the Spinner.\n * The root slot receives the `className` and `style` specified directly on the `<Spinner>`.\n */\n root: NonNullable<Slot<'div'>>;\n /**\n * The slot for the animated svg.\n * The spinner slot receives the `className` and `style` that handles the spinning animation.\n * An svg is also rendered as a child of this slot\n */\n spinner?: Slot<'span'>;\n /**\n * The label of the Slider.\n * The label slot receives the styling related to the text associated with the Spinner.\n */\n label?: Slot<typeof Label>;\n};\n\n/**\n * Spinner Props\n */\nexport type SpinnerProps = Omit<ComponentProps<SpinnerSlots>, 'size'> & {\n /**\n * The appearance of the Spinner.\n * @default 'primary'\n */\n appearance?: 'primary' | 'inverted';\n\n /**\n * Time in milliseconds after component mount before spinner is visible.\n * @default 0\n */\n delay?: number;\n\n /**\n * Where the label is positioned relative to the Spinner\n * @default 'after'\n */\n labelPosition?: 'above' | 'below' | 'before' | 'after';\n\n /**\n * The size of the spinner.\n * @default 'medium'\n */\n size?: 'extra-tiny' | 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n};\n\n/**\n * State used in rendering Spinner\n */\nexport type SpinnerState = ComponentState<SpinnerSlots> &\n Required<Pick<SpinnerProps, 'appearance' | 'delay' | 'labelPosition' | 'size'>> & {\n /**\n * Should the spinner be rendered in the DOM\n */\n shouldRenderSpinner: boolean;\n };\n"],"names":[],"mappings":"AAAA,WA4DI"}
|
|
@@ -2,6 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';
|
|
3
3
|
import { Label } from '@fluentui/react-label';
|
|
4
4
|
import { DefaultSvg } from './DefaultSvg';
|
|
5
|
+
import { useSpinnerContext } from '../../contexts/SpinnerContext';
|
|
5
6
|
/**
|
|
6
7
|
* Create the state required to render Spinner.
|
|
7
8
|
*
|
|
@@ -12,7 +13,8 @@ import { DefaultSvg } from './DefaultSvg';
|
|
|
12
13
|
* @param ref - reference to root HTMLElement of Spinner
|
|
13
14
|
*/ export const useSpinner_unstable = (props, ref)=>{
|
|
14
15
|
// Props
|
|
15
|
-
const {
|
|
16
|
+
const { size: contextSize } = useSpinnerContext();
|
|
17
|
+
const { appearance ='primary' , labelPosition ='after' , size =contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' , delay =0 } = props;
|
|
16
18
|
const baseId = useId('spinner');
|
|
17
19
|
const { role ='progressbar' , tabIndex , ...rest } = props;
|
|
18
20
|
const nativeRoot = getNativeElementProps('div', {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport type { SpinnerProps, SpinnerState } from './Spinner.types';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */\nexport const useSpinner_unstable = (props: SpinnerProps, ref: React.Ref<HTMLElement>): SpinnerState => {\n // Props\n const { appearance = 'primary', labelPosition = 'after', size = 'medium', delay = 0 } = props;\n const baseId = useId('spinner');\n\n const { role = 'progressbar', tabIndex, ...rest } = props;\n const nativeRoot = getNativeElementProps('div', { ref, role, ...rest }, ['size']);\n\n const [isVisible, setIsVisible] = React.useState(true);\n\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n React.useEffect(() => {\n if (delay <= 0) {\n return;\n }\n setIsVisible(false);\n setDelayTimeout(() => {\n setIsVisible(true);\n }, delay);\n\n return () => {\n clearDelayTimeout();\n };\n }, [setDelayTimeout, clearDelayTimeout, delay]);\n\n const labelShorthand = resolveShorthand(props.label, {\n defaultProps: {\n id: baseId,\n },\n required: false,\n });\n\n const spinnerShortHand = resolveShorthand(props.spinner, {\n required: true,\n defaultProps: {\n children: <DefaultSvg />,\n tabIndex,\n },\n });\n\n if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n nativeRoot['aria-labelledby'] = labelShorthand.id;\n }\n\n const state: SpinnerState = {\n appearance,\n delay,\n labelPosition,\n size,\n shouldRenderSpinner: isVisible,\n components: {\n root: 'div',\n spinner: 'span',\n label: Label,\n },\n root: nativeRoot,\n spinner: spinnerShortHand,\n label: labelShorthand,\n };\n return state;\n};\n"],"names":["React","getNativeElementProps","resolveShorthand","useId","useTimeout","Label","DefaultSvg","useSpinner_unstable","props","ref","
|
|
1
|
+
{"version":3,"sources":["useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport type { SpinnerProps, SpinnerState } from './Spinner.types';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\nimport { useSpinnerContext } from '../../contexts/SpinnerContext';\n\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */\nexport const useSpinner_unstable = (props: SpinnerProps, ref: React.Ref<HTMLElement>): SpinnerState => {\n // Props\n const { size: contextSize } = useSpinnerContext();\n const { appearance = 'primary', labelPosition = 'after', size = contextSize ?? 'medium', delay = 0 } = props;\n const baseId = useId('spinner');\n\n const { role = 'progressbar', tabIndex, ...rest } = props;\n const nativeRoot = getNativeElementProps('div', { ref, role, ...rest }, ['size']);\n\n const [isVisible, setIsVisible] = React.useState(true);\n\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n React.useEffect(() => {\n if (delay <= 0) {\n return;\n }\n setIsVisible(false);\n setDelayTimeout(() => {\n setIsVisible(true);\n }, delay);\n\n return () => {\n clearDelayTimeout();\n };\n }, [setDelayTimeout, clearDelayTimeout, delay]);\n\n const labelShorthand = resolveShorthand(props.label, {\n defaultProps: {\n id: baseId,\n },\n required: false,\n });\n\n const spinnerShortHand = resolveShorthand(props.spinner, {\n required: true,\n defaultProps: {\n children: <DefaultSvg />,\n tabIndex,\n },\n });\n\n if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n nativeRoot['aria-labelledby'] = labelShorthand.id;\n }\n\n const state: SpinnerState = {\n appearance,\n delay,\n labelPosition,\n size,\n shouldRenderSpinner: isVisible,\n components: {\n root: 'div',\n spinner: 'span',\n label: Label,\n },\n root: nativeRoot,\n spinner: spinnerShortHand,\n label: labelShorthand,\n };\n return state;\n};\n"],"names":["React","getNativeElementProps","resolveShorthand","useId","useTimeout","Label","DefaultSvg","useSpinnerContext","useSpinner_unstable","props","ref","size","contextSize","appearance","labelPosition","delay","baseId","role","tabIndex","rest","nativeRoot","isVisible","setIsVisible","useState","setDelayTimeout","clearDelayTimeout","useEffect","labelShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","state","shouldRenderSpinner","components","root"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,UAAU,QAAQ,4BAA4B;AAEvG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,UAAU,QAAQ,eAAe;AAC1C,SAASC,iBAAiB,QAAQ,gCAAgC;AAElE;;;;;;;;CAQC,GACD,OAAO,MAAMC,sBAAsB,CAACC,OAAqBC,MAA8C;IACrG,QAAQ;IACR,MAAM,EAAEC,MAAMC,YAAW,EAAE,GAAGL;IAC9B,MAAM,EAAEM,YAAa,UAAS,EAAEC,eAAgB,QAAO,EAAEH,MAAOC,wBAAAA,yBAAAA,cAAe,QAAQ,CAAA,EAAEG,OAAQ,EAAC,EAAE,GAAGN;IACvG,MAAMO,SAASb,MAAM;IAErB,MAAM,EAAEc,MAAO,cAAa,EAAEC,SAAQ,EAAE,GAAGC,MAAM,GAAGV;IACpD,MAAMW,aAAanB,sBAAsB,OAAO;QAAES;QAAKO;QAAM,GAAGE,IAAI;IAAC,GAAG;QAAC;KAAO;IAEhF,MAAM,CAACE,WAAWC,aAAa,GAAGtB,MAAMuB,QAAQ,CAAC,IAAI;IAErD,MAAM,CAACC,iBAAiBC,kBAAkB,GAAGrB;IAE7CJ,MAAM0B,SAAS,CAAC,IAAM;QACpB,IAAIX,SAAS,GAAG;YACd;QACF,CAAC;QACDO,aAAa,KAAK;QAClBE,gBAAgB,IAAM;YACpBF,aAAa,IAAI;QACnB,GAAGP;QAEH,OAAO,IAAM;YACXU;QACF;IACF,GAAG;QAACD;QAAiBC;QAAmBV;KAAM;IAE9C,MAAMY,iBAAiBzB,iBAAiBO,MAAMmB,KAAK,EAAE;QACnDC,cAAc;YACZC,IAAId;QACN;QACAe,UAAU,KAAK;IACjB;IAEA,MAAMC,mBAAmB9B,iBAAiBO,MAAMwB,OAAO,EAAE;QACvDF,UAAU,IAAI;QACdF,cAAc;YACZK,wBAAU,oBAAC5B;YACXY;QACF;IACF;IAEA,IAAIS,kBAAkBP,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;QAClEA,UAAU,CAAC,kBAAkB,GAAGO,eAAeG,EAAE;IACnD,CAAC;IAED,MAAMK,QAAsB;QAC1BtB;QACAE;QACAD;QACAH;QACAyB,qBAAqBf;QACrBgB,YAAY;YACVC,MAAM;YACNL,SAAS;YACTL,OAAOvB;QACT;QACAiC,MAAMlB;QACNa,SAASD;QACTJ,OAAOD;IACT;IACA,OAAOQ;AACT,EAAE"}
|
|
@@ -10,6 +10,7 @@ export const spinnerClassNames = {
|
|
|
10
10
|
* Radii for the Spinner circles
|
|
11
11
|
*/
|
|
12
12
|
const rValues = {
|
|
13
|
+
extraTiny: '7px',
|
|
13
14
|
tiny: '9px',
|
|
14
15
|
extraSmall: '11px',
|
|
15
16
|
small: '13px',
|
|
@@ -23,6 +24,7 @@ const rValues = {
|
|
|
23
24
|
* Sizes for the Spinner
|
|
24
25
|
*/
|
|
25
26
|
const spinnnerSizes = {
|
|
27
|
+
extraTiny: '16px',
|
|
26
28
|
tiny: '20px',
|
|
27
29
|
extraSmall: '24px',
|
|
28
30
|
small: '28px',
|
|
@@ -80,6 +82,12 @@ const useLoaderStyles = /*#__PURE__*/__styles({
|
|
|
80
82
|
Bsvqbuc: "f11rfva0",
|
|
81
83
|
b3s3i5: "f1exc66"
|
|
82
84
|
},
|
|
85
|
+
"extra-tiny": {
|
|
86
|
+
Bah9ito: "f1x2gjcb",
|
|
87
|
+
ut6tcf: "f1vjiaua",
|
|
88
|
+
B7p06xz: "fv1u54w",
|
|
89
|
+
B807ibg: "f1oebb0s"
|
|
90
|
+
},
|
|
83
91
|
tiny: {
|
|
84
92
|
Bah9ito: "f1j4wmu2",
|
|
85
93
|
ut6tcf: "f1vppzuq",
|
|
@@ -125,7 +133,7 @@ const useLoaderStyles = /*#__PURE__*/__styles({
|
|
|
125
133
|
}, {
|
|
126
134
|
f: [".f1or16p5:focus{outline-width:3px;}", ".f1grzc83:focus{outline-style:solid;}", ".f19shzzi:focus{outline-color:transparent;}"],
|
|
127
135
|
k: ["@-webkit-keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}", "@-webkit-keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}", "@keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}", "@keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}"],
|
|
128
|
-
d: [".f5tbecn>svg{-webkit-animation-name:fb7n1on;animation-name:fb7n1on;}", ".f15qb8s7>svg{-webkit-animation-name:f1gx3jof;animation-name:f1gx3jof;}", ".fn4mtlg>svg{-webkit-animation-duration:3s;animation-duration:3s;}", ".f1y80fxs>svg{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}", ".f1r2crtq>svg{-webkit-animation-timing-function:linear;animation-timing-function:linear;}", ".f1wsi8sr>svg{background-color:transparent;}", ".f1da2vov>svg>circle{cx:50%;}", ".f11rfva0>svg>circle{cy:50%;}", ".f1exc66>svg>circle{fill:none;}", ".
|
|
136
|
+
d: [".f5tbecn>svg{-webkit-animation-name:fb7n1on;animation-name:fb7n1on;}", ".f15qb8s7>svg{-webkit-animation-name:f1gx3jof;animation-name:f1gx3jof;}", ".fn4mtlg>svg{-webkit-animation-duration:3s;animation-duration:3s;}", ".f1y80fxs>svg{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}", ".f1r2crtq>svg{-webkit-animation-timing-function:linear;animation-timing-function:linear;}", ".f1wsi8sr>svg{background-color:transparent;}", ".f1da2vov>svg>circle{cx:50%;}", ".f11rfva0>svg>circle{cy:50%;}", ".f1exc66>svg>circle{fill:none;}", ".f1x2gjcb>svg{height:16px;}", ".f1vjiaua>svg{width:16px;}", ".fv1u54w>svg>circle{stroke-width:var(--strokeWidthThick);}", ".f1oebb0s>svg>circle{r:7px;}", ".f1j4wmu2>svg{height:20px;}", ".f1vppzuq>svg{width:20px;}", ".fngtx1d>svg>circle{r:9px;}", ".fmpqlna>svg{height:24px;}", ".f15z5jzu>svg{width:24px;}", ".fadawes>svg>circle{r:11px;}", ".fo52gbo>svg{height:28px;}", ".f1b41i3v>svg{width:28px;}", ".f1xqyyrl>svg>circle{r:13px;}", ".f1aiqagr>svg{height:32px;}", ".f1wtx80b>svg{width:32px;}", ".f1flujpd>svg>circle{stroke-width:var(--strokeWidthThicker);}", ".f1u06hy7>svg>circle{r:14.5px;}", ".f1trdq7b>svg{height:36px;}", ".f9e0mc5>svg{width:36px;}", ".f13pmvhl>svg>circle{r:16.5px;}", ".f89rf2a>svg{height:40px;}", ".f1w2xg3q>svg{width:40px;}", ".fmn74v6>svg>circle{r:18.5px;}", ".f1rx7k5y>svg{height:44px;}", ".f1vtyt49>svg{width:44px;}", ".f1owbg48>svg>circle{stroke-width:var(--strokeWidthThickest);}", ".f1fr1izd>svg>circle{r:20px;}"],
|
|
129
137
|
m: [["@media screen and (prefers-reduced-motion: reduce){.f1bkm2qd>svg{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}", {
|
|
130
138
|
m: "screen and (prefers-reduced-motion: reduce)"
|
|
131
139
|
}], ["@media screen and (prefers-reduced-motion: reduce){.f1urqz7h>svg{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}", {
|
|
@@ -183,6 +191,12 @@ const useLabelStyles = /*#__PURE__*/__styles({
|
|
|
183
191
|
sj55zd: "f15aqcq"
|
|
184
192
|
},
|
|
185
193
|
primary: {},
|
|
194
|
+
"extra-tiny": {
|
|
195
|
+
Bahqtrf: "fk6fouc",
|
|
196
|
+
Be2twd7: "fkhj508",
|
|
197
|
+
Bhrd7zp: "figsok6",
|
|
198
|
+
Bg96gwp: "f1i3iumi"
|
|
199
|
+
},
|
|
186
200
|
tiny: {
|
|
187
201
|
Bahqtrf: "fk6fouc",
|
|
188
202
|
Be2twd7: "fkhj508",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className"],"sources":["useSpinnerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinnerClassNames = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label'\n};\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */ const rValues = {\n tiny: '9px',\n extraSmall: '11px',\n small: '13px',\n medium: '14.5px',\n large: '16.5px',\n extraLarge: '18.5px',\n huge: '20px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */ const spinnnerSizes = {\n tiny: '20px',\n extraSmall: '24px',\n small: '28px',\n medium: '32px',\n large: '36px',\n extraLarge: '40px',\n huge: '44px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */ const spinnerAnimation = {\n container: {\n animationDuration: '3s',\n animationIterationCount: 'infinite',\n animationTimingFunction: 'linear',\n backgroundColor: 'transparent'\n }\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n lineHeight: '0',\n ...shorthands.gap('8px')\n },\n horizontal: {\n flexDirection: 'row'\n },\n vertical: {\n flexDirection: 'column'\n }\n});\nconst useLoaderStyles = makeStyles({\n // global SVG class\n spinnerSVG: {\n ':focus': {\n ...shorthands.outline('3px', 'solid', 'transparent')\n },\n ['& > svg']: {\n animationName: {\n '0%': {\n transform: 'rotate(0deg)'\n },\n '100%': {\n transform: 'rotate(360deg)'\n }\n },\n ...spinnerAnimation.container,\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle']: {\n cx: '50%',\n cy: '50%',\n fill: 'none'\n }\n },\n tiny: {\n ['& > svg']: {\n height: spinnnerSizes.tiny,\n width: spinnnerSizes.tiny\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.tiny\n }\n },\n 'extra-small': {\n ['& > svg']: {\n height: spinnnerSizes.extraSmall,\n width: spinnnerSizes.extraSmall\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.extraSmall\n }\n },\n small: {\n ['& > svg']: {\n height: spinnnerSizes.small,\n width: spinnnerSizes.small\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.small\n }\n },\n medium: {\n ['& > svg']: {\n height: spinnnerSizes.medium,\n width: spinnnerSizes.medium\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.medium\n }\n },\n large: {\n ['& > svg']: {\n height: spinnnerSizes.large,\n width: spinnnerSizes.large\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.large\n }\n },\n 'extra-large': {\n ['& > svg']: {\n height: spinnnerSizes.extraLarge,\n width: spinnnerSizes.extraLarge\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.extraLarge\n }\n },\n huge: {\n ['& > svg']: {\n height: spinnnerSizes.huge,\n width: spinnnerSizes.huge\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThickest,\n r: rValues.huge\n }\n }\n});\nconst useTrackStyles = makeStyles({\n inverted: {\n ['& > svg > circle.fui-Spinner__Tail']: {\n stroke: tokens.colorNeutralStrokeOnBrand2,\n animationName: {\n '0%': {\n strokeDasharray: '1,150',\n strokeDashoffset: '0'\n },\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35'\n },\n '100%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-124'\n }\n },\n animationDuration: '1.5s',\n animationIterationCount: 'infinite',\n animationTimingFunction: tokens.curveEasyEase,\n strokeLinecap: 'round',\n transform: 'rotate(-90deg)',\n transformOrigin: '50% 50%',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: 'rgba(255, 255, 255, 0.2)'\n }\n },\n primary: {\n ['& > svg > circle.fui-Spinner__Tail']: {\n stroke: tokens.colorBrandStroke1,\n '@media screen and (forced-colors: active)': {\n stroke: tokens.colorNeutralStrokeOnBrand2\n },\n animationName: {\n '0%': {\n strokeDasharray: '1,150',\n strokeDashoffset: '0'\n },\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35'\n },\n '100%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-124'\n }\n },\n animationDuration: '1.5s',\n animationIterationCount: 'infinite',\n animationTimingFunction: tokens.curveEasyEase,\n strokeLinecap: 'round',\n transform: 'rotate(-90deg)',\n transformOrigin: '50% 50%',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: tokens.colorBrandStroke2,\n '@media screen and (forced-colors: active)': {\n stroke: tokens.colorNeutralBackgroundInverted\n }\n }\n }\n});\nconst useLabelStyles = makeStyles({\n // style for label\n inverted: {\n color: 'rgba(255, 255, 255, 1)'\n },\n primary: {},\n tiny: {\n ...typographyStyles.body1\n },\n 'extra-small': {\n ...typographyStyles.body1\n },\n small: {\n ...typographyStyles.body1\n },\n medium: {\n ...typographyStyles.subtitle2\n },\n large: {\n ...typographyStyles.subtitle2\n },\n 'extra-large': {\n ...typographyStyles.subtitle2\n },\n huge: {\n ...typographyStyles.subtitle1\n }\n});\n/**\n * Apply styling to the Spinner slots based on the state\n */ export const useSpinnerStyles_unstable = (state)=>{\n const { labelPosition , size , appearance ='primary' } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n state.root.className = mergeClasses(spinnerClassNames.root, rootStyles.root, (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical, (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal, state.root.className);\n if (state.spinner) {\n state.spinner.className = mergeClasses(spinnerClassNames.spinner, spinnerStyles.spinnerSVG, spinnerStyles[size], trackStyles[appearance], state.spinner.className);\n }\n if (state.label) {\n state.label.className = mergeClasses(spinnerClassNames.label, labelStyles[size], labelStyles[appearance], state.label.className);\n }\n return state;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","extraTiny","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className"],"sources":["useSpinnerStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinnerClassNames = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label'\n};\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */ const rValues = {\n extraTiny: '7px',\n tiny: '9px',\n extraSmall: '11px',\n small: '13px',\n medium: '14.5px',\n large: '16.5px',\n extraLarge: '18.5px',\n huge: '20px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */ const spinnnerSizes = {\n extraTiny: '16px',\n tiny: '20px',\n extraSmall: '24px',\n small: '28px',\n medium: '32px',\n large: '36px',\n extraLarge: '40px',\n huge: '44px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */ const spinnerAnimation = {\n container: {\n animationDuration: '3s',\n animationIterationCount: 'infinite',\n animationTimingFunction: 'linear',\n backgroundColor: 'transparent'\n }\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n lineHeight: '0',\n ...shorthands.gap('8px')\n },\n horizontal: {\n flexDirection: 'row'\n },\n vertical: {\n flexDirection: 'column'\n }\n});\nconst useLoaderStyles = makeStyles({\n // global SVG class\n spinnerSVG: {\n ':focus': {\n ...shorthands.outline('3px', 'solid', 'transparent')\n },\n ['& > svg']: {\n animationName: {\n '0%': {\n transform: 'rotate(0deg)'\n },\n '100%': {\n transform: 'rotate(360deg)'\n }\n },\n ...spinnerAnimation.container,\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle']: {\n cx: '50%',\n cy: '50%',\n fill: 'none'\n }\n },\n 'extra-tiny': {\n ['& > svg']: {\n height: spinnnerSizes.extraTiny,\n width: spinnnerSizes.extraTiny\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.extraTiny\n }\n },\n tiny: {\n ['& > svg']: {\n height: spinnnerSizes.tiny,\n width: spinnnerSizes.tiny\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.tiny\n }\n },\n 'extra-small': {\n ['& > svg']: {\n height: spinnnerSizes.extraSmall,\n width: spinnnerSizes.extraSmall\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.extraSmall\n }\n },\n small: {\n ['& > svg']: {\n height: spinnnerSizes.small,\n width: spinnnerSizes.small\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThick,\n r: rValues.small\n }\n },\n medium: {\n ['& > svg']: {\n height: spinnnerSizes.medium,\n width: spinnnerSizes.medium\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.medium\n }\n },\n large: {\n ['& > svg']: {\n height: spinnnerSizes.large,\n width: spinnnerSizes.large\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.large\n }\n },\n 'extra-large': {\n ['& > svg']: {\n height: spinnnerSizes.extraLarge,\n width: spinnnerSizes.extraLarge\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThicker,\n r: rValues.extraLarge\n }\n },\n huge: {\n ['& > svg']: {\n height: spinnnerSizes.huge,\n width: spinnnerSizes.huge\n },\n ['& > svg > circle']: {\n strokeWidth: tokens.strokeWidthThickest,\n r: rValues.huge\n }\n }\n});\nconst useTrackStyles = makeStyles({\n inverted: {\n ['& > svg > circle.fui-Spinner__Tail']: {\n stroke: tokens.colorNeutralStrokeOnBrand2,\n animationName: {\n '0%': {\n strokeDasharray: '1,150',\n strokeDashoffset: '0'\n },\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35'\n },\n '100%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-124'\n }\n },\n animationDuration: '1.5s',\n animationIterationCount: 'infinite',\n animationTimingFunction: tokens.curveEasyEase,\n strokeLinecap: 'round',\n transform: 'rotate(-90deg)',\n transformOrigin: '50% 50%',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: 'rgba(255, 255, 255, 0.2)'\n }\n },\n primary: {\n ['& > svg > circle.fui-Spinner__Tail']: {\n stroke: tokens.colorBrandStroke1,\n '@media screen and (forced-colors: active)': {\n stroke: tokens.colorNeutralStrokeOnBrand2\n },\n animationName: {\n '0%': {\n strokeDasharray: '1,150',\n strokeDashoffset: '0'\n },\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35'\n },\n '100%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-124'\n }\n },\n animationDuration: '1.5s',\n animationIterationCount: 'infinite',\n animationTimingFunction: tokens.curveEasyEase,\n strokeLinecap: 'round',\n transform: 'rotate(-90deg)',\n transformOrigin: '50% 50%',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n },\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: tokens.colorBrandStroke2,\n '@media screen and (forced-colors: active)': {\n stroke: tokens.colorNeutralBackgroundInverted\n }\n }\n }\n});\nconst useLabelStyles = makeStyles({\n // style for label\n inverted: {\n color: 'rgba(255, 255, 255, 1)'\n },\n primary: {},\n 'extra-tiny': {\n ...typographyStyles.body1\n },\n tiny: {\n ...typographyStyles.body1\n },\n 'extra-small': {\n ...typographyStyles.body1\n },\n small: {\n ...typographyStyles.body1\n },\n medium: {\n ...typographyStyles.subtitle2\n },\n large: {\n ...typographyStyles.subtitle2\n },\n 'extra-large': {\n ...typographyStyles.subtitle2\n },\n huge: {\n ...typographyStyles.subtitle1\n }\n});\n/**\n * Apply styling to the Spinner slots based on the state\n */ export const useSpinnerStyles_unstable = (state)=>{\n const { labelPosition , size , appearance ='primary' } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n state.root.className = mergeClasses(spinnerClassNames.root, rootStyles.root, (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical, (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal, state.root.className);\n if (state.spinner) {\n state.spinner.className = mergeClasses(spinnerClassNames.spinner, spinnerStyles.spinnerSVG, spinnerStyles[size], trackStyles[appearance], state.spinner.className);\n }\n if (state.label) {\n state.label.className = mergeClasses(spinnerClassNames.label, labelStyles[size], labelStyles[appearance], state.label.className);\n }\n return state;\n};\n"],"mappings":"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"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
const SpinnerContext = React.createContext(undefined);
|
|
3
|
+
const SpinnerContextDefaultValue = {};
|
|
4
|
+
/**
|
|
5
|
+
* @internal
|
|
6
|
+
*/ export const SpinnerContextProvider = SpinnerContext.Provider;
|
|
7
|
+
var _React_useContext;
|
|
8
|
+
/**
|
|
9
|
+
* @internal
|
|
10
|
+
*/ export const useSpinnerContext = ()=>(_React_useContext = React.useContext(SpinnerContext)) !== null && _React_useContext !== void 0 ? _React_useContext : SpinnerContextDefaultValue;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["SpinnerContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { SpinnerProps } from '../components/Spinner/Spinner.types';\n\nconst SpinnerContext = React.createContext<SpinnerContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport type SpinnerContextValue = Pick<SpinnerProps, 'size'>;\n\nconst SpinnerContextDefaultValue: SpinnerContextValue = {};\n\n/**\n * @internal\n */\nexport const SpinnerContextProvider = SpinnerContext.Provider;\n\n/**\n * @internal\n */\nexport const useSpinnerContext = () => React.useContext(SpinnerContext) ?? SpinnerContextDefaultValue;\n"],"names":["React","SpinnerContext","createContext","undefined","SpinnerContextDefaultValue","SpinnerContextProvider","Provider","useSpinnerContext","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,MAAMC,iBAAiBD,MAAME,aAAa,CAAkCC;AAO5E,MAAMC,6BAAkD,CAAC;AAEzD;;CAEC,GACD,OAAO,MAAMC,yBAAyBJ,eAAeK,QAAQ,CAAC;IAKvBN;AAHvC;;CAEC,GACD,OAAO,MAAMO,oBAAoB,IAAMP,CAAAA,oBAAAA,MAAMQ,UAAU,CAACP,6BAAjBD,+BAAAA,oBAAoCI,0BAA0B,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './SpinnerContext';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './SpinnerContext';\n"],"names":[],"mappings":"AAAA,cAAc,mBAAmB"}
|
package/lib/index.js
CHANGED
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n Spinner,\n spinnerClassNames,\n renderSpinner_unstable,\n useSpinner_unstable,\n useSpinnerStyles_unstable,\n} from './Spinner';\nexport type { SpinnerProps, SpinnerSlots, SpinnerState } from './Spinner';\n"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB,YAAY"}
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n Spinner,\n spinnerClassNames,\n renderSpinner_unstable,\n useSpinner_unstable,\n useSpinnerStyles_unstable,\n} from './Spinner';\nexport type { SpinnerProps, SpinnerSlots, SpinnerState } from './Spinner';\nexport { SpinnerContextProvider, useSpinnerContext } from './contexts/index';\nexport type { SpinnerContextValue } from './contexts/index';\n"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable","SpinnerContextProvider","useSpinnerContext"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB,YAAY;AAEnB,SAASC,sBAAsB,EAAEC,iBAAiB,QAAQ,mBAAmB"}
|
|
@@ -11,9 +11,11 @@ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
|
11
11
|
const _reactUtilities = require("@fluentui/react-utilities");
|
|
12
12
|
const _reactLabel = require("@fluentui/react-label");
|
|
13
13
|
const _defaultSvg = require("./DefaultSvg");
|
|
14
|
+
const _spinnerContext = require("../../contexts/SpinnerContext");
|
|
14
15
|
const useSpinner_unstable = (props, ref)=>{
|
|
15
16
|
// Props
|
|
16
|
-
const {
|
|
17
|
+
const { size: contextSize } = (0, _spinnerContext.useSpinnerContext)();
|
|
18
|
+
const { appearance ='primary' , labelPosition ='after' , size =contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' , delay =0 } = props;
|
|
17
19
|
const baseId = (0, _reactUtilities.useId)('spinner');
|
|
18
20
|
const { role ='progressbar' , tabIndex , ...rest } = props;
|
|
19
21
|
const nativeRoot = (0, _reactUtilities.getNativeElementProps)('div', {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useSpinner.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */ export const useSpinner_unstable = (props, ref)=>{\n // Props\n const { appearance ='primary' , labelPosition ='after' , size ='medium' , delay =0 } = props;\n const baseId = useId('spinner');\n const { role ='progressbar' , tabIndex , ...rest } = props;\n const nativeRoot = getNativeElementProps('div', {\n ref,\n role,\n ...rest\n }, [\n 'size'\n ]);\n const [isVisible, setIsVisible] = React.useState(true);\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n React.useEffect(()=>{\n if (delay <= 0) {\n return;\n }\n setIsVisible(false);\n setDelayTimeout(()=>{\n setIsVisible(true);\n }, delay);\n return ()=>{\n clearDelayTimeout();\n };\n }, [\n setDelayTimeout,\n clearDelayTimeout,\n delay\n ]);\n const labelShorthand = resolveShorthand(props.label, {\n defaultProps: {\n id: baseId\n },\n required: false\n });\n const spinnerShortHand = resolveShorthand(props.spinner, {\n required: true,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(DefaultSvg, null),\n tabIndex\n }\n });\n if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n nativeRoot['aria-labelledby'] = labelShorthand.id;\n }\n const state = {\n appearance,\n delay,\n labelPosition,\n size,\n shouldRenderSpinner: isVisible,\n components: {\n root: 'div',\n spinner: 'span',\n label: Label\n },\n root: nativeRoot,\n spinner: spinnerShortHand,\n label: labelShorthand\n };\n return state;\n};\n"],"names":["useSpinner_unstable","props","ref","
|
|
1
|
+
{"version":3,"sources":["useSpinner.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\nimport { useSpinnerContext } from '../../contexts/SpinnerContext';\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */ export const useSpinner_unstable = (props, ref)=>{\n // Props\n const { size: contextSize } = useSpinnerContext();\n const { appearance ='primary' , labelPosition ='after' , size =contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' , delay =0 } = props;\n const baseId = useId('spinner');\n const { role ='progressbar' , tabIndex , ...rest } = props;\n const nativeRoot = getNativeElementProps('div', {\n ref,\n role,\n ...rest\n }, [\n 'size'\n ]);\n const [isVisible, setIsVisible] = React.useState(true);\n const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n React.useEffect(()=>{\n if (delay <= 0) {\n return;\n }\n setIsVisible(false);\n setDelayTimeout(()=>{\n setIsVisible(true);\n }, delay);\n return ()=>{\n clearDelayTimeout();\n };\n }, [\n setDelayTimeout,\n clearDelayTimeout,\n delay\n ]);\n const labelShorthand = resolveShorthand(props.label, {\n defaultProps: {\n id: baseId\n },\n required: false\n });\n const spinnerShortHand = resolveShorthand(props.spinner, {\n required: true,\n defaultProps: {\n children: /*#__PURE__*/ React.createElement(DefaultSvg, null),\n tabIndex\n }\n });\n if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n nativeRoot['aria-labelledby'] = labelShorthand.id;\n }\n const state = {\n appearance,\n delay,\n labelPosition,\n size,\n shouldRenderSpinner: isVisible,\n components: {\n root: 'div',\n spinner: 'span',\n label: Label\n },\n root: nativeRoot,\n spinner: spinnerShortHand,\n label: labelShorthand\n };\n return state;\n};\n"],"names":["useSpinner_unstable","props","ref","size","contextSize","useSpinnerContext","appearance","labelPosition","delay","baseId","useId","role","tabIndex","rest","nativeRoot","getNativeElementProps","isVisible","setIsVisible","React","useState","setDelayTimeout","clearDelayTimeout","useTimeout","useEffect","labelShorthand","resolveShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","createElement","DefaultSvg","state","shouldRenderSpinner","components","root","Label"],"mappings":";;;;+BAaiBA;;aAAAA;;;6DAbM;gCACoD;4BACrD;4BACK;gCACO;AASvB,MAAMA,sBAAsB,CAACC,OAAOC,MAAM;IACjD,QAAQ;IACR,MAAM,EAAEC,MAAMC,YAAW,EAAG,GAAGC,IAAAA,iCAAiB;IAChD,MAAM,EAAEC,YAAY,UAAS,EAAGC,eAAe,QAAO,EAAGJ,MAAMC,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAIA,cAAc,QAAQ,CAAA,EAAGI,OAAO,EAAC,EAAG,GAAGP;IACvJ,MAAMQ,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAM,EAAEC,MAAM,cAAa,EAAGC,SAAQ,EAAG,GAAGC,MAAM,GAAGZ;IACrD,MAAMa,aAAaC,IAAAA,qCAAqB,EAAC,OAAO;QAC5Cb;QACAS;QACA,GAAGE,IAAI;IACX,GAAG;QACC;KACH;IACD,MAAM,CAACG,WAAWC,aAAa,GAAGC,OAAMC,QAAQ,CAAC,IAAI;IACrD,MAAM,CAACC,iBAAiBC,kBAAkB,GAAGC,IAAAA,0BAAU;IACvDJ,OAAMK,SAAS,CAAC,IAAI;QAChB,IAAIf,SAAS,GAAG;YACZ;QACJ,CAAC;QACDS,aAAa,KAAK;QAClBG,gBAAgB,IAAI;YAChBH,aAAa,IAAI;QACrB,GAAGT;QACH,OAAO,IAAI;YACPa;QACJ;IACJ,GAAG;QACCD;QACAC;QACAb;KACH;IACD,MAAMgB,iBAAiBC,IAAAA,gCAAgB,EAACxB,MAAMyB,KAAK,EAAE;QACjDC,cAAc;YACVC,IAAInB;QACR;QACAoB,UAAU,KAAK;IACnB;IACA,MAAMC,mBAAmBL,IAAAA,gCAAgB,EAACxB,MAAM8B,OAAO,EAAE;QACrDF,UAAU,IAAI;QACdF,cAAc;YACVK,UAAU,WAAW,GAAGd,OAAMe,aAAa,CAACC,sBAAU,EAAE,IAAI;YAC5DtB;QACJ;IACJ;IACA,IAAIY,kBAAkBV,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;QAChEA,UAAU,CAAC,kBAAkB,GAAGU,eAAeI,EAAE;IACrD,CAAC;IACD,MAAMO,QAAQ;QACV7B;QACAE;QACAD;QACAJ;QACAiC,qBAAqBpB;QACrBqB,YAAY;YACRC,MAAM;YACNP,SAAS;YACTL,OAAOa,iBAAK;QAChB;QACAD,MAAMxB;QACNiB,SAASD;QACTJ,OAAOF;IACX;IACA,OAAOW;AACX"}
|
|
@@ -22,6 +22,7 @@ const spinnerClassNames = {
|
|
|
22
22
|
* TODO: Update with proper tokens when added
|
|
23
23
|
* Radii for the Spinner circles
|
|
24
24
|
*/ const rValues = {
|
|
25
|
+
extraTiny: '7px',
|
|
25
26
|
tiny: '9px',
|
|
26
27
|
extraSmall: '11px',
|
|
27
28
|
small: '13px',
|
|
@@ -34,6 +35,7 @@ const spinnerClassNames = {
|
|
|
34
35
|
* TODO: Update with proper tokens when added
|
|
35
36
|
* Sizes for the Spinner
|
|
36
37
|
*/ const spinnnerSizes = {
|
|
38
|
+
extraTiny: '16px',
|
|
37
39
|
tiny: '20px',
|
|
38
40
|
extraSmall: '24px',
|
|
39
41
|
small: '28px',
|
|
@@ -101,6 +103,12 @@ const useLoaderStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
|
101
103
|
Bsvqbuc: "f11rfva0",
|
|
102
104
|
b3s3i5: "f1exc66"
|
|
103
105
|
},
|
|
106
|
+
"extra-tiny": {
|
|
107
|
+
Bah9ito: "f1x2gjcb",
|
|
108
|
+
ut6tcf: "f1vjiaua",
|
|
109
|
+
B7p06xz: "fv1u54w",
|
|
110
|
+
B807ibg: "f1oebb0s"
|
|
111
|
+
},
|
|
104
112
|
tiny: {
|
|
105
113
|
Bah9ito: "f1j4wmu2",
|
|
106
114
|
ut6tcf: "f1vppzuq",
|
|
@@ -165,9 +173,12 @@ const useLoaderStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
|
165
173
|
".f1da2vov>svg>circle{cx:50%;}",
|
|
166
174
|
".f11rfva0>svg>circle{cy:50%;}",
|
|
167
175
|
".f1exc66>svg>circle{fill:none;}",
|
|
176
|
+
".f1x2gjcb>svg{height:16px;}",
|
|
177
|
+
".f1vjiaua>svg{width:16px;}",
|
|
178
|
+
".fv1u54w>svg>circle{stroke-width:var(--strokeWidthThick);}",
|
|
179
|
+
".f1oebb0s>svg>circle{r:7px;}",
|
|
168
180
|
".f1j4wmu2>svg{height:20px;}",
|
|
169
181
|
".f1vppzuq>svg{width:20px;}",
|
|
170
|
-
".fv1u54w>svg>circle{stroke-width:var(--strokeWidthThick);}",
|
|
171
182
|
".fngtx1d>svg>circle{r:9px;}",
|
|
172
183
|
".fmpqlna>svg{height:24px;}",
|
|
173
184
|
".f15z5jzu>svg{width:24px;}",
|
|
@@ -303,6 +314,12 @@ const useLabelStyles = /*#__PURE__*/ (0, _react["__styles"])({
|
|
|
303
314
|
sj55zd: "f15aqcq"
|
|
304
315
|
},
|
|
305
316
|
primary: {},
|
|
317
|
+
"extra-tiny": {
|
|
318
|
+
Bahqtrf: "fk6fouc",
|
|
319
|
+
Be2twd7: "fkhj508",
|
|
320
|
+
Bhrd7zp: "figsok6",
|
|
321
|
+
Bg96gwp: "f1i3iumi"
|
|
322
|
+
},
|
|
306
323
|
tiny: {
|
|
307
324
|
Bahqtrf: "fk6fouc",
|
|
308
325
|
Be2twd7: "fkhj508",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["useSpinnerStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinnerClassNames = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label'\n};\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */\nconst rValues = {\n tiny: '9px',\n extraSmall: '11px',\n small: '13px',\n medium: '14.5px',\n large: '16.5px',\n extraLarge: '18.5px',\n huge: '20px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */\nconst spinnnerSizes = {\n tiny: '20px',\n extraSmall: '24px',\n small: '28px',\n medium: '32px',\n large: '36px',\n extraLarge: '40px',\n huge: '44px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */\nconst spinnerAnimation = {\n container: {\n animationDuration: '3s',\n animationIterationCount: 'infinite',\n animationTimingFunction: 'linear',\n backgroundColor: 'transparent'\n }\n};\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n root: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Brf1p80: \"f4d9j23\",\n Bg96gwp: \"fez10in\",\n i8kkvl: \"f4px1ci\",\n Belr9w4: \"fn67r4l\"\n },\n horizontal: {\n Beiy3e4: \"f1063pyq\"\n },\n vertical: {\n Beiy3e4: \"f1vx9l62\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}\", \".fez10in{line-height:0;}\", \".f4px1ci{-webkit-column-gap:8px;column-gap:8px;}\", \".fn67r4l{row-gap:8px;}\", \".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\"]\n});\nconst useLoaderStyles = /*#__PURE__*/__styles({\n spinnerSVG: {\n B3aqqti: \"f1or16p5\",\n Brovlpu: \"f1grzc83\",\n Bxa1mx5: \"f19shzzi\",\n Bwaue66: [\"f5tbecn\", \"f15qb8s7\"],\n fyp1ls: \"fn4mtlg\",\n ag6ruv: \"f1y80fxs\",\n osj692: \"f1r2crtq\",\n aq5vjd: \"f1wsi8sr\",\n tlu9e1: \"f1bkm2qd\",\n J3u96z: \"f1urqz7h\",\n d32isg: \"f1da2vov\",\n Bsvqbuc: \"f11rfva0\",\n b3s3i5: \"f1exc66\"\n },\n tiny: {\n Bah9ito: \"f1j4wmu2\",\n ut6tcf: \"f1vppzuq\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"fngtx1d\"\n },\n \"extra-small\": {\n Bah9ito: \"fmpqlna\",\n ut6tcf: \"f15z5jzu\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"fadawes\"\n },\n small: {\n Bah9ito: \"fo52gbo\",\n ut6tcf: \"f1b41i3v\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"f1xqyyrl\"\n },\n medium: {\n Bah9ito: \"f1aiqagr\",\n ut6tcf: \"f1wtx80b\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"f1u06hy7\"\n },\n large: {\n Bah9ito: \"f1trdq7b\",\n ut6tcf: \"f9e0mc5\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"f13pmvhl\"\n },\n \"extra-large\": {\n Bah9ito: \"f89rf2a\",\n ut6tcf: \"f1w2xg3q\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"fmn74v6\"\n },\n huge: {\n Bah9ito: \"f1rx7k5y\",\n ut6tcf: \"f1vtyt49\",\n B7p06xz: \"f1owbg48\",\n B807ibg: \"f1fr1izd\"\n }\n}, {\n f: [\".f1or16p5:focus{outline-width:3px;}\", \".f1grzc83:focus{outline-style:solid;}\", \".f19shzzi:focus{outline-color:transparent;}\"],\n k: [\"@-webkit-keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}\", \"@-webkit-keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}\", \"@keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}\", \"@keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}\"],\n d: [\".f5tbecn>svg{-webkit-animation-name:fb7n1on;animation-name:fb7n1on;}\", \".f15qb8s7>svg{-webkit-animation-name:f1gx3jof;animation-name:f1gx3jof;}\", \".fn4mtlg>svg{-webkit-animation-duration:3s;animation-duration:3s;}\", \".f1y80fxs>svg{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}\", \".f1r2crtq>svg{-webkit-animation-timing-function:linear;animation-timing-function:linear;}\", \".f1wsi8sr>svg{background-color:transparent;}\", \".f1da2vov>svg>circle{cx:50%;}\", \".f11rfva0>svg>circle{cy:50%;}\", \".f1exc66>svg>circle{fill:none;}\", \".f1j4wmu2>svg{height:20px;}\", \".f1vppzuq>svg{width:20px;}\", \".fv1u54w>svg>circle{stroke-width:var(--strokeWidthThick);}\", \".fngtx1d>svg>circle{r:9px;}\", \".fmpqlna>svg{height:24px;}\", \".f15z5jzu>svg{width:24px;}\", \".fadawes>svg>circle{r:11px;}\", \".fo52gbo>svg{height:28px;}\", \".f1b41i3v>svg{width:28px;}\", \".f1xqyyrl>svg>circle{r:13px;}\", \".f1aiqagr>svg{height:32px;}\", \".f1wtx80b>svg{width:32px;}\", \".f1flujpd>svg>circle{stroke-width:var(--strokeWidthThicker);}\", \".f1u06hy7>svg>circle{r:14.5px;}\", \".f1trdq7b>svg{height:36px;}\", \".f9e0mc5>svg{width:36px;}\", \".f13pmvhl>svg>circle{r:16.5px;}\", \".f89rf2a>svg{height:40px;}\", \".f1w2xg3q>svg{width:40px;}\", \".fmn74v6>svg>circle{r:18.5px;}\", \".f1rx7k5y>svg{height:44px;}\", \".f1vtyt49>svg{width:44px;}\", \".f1owbg48>svg>circle{stroke-width:var(--strokeWidthThickest);}\", \".f1fr1izd>svg>circle{r:20px;}\"],\n m: [[\"@media screen and (prefers-reduced-motion: reduce){.f1bkm2qd>svg{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.f1urqz7h>svg{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }]]\n});\nconst useTrackStyles = /*#__PURE__*/__styles({\n inverted: {\n gwg7kz: \"f1jvpmnu\",\n Bvrehnu: \"fq8a5sv\",\n Bidp6o: \"f1b4lwqj\",\n cq3kgi: \"f1najlst\",\n Btwiser: \"fjxod4\",\n B8001xd: \"fu3xdw0\",\n Bdordwa: [\"f1ttdh6v\", \"fmyjox0\"],\n Bo2mdfu: \"f1eseayc\",\n E10nrc: \"folzdkc\",\n Bwl7w15: \"fhlfkde\",\n Bksq7rz: \"f1esql28\"\n },\n primary: {\n gwg7kz: \"f11ditju\",\n B8k2rxp: \"f1m9nikz\",\n Bvrehnu: \"fq8a5sv\",\n Bidp6o: \"f1b4lwqj\",\n cq3kgi: \"f1najlst\",\n Btwiser: \"fjxod4\",\n B8001xd: \"fu3xdw0\",\n Bdordwa: [\"f1ttdh6v\", \"fmyjox0\"],\n Bo2mdfu: \"f1eseayc\",\n E10nrc: \"folzdkc\",\n Bwl7w15: \"fhlfkde\",\n Bksq7rz: \"f61h2gu\",\n y14cdu: \"flglbw1\"\n }\n}, {\n d: [\".f1jvpmnu>svg>circle.fui-Spinner__Tail{stroke:var(--colorNeutralStrokeOnBrand2);}\", \".fq8a5sv>svg>circle.fui-Spinner__Tail{-webkit-animation-name:f1v1ql0f;animation-name:f1v1ql0f;}\", \".f1b4lwqj>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:1.5s;animation-duration:1.5s;}\", \".f1najlst>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}\", \".fjxod4>svg>circle.fui-Spinner__Tail{-webkit-animation-timing-function:var(--curveEasyEase);animation-timing-function:var(--curveEasyEase);}\", \".fu3xdw0>svg>circle.fui-Spinner__Tail{stroke-linecap:round;}\", \".f1ttdh6v>svg>circle.fui-Spinner__Tail{-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);}\", \".fmyjox0>svg>circle.fui-Spinner__Tail{-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}\", \".f1eseayc>svg>circle.fui-Spinner__Tail{transform-origin:50% 50%;}\", \".f1esql28>svg>circle.fui-Spinner__Track{stroke:rgba(255, 255, 255, 0.2);}\", \".f11ditju>svg>circle.fui-Spinner__Tail{stroke:var(--colorBrandStroke1);}\", \".f61h2gu>svg>circle.fui-Spinner__Track{stroke:var(--colorBrandStroke2);}\"],\n k: [\"@-webkit-keyframes f1v1ql0f{0%{stroke-dasharray:1,150;stroke-dashoffset:0;}50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}}\", \"@keyframes f1v1ql0f{0%{stroke-dasharray:1,150;stroke-dashoffset:0;}50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}}\"],\n m: [[\"@media screen and (prefers-reduced-motion: reduce){.folzdkc>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.fhlfkde>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (forced-colors: active){.f1m9nikz>svg>circle.fui-Spinner__Tail{stroke:var(--colorNeutralStrokeOnBrand2);}}\", {\n m: \"screen and (forced-colors: active)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.folzdkc>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.fhlfkde>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (forced-colors: active){.flglbw1>svg>circle.fui-Spinner__Track{stroke:var(--colorNeutralBackgroundInverted);}}\", {\n m: \"screen and (forced-colors: active)\"\n }]]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n inverted: {\n sj55zd: \"f15aqcq\"\n },\n primary: {},\n tiny: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n \"extra-small\": {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n medium: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n large: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n \"extra-large\": {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n huge: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"f1pp30po\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"f106mvju\"\n }\n}, {\n d: [\".f15aqcq{color:rgba(255, 255, 255, 1);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".fod5ikn{font-size:var(--fontSizeBase400);}\", \".fl43uef{font-weight:var(--fontWeightSemibold);}\", \".faaz57k{line-height:var(--lineHeightBase400);}\", \".f1pp30po{font-size:var(--fontSizeBase500);}\", \".f106mvju{line-height:var(--lineHeightBase500);}\"]\n});\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = state => {\n const {\n labelPosition,\n size,\n appearance = 'primary'\n } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n state.root.className = mergeClasses(spinnerClassNames.root, rootStyles.root, (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical, (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal, state.root.className);\n if (state.spinner) {\n state.spinner.className = mergeClasses(spinnerClassNames.spinner, spinnerStyles.spinnerSVG, spinnerStyles[size], trackStyles[appearance], state.spinner.className);\n }\n if (state.label) {\n state.label.className = mergeClasses(spinnerClassNames.label, labelStyles[size], labelStyles[appearance], state.label.className);\n }\n return state;\n};\n//# sourceMappingURL=useSpinnerStyles.styles.js.map"],"names":["spinnerClassNames","useSpinnerStyles_unstable","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","__styles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className","mergeClasses"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["useSpinnerStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const spinnerClassNames = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label'\n};\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */\nconst rValues = {\n extraTiny: '7px',\n tiny: '9px',\n extraSmall: '11px',\n small: '13px',\n medium: '14.5px',\n large: '16.5px',\n extraLarge: '18.5px',\n huge: '20px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */\nconst spinnnerSizes = {\n extraTiny: '16px',\n tiny: '20px',\n extraSmall: '24px',\n small: '28px',\n medium: '32px',\n large: '36px',\n extraLarge: '40px',\n huge: '44px'\n};\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */\nconst spinnerAnimation = {\n container: {\n animationDuration: '3s',\n animationIterationCount: 'infinite',\n animationTimingFunction: 'linear',\n backgroundColor: 'transparent'\n }\n};\n/**\n * Styles for the root slot\n */\nconst useRootStyles = /*#__PURE__*/__styles({\n root: {\n mc9l5x: \"f22iagw\",\n Bt984gj: \"f122n59\",\n Brf1p80: \"f4d9j23\",\n Bg96gwp: \"fez10in\",\n i8kkvl: \"f4px1ci\",\n Belr9w4: \"fn67r4l\"\n },\n horizontal: {\n Beiy3e4: \"f1063pyq\"\n },\n vertical: {\n Beiy3e4: \"f1vx9l62\"\n }\n}, {\n d: [\".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}\", \".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}\", \".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}\", \".fez10in{line-height:0;}\", \".f4px1ci{-webkit-column-gap:8px;column-gap:8px;}\", \".fn67r4l{row-gap:8px;}\", \".f1063pyq{-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;}\", \".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}\"]\n});\nconst useLoaderStyles = /*#__PURE__*/__styles({\n spinnerSVG: {\n B3aqqti: \"f1or16p5\",\n Brovlpu: \"f1grzc83\",\n Bxa1mx5: \"f19shzzi\",\n Bwaue66: [\"f5tbecn\", \"f15qb8s7\"],\n fyp1ls: \"fn4mtlg\",\n ag6ruv: \"f1y80fxs\",\n osj692: \"f1r2crtq\",\n aq5vjd: \"f1wsi8sr\",\n tlu9e1: \"f1bkm2qd\",\n J3u96z: \"f1urqz7h\",\n d32isg: \"f1da2vov\",\n Bsvqbuc: \"f11rfva0\",\n b3s3i5: \"f1exc66\"\n },\n \"extra-tiny\": {\n Bah9ito: \"f1x2gjcb\",\n ut6tcf: \"f1vjiaua\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"f1oebb0s\"\n },\n tiny: {\n Bah9ito: \"f1j4wmu2\",\n ut6tcf: \"f1vppzuq\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"fngtx1d\"\n },\n \"extra-small\": {\n Bah9ito: \"fmpqlna\",\n ut6tcf: \"f15z5jzu\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"fadawes\"\n },\n small: {\n Bah9ito: \"fo52gbo\",\n ut6tcf: \"f1b41i3v\",\n B7p06xz: \"fv1u54w\",\n B807ibg: \"f1xqyyrl\"\n },\n medium: {\n Bah9ito: \"f1aiqagr\",\n ut6tcf: \"f1wtx80b\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"f1u06hy7\"\n },\n large: {\n Bah9ito: \"f1trdq7b\",\n ut6tcf: \"f9e0mc5\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"f13pmvhl\"\n },\n \"extra-large\": {\n Bah9ito: \"f89rf2a\",\n ut6tcf: \"f1w2xg3q\",\n B7p06xz: \"f1flujpd\",\n B807ibg: \"fmn74v6\"\n },\n huge: {\n Bah9ito: \"f1rx7k5y\",\n ut6tcf: \"f1vtyt49\",\n B7p06xz: \"f1owbg48\",\n B807ibg: \"f1fr1izd\"\n }\n}, {\n f: [\".f1or16p5:focus{outline-width:3px;}\", \".f1grzc83:focus{outline-style:solid;}\", \".f19shzzi:focus{outline-color:transparent;}\"],\n k: [\"@-webkit-keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}\", \"@-webkit-keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}\", \"@keyframes fb7n1on{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg);}}\", \"@keyframes f1gx3jof{0%{-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);}100%{-webkit-transform:rotate(-360deg);-moz-transform:rotate(-360deg);-ms-transform:rotate(-360deg);transform:rotate(-360deg);}}\"],\n d: [\".f5tbecn>svg{-webkit-animation-name:fb7n1on;animation-name:fb7n1on;}\", \".f15qb8s7>svg{-webkit-animation-name:f1gx3jof;animation-name:f1gx3jof;}\", \".fn4mtlg>svg{-webkit-animation-duration:3s;animation-duration:3s;}\", \".f1y80fxs>svg{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}\", \".f1r2crtq>svg{-webkit-animation-timing-function:linear;animation-timing-function:linear;}\", \".f1wsi8sr>svg{background-color:transparent;}\", \".f1da2vov>svg>circle{cx:50%;}\", \".f11rfva0>svg>circle{cy:50%;}\", \".f1exc66>svg>circle{fill:none;}\", \".f1x2gjcb>svg{height:16px;}\", \".f1vjiaua>svg{width:16px;}\", \".fv1u54w>svg>circle{stroke-width:var(--strokeWidthThick);}\", \".f1oebb0s>svg>circle{r:7px;}\", \".f1j4wmu2>svg{height:20px;}\", \".f1vppzuq>svg{width:20px;}\", \".fngtx1d>svg>circle{r:9px;}\", \".fmpqlna>svg{height:24px;}\", \".f15z5jzu>svg{width:24px;}\", \".fadawes>svg>circle{r:11px;}\", \".fo52gbo>svg{height:28px;}\", \".f1b41i3v>svg{width:28px;}\", \".f1xqyyrl>svg>circle{r:13px;}\", \".f1aiqagr>svg{height:32px;}\", \".f1wtx80b>svg{width:32px;}\", \".f1flujpd>svg>circle{stroke-width:var(--strokeWidthThicker);}\", \".f1u06hy7>svg>circle{r:14.5px;}\", \".f1trdq7b>svg{height:36px;}\", \".f9e0mc5>svg{width:36px;}\", \".f13pmvhl>svg>circle{r:16.5px;}\", \".f89rf2a>svg{height:40px;}\", \".f1w2xg3q>svg{width:40px;}\", \".fmn74v6>svg>circle{r:18.5px;}\", \".f1rx7k5y>svg{height:44px;}\", \".f1vtyt49>svg{width:44px;}\", \".f1owbg48>svg>circle{stroke-width:var(--strokeWidthThickest);}\", \".f1fr1izd>svg>circle{r:20px;}\"],\n m: [[\"@media screen and (prefers-reduced-motion: reduce){.f1bkm2qd>svg{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.f1urqz7h>svg{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }]]\n});\nconst useTrackStyles = /*#__PURE__*/__styles({\n inverted: {\n gwg7kz: \"f1jvpmnu\",\n Bvrehnu: \"fq8a5sv\",\n Bidp6o: \"f1b4lwqj\",\n cq3kgi: \"f1najlst\",\n Btwiser: \"fjxod4\",\n B8001xd: \"fu3xdw0\",\n Bdordwa: [\"f1ttdh6v\", \"fmyjox0\"],\n Bo2mdfu: \"f1eseayc\",\n E10nrc: \"folzdkc\",\n Bwl7w15: \"fhlfkde\",\n Bksq7rz: \"f1esql28\"\n },\n primary: {\n gwg7kz: \"f11ditju\",\n B8k2rxp: \"f1m9nikz\",\n Bvrehnu: \"fq8a5sv\",\n Bidp6o: \"f1b4lwqj\",\n cq3kgi: \"f1najlst\",\n Btwiser: \"fjxod4\",\n B8001xd: \"fu3xdw0\",\n Bdordwa: [\"f1ttdh6v\", \"fmyjox0\"],\n Bo2mdfu: \"f1eseayc\",\n E10nrc: \"folzdkc\",\n Bwl7w15: \"fhlfkde\",\n Bksq7rz: \"f61h2gu\",\n y14cdu: \"flglbw1\"\n }\n}, {\n d: [\".f1jvpmnu>svg>circle.fui-Spinner__Tail{stroke:var(--colorNeutralStrokeOnBrand2);}\", \".fq8a5sv>svg>circle.fui-Spinner__Tail{-webkit-animation-name:f1v1ql0f;animation-name:f1v1ql0f;}\", \".f1b4lwqj>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:1.5s;animation-duration:1.5s;}\", \".f1najlst>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}\", \".fjxod4>svg>circle.fui-Spinner__Tail{-webkit-animation-timing-function:var(--curveEasyEase);animation-timing-function:var(--curveEasyEase);}\", \".fu3xdw0>svg>circle.fui-Spinner__Tail{stroke-linecap:round;}\", \".f1ttdh6v>svg>circle.fui-Spinner__Tail{-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);}\", \".fmyjox0>svg>circle.fui-Spinner__Tail{-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg);}\", \".f1eseayc>svg>circle.fui-Spinner__Tail{transform-origin:50% 50%;}\", \".f1esql28>svg>circle.fui-Spinner__Track{stroke:rgba(255, 255, 255, 0.2);}\", \".f11ditju>svg>circle.fui-Spinner__Tail{stroke:var(--colorBrandStroke1);}\", \".f61h2gu>svg>circle.fui-Spinner__Track{stroke:var(--colorBrandStroke2);}\"],\n k: [\"@-webkit-keyframes f1v1ql0f{0%{stroke-dasharray:1,150;stroke-dashoffset:0;}50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}}\", \"@keyframes f1v1ql0f{0%{stroke-dasharray:1,150;stroke-dashoffset:0;}50%{stroke-dasharray:90,150;stroke-dashoffset:-35;}100%{stroke-dasharray:90,150;stroke-dashoffset:-124;}}\"],\n m: [[\"@media screen and (prefers-reduced-motion: reduce){.folzdkc>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.fhlfkde>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (forced-colors: active){.f1m9nikz>svg>circle.fui-Spinner__Tail{stroke:var(--colorNeutralStrokeOnBrand2);}}\", {\n m: \"screen and (forced-colors: active)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.folzdkc>svg>circle.fui-Spinner__Tail{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (prefers-reduced-motion: reduce){.fhlfkde>svg>circle.fui-Spinner__Tail{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}\", {\n m: \"screen and (prefers-reduced-motion: reduce)\"\n }], [\"@media screen and (forced-colors: active){.flglbw1>svg>circle.fui-Spinner__Track{stroke:var(--colorNeutralBackgroundInverted);}}\", {\n m: \"screen and (forced-colors: active)\"\n }]]\n});\nconst useLabelStyles = /*#__PURE__*/__styles({\n inverted: {\n sj55zd: \"f15aqcq\"\n },\n primary: {},\n \"extra-tiny\": {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n tiny: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n \"extra-small\": {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n small: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n },\n medium: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n large: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n \"extra-large\": {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fod5ikn\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"faaz57k\"\n },\n huge: {\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"f1pp30po\",\n Bhrd7zp: \"fl43uef\",\n Bg96gwp: \"f106mvju\"\n }\n}, {\n d: [\".f15aqcq{color:rgba(255, 255, 255, 1);}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\", \".fod5ikn{font-size:var(--fontSizeBase400);}\", \".fl43uef{font-weight:var(--fontWeightSemibold);}\", \".faaz57k{line-height:var(--lineHeightBase400);}\", \".f1pp30po{font-size:var(--fontSizeBase500);}\", \".f106mvju{line-height:var(--lineHeightBase500);}\"]\n});\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = state => {\n const {\n labelPosition,\n size,\n appearance = 'primary'\n } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n state.root.className = mergeClasses(spinnerClassNames.root, rootStyles.root, (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical, (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal, state.root.className);\n if (state.spinner) {\n state.spinner.className = mergeClasses(spinnerClassNames.spinner, spinnerStyles.spinnerSVG, spinnerStyles[size], trackStyles[appearance], state.spinner.className);\n }\n if (state.label) {\n state.label.className = mergeClasses(spinnerClassNames.label, labelStyles[size], labelStyles[appearance], state.label.className);\n }\n return state;\n};\n//# sourceMappingURL=useSpinnerStyles.styles.js.map"],"names":["spinnerClassNames","useSpinnerStyles_unstable","root","spinner","label","rValues","extraTiny","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","__styles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className","mergeClasses"],"mappings":"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"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
SpinnerContextProvider: ()=>SpinnerContextProvider,
|
|
13
|
+
useSpinnerContext: ()=>useSpinnerContext
|
|
14
|
+
});
|
|
15
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
|
16
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
17
|
+
const SpinnerContext = /*#__PURE__*/ _react.createContext(undefined);
|
|
18
|
+
const SpinnerContextDefaultValue = {};
|
|
19
|
+
const SpinnerContextProvider = SpinnerContext.Provider;
|
|
20
|
+
var _React_useContext;
|
|
21
|
+
const useSpinnerContext = ()=>(_React_useContext = _react.useContext(SpinnerContext)) !== null && _React_useContext !== void 0 ? _React_useContext : SpinnerContextDefaultValue;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["SpinnerContext.js"],"sourcesContent":["import * as React from 'react';\nconst SpinnerContext = React.createContext(undefined);\nconst SpinnerContextDefaultValue = {};\n/**\n * @internal\n */ export const SpinnerContextProvider = SpinnerContext.Provider;\nvar _React_useContext;\n/**\n * @internal\n */ export const useSpinnerContext = ()=>(_React_useContext = React.useContext(SpinnerContext)) !== null && _React_useContext !== void 0 ? _React_useContext : SpinnerContextDefaultValue;\n"],"names":["SpinnerContextProvider","useSpinnerContext","SpinnerContext","React","createContext","undefined","SpinnerContextDefaultValue","Provider","_React_useContext","useContext"],"mappings":";;;;;;;;;;;IAKiBA,sBAAsB,MAAtBA;IAIAC,iBAAiB,MAAjBA;;;6DATM;AACvB,MAAMC,+BAAiBC,OAAMC,aAAa,CAACC;AAC3C,MAAMC,6BAA6B,CAAC;AAGzB,MAAMN,yBAAyBE,eAAeK,QAAQ;AACjE,IAAIC;AAGO,MAAMP,oBAAoB,IAAI,AAACO,CAAAA,oBAAoBL,OAAMM,UAAU,CAACP,eAAc,MAAO,IAAI,IAAIM,sBAAsB,KAAK,IAAIA,oBAAoBF,0BAA0B"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './SpinnerContext';\n"],"names":[],"mappings":";;;;;oBAAc"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -13,6 +13,9 @@ _export(exports, {
|
|
|
13
13
|
spinnerClassNames: ()=>_spinner.spinnerClassNames,
|
|
14
14
|
renderSpinner_unstable: ()=>_spinner.renderSpinner_unstable,
|
|
15
15
|
useSpinner_unstable: ()=>_spinner.useSpinner_unstable,
|
|
16
|
-
useSpinnerStyles_unstable: ()=>_spinner.useSpinnerStyles_unstable
|
|
16
|
+
useSpinnerStyles_unstable: ()=>_spinner.useSpinnerStyles_unstable,
|
|
17
|
+
SpinnerContextProvider: ()=>_index.SpinnerContextProvider,
|
|
18
|
+
useSpinnerContext: ()=>_index.useSpinnerContext
|
|
17
19
|
});
|
|
18
20
|
const _spinner = require("./Spinner");
|
|
21
|
+
const _index = require("./contexts/index");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.js"],"sourcesContent":["export { Spinner, spinnerClassNames, renderSpinner_unstable, useSpinner_unstable, useSpinnerStyles_unstable } from './Spinner';\n"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"mappings":";;;;;;;;;;;IAASA,OAAO,MAAPA,gBAAO;IAAEC,iBAAiB,MAAjBA,0BAAiB;IAAEC,sBAAsB,MAAtBA,+BAAsB;IAAEC,mBAAmB,MAAnBA,4BAAmB;IAAEC,yBAAyB,MAAzBA,kCAAyB;;
|
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export { Spinner, spinnerClassNames, renderSpinner_unstable, useSpinner_unstable, useSpinnerStyles_unstable } from './Spinner';\nexport { SpinnerContextProvider, useSpinnerContext } from './contexts/index';\n"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable","SpinnerContextProvider","useSpinnerContext"],"mappings":";;;;;;;;;;;IAASA,OAAO,MAAPA,gBAAO;IAAEC,iBAAiB,MAAjBA,0BAAiB;IAAEC,sBAAsB,MAAtBA,+BAAsB;IAAEC,mBAAmB,MAAnBA,4BAAmB;IAAEC,yBAAyB,MAAzBA,kCAAyB;IAClGC,sBAAsB,MAAtBA,6BAAsB;IAAEC,iBAAiB,MAAjBA,wBAAiB;;yBADiE;uBACzD"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-spinner",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.3.1",
|
|
4
4
|
"description": "Spinner component for Fluent UI React",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"scripts": {
|
|
15
15
|
"build": "just-scripts build",
|
|
16
|
-
"bundle-size": "
|
|
16
|
+
"bundle-size": "monosize measure",
|
|
17
17
|
"clean": "just-scripts clean",
|
|
18
18
|
"code-style": "just-scripts code-style",
|
|
19
19
|
"just": "just-scripts",
|
|
@@ -28,13 +28,13 @@
|
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
|
30
30
|
"@fluentui/react-conformance": "*",
|
|
31
|
-
"@fluentui/react-conformance-griffel": "
|
|
31
|
+
"@fluentui/react-conformance-griffel": "*",
|
|
32
32
|
"@fluentui/scripts-api-extractor": "*",
|
|
33
33
|
"@fluentui/scripts-tasks": "*"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@fluentui/react-jsx-runtime": "9.0.0-alpha.
|
|
37
|
-
"@fluentui/react-label": "^9.1.
|
|
36
|
+
"@fluentui/react-jsx-runtime": "9.0.0-alpha.12",
|
|
37
|
+
"@fluentui/react-label": "^9.1.21",
|
|
38
38
|
"@fluentui/react-shared-contexts": "^9.6.0",
|
|
39
39
|
"@fluentui/react-theme": "^9.1.9",
|
|
40
40
|
"@fluentui/react-utilities": "^9.10.1",
|