@fluentui/react-button 9.0.0-rc.4 → 9.0.0-rc.7

Sign up to get free protection for your applications and to get access to all the features.
Files changed (113) hide show
  1. package/CHANGELOG.json +200 -1
  2. package/CHANGELOG.md +50 -2
  3. package/dist/react-button.d.ts +38 -8
  4. package/lib/components/Button/Button.types.d.ts +3 -1
  5. package/lib/components/Button/Button.types.js.map +1 -1
  6. package/lib/components/Button/index.d.ts +1 -1
  7. package/lib/components/Button/index.js +3 -1
  8. package/lib/components/Button/index.js.map +1 -1
  9. package/lib/components/Button/useButton.js +1 -0
  10. package/lib/components/Button/useButton.js.map +1 -1
  11. package/lib/components/Button/useButtonStyles.d.ts +7 -2
  12. package/lib/components/Button/useButtonStyles.js +110 -59
  13. package/lib/components/Button/useButtonStyles.js.map +1 -1
  14. package/lib/components/CompoundButton/CompoundButton.d.ts +1 -1
  15. package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
  16. package/lib/components/CompoundButton/index.d.ts +1 -1
  17. package/lib/components/CompoundButton/index.js +3 -1
  18. package/lib/components/CompoundButton/index.js.map +1 -1
  19. package/lib/components/CompoundButton/useCompoundButton.js +7 -2
  20. package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
  21. package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +7 -2
  22. package/lib/components/CompoundButton/useCompoundButtonStyles.js +43 -28
  23. package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  24. package/lib/components/MenuButton/index.d.ts +1 -1
  25. package/lib/components/MenuButton/index.js +3 -1
  26. package/lib/components/MenuButton/index.js.map +1 -1
  27. package/lib/components/MenuButton/useMenuButtonStyles.d.ts +7 -2
  28. package/lib/components/MenuButton/useMenuButtonStyles.js +16 -3
  29. package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  30. package/lib/components/SplitButton/SplitButton.types.d.ts +1 -1
  31. package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
  32. package/lib/components/SplitButton/index.d.ts +1 -1
  33. package/lib/components/SplitButton/index.js +3 -1
  34. package/lib/components/SplitButton/index.js.map +1 -1
  35. package/lib/components/SplitButton/useSplitButton.js +1 -0
  36. package/lib/components/SplitButton/useSplitButton.js.map +1 -1
  37. package/lib/components/SplitButton/useSplitButtonStyles.d.ts +7 -2
  38. package/lib/components/SplitButton/useSplitButtonStyles.js +38 -27
  39. package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  40. package/lib/components/ToggleButton/index.d.ts +1 -1
  41. package/lib/components/ToggleButton/index.js +3 -1
  42. package/lib/components/ToggleButton/index.js.map +1 -1
  43. package/lib/components/ToggleButton/useToggleButton.d.ts +1 -1
  44. package/lib/components/ToggleButton/useToggleButton.js +3 -41
  45. package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
  46. package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +9 -1
  47. package/lib/components/ToggleButton/useToggleButtonStyles.js +83 -60
  48. package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  49. package/lib/index.d.ts +11 -5
  50. package/lib/index.js +11 -5
  51. package/lib/index.js.map +1 -1
  52. package/lib/utils/index.d.ts +1 -0
  53. package/lib/utils/index.js +2 -0
  54. package/lib/utils/index.js.map +1 -0
  55. package/lib/utils/useToggleState.d.ts +3 -0
  56. package/lib/utils/useToggleState.js +37 -0
  57. package/lib/utils/useToggleState.js.map +1 -0
  58. package/lib-commonjs/components/Button/Button.types.d.ts +3 -1
  59. package/lib-commonjs/components/Button/index.d.ts +1 -1
  60. package/lib-commonjs/components/Button/index.js +9 -1
  61. package/lib-commonjs/components/Button/index.js.map +1 -1
  62. package/lib-commonjs/components/Button/useButton.js +1 -0
  63. package/lib-commonjs/components/Button/useButton.js.map +1 -1
  64. package/lib-commonjs/components/Button/useButtonStyles.d.ts +7 -2
  65. package/lib-commonjs/components/Button/useButtonStyles.js +112 -60
  66. package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
  67. package/lib-commonjs/components/CompoundButton/CompoundButton.d.ts +1 -1
  68. package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
  69. package/lib-commonjs/components/CompoundButton/index.d.ts +1 -1
  70. package/lib-commonjs/components/CompoundButton/index.js +9 -1
  71. package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
  72. package/lib-commonjs/components/CompoundButton/useCompoundButton.js +7 -2
  73. package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
  74. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +7 -2
  75. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +44 -29
  76. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  77. package/lib-commonjs/components/MenuButton/index.d.ts +1 -1
  78. package/lib-commonjs/components/MenuButton/index.js +9 -1
  79. package/lib-commonjs/components/MenuButton/index.js.map +1 -1
  80. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +7 -2
  81. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +17 -4
  82. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  83. package/lib-commonjs/components/SplitButton/SplitButton.types.d.ts +1 -1
  84. package/lib-commonjs/components/SplitButton/index.d.ts +1 -1
  85. package/lib-commonjs/components/SplitButton/index.js +9 -1
  86. package/lib-commonjs/components/SplitButton/index.js.map +1 -1
  87. package/lib-commonjs/components/SplitButton/useSplitButton.js +1 -0
  88. package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
  89. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +7 -2
  90. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +39 -28
  91. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  92. package/lib-commonjs/components/ToggleButton/index.d.ts +1 -1
  93. package/lib-commonjs/components/ToggleButton/index.js +9 -1
  94. package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
  95. package/lib-commonjs/components/ToggleButton/useToggleButton.d.ts +1 -1
  96. package/lib-commonjs/components/ToggleButton/useToggleButton.js +3 -42
  97. package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
  98. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +9 -1
  99. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +87 -62
  100. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  101. package/lib-commonjs/index.d.ts +11 -5
  102. package/lib-commonjs/index.js +204 -6
  103. package/lib-commonjs/index.js.map +1 -1
  104. package/lib-commonjs/utils/index.d.ts +1 -0
  105. package/lib-commonjs/utils/index.js +10 -0
  106. package/lib-commonjs/utils/index.js.map +1 -0
  107. package/lib-commonjs/utils/useToggleState.d.ts +3 -0
  108. package/lib-commonjs/utils/useToggleState.js +48 -0
  109. package/lib-commonjs/utils/useToggleState.js.map +1 -0
  110. package/package.json +17 -20
  111. package/dist/demo/index.html +0 -71
  112. package/dist/demo/react-dom.development.js +0 -21413
  113. package/dist/demo/react.development.js +0 -3155
