@fluentui/react-label 9.0.8 → 9.0.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (5) hide show
  1. package/CHANGELOG.json +37 -4
  2. package/CHANGELOG.md +17 -5
  3. package/package.json +4 -4
  4. package/MIGRATION.md +0 -38
  5. package/Spec.md +0 -128
package/CHANGELOG.json CHANGED
@@ -2,7 +2,40 @@
2
2
  "name": "@fluentui/react-label",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 20 Oct 2022 08:35:12 GMT",
5
+ "date": "Wed, 02 Nov 2022 11:54:54 GMT",
6
+ "tag": "@fluentui/react-label_v9.0.9",
7
+ "version": "9.0.9",
8
+ "comments": {
9
+ "patch": [
10
+ {
11
+ "author": "olfedias@microsoft.com",
12
+ "package": "@fluentui/react-label",
13
+ "commit": "c619ba066f11a8654e95375314824ba6b81b003e",
14
+ "comment": "chore: Update Griffel to latest version"
15
+ },
16
+ {
17
+ "author": "tristan.watanabe@gmail.com",
18
+ "package": "@fluentui/react-label",
19
+ "commit": "e55cbfd57ae01ffb350142f0da3e6fabdd7b4c35",
20
+ "comment": "chore: Migrate to new package structure."
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-label",
25
+ "comment": "Bump @fluentui/react-utilities to v9.2.0",
26
+ "commit": "393a7b169155997a97a6ce1ad36ee3eafc6f461b"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-label",
31
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.17",
32
+ "commit": "393a7b169155997a97a6ce1ad36ee3eafc6f461b"
33
+ }
34
+ ]
35
+ }
36
+ },
37
+ {
38
+ "date": "Thu, 20 Oct 2022 08:39:35 GMT",
6
39
  "tag": "@fluentui/react-label_v9.0.8",
7
40
  "version": "9.0.8",
8
41
  "comments": {
@@ -23,19 +56,19 @@
23
56
  "author": "beachball",
24
57
  "package": "@fluentui/react-label",
25
58
  "comment": "Bump @fluentui/react-theme to v9.1.1",
26
- "commit": "be27026d83b8a019bcb945d0f42635ae76c00385"
59
+ "commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
27
60
  },
28
61
  {
29
62
  "author": "beachball",
30
63
  "package": "@fluentui/react-label",
31
64
  "comment": "Bump @fluentui/react-utilities to v9.1.2",
32
- "commit": "be27026d83b8a019bcb945d0f42635ae76c00385"
65
+ "commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
33
66
  },
34
67
  {
35
68
  "author": "beachball",
36
69
  "package": "@fluentui/react-label",
37
70
  "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.16",
38
- "commit": "be27026d83b8a019bcb945d0f42635ae76c00385"
71
+ "commit": "5ea1372675d910d76cf1b9cbd74d05b7c4e8fcbc"
39
72
  }
40
73
  ]
41
74
  }
package/CHANGELOG.md CHANGED
@@ -1,21 +1,33 @@
1
1
  # Change Log - @fluentui/react-label
2
2
 
