@fluentui/react-spinner 0.0.0-nightly-20220610-0420.1 → 0.0.0-nightly-20220615-0421.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 CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-spinner",
3
3
  "entries": [
4
4
  {
5
- "date": "Fri, 10 Jun 2022 04:35:11 GMT",
6
- "tag": "@fluentui/react-spinner_v0.0.0-nightly-20220610-0420.1",
7
- "version": "0.0.0-nightly-20220610-0420.1",
5
+ "date": "Wed, 15 Jun 2022 04:36:22 GMT",
6
+ "tag": "@fluentui/react-spinner_v0.0.0-nightly-20220615-0421.1",
7
+ "version": "0.0.0-nightly-20220615-0421.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -13,17 +13,30 @@
13
13
  "commit": "11db251a9eda2d067cb1262c37c7a6a4b5a1a016",
14
14
  "comment": "fix: Move role attribute to root slot and update Spinner documentation"
15
15
  },
16
+ {
17
+ "author": "Humberto.Morimoto@microsoft.com",
18
+ "package": "@fluentui/react-spinner",
19
+ "commit": "95039a95033166fdd6c45478b1e9703302e17bb8"
20
+ },
16
21
  {
17
22
  "author": "beachball",
18
23
  "package": "@fluentui/react-spinner",
19
- "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20220610-0420.1",
20
- "commit": "f6d5f8cebb6e0b532670f90508886c9c033cd443"
24
+ "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20220615-0421.1",
25
+ "commit": "251ff0f337f2debfdbc2d3027019a5f2d7cb43bc"
21
26
  },
22
27
  {
23
28
  "author": "beachball",
24
29
  "package": "@fluentui/react-spinner",
25
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220610-0420.1",
26
- "commit": "f6d5f8cebb6e0b532670f90508886c9c033cd443"
30
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220615-0421.1",
31
+ "commit": "251ff0f337f2debfdbc2d3027019a5f2d7cb43bc"
32
+ }
33
+ ],
34
+ "none": [
35
+ {
36
+ "author": "Humberto.Morimoto@microsoft.com",
37
+ "package": "@fluentui/react-spinner",
38
+ "commit": "95039a95033166fdd6c45478b1e9703302e17bb8",
39
+ "comment": "docs: README, spec and migration guide cleanup."
27
40
  }
28
41
  ]
29
42
  }
package/CHANGELOG.md CHANGED
@@ -1,19 +1,20 @@
1
1
  # Change Log - @fluentui/react-spinner
2
2
 
3
- This log was last generated on Fri, 10 Jun 2022 04:35:11 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 15 Jun 2022 04:36:22 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20220610-0420.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20220610-0420.1)
7
+ ## [0.0.0-nightly-20220615-0421.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20220615-0421.1)
8
8
 
