@fluentui/react-spinner 0.0.0-nightly-20230223-2115.1 → 0.0.0-nightly-20230228-0425.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.
Files changed (32) hide show
  1. package/CHANGELOG.json +11 -11
  2. package/CHANGELOG.md +8 -8
  3. package/lib/Spinner.js.map +1 -1
  4. package/lib/components/Spinner/DefaultSvg.js.map +1 -1
  5. package/lib/components/Spinner/Spinner.js.map +1 -1
  6. package/lib/components/Spinner/Spinner.types.js.map +1 -1
  7. package/lib/components/Spinner/index.js.map +1 -1
  8. package/lib/components/Spinner/renderSpinner.js +9 -2
  9. package/lib/components/Spinner/renderSpinner.js.map +1 -1
  10. package/lib/components/Spinner/useSpinner.js.map +1 -1
  11. package/lib/components/Spinner/useSpinnerStyles.js.map +1 -1
  12. package/lib/index.js.map +1 -1
  13. package/lib-commonjs/Spinner.js +4 -5
  14. package/lib-commonjs/Spinner.js.map +1 -1
  15. package/lib-commonjs/components/Spinner/DefaultSvg.js +12 -15
  16. package/lib-commonjs/components/Spinner/DefaultSvg.js.map +1 -1
  17. package/lib-commonjs/components/Spinner/Spinner.js +15 -16
  18. package/lib-commonjs/components/Spinner/Spinner.js.map +1 -1
  19. package/lib-commonjs/components/Spinner/Spinner.types.js +2 -3
  20. package/lib-commonjs/components/Spinner/Spinner.types.js.map +1 -1
  21. package/lib-commonjs/components/Spinner/index.js +8 -9
  22. package/lib-commonjs/components/Spinner/index.js.map +1 -1
  23. package/lib-commonjs/components/Spinner/renderSpinner.js +27 -16
  24. package/lib-commonjs/components/Spinner/renderSpinner.js.map +1 -1
  25. package/lib-commonjs/components/Spinner/useSpinner.js +65 -53
  26. package/lib-commonjs/components/Spinner/useSpinner.js.map +1 -1
  27. package/lib-commonjs/components/Spinner/useSpinnerStyles.js +233 -351
  28. package/lib-commonjs/components/Spinner/useSpinnerStyles.js.map +1 -1
  29. package/lib-commonjs/index.js +33 -16
  30. package/lib-commonjs/index.js.map +1 -1
  31. package/package.json +7 -7
  32. package/.swcrc +0 -33
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-spinner",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 23 Feb 2023 21:23:18 GMT",
6
- "tag": "@fluentui/react-spinner_v0.0.0-nightly-20230223-2115.1",
7
- "version": "0.0.0-nightly-20230223-2115.1",
5
+ "date": "Tue, 28 Feb 2023 04:34:41 GMT",
6
+ "tag": "@fluentui/react-spinner_v0.0.0-nightly-20230228-0425.1",
7
+ "version": "0.0.0-nightly-20230228-0425.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -16,26 +16,26 @@
16
16
  {
17
17
  "author": "beachball",
18
18
  "package": "@fluentui/react-spinner",
19
- "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230223-2115.1",
20
- "commit": "a400eb0e4c7e02093ab7fb103c74a8dcca00f17b"
19
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230228-0425.1",
20
+ "commit": "8c1594112af8a99c5f4d2da191968d9247bdb269"
21
21
  },
22
22
  {
23
23
  "author": "beachball",
24
24
  "package": "@fluentui/react-spinner",
25
- "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20230223-2115.1",
26
- "commit": "a400eb0e4c7e02093ab7fb103c74a8dcca00f17b"
25
+ "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20230228-0425.1",
26
+ "commit": "8c1594112af8a99c5f4d2da191968d9247bdb269"
27
27
  },
28
28
  {
29
29
  "author": "beachball",
30
30
  "package": "@fluentui/react-spinner",
31
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230223-2115.1",
32
- "commit": "a400eb0e4c7e02093ab7fb103c74a8dcca00f17b"
31
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230228-0425.1",
32
+ "commit": "8c1594112af8a99c5f4d2da191968d9247bdb269"
33
33
  },
34
34
  {
35
35
  "author": "beachball",
36
36
  "package": "@fluentui/react-spinner",
37
- "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230223-2115.1",
38
- "commit": "a400eb0e4c7e02093ab7fb103c74a8dcca00f17b"
37
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230228-0425.1",
38
+ "commit": "8c1594112af8a99c5f4d2da191968d9247bdb269"
39
39
  }
40
40
  ]
41
41
  }
package/CHANGELOG.md CHANGED
@@ -1,21 +1,21 @@
1
1
  # Change Log - @fluentui/react-spinner
2
2
 
3
- This log was last generated on Thu, 23 Feb 2023 21:23:18 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 28 Feb 2023 04:34:41 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20230223-2115.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20230223-2115.1)
7
+ ## [0.0.0-nightly-20230228-0425.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20230228-0425.1)
8
8
 