3
- This log was last generated on Thu, 20 Oct 2022 08:35:12 GMT and should not be manually modified.
3
+ This log was last generated on Wed, 02 Nov 2022 11:54:54 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.9)
8
+
9
+ Wed, 02 Nov 2022 11:54:54 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.8..@fluentui/react-label_v9.0.9)
11
+
12
+ ### Patches
13
+
14
+ - chore: Update Griffel to latest version ([PR #25412](https://github.com/microsoft/fluentui/pull/25412) by olfedias@microsoft.com)
15
+ - chore: Migrate to new package structure. ([PR #25470](https://github.com/microsoft/fluentui/pull/25470) by tristan.watanabe@gmail.com)
16
+ - Bump @fluentui/react-utilities to v9.2.0 ([PR #25456](https://github.com/microsoft/fluentui/pull/25456) by beachball)
17
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.17 ([PR #25456](https://github.com/microsoft/fluentui/pull/25456) by beachball)
18
+
7
19
  ## [9.0.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.8)
8
20
 
9
- Thu, 20 Oct 2022 08:35:12 GMT
21
+ Thu, 20 Oct 2022 08:39:35 GMT
10
22
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-label_v9.0.7..@fluentui/react-label_v9.0.8)
11
23
 
12
24
  ### Patches
13
25
 
14
26
  - chore: Update Griffel to latest version ([PR #25212](https://github.com/microsoft/fluentui/pull/25212) by olfedias@microsoft.com)
15
27
  - chore: Bump peer deps to support React 18 ([PR #24972](https://github.com/microsoft/fluentui/pull/24972) by mgodbolt@microsoft.com)
16
- - Bump @fluentui/react-theme to v9.1.1 ([commit](https://github.com/microsoft/fluentui/commit/be27026d83b8a019bcb945d0f42635ae76c00385) by beachball)
17
- - Bump @fluentui/react-utilities to v9.1.2 ([commit](https://github.com/microsoft/fluentui/commit/be27026d83b8a019bcb945d0f42635ae76c00385) by beachball)
18
- - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.16 ([commit](https://github.com/microsoft/fluentui/commit/be27026d83b8a019bcb945d0f42635ae76c00385) by beachball)
28
+ - Bump @fluentui/react-theme to v9.1.1 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
29
+ - Bump @fluentui/react-utilities to v9.1.2 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
30
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.16 ([PR #25265](https://github.com/microsoft/fluentui/pull/25265) by beachball)
19
31
 
20
32
  ## [9.0.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-label_v9.0.7)
21
33
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-label",
3
- "version": "9.0.8",
3
+ "version": "9.0.9",
4
4
  "description": "Fluent UI React Label component",
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": "9.0.0-beta.16",
31
+ "@fluentui/react-conformance-griffel": "9.0.0-beta.17",
32
32
  "@fluentui/scripts": "^1.0.0"
33
33
  },
34
34
  "dependencies": {
35
35
  "@fluentui/react-theme": "^9.1.1",
36
- "@fluentui/react-utilities": "^9.1.2",
37
- "@griffel/react": "^1.4.1",
36
+ "@fluentui/react-utilities": "^9.2.0",
37
+ "@griffel/react": "^1.4.2",
38
38
  "tslib": "^2.1.0"
39
39
  },
40
40
  "peerDependencies": {
package/MIGRATION.md DELETED
@@ -1,38 +0,0 @@
1
- # Label Migration
2
-
3
- ## Migration from v8
4
-
5
- - `Label`
6
- - `componentRef` => Not supported. Consider using `ref` instead.
7
- - `disabled` => `disabled`.
8
- - `required` => `required`.
9
-
10
- ## Migration from v0
11
-
12
- The v9 API does not support many of the features offered in v0. Some could potentially be addressed by using the already existing slots or by adding either the additional features or more slots if needed.
13
-
14
- - `Label`
15
- - `circular` => Not supported. Consider using `Badge` component.
16
- - `color` => Not supported. Consider using `Badge` component.
17
- - `content` => The child of `Label`.
18
- - `design` => Not applicable.
19
- - `fluid` => Not supported. Use CSS styling such as flex-grow.
20
- - `icon`, `iconPosition` => Not supported. Consider using `Badge` component or add as a child.
21
- - `image`, `imagePosition` => Not supported. Add as a child.
22
-
23
- ## Property mapping
24
-
25
- | v8 `Label` | v0 `Label` | v9 `Label` |
26
- | -------------- | --------------- | ---------- |
27
- | `children` | `content` | `children` |
28
- | | `circular` | |
29
- | | `color` | |
30
- | `componentRef` | `ref` | `ref` |
31
- | | `design` | |
32
- | `disabled` | | `disabled` |
33
- | | `fluid` | |
34
- | | `icon` | |
35
- | | `iconPosition` | |
36
- | | `image` | |
37
- | | `imagePosition` | |
38
- | `required` | | `required` |
package/Spec.md DELETED
@@ -1,128 +0,0 @@
1
- # @fluentui/react-label Spec
2
-
3
- ## Background
4
-
5
- Labels provide a name or title to a component or group of components, e.g., text fields, checkboxes, radio buttons, and dropdown menus.
6
-
7
- ## Prior Art
8
-
9
- - [open-ui PR](https://github.com/openui/open-ui/pull/348)
10
- - [Label Convergence Epic issue](https://github.com/microsoft/fluentui/issues/18247)
11
-
12
- ### Label in Fabric/v8
13
-
14
- ```tsx
15
- <Label required>I am a required label</Label>
16
- ```
17
-
18
- Props used in v8 Label:
19
-
20
- | Prop | Description |
21
- | ------------ | ------------------------------------------------------------------------------------------------------------------------------------------ |
22
- | as | Element type to render Label as |
23
- | componentRef | Optional callback to access the ILabel interface. Use this instead of ref for accessing the public methods and properties of the component |
24
- | disabled | Renders label as disabled, changing the Label's foreground color |
25
- | required | Renders an asterisk next to the given text |
26
- | styles | Custom styles for the Label |
27
- | theme | Theme provided by HOC |
28
-
29
- ### Label in Northstar/v0
30
-
31
- ```tsx
32
- <Label content="You have 23 emails" />
33
- ```
34
-
35
- Props used in v0 Label:
36
-
37
- | Prop | Description |
38
- | ------------- | ------------------------------------------------- |
39
- | accessibility | Prop to override accessibility behavior |
40
- | as | Element type to render Label as |
41
- | circular | Renders Label with round corners |
42
- | className | Additional CSS class name to apply |
43
- | color | Color for the background of the label |
44
- | content | Label content |
45
- | fluid | Make it so Label takes the width of its container |
46
- | icon | Adds an icon to the label |
47
- | iconPosition | Choose where the icon is placed (Start or End) |
48
- | image | Adds an image to the label |
49
- | imagePosition | Choose where the image is placed (Start or End) |
50
- | styles | Additional custom styles for the component |
51
- | variables | Allows override of theme variables |
52
-
53
- ### Conclusion
54
-
55
- Moving forward, Label will be a simple component. The converged Label will be based on v8's Label with some minor changes. Most props from v0 will be left out but because of the use of slots, it won't be too difficult to migrate to the converged Label.
56
-
57
- ## Sample Code
58
-
59
- The Label component should be simple as shown below. It will just need the text to be rendered. For the required label, it has the option of being a shorthand slot that will allow to customize the label's required text.
60
-
61
- ```tsx
62
- <Label>Label</Label>
63
-
64
- <Label disabled>Label</Label>
65
-
66
- <Label required>Label</Label>
67
-
68
- <Label required="**">
69
- Label
70
- </Label>
71
- ```
72
-
73
- ## Variants
74
-
75
- - A Label can be rendered with an asterisk or custom text when is set as `required`.
76
-
77
- ## API
78
-
79
- See API at [Label.types.ts](./src/components/Label/Label.types.ts).
80
-
81
- ## Structure
82
-
83
- ### Public
84
-
85
- ```tsx
86
- <Label required>I'm a Label</Label>
87
- ```
88
-
89
- ### DOM
90
-
91
- ```tsx
92
- <label {/*Label*/} class="...">
93
- I'm a Label
94
- <span {/*required*/} class="...">*</span>
95
- </label>
96
- ```
97
-
98
- ### Internal
99
-
100
- ```tsx
101
- <slots.root {...slotProps.root}>
102
- {state.children}
103
- <slots.required {...slotProps.required} />
104
- </slots.root>
105
- ```
106
-
107
- ## Migration
108
-
109
- See [MIGRATION.md](MIGRATION.md)
110
-
111
- ## Behaviors
112
-
113
- ### Component States
114
-
115
- Label does not have state attributes.
116
-
117
- ### Interaction
118
-
119
- _Keyboard, Cursor, Touch, and Screen Readers_
120
-
121
- - None
122
-
123
- ## Accessibility
124
-
125
- - Label will use the native `label` element to render.
126
- - Label cannot receive focus.
127
- - Label will have no focusable elements.
128
- - When a Label is disabled, the required contrast ratio won't be met. This is acceptable behavior due to the nature of the styling. This state should be used sparingly and make it clear that there's no interaction with the control associated with it.