9
- Fri, 10 Jun 2022 04:35:11 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.0-rc.5..@fluentui/react-spinner_v0.0.0-nightly-20220610-0420.1)
9
+ Wed, 15 Jun 2022 04:36:22 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.0-rc.5..@fluentui/react-spinner_v0.0.0-nightly-20220615-0421.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - fix: Move role attribute to root slot and update Spinner documentation ([PR #23385](https://github.com/microsoft/fluentui/pull/23385) by ololubek@microsoft.com)
15
- - Bump @fluentui/react-label to v0.0.0-nightly-20220610-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/f6d5f8cebb6e0b532670f90508886c9c033cd443) by beachball)
16
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20220610-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/f6d5f8cebb6e0b532670f90508886c9c033cd443) by beachball)
15
+ - undefined ([PR #23503](https://github.com/microsoft/fluentui/pull/23503) by Humberto.Morimoto@microsoft.com)
16
+ - Bump @fluentui/react-label to v0.0.0-nightly-20220615-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/251ff0f337f2debfdbc2d3027019a5f2d7cb43bc) by beachball)
17
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20220615-0421.1 ([commit](https://github.com/microsoft/fluentui/commit/251ff0f337f2debfdbc2d3027019a5f2d7cb43bc) by beachball)
17
18
 
18
19
  ## [9.0.0-rc.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.0.0-rc.5)
19
20
 
package/MIGRATION.md CHANGED
@@ -1,13 +1,5 @@
1
1
  # Spinner Migration
2
2
 
3
- ## Migration from v0
4
-
5
- - `Loader`
6
- - `inline` => Not supported.
7
- - `labelPosition` => 'start' and 'end' changed to 'before' and 'after'
8
- - `size` => There are the same number of sizes
9
- - `delay` => Not supported.
10
-
11
3
  ## Migration from v8
12
4
 
13
5
  - `Spinner`
@@ -15,3 +7,24 @@
15
7
  - `ariaLive` => use `aria-live` instead.
16
8
  - `componentRef` => use `ref` instead.
17
9
  - `theme` => Not supported. Use a `ThemeProvider` control instead.
10
+
11
+ ## Migration from v0
12
+
13
+ - `Loader`
14
+ - `delay` => Not supported.
15
+ - `inline` => Not supported.
16
+ - `labelPosition` => `labelPosition` => 'start' and 'end' changed to 'before' and 'after'
17
+ - `size` => `size` => There are the same number of sizes
18
+
19
+ ## Property mapping
20
+
21
+ | v8 `Spinner` | v0 `Loader` | v9 `Spinner` |
22
+ | -------------- | --------------- | --------------- |
23
+ | `ariaLabel` | `aria-label` | `aria-label` |
24
+ | `ariaLive` | `aria-live` | `aria-live` |
25
+ | `componentRef` | `ref` | `ref` |
26
+ | | `delay` | |
27
+ | | `inline` | |
28
+ | | `labelPosition` | `labelPosition` |
29
+ | | `size` | `size` |
30
+ | `theme` | | |
package/README.md CHANGED
@@ -1,24 +1,32 @@
1
1
  # @fluentui/react-spinner
2
2
 
3
- **React Spinner components for [Fluent UI React](https://developer.microsoft.com/en-us/fluentui)**
3
+ **Spinner components for [Fluent UI React](https://aka.ms/fluentui-storybook)**
4
4
 
5
- The Spinner is an outline of a circle which animates around itself indicating to the user that things are processing. Spinner is typically an indeterminate ProgressIndicator that is used when it is unknown how long a task will take to complete. They can be various sizes, located inline with content or centered. They generally appear while an action is being processed or committed. They are subtle and generally do not take up much space, but are transitions from the completed task
5
+ The Spinner is an outline of a circle which animates around itself indicating to the user that things are processing. Spinners are typically indeterminate progress indicators that is used when it is unknown how long a task will take to complete. They can be various sizes, located inline with content or centered. They generally appear while an action is being processed or committed. They are subtle and generally do not take up much space, but are transitions from the completed task.
6
6
 
7
7
  ## Usage
8
8
 
9
9
  To import Spinner:
10
10
 
11
11
  ```js
12
- import { Spinner } from '@fluentui/react-spinner';
12
+ import { Spinner } from '@fluentui/react-components';
13
13
  ```
14
14
 
15
15
  ### Examples
16
16
 
17
17
  ```js
18
18
  <Spinner label="Loading..." />
19
- <Spinner size="large" />
19
+ <Spinner label="Loading..." appearance="inverted" />
20
+ <Spinner label="Loading..." size="large" />
20
21
  ```
21
22
 
23
+ See [Fluent UI Storybook](https://aka.ms/fluentui-storybook) for more detailed usage examples.
24
+
25
+ Alternatively, run Storybook locally with:
26
+
27
+ 1. `yarn start`
28
+ 2. Select `react-spinner` from the list.
29
+
22
30
  #### Rendering Spinner without the animated circle
23
31
 
24
32
  You can directly override the Spinner slot to render a Spinner without the animated circle, as shown below
@@ -27,3 +35,11 @@ You can directly override the Spinner slot to render a Spinner without the anima
27
35
  <Spinner spinner={null} appearance="primary" label="Primary Spinner" />
28
36
  <Spinner spinner={{style:{visibility: 'hidden'}}} appearance="inverted" label="Inverted Spinner" />
29
37
  ```
38
+
39
+ ### Specification
40
+
41
+ See [SPEC.md](./SPEC.md).
42
+
43
+ ### Migration Guide
44
+
45
+ If you're upgrading to Fluent UI v9 see [MIGRATION.md](./MIGRATION.md) for guidance on updating to the latest Spinner implementation.
package/Spec.md CHANGED
@@ -68,8 +68,6 @@ The Spinner is represented as a circle with an arc of a darker shade rotating th
68
68
 
69
69
  ## API
70
70
 
71
- From [Spinner.types.tsx](https://github.com/microsoft/fluentui/blob/master/packages/react-spinner/src/components/Spinner/Spinner.types.ts)
72
-
73
71
  ### Slots
74
72
 
75
73
  - `root` - The root element of the Spinner. The html element is a `span`
@@ -78,18 +76,7 @@ From [Spinner.types.tsx](https://github.com/microsoft/fluentui/blob/master/packa
78
76
 
79
77
  ### Props
80
78
 
81
- ```jsx
82
- export type SpinnerProps = ComponentProps &
83
- React.HTMLAttributes<HTMLElement> & {
84
- /* The appearance of the Spinner*/
85
- appearance?: 'primary' | 'inverted',
86
- /* The labelPosition prop allows user to set the location of the label*/
87
- labelPosition?: 'above' | 'below' | 'before' | 'after',
88
- /* The size prop sets the size of the Spinner
89
- * @defaultValue "medium"*/
90
- size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge',
91
- };
92
- ```
79
+ See API at [Spinner.types.tsx](./src/components/Spinner/Spinner.types.ts).
93
80
 
94
81
  ## Structure
95
82
 
@@ -109,7 +96,7 @@ export type SpinnerProps = ComponentProps &
109
96
 
110
97
  ## Migration
111
98
 
112
- See [MIGRATION.md]().
99
+ See [MIGRATION.md](./MIGRATION.md).
113
100
 
114
101
  ## Behaviors
115
102
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-spinner",
3
- "version": "0.0.0-nightly-20220610-0420.1",
3
+ "version": "0.0.0-nightly-20220615-0421.1",
4
4
  "description": "Spinner component for Fluent UI React",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -28,13 +28,13 @@
28
28
  "devDependencies": {
29
29
  "@fluentui/eslint-plugin": "*",
30
30
  "@fluentui/react-conformance": "*",
31
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20220610-0420.0",
31
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20220615-0421.0",
32
32
  "@fluentui/scripts": "^1.0.0"
33
33
  },
34
34
  "dependencies": {
35
- "@fluentui/react-theme": "0.0.0-nightly-20220610-0420.0",
36
- "@fluentui/react-label": "0.0.0-nightly-20220610-0420.1",
37
- "@fluentui/react-utilities": "0.0.0-nightly-20220610-0420.1",
35
+ "@fluentui/react-theme": "0.0.0-nightly-20220615-0421.0",
36
+ "@fluentui/react-label": "0.0.0-nightly-20220615-0421.1",
37
+ "@fluentui/react-utilities": "0.0.0-nightly-20220615-0421.1",
38
38
  "@griffel/react": "1.1.0",
39
39
  "tslib": "^2.1.0"
40
40
  },