package/CHANGELOG.json CHANGED
@@ -2,7 +2,206 @@
2
2
  "name": "@fluentui/react-button",
3
3
  "entries": [
4
4
  {
5
- "date": "Tue, 01 Mar 2022 02:16:08 GMT",
5
+ "date": "Mon, 25 Apr 2022 09:31:17 GMT",
6
+ "tag": "@fluentui/react-button_v9.0.0-rc.7",
7
+ "version": "9.0.0-rc.7",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "Humberto.Morimoto@microsoft.com",
12
+ "package": "@fluentui/react-button",
13
+ "commit": "4c11854b93b331f12cdaa7ee0628b01667acba12",
14
+ "comment": "Adding useToggleState hook to scaffold toggleable behavior for individual consumption."
15
+ },
16
+ {
17
+ "author": "jukapsia@microsoft.com",
18
+ "package": "@fluentui/react-button",
19
+ "commit": "3f8fffc216f60fb8b055461a6725d76983d131c0",
20
+ "comment": "fix(Button): Text color in HC mode for hover, active and checked states."
21
+ },
22
+ {
23
+ "author": "Humberto.Morimoto@microsoft.com",
24
+ "package": "@fluentui/react-button",
25
+ "commit": "8ca44964836cefd3c435e9cf9a6ef78ceb256258",
26
+ "comment": "Button: Stop applying active styles when mouse moves away while it is being held and improving styles in High Contrast mode."
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-button",
31
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-rc.7",
32
+ "commit": "02ca1d3c198452c1693067f5f18bd01b2ed5d6e6"
33
+ }
34
+ ],
35
+ "none": [
36
+ {
37
+ "author": "annkelle@microsoft.com",
38
+ "package": "@fluentui/react-button",
39
+ "commit": "155d4932b7cf3a544fa4f4605b5acc5cf74be763",
40
+ "comment": "Button: Use filled icons on hover."
41
+ }
42
+ ]
43
+ }
44
+ },
45
+ {
46
+ "date": "Tue, 19 Apr 2022 19:17:12 GMT",
47
+ "tag": "@fluentui/react-button_v9.0.0-rc.6",
48
+ "version": "9.0.0-rc.6",
49
+ "comments": {
50
+ "none": [
51
+ {
52
+ "author": "elcraig@microsoft.com",
53
+ "package": "@fluentui/react-button",
54
+ "commit": "b7f17e976f9e058f39c9fce4f0f9bb6eb4dfa577",
55
+ "comment": "Update React dev deps and hoist them to the repo root"
56
+ },
57
+ {
58
+ "author": "mgodbolt@microsoft.com",
59
+ "package": "@fluentui/react-button",
60
+ "commit": "905e46db07ada986fd7885531f72a71b7bbaabdc",
61
+ "comment": "create v9 api extractor config and set all v9 packags to use it, suppress forgotten export"
62
+ },
63
+ {
64
+ "author": "elcraig@microsoft.com",
65
+ "package": "@fluentui/react-button",
66
+ "commit": "13c32e184b7960671754582de21f3555bf9f02f3",
67
+ "comment": "Remove config file that's no longer needed"
68
+ }
69
+ ],
70
+ "prerelease": [
71
+ {
72
+ "author": "Humberto.Morimoto@microsoft.com",
73
+ "package": "@fluentui/react-button",
74
+ "commit": "e0660222b8d9f4f38a61b718c18d4c67e52c8df9",
75
+ "comment": "Disabling lint rule for deprecated [component]ClassName exports."
76
+ },
77
+ {
78
+ "author": "Humberto.Morimoto@microsoft.com",
79
+ "package": "@fluentui/react-button",
80
+ "commit": "1209d5881f9d9d581b481aa82979a22ce371cf8b",
81
+ "comment": "Button: Deprecating block prop."
82
+ },
83
+ {
84
+ "author": "Humberto.Morimoto@microsoft.com",
85
+ "package": "@fluentui/react-button",
86
+ "commit": "8c862ab1147fd38bc5008c85d1644f992561f89f",
87
+ "comment": "Button components: Making root a non-nullable slot."
88
+ },
89
+ {
90
+ "author": "Humberto.Morimoto@microsoft.com",
91
+ "package": "@fluentui/react-button",
92
+ "commit": "fac31825b58253b8b98c14b90090c97db2957373",
93
+ "comment": "CompoundButton: Fixing bug where component was iconOnly even when secondaryContent was being provided."
94
+ },
95
+ {
96
+ "author": "Humberto.Morimoto@microsoft.com",
97
+ "package": "@fluentui/react-button",
98
+ "commit": "6bee76a70a7490557cd2b5c2b5639ab6bed2e6a1",
99
+ "comment": "Removing star exports."
100
+ },
101
+ {
102
+ "author": "seanmonahan@microsoft.com",
103
+ "package": "@fluentui/react-button",
104
+ "commit": "086a675fd0c648944ff4048450190a0a13467de3",
105
+ "comment": "Add deprecation messages to react-button"
106
+ },
107
+ {
108
+ "author": "olfedias@microsoft.com",
109
+ "package": "@fluentui/react-button",
110
+ "commit": "e569d6e04d83cbcc6225e61db52ff81d2addd363",
111
+ "comment": "chore: Update Griffel to latest version"
112
+ },
113
+ {
114
+ "author": "seanmonahan@microsoft.com",
115
+ "package": "@fluentui/react-button",
116
+ "commit": "bea6aecfed8612f7b0664ab8bac77c5fccee1efb",
117
+ "comment": "update react-icons version to ^2.0.166-rc.3 from ^2.0.159-beta.10"
118
+ },
119
+ {
120
+ "author": "beachball",
121
+ "package": "@fluentui/react-button",
122
+ "comment": "Bump @fluentui/react-aria to v9.0.0-rc.6",
123
+ "commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
124
+ },
125
+ {
126
+ "author": "beachball",
127
+ "package": "@fluentui/react-button",
128
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-rc.6",
129
+ "commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
130
+ },
131
+ {
132
+ "author": "beachball",
133
+ "package": "@fluentui/react-button",
134
+ "comment": "Bump @fluentui/react-theme to v9.0.0-rc.5",
135
+ "commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
136
+ },
137
+ {
138
+ "author": "beachball",
139
+ "package": "@fluentui/react-button",
140
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.6",
141
+ "commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
142
+ },
143
+ {
144
+ "author": "beachball",
145
+ "package": "@fluentui/react-button",
146
+ "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4",
147
+ "commit": "f94b48c825ca8c8b2e3b6755bdd29fe15c7d435d"
148
+ }
149
+ ]
150
+ }
151
+ },
152
+ {
153
+ "date": "Fri, 04 Mar 2022 05:17:34 GMT",
154
+ "tag": "@fluentui/react-button_v9.0.0-rc.5",
155
+ "version": "9.0.0-rc.5",
156
+ "comments": {
157
+ "prerelease": [
158
+ {
159
+ "author": "dzearing@microsoft.com",
160
+ "package": "@fluentui/react-button",
161
+ "commit": "f2f1c0ea948cc3517eeb442c05433eb0918def29",
162
+ "comment": "Adding explicit export maps on all consumer packages for FUIR 8 and 9."
163
+ },
164
+ {
165
+ "author": "Humberto.Morimoto@microsoft.com",
166
+ "package": "@fluentui/react-button",
167
+ "commit": "e951d80afa1d6220e76d7a6c23d75ae417be2b9c",
168
+ "comment": "Button: Exporting classNames of individual slots."
169
+ },
170
+ {
171
+ "author": "beachball",
172
+ "package": "@fluentui/react-button",
173
+ "comment": "Bump @fluentui/keyboard-keys to v9.0.0-rc.4",
174
+ "commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
175
+ },
176
+ {
177
+ "author": "beachball",
178
+ "package": "@fluentui/react-button",
179
+ "comment": "Bump @fluentui/react-aria to v9.0.0-rc.5",
180
+ "commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
181
+ },
182
+ {
183
+ "author": "beachball",
184
+ "package": "@fluentui/react-button",
185
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-rc.5",
186
+ "commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
187
+ },
188
+ {
189
+ "author": "beachball",
190
+ "package": "@fluentui/react-button",
191
+ "comment": "Bump @fluentui/react-theme to v9.0.0-rc.4",
192
+ "commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
193
+ },
194
+ {
195
+ "author": "beachball",
196
+ "package": "@fluentui/react-button",
197
+ "comment": "Bump @fluentui/react-utilities to v9.0.0-rc.5",
198
+ "commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
199
+ }
200
+ ]
201
+ }
202
+ },
203
+ {
204
+ "date": "Tue, 01 Mar 2022 02:17:35 GMT",
6
205
  "tag": "@fluentui/react-button_v9.0.0-rc.4",
7
206
  "version": "9.0.0-rc.4",
8
207
  "comments": {
package/CHANGELOG.md CHANGED
@@ -1,12 +1,60 @@
1
1
  # Change Log - @fluentui/react-button
2
2
 
3
- This log was last generated on Tue, 01 Mar 2022 02:16:08 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 25 Apr 2022 09:31:17 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.0-rc.7](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.7)
8
+
9
+ Mon, 25 Apr 2022 09:31:17 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.6..@fluentui/react-button_v9.0.0-rc.7)
11
+
12
+ ### Changes
13
+
14
+ - Adding useToggleState hook to scaffold toggleable behavior for individual consumption. ([PR #22279](https://github.com/microsoft/fluentui/pull/22279) by Humberto.Morimoto@microsoft.com)
15
+ - fix(Button): Text color in HC mode for hover, active and checked states. ([PR #22566](https://github.com/microsoft/fluentui/pull/22566) by jukapsia@microsoft.com)
16
+ - Button: Stop applying active styles when mouse moves away while it is being held and improving styles in High Contrast mode. ([PR #22574](https://github.com/microsoft/fluentui/pull/22574) by Humberto.Morimoto@microsoft.com)
17
+ - Bump @fluentui/react-tabster to v9.0.0-rc.7 ([PR #22601](https://github.com/microsoft/fluentui/pull/22601) by beachball)
18
+
19
+ ## [9.0.0-rc.6](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.6)
20
+
21
+ Tue, 19 Apr 2022 19:17:12 GMT
22
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.5..@fluentui/react-button_v9.0.0-rc.6)
23
+
24
+ ### Changes
25
+
26
+ - Disabling lint rule for deprecated [component]ClassName exports. ([PR #22131](https://github.com/microsoft/fluentui/pull/22131) by Humberto.Morimoto@microsoft.com)
27
+ - Button: Deprecating block prop. ([PR #22148](https://github.com/microsoft/fluentui/pull/22148) by Humberto.Morimoto@microsoft.com)
28
+ - Button components: Making root a non-nullable slot. ([PR #22147](https://github.com/microsoft/fluentui/pull/22147) by Humberto.Morimoto@microsoft.com)
29
+ - CompoundButton: Fixing bug where component was iconOnly even when secondaryContent was being provided. ([PR #22107](https://github.com/microsoft/fluentui/pull/22107) by Humberto.Morimoto@microsoft.com)
30
+ - Removing star exports. ([PR #22111](https://github.com/microsoft/fluentui/pull/22111) by Humberto.Morimoto@microsoft.com)
31
+ - Add deprecation messages to react-button ([PR #21960](https://github.com/microsoft/fluentui/pull/21960) by seanmonahan@microsoft.com)
32
+ - chore: Update Griffel to latest version ([PR #21976](https://github.com/microsoft/fluentui/pull/21976) by olfedias@microsoft.com)
33
+ - update react-icons version to ^2.0.166-rc.3 from ^2.0.159-beta.10 ([PR #22512](https://github.com/microsoft/fluentui/pull/22512) by seanmonahan@microsoft.com)
34
+ - Bump @fluentui/react-aria to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
35
+ - Bump @fluentui/react-tabster to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
36
+ - Bump @fluentui/react-theme to v9.0.0-rc.5 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
37
+ - Bump @fluentui/react-utilities to v9.0.0-rc.6 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
38
+ - Bump @fluentui/react-conformance-griffel to v9.0.0-beta.4 ([PR #21995](https://github.com/microsoft/fluentui/pull/21995) by beachball)
39
+
40
+ ## [9.0.0-rc.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.5)
41
+
42
+ Fri, 04 Mar 2022 05:17:34 GMT
43
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.4..@fluentui/react-button_v9.0.0-rc.5)
44
+
45
+ ### Changes
46
+
47
+ - Adding explicit export maps on all consumer packages for FUIR 8 and 9. ([PR #21508](https://github.com/microsoft/fluentui/pull/21508) by dzearing@microsoft.com)
48
+ - Button: Exporting classNames of individual slots. ([PR #20977](https://github.com/microsoft/fluentui/pull/20977) by Humberto.Morimoto@microsoft.com)
49
+ - Bump @fluentui/keyboard-keys to v9.0.0-rc.4 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
50
+ - Bump @fluentui/react-aria to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
51
+ - Bump @fluentui/react-tabster to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
52
+ - Bump @fluentui/react-theme to v9.0.0-rc.4 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
53
+ - Bump @fluentui/react-utilities to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
54
+
7
55
  ## [9.0.0-rc.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.4)
8
56
 
9
- Tue, 01 Mar 2022 02:16:08 GMT
57
+ Tue, 01 Mar 2022 02:17:35 GMT
10
58
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.3..@fluentui/react-button_v9.0.0-rc.4)
11
59
 
12
60
  ### Changes
@@ -4,13 +4,19 @@ import type { ComponentState } from '@fluentui/react-utilities';
4
4
  import { ForwardRefComponent } from '@fluentui/react-utilities';
5
5
  import * as React_2 from 'react';
6
6
  import type { Slot } from '@fluentui/react-utilities';
7
+ import type { SlotClassNames } from '@fluentui/react-utilities';
7
8
 
8
9
  /**
9
10
  * Buttons give people a way to trigger an action.
10
11
  */
11
12
  export declare const Button: ForwardRefComponent<ButtonProps>;
12
13
 
13
- export declare const buttonClassName = "fui-Button";
14
+ /**
15
+ * @deprecated Use `buttonClassNames.root` instead.
16
+ */
17
+ export declare const buttonClassName: string;
18
+
19
+ export declare const buttonClassNames: SlotClassNames<ButtonSlots>;
14
20
 
15
21
  declare type ButtonCommons = {
16
22
  /**
@@ -24,6 +30,8 @@ declare type ButtonCommons = {
24
30
  /**
25
31
  * A button can fill the width of its container.
26
32
  * @default false
33
+ *
34
+ * @deprecated - Use style overrides instead.
27
35
  */
28
36
  block: boolean;
29
37
  /**
@@ -61,7 +69,7 @@ export declare type ButtonSlots = {
61
69
  /**
62
70
  * Root of the component that renders as either a `<button>` tag or an `<a>` tag.
63
71
  */
64
- root: Slot<ARIAButtonSlotProps>;
72
+ root: NonNullable<Slot<ARIAButtonSlotProps>>;
65
73
  /**
66
74
  * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
67
75
  */
@@ -81,7 +89,12 @@ export declare type ButtonState = ComponentState<ButtonSlots> & ButtonCommons &
81
89
  */
82
90
  export declare const CompoundButton: ForwardRefComponent<CompoundButtonProps>;
83
91
 
84
- export declare const compoundButtonClassName = "fui-CompoundButton";
92
+ /**
93
+ * @deprecated Use `compoundButtonClassName.root` instead.
94
+ */
95
+ export declare const compoundButtonClassName: string;
96
+
97
+ export declare const compoundButtonClassNames: SlotClassNames<CompoundButtonSlots>;
85
98
 
86
99
  export declare type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> & Partial<ButtonCommons>;
87
100
 
@@ -103,7 +116,12 @@ export declare type CompoundButtonState = ComponentState<CompoundButtonSlots> &
103
116
  */
104
117
  export declare const MenuButton: ForwardRefComponent<MenuButtonProps>;
105
118
 
106
- export declare const menuButtonClassName = "fui-MenuButton";
119
+ /**
120
+ * @deprecated Use `menuButtonClassName.root` instead.
121
+ */
122
+ export declare const menuButtonClassName: string;
123
+
124
+ export declare const menuButtonClassNames: SlotClassNames<MenuButtonSlots>;
107
125
 
108
126
  export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>>;
109
127
 
@@ -144,7 +162,12 @@ export declare const renderSplitButton_unstable: (state: SplitButtonState) => JS
144
162
  */
145
163
  export declare const SplitButton: ForwardRefComponent<SplitButtonProps>;
146
164
 
147
- export declare const splitButtonClassName = "fui-SplitButton";
165
+ /**
166
+ * @deprecated Use `splitButtonClassName.root` instead.
167
+ */
168
+ export declare const splitButtonClassName: string;
169
+
170
+ export declare const splitButtonClassNames: SlotClassNames<SplitButtonSlots>;
148
171
 
149
172
  export declare type SplitButtonProps = ComponentProps<SplitButtonSlots> & Omit<ButtonProps, 'root'> & Omit<MenuButtonProps, 'root'>;
150
173
 
@@ -152,7 +175,7 @@ export declare type SplitButtonSlots = {
152
175
  /**
153
176
  * Root of the component that wraps the primary action button and menu button.
154
177
  */
155
- root: Slot<'div'>;
178
+ root: NonNullable<Slot<'div'>>;
156
179
  /**
157
180
  * Button that opens menu with secondary actions in SplitButton.
158
181
  */
@@ -170,7 +193,12 @@ export declare type SplitButtonState = ComponentState<SplitButtonSlots> & Omit<B
170
193
  */
171
194
  export declare const ToggleButton: ForwardRefComponent<ToggleButtonProps>;
172
195
 
173
- export declare const toggleButtonClassName = "fui-ToggleButton";
196
+ /**
197
+ * @deprecated Use `toggleButtonClassName.root` instead.
198
+ */
199
+ export declare const toggleButtonClassName: string;
200
+
201
+ export declare const toggleButtonClassNames: SlotClassNames<ButtonSlots>;
174
202
 
175
203
  declare type ToggleButtonCommons = {
176
204
  /**
@@ -233,8 +261,10 @@ export declare const useSplitButtonStyles_unstable: (state: SplitButtonState) =>
233
261
  * @param props - User provided props to the ToggleButton component.
234
262
  * @param ref - User provided ref to be passed to the ToggleButton component.
235
263
  */
236
- export declare const useToggleButton_unstable: ({ checked, defaultChecked, ...props }: ToggleButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => ToggleButtonState;
264
+ export declare const useToggleButton_unstable: (props: ToggleButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => ToggleButtonState;
237
265
 
238
266
  export declare const useToggleButtonStyles_unstable: (state: ToggleButtonState) => ToggleButtonState;
239
267
 
268
+ export declare function useToggleState<TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>, TButtonState extends Pick<ButtonState, 'root'>, TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState;
269
+
240
270
  export { }
@@ -4,7 +4,7 @@ export declare type ButtonSlots = {
4
4
  /**
5
5
  * Root of the component that renders as either a `<button>` tag or an `<a>` tag.
6
6
  */
7
- root: Slot<ARIAButtonSlotProps>;
7
+ root: NonNullable<Slot<ARIAButtonSlotProps>>;
8
8
  /**
9
9
  * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
10
10
  */
@@ -22,6 +22,8 @@ export declare type ButtonCommons = {
22
22
  /**
23
23
  * A button can fill the width of its container.
24
24
  * @default false
25
+ *
26
+ * @deprecated - Use style overrides instead.
25
27
  */
26
28
  block: boolean;
27
29
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ButtonSlots = {\n /**\n * Root of the component that renders as either a `<button>` tag or an `<a>` tag.\n */\n root: Slot<ARIAButtonSlotProps>;\n\n /**\n * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.\n */\n icon?: Slot<'span'>;\n};\n\nexport type ButtonCommons = {\n /**\n * A button can have its content and borders styled for greater emphasis or to be subtle.\n * - 'primary': Emphasizes the button as a primary action.\n * - 'outline': Removes background styling.\n * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n * - 'transparent': Removes background and border styling.\n */\n appearance?: 'primary' | 'outline' | 'subtle' | 'transparent';\n\n /**\n * A button can fill the width of its container.\n * @default false\n */\n block: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A button can be rounded, circular, or square.\n * @default 'rounded'\n */\n shape: 'rounded' | 'circular' | 'square';\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size: 'small' | 'medium' | 'large';\n};\n\nexport type ButtonProps = ComponentProps<ButtonSlots> & Partial<ButtonCommons>;\n\nexport type ButtonState = ComponentState<ButtonSlots> &\n ButtonCommons & {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly: boolean;\n };\n"]}
1
+ {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ButtonSlots = {\n /**\n * Root of the component that renders as either a `<button>` tag or an `<a>` tag.\n */\n root: NonNullable<Slot<ARIAButtonSlotProps>>;\n\n /**\n * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.\n */\n icon?: Slot<'span'>;\n};\n\nexport type ButtonCommons = {\n /**\n * A button can have its content and borders styled for greater emphasis or to be subtle.\n * - 'primary': Emphasizes the button as a primary action.\n * - 'outline': Removes background styling.\n * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n * - 'transparent': Removes background and border styling.\n */\n appearance?: 'primary' | 'outline' | 'subtle' | 'transparent';\n\n /**\n * A button can fill the width of its container.\n * @default false\n *\n * @deprecated - Use style overrides instead.\n */\n block: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A button can be rounded, circular, or square.\n * @default 'rounded'\n */\n shape: 'rounded' | 'circular' | 'square';\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size: 'small' | 'medium' | 'large';\n};\n\nexport type ButtonProps = ComponentProps<ButtonSlots> & Partial<ButtonCommons>;\n\nexport type ButtonState = ComponentState<ButtonSlots> &\n ButtonCommons & {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly: boolean;\n };\n"]}
@@ -2,4 +2,4 @@ export * from './Button';
2
2
  export type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';
3
3
  export * from './renderButton';
4
4
  export * from './useButton';
5
- export { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';
5
+ export { buttonClassName, buttonClassNames, useButtonStyles_unstable, } from './useButtonStyles';
@@ -1,5 +1,7 @@
1
1
  export * from './Button';
2
2
  export * from './renderButton';
3
3
  export * from './useButton';
4
- export { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';
4
+ export {
5
+ /* eslint-disable-next-line deprecation/deprecation */
6
+ buttonClassName, buttonClassNames, useButtonStyles_unstable } from './useButtonStyles';
5
7
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export * from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';\nexport * from './renderButton';\nexport * from './useButton';\nexport { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';\n"]}
1
+ {"version":3,"sources":["components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAd;AAGA,cAAc,gBAAd;AACA,cAAc,aAAd;AACA;AACE;AACA,eAFF,EAGE,gBAHF,EAIE,wBAJF,QAKO,mBALP","sourcesContent":["export * from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';\nexport * from './renderButton';\nexport * from './useButton';\nexport {\n /* eslint-disable-next-line deprecation/deprecation */\n buttonClassName,\n buttonClassNames,\n useButtonStyles_unstable,\n} from './useButtonStyles';\n"],"sourceRoot":"../src/"}
@@ -10,6 +10,7 @@ export const useButton_unstable = (props, ref) => {
10
10
  const {
11
11
  appearance,
12
12
  as,
13
+ // eslint-disable-next-line deprecation/deprecation
13
14
  block = false,
14
15
  disabled = false,
15
16
  disabledFocusable = false,
@@ -1 +1 @@
1
- {"version":3,"sources":["components/Button/useButton.ts"],"names":[],"mappings":"AACA,SAAS,aAAT,QAA8B,sBAA9B;AAEA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;;;AAIG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAChC,KADgC,EAEhC,GAFgC,KAGjB;AACf,QAAM;AACJ,IAAA,UADI;AAEJ,IAAA,EAFI;AAGJ,IAAA,KAAK,GAAG,KAHJ;AAIJ,IAAA,QAAQ,GAAG,KAJP;AAKJ,IAAA,iBAAiB,GAAG,KALhB;AAMJ,IAAA,IANI;AAOJ,IAAA,YAAY,GAAG,QAPX;AAQJ,IAAA,KAAK,GAAG,SARJ;AASJ,IAAA,IAAI,GAAG;AATH,MAUF,KAVJ;AAWA,QAAM,aAAa,GAAG,gBAAgB,CAAC,IAAD,CAAtC;AAEA,SAAO;AACL;AACA,IAAA,UAFK;AAGL,IAAA,KAHK;AAIL,IAAA,QAJK;AAKL,IAAA,iBALK;AAML,IAAA,YANK;AAOL,IAAA,KAPK;AAQL,IAAA,IARK;AAUL;AACA,IAAA,QAAQ,EAAE,OAAO,CAAC,CAAA,aAAa,KAAA,IAAb,IAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAA,aAAa,CAAE,QAAf,KAA2B,CAAC,KAAK,CAAC,QAAnC,CAXZ;AAaL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE;AAFI,KAdP;AAmBL,IAAA,IAAI,EAAE,qBAAqB,CACzB,EAAE,IAAI,QADmB,EAEzB,aAAa,CAAsB,KAAtB,EAA6B;AACxC,MAAA,QAAQ,EAAE,IAD8B;AAExC,MAAA,YAAY,EAAE;AACZ;AACA,QAAA,GAAG,EAAE,GAFO;AAGZ,QAAA,IAAI,EAAE,QAHM,CAGI;;AAHJ;AAF0B,KAA7B,CAFY,CAnBtB;AA8BL,IAAA,IAAI,EAAE;AA9BD,GAAP;AAgCD,CAjDM","sourcesContent":["import * as React from 'react';\nimport { useARIAButton } from '@fluentui/react-aria';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from './Button.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ButtonState => {\n const {\n appearance,\n as,\n block = false,\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n shape = 'rounded',\n size = 'medium',\n } = props;\n const iconShorthand = resolveShorthand(icon);\n\n return {\n // Props passed at the top-level\n appearance,\n block,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // State calculated from a set of props\n iconOnly: Boolean(iconShorthand?.children && !props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n },\n\n root: getNativeElementProps(\n as || 'button',\n useARIAButton<ARIAButtonSlotProps>(props, {\n required: true,\n defaultProps: {\n // useARIAButton isn't working with React.Ref<HTMLButtonElement | HTMLAnchorElement>\n ref: ref as React.Ref<HTMLButtonElement>,\n type: 'button', // This is added because the default for type is 'submit'\n },\n }),\n ),\n icon: iconShorthand,\n };\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/Button/useButton.ts"],"names":[],"mappings":"AACA,SAAS,aAAT,QAA8B,sBAA9B;AAEA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;;;AAIG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAChC,KADgC,EAEhC,GAFgC,KAGjB;AACf,QAAM;AACJ,IAAA,UADI;AAEJ,IAAA,EAFI;AAGJ;AACA,IAAA,KAAK,GAAG,KAJJ;AAKJ,IAAA,QAAQ,GAAG,KALP;AAMJ,IAAA,iBAAiB,GAAG,KANhB;AAOJ,IAAA,IAPI;AAQJ,IAAA,YAAY,GAAG,QARX;AASJ,IAAA,KAAK,GAAG,SATJ;AAUJ,IAAA,IAAI,GAAG;AAVH,MAWF,KAXJ;AAYA,QAAM,aAAa,GAAG,gBAAgB,CAAC,IAAD,CAAtC;AAEA,SAAO;AACL;AACA,IAAA,UAFK;AAGL,IAAA,KAHK;AAIL,IAAA,QAJK;AAKL,IAAA,iBALK;AAML,IAAA,YANK;AAOL,IAAA,KAPK;AAQL,IAAA,IARK;AAUL;AACA,IAAA,QAAQ,EAAE,OAAO,CAAC,CAAA,aAAa,KAAA,IAAb,IAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAA,aAAa,CAAE,QAAf,KAA2B,CAAC,KAAK,CAAC,QAAnC,CAXZ;AAaL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE;AAFI,KAdP;AAmBL,IAAA,IAAI,EAAE,qBAAqB,CACzB,EAAE,IAAI,QADmB,EAEzB,aAAa,CAAsB,KAAtB,EAA6B;AACxC,MAAA,QAAQ,EAAE,IAD8B;AAExC,MAAA,YAAY,EAAE;AACZ;AACA,QAAA,GAAG,EAAE,GAFO;AAGZ,QAAA,IAAI,EAAE,QAHM,CAGI;;AAHJ;AAF0B,KAA7B,CAFY,CAnBtB;AA8BL,IAAA,IAAI,EAAE;AA9BD,GAAP;AAgCD,CAlDM","sourcesContent":["import * as React from 'react';\nimport { useARIAButton } from '@fluentui/react-aria';\nimport type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport { getNativeElementProps, resolveShorthand } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from './Button.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ButtonState => {\n const {\n appearance,\n as,\n // eslint-disable-next-line deprecation/deprecation\n block = false,\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n shape = 'rounded',\n size = 'medium',\n } = props;\n const iconShorthand = resolveShorthand(icon);\n\n return {\n // Props passed at the top-level\n appearance,\n block,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // State calculated from a set of props\n iconOnly: Boolean(iconShorthand?.children && !props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n },\n\n root: getNativeElementProps(\n as || 'button',\n useARIAButton<ARIAButtonSlotProps>(props, {\n required: true,\n defaultProps: {\n // useARIAButton isn't working with React.Ref<HTMLButtonElement | HTMLAnchorElement>\n ref: ref as React.Ref<HTMLButtonElement>,\n type: 'button', // This is added because the default for type is 'submit'\n },\n }),\n ),\n icon: iconShorthand,\n };\n};\n"],"sourceRoot":"../src/"}
@@ -1,3 +1,8 @@
1
- import type { ButtonState } from './Button.types';
2
- export declare const buttonClassName = "fui-Button";
1
+ import type { SlotClassNames } from '@fluentui/react-utilities';
2
+ import type { ButtonSlots, ButtonState } from './Button.types';
3
+ export declare const buttonClassNames: SlotClassNames<ButtonSlots>;
4
+ /**
5
+ * @deprecated Use `buttonClassNames.root` instead.
6
+ */
7
+ export declare const buttonClassName: string;
3
8
  export declare const useButtonStyles_unstable: (state: ButtonState) => ButtonState;