9
- Thu, 23 Feb 2023 21:23:18 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.22..@fluentui/react-spinner_v0.0.0-nightly-20230223-2115.1)
9
+ Tue, 28 Feb 2023 04:34:41 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.22..@fluentui/react-spinner_v0.0.0-nightly-20230228-0425.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/react-theme to v0.0.0-nightly-20230223-2115.1 ([commit](https://github.com/microsoft/fluentui/commit/a400eb0e4c7e02093ab7fb103c74a8dcca00f17b) by beachball)
16
- - Bump @fluentui/react-label to v0.0.0-nightly-20230223-2115.1 ([commit](https://github.com/microsoft/fluentui/commit/a400eb0e4c7e02093ab7fb103c74a8dcca00f17b) by beachball)
17
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20230223-2115.1 ([commit](https://github.com/microsoft/fluentui/commit/a400eb0e4c7e02093ab7fb103c74a8dcca00f17b) by beachball)
18
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230223-2115.1 ([commit](https://github.com/microsoft/fluentui/commit/a400eb0e4c7e02093ab7fb103c74a8dcca00f17b) by beachball)
15
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20230228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/8c1594112af8a99c5f4d2da191968d9247bdb269) by beachball)
16
+ - Bump @fluentui/react-label to v0.0.0-nightly-20230228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/8c1594112af8a99c5f4d2da191968d9247bdb269) by beachball)
17
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20230228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/8c1594112af8a99c5f4d2da191968d9247bdb269) by beachball)
18
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230228-0425.1 ([commit](https://github.com/microsoft/fluentui/commit/8c1594112af8a99c5f4d2da191968d9247bdb269) by beachball)
19
19
 
20
20
  ## [9.0.22](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.0.22)
21
21
 
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,cAAc","names":[],"sources":["../src/Spinner.ts"],"sourcesContent":["export * from './components/Spinner/index';\n"]}
1
+ {"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinner/src/Spinner.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './components/Spinner/index';\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,YAAYA,WAAW;AAEvB,OAAO,MAAMC,aAAa,mBACxBD,oBAACE;EAAIC,WAAU;gBACbH,oBAACI;EAAOD,WAAU;iBAClBH,oBAACI;EAAOD,WAAU","names":["React","DefaultSvg","svg","className","circle"],"sources":["../../../src/components/Spinner/DefaultSvg.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const DefaultSvg = () => (\n <svg className=\"fui-Spinner__Progressbar\">\n <circle className=\"fui-Spinner__Track\" />\n <circle className=\"fui-Spinner__Tail\" />\n </svg>\n);\n"]}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAE9B,OAAO,MAAMC,UAAU,GAAG,mBACxBD;EAAKE,SAAS,EAAC;AAA0B,gBACvCF;EAAQE,SAAS,EAAC;AAAoB,EAAG,eACzCF;EAAQE,SAAS,EAAC;AAAmB,EAAG,CAE3C","names":["React","DefaultSvg","className"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/DefaultSvg.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const DefaultSvg = () => (\n <svg className=\"fui-Spinner__Progressbar\">\n <circle className=\"fui-Spinner__Track\" />\n <circle className=\"fui-Spinner__Tail\" />\n </svg>\n);\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,mBAAmB,QAAQ;AACpC,SAASC,sBAAsB,QAAQ;AACvC,SAASC,yBAAyB,QAAQ;AAI1C;;;AAGA,OAAO,MAAMC,uBAA6CJ,MAAMK,UAAU,CAAC,CAACC,OAAOC,QAAQ;EACzF,MAAMC,QAAQP,oBAAoBK,OAAOC;EAEzCJ,0BAA0BK;EAC1B,OAAON,uBAAuBM;AAChC;AAEAJ,QAAQK,WAAW,GAAG","names":["React","useSpinner_unstable","renderSpinner_unstable","useSpinnerStyles_unstable","Spinner","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner: ForwardRefComponent<SpinnerProps> = React.forwardRef((props, ref) => {\n const state = useSpinner_unstable(props, ref);\n\n useSpinnerStyles_unstable(state);\n return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"]}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,mBAAmB,QAAQ,cAAc;AAClD,SAASC,sBAAsB,QAAQ,iBAAiB;AACxD,SAASC,yBAAyB,QAAQ,oBAAoB;AAI9D;;;AAGA,OAAO,MAAMC,OAAO,gBAAsCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGP,mBAAmB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE7CJ,yBAAyB,CAACK,KAAK,CAAC;EAChC,OAAON,sBAAsB,CAACM,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFJ,OAAO,CAACK,WAAW,GAAG,SAAS","names":["React","useSpinner_unstable","renderSpinner_unstable","useSpinnerStyles_unstable","Spinner","forwardRef","props","ref","state","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner: ForwardRefComponent<SpinnerProps> = React.forwardRef((props, ref) => {\n const state = useSpinner_unstable(props, ref);\n\n useSpinnerStyles_unstable(state);\n return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA","names":[],"sources":["../../../src/components/Spinner/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 * 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' | 'labelPosition' | 'size'>>;\n"]}
1
+ {"version":3,"file":"Spinner.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/Spinner.types.ts"],"names":[],"mappings":"","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 * 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' | 'labelPosition' | 'size'>>;\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc","names":[],"sources":["../../../src/components/Spinner/index.ts"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}
@@ -1,4 +1,3 @@
1
- import _extends from "@swc/helpers/src/_extends.mjs";
2
1
  import * as React from 'react';
3
2
  import { getSlots } from '@fluentui/react-utilities';
4
3
  /**
@@ -12,6 +11,14 @@ export const renderSpinner_unstable = state => {
12
11
  const {
13
12
  labelPosition
14
13
  } = state;
15
- return /*#__PURE__*/React.createElement(slots.root, _extends({}, slotProps.root), slots.label && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/React.createElement(slots.label, _extends({}, slotProps.label)), slots.spinner && /*#__PURE__*/React.createElement(slots.spinner, _extends({}, slotProps.spinner)), slots.label && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/React.createElement(slots.label, _extends({}, slotProps.label)));
14
+ return /*#__PURE__*/React.createElement(slots.root, {
15
+ ...slotProps.root
16
+ }, slots.label && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/React.createElement(slots.label, {
17
+ ...slotProps.label
18
+ }), slots.spinner && /*#__PURE__*/React.createElement(slots.spinner, {
19
+ ...slotProps.spinner
20
+ }), slots.label && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/React.createElement(slots.label, {
21
+ ...slotProps.label
22
+ }));
16
23
  };
17
24
  //# sourceMappingURL=renderSpinner.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";AAAA,YAAYA,WAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,yBAA0BC,SAAwB;EAC7D,MAAM;IAAEC;IAAOC;EAAS,CAAE,GAAGJ,SAAuBE;EACpD,MAAM;IAAEG;EAAa,CAAE,GAAGH;EAC1B,oBACEH,oBAACI,MAAMG,IAAI,eAAKF,UAAUE,IAAI,GAC3BH,MAAMI,KAAK,KAAKF,kBAAkB,WAAWA,kBAAkB,QAAO,kBAAMN,oBAACI,MAAMI,KAAK,eAAKH,UAAUG,KAAK,IAC5GJ,MAAMK,OAAO,iBAAIT,oBAACI,MAAMK,OAAO,eAAKJ,UAAUI,OAAO,IACrDL,MAAMI,KAAK,KAAKF,kBAAkB,WAAWA,kBAAkB,OAAM,kBAAMN,oBAACI,MAAMI,KAAK,eAAKH,UAAUG,KAAK;AAGlH","names":["React","getSlots","renderSpinner_unstable","state","slots","slotProps","labelPosition","root","label","spinner"],"sources":["../../../src/components/Spinner/renderSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\n\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = (state: SpinnerState) => {\n const { slots, slotProps } = getSlots<SpinnerSlots>(state);\n const { labelPosition } = state;\n return (\n <slots.root {...slotProps.root}>\n {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n </slots.root>\n );\n};\n"]}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD;;;AAGA,OAAO,MAAMC,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAeE,KAAK,CAAC;EAC1D,MAAM;IAAEG;EAAa,CAAE,GAAGH,KAAK;EAC/B,oBACEH,oBAACI,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BH,KAAK,CAACI,KAAK,KAAKF,aAAa,KAAK,OAAO,IAAIA,aAAa,KAAK,QAAQ,CAAC,iBAAIN,oBAACI,KAAK,CAACI,KAAK;IAAA,GAAKH,SAAS,CAACG;EAAK,EAAI,EAChHJ,KAAK,CAACK,OAAO,iBAAIT,oBAACI,KAAK,CAACK,OAAO;IAAA,GAAKJ,SAAS,CAACI;EAAO,EAAI,EACzDL,KAAK,CAACI,KAAK,KAAKF,aAAa,KAAK,OAAO,IAAIA,aAAa,KAAK,OAAO,CAAC,iBAAIN,oBAACI,KAAK,CAACI,KAAK;IAAA,GAAKH,SAAS,CAACG;EAAK,EAAI,CACrG;AAEjB,CAAC","names":["React","getSlots","renderSpinner_unstable","state","slots","slotProps","labelPosition","root","label","spinner"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/renderSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\n\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = (state: SpinnerState) => {\n const { slots, slotProps } = getSlots<SpinnerSlots>(state);\n const { labelPosition } = state;\n return (\n <slots.root {...slotProps.root}>\n {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n </slots.root>\n );\n};\n"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,YAAYA,WAAW;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ;AAE/D,SAASC,KAAK,QAAQ;AACtB,SAASC,UAAU,QAAQ;AAE3B;;;;;;;;;AASA,OAAO,MAAMC,sBAAsB,CAACC,OAAqBC,QAA8C;EACrG;EACA,MAAM;IAAEC,aAAa;IAAWC,gBAAgB;IAASC,OAAO;EAAQ,CAAE,GAAGJ;EAC7E,MAAMK,SAAST,MAAM;EAErB,MAAM;IAAEU,OAAO;IAAeC;IAAU,GAAGC;EAAAA,CAAM,GAAGR;EACpD,MAAMS,aAAaf,sBAAsB,OAAO;IAAEO;IAAKK;IAAM,GAAGE;EAAK,GAAG,CAAC,OAAO;EAEhF,MAAME,iBAAiBf,iBAAiBK,MAAMW,KAAK,EAAE;IACnDC,cAAc;MACZC,IAAIR;IACN;IACAS,UAAU;EACZ;EAEA,MAAMC,mBAAmBpB,iBAAiBK,MAAMgB,OAAO,EAAE;IACvDF,UAAU,IAAI;IACdF,cAAc;MACZK,uBAAUxB,oBAACK;MACXS;IACF;EACF;EAEA,IAAIG,kBAAkBD,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;IAClEA,UAAU,CAAC,kBAAkB,GAAGC,eAAeG,EAAE;EACnD;EAEA,MAAMK,QAAsB;IAC1BhB;IACAC;IACAC;IACAe,YAAY;MACVC,MAAM;MACNJ,SAAS;MACTL,OAAOd;IACT;IACAuB,MAAMX;IACNO,SAASD;IACTJ,OAAOD;EACT;EACA,OAAOQ;AACT","names":["React","getNativeElementProps","resolveShorthand","useId","Label","DefaultSvg","useSpinner_unstable","props","ref","appearance","labelPosition","size","baseId","role","tabIndex","rest","nativeRoot","labelShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","state","components","root"],"sources":["../../../src/components/Spinner/useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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 labelPosition,\n size,\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"]}
1
+ {"version":3,"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,QAAQ,2BAA2B;AAE1F,SAASC,KAAK,QAAQ,uBAAuB;AAC7C,SAASC,UAAU,QAAQ,cAAc;AAEzC;;;;;;;;;AASA,OAAO,MAAMC,mBAAmB,GAAG,CAACC,KAAmB,EAAEC,GAA2B,KAAkB;EACpG;EACA,MAAM;IAAEC,UAAU,GAAG,SAAS;IAAEC,aAAa,GAAG,OAAO;IAAEC,IAAI,GAAG;EAAQ,CAAE,GAAGJ,KAAK;EAClF,MAAMK,MAAM,GAAGT,KAAK,CAAC,SAAS,CAAC;EAE/B,MAAM;IAAEU,IAAI,GAAG,aAAa;IAAEC,QAAQ;IAAE,GAAGC;EAAI,CAAE,GAAGR,KAAK;EACzD,MAAMS,UAAU,GAAGf,qBAAqB,CAAC,KAAK,EAAE;IAAEO,GAAG;IAAEK,IAAI;IAAE,GAAGE;EAAI,CAAE,EAAE,CAAC,MAAM,CAAC,CAAC;EAEjF,MAAME,cAAc,GAAGf,gBAAgB,CAACK,KAAK,CAACW,KAAK,EAAE;IACnDC,YAAY,EAAE;MACZC,EAAE,EAAER;KACL;IACDS,QAAQ,EAAE;GACX,CAAC;EAEF,MAAMC,gBAAgB,GAAGpB,gBAAgB,CAACK,KAAK,CAACgB,OAAO,EAAE;IACvDF,QAAQ,EAAE,IAAI;IACdF,YAAY,EAAE;MACZK,QAAQ,eAAExB,oBAACK,UAAU,OAAG;MACxBS;;GAEH,CAAC;EAEF,IAAIG,cAAc,IAAID,UAAU,IAAI,CAACA,UAAU,CAAC,iBAAiB,CAAC,EAAE;IAClEA,UAAU,CAAC,iBAAiB,CAAC,GAAGC,cAAc,CAACG,EAAE;;EAGnD,MAAMK,KAAK,GAAiB;IAC1BhB,UAAU;IACVC,aAAa;IACbC,IAAI;IACJe,UAAU,EAAE;MACVC,IAAI,EAAE,KAAK;MACXJ,OAAO,EAAE,MAAM;MACfL,KAAK,EAAEd;KACR;IACDuB,IAAI,EAAEX,UAAU;IAChBO,OAAO,EAAED,gBAAgB;IACzBJ,KAAK,EAAED;GACR;EACD,OAAOQ,KAAK;AACd,CAAC","names":["React","getNativeElementProps","resolveShorthand","useId","Label","DefaultSvg","useSpinner_unstable","props","ref","appearance","labelPosition","size","baseId","role","tabIndex","rest","nativeRoot","labelShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","state","components","root"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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 labelPosition,\n size,\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"]}
@@ -1 +1 @@
1
- {"version":3,"mappings":"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","names":["mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","makeStyles","useLoaderStyles","useTrackStyles","useLabelStyles","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className","vertical","horizontal","spinnerSVG"],"sources":["../../../src/components/Spinner/useSpinnerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const spinnerClassNames: SlotClassNames<SpinnerSlots> = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label',\n};\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/*\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/*\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/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n lineHeight: '0',\n ...shorthands.gap('8px'),\n },\n\n horizontal: {\n flexDirection: 'row',\n },\n\n vertical: {\n flexDirection: 'column',\n },\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%': { transform: 'rotate(0deg)' },\n '100%': { transform: 'rotate(360deg)' },\n },\n ...spinnerAnimation.container,\n\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\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\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\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\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\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\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\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});\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\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35',\n },\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\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: 'rgba(255, 255, 255, 0.2)', // this is whiteAlpha[20] but that token is not exported\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\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35',\n },\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});\n\nconst useLabelStyles = makeStyles({\n // style for label\n inverted: {\n color: 'rgba(255, 255, 255, 1)', // This is white alpha but the token is not exported\n },\n\n primary: {}, // no change\n\n tiny: {\n ...typographyStyles.body1,\n },\n\n 'extra-small': {\n ...typographyStyles.body1,\n },\n\n small: {\n ...typographyStyles.body1,\n },\n\n medium: {\n ...typographyStyles.subtitle2,\n },\n\n large: {\n ...typographyStyles.subtitle2,\n },\n\n 'extra-large': {\n ...typographyStyles.subtitle2,\n },\n\n huge: {\n ...typographyStyles.subtitle1,\n },\n});\n\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = (state: SpinnerState): SpinnerState => {\n const { labelPosition, size, appearance = 'primary' } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n\n state.root.className = mergeClasses(\n spinnerClassNames.root,\n rootStyles.root,\n (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical,\n (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal,\n state.root.className,\n );\n if (state.spinner) {\n state.spinner.className = mergeClasses(\n spinnerClassNames.spinner,\n spinnerStyles.spinnerSVG,\n spinnerStyles[size],\n trackStyles[appearance],\n state.spinner.className,\n );\n }\n if (state.label) {\n state.label.className = mergeClasses(\n spinnerClassNames.label,\n labelStyles[size],\n labelStyles[appearance],\n state.label.className,\n );\n }\n\n return state;\n};\n"]}
1
+ {"version":3,"mappings":"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","names":["mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","useLoaderStyles","useTrackStyles","useLabelStyles","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className","vertical","horizontal","spinnerSVG"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/useSpinnerStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const spinnerClassNames: SlotClassNames<SpinnerSlots> = {\n root: 'fui-Spinner',\n spinner: 'fui-Spinner__spinner',\n label: 'fui-Spinner__label',\n};\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/*\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/*\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/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n root: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n lineHeight: '0',\n ...shorthands.gap('8px'),\n },\n\n horizontal: {\n flexDirection: 'row',\n },\n\n vertical: {\n flexDirection: 'column',\n },\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%': { transform: 'rotate(0deg)' },\n '100%': { transform: 'rotate(360deg)' },\n },\n ...spinnerAnimation.container,\n\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\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\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\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\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\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\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\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});\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\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35',\n },\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\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n\n ['& > svg > circle.fui-Spinner__Track']: {\n stroke: 'rgba(255, 255, 255, 0.2)', // this is whiteAlpha[20] but that token is not exported\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\n '50%': {\n strokeDasharray: '90,150',\n strokeDashoffset: '-35',\n },\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});\n\nconst useLabelStyles = makeStyles({\n // style for label\n inverted: {\n color: 'rgba(255, 255, 255, 1)', // This is white alpha but the token is not exported\n },\n\n primary: {}, // no change\n\n tiny: {\n ...typographyStyles.body1,\n },\n\n 'extra-small': {\n ...typographyStyles.body1,\n },\n\n small: {\n ...typographyStyles.body1,\n },\n\n medium: {\n ...typographyStyles.subtitle2,\n },\n\n large: {\n ...typographyStyles.subtitle2,\n },\n\n 'extra-large': {\n ...typographyStyles.subtitle2,\n },\n\n huge: {\n ...typographyStyles.subtitle1,\n },\n});\n\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = (state: SpinnerState): SpinnerState => {\n const { labelPosition, size, appearance = 'primary' } = state;\n const rootStyles = useRootStyles();\n const spinnerStyles = useLoaderStyles();\n const labelStyles = useLabelStyles();\n const trackStyles = useTrackStyles();\n\n state.root.className = mergeClasses(\n spinnerClassNames.root,\n rootStyles.root,\n (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical,\n (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal,\n state.root.className,\n );\n if (state.spinner) {\n state.spinner.className = mergeClasses(\n spinnerClassNames.spinner,\n spinnerStyles.spinnerSVG,\n spinnerStyles[size],\n trackStyles[appearance],\n state.spinner.className,\n );\n }\n if (state.label) {\n state.label.className = mergeClasses(\n spinnerClassNames.label,\n labelStyles[size],\n labelStyles[appearance],\n state.label.className,\n );\n }\n\n return state;\n};\n"]}
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB","names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"sources":["../src/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"]}
1
+ {"version":3,"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB,WAAW","names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinner/src/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"]}
@@ -1,9 +1,8 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
+ value: true
4
5
  });
5
- const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
- _exportStar(require("./components/Spinner/index"), exports);
7
- //# sourceMappingURL=Spinner.js.map
8
-
6
+ const tslib_1 = /*#__PURE__*/require("tslib");
7
+ tslib_1.__exportStar(require("./components/Spinner/index"), exports);
9
8
  //# sourceMappingURL=Spinner.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../lib/Spinner.js"],"sourcesContent":["export * from './components/Spinner/index';\n//# sourceMappingURL=Spinner.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
1
+ {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinner/src/Spinner.ts"],"sourcesContent":["export * from './components/Spinner/index';\n"]}
@@ -1,19 +1,16 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "DefaultSvg", {
6
- enumerable: true,
7
- get: ()=>DefaultSvg
4
+ value: true
8
5
  });
9
- const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
- const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
- const DefaultSvg = ()=>/*#__PURE__*/ _react.createElement("svg", {
12
- className: "fui-Spinner__Progressbar"
13
- }, /*#__PURE__*/ _react.createElement("circle", {
14
- className: "fui-Spinner__Track"
15
- }), /*#__PURE__*/ _react.createElement("circle", {
16
- className: "fui-Spinner__Tail"
17
- })); //# sourceMappingURL=DefaultSvg.js.map
18
-
6
+ exports.DefaultSvg = void 0;
7
+ const React = /*#__PURE__*/require("react");
8
+ const DefaultSvg = () => React.createElement("svg", {
9
+ className: "fui-Spinner__Progressbar"
10
+ }, React.createElement("circle", {
11
+ className: "fui-Spinner__Track"
12
+ }), React.createElement("circle", {
13
+ className: "fui-Spinner__Tail"
14
+ }));
15
+ exports.DefaultSvg = DefaultSvg;
19
16
  //# sourceMappingURL=DefaultSvg.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Spinner/DefaultSvg.js"],"sourcesContent":["import * as React from 'react';\nexport const DefaultSvg = () => /*#__PURE__*/React.createElement(\"svg\", {\n className: \"fui-Spinner__Progressbar\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n className: \"fui-Spinner__Track\"\n}), /*#__PURE__*/React.createElement(\"circle\", {\n className: \"fui-Spinner__Tail\"\n}));\n//# sourceMappingURL=DefaultSvg.js.map"],"names":["DefaultSvg","React","createElement","className"],"mappings":";;;;+BACaA;;aAAAA;;;6DADU;AAChB,MAAMA,aAAa,IAAM,WAAW,GAAEC,OAAMC,aAAa,CAAC,OAAO;QACtEC,WAAW;IACb,GAAG,WAAW,GAAEF,OAAMC,aAAa,CAAC,UAAU;QAC5CC,WAAW;IACb,IAAI,WAAW,GAAEF,OAAMC,aAAa,CAAC,UAAU;QAC7CC,WAAW;IACb,KACA,sCAAsC"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AAEO,MAAMA,UAAU,GAAG,MACxBC;EAAKC,SAAS,EAAC;AAA0B,GACvCD;EAAQC,SAAS,EAAC;AAAoB,EAAG,EACzCD;EAAQC,SAAS,EAAC;AAAmB,EAAG,CAE3C;AALYC,kBAAU","names":["DefaultSvg","React","className","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/DefaultSvg.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const DefaultSvg = () => (\n <svg className=\"fui-Spinner__Progressbar\">\n <circle className=\"fui-Spinner__Track\" />\n <circle className=\"fui-Spinner__Tail\" />\n </svg>\n);\n"]}
@@ -1,21 +1,20 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "Spinner", {
6
- enumerable: true,
7
- get: ()=>Spinner
4
+ value: true
8
5
  });
9
- const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
- const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
- const _useSpinner = require("./useSpinner");
12
- const _renderSpinner = require("./renderSpinner");
13
- const _useSpinnerStyles = require("./useSpinnerStyles");
14
- const Spinner = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
15
- const state = (0, _useSpinner.useSpinner_unstable)(props, ref);
16
- (0, _useSpinnerStyles.useSpinnerStyles_unstable)(state);
17
- return (0, _renderSpinner.renderSpinner_unstable)(state);
6
+ exports.Spinner = void 0;
7
+ const React = /*#__PURE__*/require("react");
8
+ const useSpinner_1 = /*#__PURE__*/require("./useSpinner");
9
+ const renderSpinner_1 = /*#__PURE__*/require("./renderSpinner");
10
+ const useSpinnerStyles_1 = /*#__PURE__*/require("./useSpinnerStyles");
11
+ /**
12
+ * Converged Spinner component for the fluentui repo
13
+ */
14
+ exports.Spinner = /*#__PURE__*/React.forwardRef((props, ref) => {
15
+ const state = useSpinner_1.useSpinner_unstable(props, ref);
16
+ useSpinnerStyles_1.useSpinnerStyles_unstable(state);
17
+ return renderSpinner_1.renderSpinner_unstable(state);
18
18
  });
19
- Spinner.displayName = 'Spinner'; //# sourceMappingURL=Spinner.js.map
20
-
19
+ exports.Spinner.displayName = 'Spinner';
21
20
  //# sourceMappingURL=Spinner.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Spinner/Spinner.js"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner = /*#__PURE__*/React.forwardRef((props, ref) => {\n const state = useSpinner_unstable(props, ref);\n useSpinnerStyles_unstable(state);\n return renderSpinner_unstable(state);\n});\nSpinner.displayName = 'Spinner';\n//# sourceMappingURL=Spinner.js.map"],"names":["Spinner","React","forwardRef","props","ref","state","useSpinner_unstable","useSpinnerStyles_unstable","renderSpinner_unstable","displayName"],"mappings":";;;;+BAOaA;;aAAAA;;;6DAPU;4BACa;+BACG;kCACG;AAInC,MAAMA,UAAU,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnE,MAAMC,QAAQC,IAAAA,+BAAmB,EAACH,OAAOC;IACzCG,IAAAA,2CAAyB,EAACF;IAC1B,OAAOG,IAAAA,qCAAsB,EAACH;AAChC;AACAL,QAAQS,WAAW,GAAG,WACtB,mCAAmC"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AACA;AAIA;;;AAGaA,eAAO,gBAAsCC,KAAK,CAACC,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACxF,MAAMC,KAAK,GAAGC,gCAAmB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE7CG,4CAAyB,CAACF,KAAK,CAAC;EAChC,OAAOG,sCAAsB,CAACH,KAAK,CAAC;AACtC,CAAC,CAAC;AAEFL,eAAO,CAACS,WAAW,GAAG,SAAS","names":["exports","React","forwardRef","props","ref","state","useSpinner_1","useSpinnerStyles_1","renderSpinner_1","displayName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner: ForwardRefComponent<SpinnerProps> = React.forwardRef((props, ref) => {\n const state = useSpinner_unstable(props, ref);\n\n useSpinnerStyles_unstable(state);\n return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"]}
@@ -1,7 +1,6 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
+ value: true
4
5
  });
5
- //# sourceMappingURL=Spinner.types.js.map
6
-
7
6
  //# sourceMappingURL=Spinner.types.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Spinner/Spinner.types.js"],"sourcesContent":["export {};\n//# sourceMappingURL=Spinner.types.js.map"],"names":[],"mappings":";;;;CACA,yCAAyC"}
1
+ {"version":3,"mappings":"","names":[],"sourceRoot":"","sources":[],"sourcesContent":[]}
@@ -1,13 +1,12 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
+ value: true
4
5
  });
5
- const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
6
- _exportStar(require("./Spinner"), exports);
7
- _exportStar(require("./Spinner.types"), exports);
8
- _exportStar(require("./renderSpinner"), exports);
9
- _exportStar(require("./useSpinner"), exports);
10
- _exportStar(require("./useSpinnerStyles"), exports);
11
- //# sourceMappingURL=index.js.map
12
-
6
+ const tslib_1 = /*#__PURE__*/require("tslib");
7
+ tslib_1.__exportStar(require("./Spinner"), exports);
8
+ tslib_1.__exportStar(require("./Spinner.types"), exports);
9
+ tslib_1.__exportStar(require("./renderSpinner"), exports);
10
+ tslib_1.__exportStar(require("./useSpinner"), exports);
11
+ tslib_1.__exportStar(require("./useSpinnerStyles"), exports);
13
12
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Spinner/index.js"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
1
+ {"version":3,"mappings":";;;;;;AAAAA;AACAA;AACAA;AACAA;AACAA","names":["tslib_1"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/index.ts"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}
@@ -1,20 +1,31 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "renderSpinner_unstable", {
6
- enumerable: true,
7
- get: ()=>renderSpinner_unstable
4
+ value: true
8
5
  });
9
- const _interopRequireDefault = require("@swc/helpers/lib/_interop_require_default.js").default;
10
- const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
11
- const _extends = require("@swc/helpers/lib/_extends.js").default;
12
- const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
13
- const _reactUtilities = require("@fluentui/react-utilities");
14
- const renderSpinner_unstable = (state)=>{
15
- const { slots , slotProps } = (0, _reactUtilities.getSlots)(state);
16
- const { labelPosition } = state;
17
- return /*#__PURE__*/ _react.createElement(slots.root, _extends({}, slotProps.root), slots.label && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/ _react.createElement(slots.label, _extends({}, slotProps.label)), slots.spinner && /*#__PURE__*/ _react.createElement(slots.spinner, _extends({}, slotProps.spinner)), slots.label && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/ _react.createElement(slots.label, _extends({}, slotProps.label)));
18
- }; //# sourceMappingURL=renderSpinner.js.map
19
-
6
+ exports.renderSpinner_unstable = void 0;
7
+ const React = /*#__PURE__*/require("react");
8
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
+ /**
10
+ * Render the final JSX of Spinner
11
+ */
12
+ const renderSpinner_unstable = state => {
13
+ const {
14
+ slots,
15
+ slotProps
16
+ } = react_utilities_1.getSlots(state);
17
+ const {
18
+ labelPosition
19
+ } = state;
20
+ return React.createElement(slots.root, {
21
+ ...slotProps.root
22
+ }, slots.label && (labelPosition === 'above' || labelPosition === 'before') && React.createElement(slots.label, {
23
+ ...slotProps.label
24
+ }), slots.spinner && React.createElement(slots.spinner, {
25
+ ...slotProps.spinner
26
+ }), slots.label && (labelPosition === 'below' || labelPosition === 'after') && React.createElement(slots.label, {
27
+ ...slotProps.label
28
+ }));
29
+ };
30
+ exports.renderSpinner_unstable = renderSpinner_unstable;
20
31
  //# sourceMappingURL=renderSpinner.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../lib/components/Spinner/renderSpinner.js"],"sourcesContent":["import _extends from \"@swc/helpers/src/_extends.mjs\";\nimport * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = state => {\n const {\n slots,\n slotProps\n } = getSlots(state);\n const {\n labelPosition\n } = state;\n return /*#__PURE__*/React.createElement(slots.root, _extends({}, slotProps.root), slots.label && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/React.createElement(slots.label, _extends({}, slotProps.label)), slots.spinner && /*#__PURE__*/React.createElement(slots.spinner, _extends({}, slotProps.spinner)), slots.label && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/React.createElement(slots.label, _extends({}, slotProps.label)));\n};\n//# sourceMappingURL=renderSpinner.js.map"],"names":["renderSpinner_unstable","state","slots","slotProps","getSlots","labelPosition","React","createElement","root","_extends","label","spinner"],"mappings":";;;;+BAMaA;;aAAAA;;;;yBANQ;6DACE;gCACE;AAIlB,MAAMA,yBAAyBC,CAAAA,QAAS;IAC7C,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,wBAAQ,EAACH;IACb,MAAM,EACJI,cAAa,EACd,GAAGJ;IACJ,OAAO,WAAW,GAAEK,OAAMC,aAAa,CAACL,MAAMM,IAAI,EAAEC,SAAS,CAAC,GAAGN,UAAUK,IAAI,GAAGN,MAAMQ,KAAK,IAAKL,CAAAA,kBAAkB,WAAWA,kBAAkB,QAAO,KAAM,WAAW,GAAEC,OAAMC,aAAa,CAACL,MAAMQ,KAAK,EAAED,SAAS,CAAC,GAAGN,UAAUO,KAAK,IAAIR,MAAMS,OAAO,IAAI,WAAW,GAAEL,OAAMC,aAAa,CAACL,MAAMS,OAAO,EAAEF,SAAS,CAAC,GAAGN,UAAUQ,OAAO,IAAIT,MAAMQ,KAAK,IAAKL,CAAAA,kBAAkB,WAAWA,kBAAkB,OAAM,KAAM,WAAW,GAAEC,OAAMC,aAAa,CAACL,MAAMQ,KAAK,EAAED,SAAS,CAAC,GAAGN,UAAUO,KAAK;AACte,GACA,yCAAyC"}
1
+ {"version":3,"mappings":";;;;;;AAAA;AACA;AAGA;;;AAGO,MAAMA,sBAAsB,GAAIC,KAAmB,IAAI;EAC5D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGC,0BAAQ,CAAeH,KAAK,CAAC;EAC1D,MAAM;IAAEI;EAAa,CAAE,GAAGJ,KAAK;EAC/B,OACEK,oBAACJ,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,GAC3BL,KAAK,CAACM,KAAK,KAAKH,aAAa,KAAK,OAAO,IAAIA,aAAa,KAAK,QAAQ,CAAC,IAAIC,oBAACJ,KAAK,CAACM,KAAK;IAAA,GAAKL,SAAS,CAACK;EAAK,EAAI,EAChHN,KAAK,CAACO,OAAO,IAAIH,oBAACJ,KAAK,CAACO,OAAO;IAAA,GAAKN,SAAS,CAACM;EAAO,EAAI,EACzDP,KAAK,CAACM,KAAK,KAAKH,aAAa,KAAK,OAAO,IAAIA,aAAa,KAAK,OAAO,CAAC,IAAIC,oBAACJ,KAAK,CAACM,KAAK;IAAA,GAAKL,SAAS,CAACK;EAAK,EAAI,CACrG;AAEjB,CAAC;AAVYE,8BAAsB","names":["renderSpinner_unstable","state","slots","slotProps","react_utilities_1","labelPosition","React","root","label","spinner","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/renderSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\n\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = (state: SpinnerState) => {\n const { slots, slotProps } = getSlots<SpinnerSlots>(state);\n const { labelPosition } = state;\n return (\n <slots.root {...slotProps.root}>\n {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n </slots.root>\n );\n};\n"]}
@@ -1,58 +1,70 @@
1
1
  "use strict";
2
+
2
3
  Object.defineProperty(exports, "__esModule", {
3
- value: true
4
- });
5
- Object.defineProperty(exports, "useSpinner_unstable", {
6
- enumerable: true,
7
- get: ()=>useSpinner_unstable
4
+ value: true
8
5
  });
9
- const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
- const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
11
- const _reactUtilities = require("@fluentui/react-utilities");
12
- const _reactLabel = require("@fluentui/react-label");
13
- const _defaultSvg = require("./DefaultSvg");
14
- const useSpinner_unstable = (props, ref)=>{
15
- // Props
16
- const { appearance ='primary' , labelPosition ='after' , size ='medium' } = props;
17
- const baseId = (0, _reactUtilities.useId)('spinner');
18
- const { role ='progressbar' , tabIndex , ...rest } = props;
19
- const nativeRoot = (0, _reactUtilities.getNativeElementProps)('div', {
20
- ref,
21
- role,
22
- ...rest
23
- }, [
24
- 'size'
25
- ]);
26
- const labelShorthand = (0, _reactUtilities.resolveShorthand)(props.label, {
27
- defaultProps: {
28
- id: baseId
29
- },
30
- required: false
31
- });
32
- const spinnerShortHand = (0, _reactUtilities.resolveShorthand)(props.spinner, {
33
- required: true,
34
- defaultProps: {
35
- children: /*#__PURE__*/ _react.createElement(_defaultSvg.DefaultSvg, null),
36
- tabIndex
37
- }
38
- });
39
- if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {
40
- nativeRoot['aria-labelledby'] = labelShorthand.id;
6
+ exports.useSpinner_unstable = void 0;
7
+ const React = /*#__PURE__*/require("react");
8
+ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
9
+ const react_label_1 = /*#__PURE__*/require("@fluentui/react-label");
10
+ const DefaultSvg_1 = /*#__PURE__*/require("./DefaultSvg");
11
+ /**
12
+ * Create the state required to render Spinner.
13
+ *
14
+ * The returned state can be modified with hooks such as useSpinnerStyles_unstable,
15
+ * before being passed to renderSpinner_unstable.
16
+ *
17
+ * @param props - props from this instance of Spinner
18
+ * @param ref - reference to root HTMLElement of Spinner
19
+ */
20
+ const useSpinner_unstable = (props, ref) => {
21
+ // Props
22
+ const {
23
+ appearance = 'primary',
24
+ labelPosition = 'after',
25
+ size = 'medium'
26
+ } = props;
27
+ const baseId = react_utilities_1.useId('spinner');
28
+ const {
29
+ role = 'progressbar',
30
+ tabIndex,
31
+ ...rest
32
+ } = props;
33
+ const nativeRoot = react_utilities_1.getNativeElementProps('div', {
34
+ ref,
35
+ role,
36
+ ...rest
37
+ }, ['size']);
38
+ const labelShorthand = react_utilities_1.resolveShorthand(props.label, {
39
+ defaultProps: {
40
+ id: baseId
41
+ },
42
+ required: false
43
+ });
44
+ const spinnerShortHand = react_utilities_1.resolveShorthand(props.spinner, {
45
+ required: true,
46
+ defaultProps: {
47
+ children: React.createElement(DefaultSvg_1.DefaultSvg, null),
48
+ tabIndex
41
49
  }
42
- const state = {
43
- appearance,
44
- labelPosition,
45
- size,
46
- components: {
47
- root: 'div',
48
- spinner: 'span',
49
- label: _reactLabel.Label
50
- },
51
- root: nativeRoot,
52
- spinner: spinnerShortHand,
53
- label: labelShorthand
54
- };
55
- return state;
56
- }; //# sourceMappingURL=useSpinner.js.map
57
-
50
+ });
51
+ if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {
52
+ nativeRoot['aria-labelledby'] = labelShorthand.id;
53
+ }
54
+ const state = {
55
+ appearance,
56
+ labelPosition,
57
+ size,
58
+ components: {
59
+ root: 'div',
60
+ spinner: 'span',
61
+ label: react_label_1.Label
62
+ },
63
+ root: nativeRoot,
64
+ spinner: spinnerShortHand,
65
+ label: labelShorthand
66
+ };
67
+ return state;
68
+ };
69
+ exports.useSpinner_unstable = useSpinner_unstable;
58
70
  //# sourceMappingURL=useSpinner.js.map