@fluentui/react-button 9.0.0-rc.1 → 9.0.0-rc.5
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +154 -1
- package/CHANGELOG.md +47 -2
- package/dist/react-button.d.ts +16 -5
- package/lib/Button.js.map +1 -1
- package/lib/CompoundButton.js.map +1 -1
- package/lib/MenuButton.js.map +1 -1
- package/lib/SplitButton.js.map +1 -1
- package/lib/ToggleButton.js.map +1 -1
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/Button.types.js.map +1 -1
- package/lib/components/Button/index.d.ts +1 -1
- package/lib/components/Button/index.js +1 -1
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Button/renderButton.js.map +1 -1
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.d.ts +4 -2
- package/lib/components/Button/useButtonStyles.js +8 -3
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
- package/lib/components/CompoundButton/index.d.ts +1 -1
- package/lib/components/CompoundButton/index.js +1 -1
- package/lib/components/CompoundButton/index.js.map +1 -1
- package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +4 -2
- package/lib/components/CompoundButton/useCompoundButtonStyles.js +30 -27
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
- package/lib/components/MenuButton/index.d.ts +1 -1
- package/lib/components/MenuButton/index.js +1 -1
- package/lib/components/MenuButton/index.js.map +1 -1
- package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.d.ts +4 -2
- package/lib/components/MenuButton/useMenuButtonStyles.js +12 -2
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
- package/lib/components/SplitButton/index.d.ts +1 -1
- package/lib/components/SplitButton/index.js +1 -1
- package/lib/components/SplitButton/index.js.map +1 -1
- package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButton.js +16 -4
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.d.ts +4 -2
- package/lib/components/SplitButton/useSplitButtonStyles.js +30 -28
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib/components/ToggleButton/index.d.ts +1 -1
- package/lib/components/ToggleButton/index.js +1 -1
- package/lib/components/ToggleButton/index.js.map +1 -1
- package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButton.js +6 -6
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +4 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.js +12 -2
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Button.js.map +1 -1
- package/lib-commonjs/CompoundButton.js.map +1 -1
- package/lib-commonjs/MenuButton.js.map +1 -1
- package/lib-commonjs/SplitButton.js.map +1 -1
- package/lib-commonjs/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/Button.types.js.map +1 -1
- package/lib-commonjs/components/Button/index.d.ts +1 -1
- package/lib-commonjs/components/Button/index.js +7 -1
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Button/renderButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.d.ts +4 -2
- package/lib-commonjs/components/Button/useButtonStyles.js +9 -4
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/index.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +7 -1
- package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +4 -2
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +31 -28
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
- package/lib-commonjs/components/MenuButton/index.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/index.js +7 -1
- package/lib-commonjs/components/MenuButton/index.js.map +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +4 -2
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +13 -3
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
- package/lib-commonjs/components/SplitButton/index.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/index.js +7 -1
- package/lib-commonjs/components/SplitButton/index.js.map +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.js +15 -3
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +4 -2
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +31 -29
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/index.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +7 -1
- package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.js +6 -6
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +4 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +13 -3
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +14 -6
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,160 @@
|
|
2
2
|
"name": "@fluentui/react-button",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Fri, 04 Mar 2022 05:15:48 GMT",
|
6
|
+
"tag": "@fluentui/react-button_v9.0.0-rc.5",
|
7
|
+
"version": "9.0.0-rc.5",
|
8
|
+
"comments": {
|
9
|
+
"prerelease": [
|
10
|
+
{
|
11
|
+
"author": "dzearing@microsoft.com",
|
12
|
+
"package": "@fluentui/react-button",
|
13
|
+
"commit": "f2f1c0ea948cc3517eeb442c05433eb0918def29",
|
14
|
+
"comment": "Adding explicit export maps on all consumer packages for FUIR 8 and 9."
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
18
|
+
"package": "@fluentui/react-button",
|
19
|
+
"commit": "e951d80afa1d6220e76d7a6c23d75ae417be2b9c",
|
20
|
+
"comment": "Button: Exporting classNames of individual slots."
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-button",
|
25
|
+
"comment": "Bump @fluentui/keyboard-keys to v9.0.0-rc.4",
|
26
|
+
"commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-button",
|
31
|
+
"comment": "Bump @fluentui/react-aria to v9.0.0-rc.5",
|
32
|
+
"commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "beachball",
|
36
|
+
"package": "@fluentui/react-button",
|
37
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.5",
|
38
|
+
"commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
|
39
|
+
},
|
40
|
+
{
|
41
|
+
"author": "beachball",
|
42
|
+
"package": "@fluentui/react-button",
|
43
|
+
"comment": "Bump @fluentui/react-theme to v9.0.0-rc.4",
|
44
|
+
"commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
|
45
|
+
},
|
46
|
+
{
|
47
|
+
"author": "beachball",
|
48
|
+
"package": "@fluentui/react-button",
|
49
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.5",
|
50
|
+
"commit": "1494f0b620f6d5aae7f0aef33fc9e8f6eb7f8749"
|
51
|
+
}
|
52
|
+
]
|
53
|
+
}
|
54
|
+
},
|
55
|
+
{
|
56
|
+
"date": "Tue, 01 Mar 2022 02:17:35 GMT",
|
57
|
+
"tag": "@fluentui/react-button_v9.0.0-rc.4",
|
58
|
+
"version": "9.0.0-rc.4",
|
59
|
+
"comments": {
|
60
|
+
"prerelease": [
|
61
|
+
{
|
62
|
+
"author": "olfedias@microsoft.com",
|
63
|
+
"package": "@fluentui/react-button",
|
64
|
+
"commit": "084d7408855f3e52b67cbca172da1acef9dcb98f",
|
65
|
+
"comment": "fix: Add react-theme as dependency"
|
66
|
+
},
|
67
|
+
{
|
68
|
+
"author": "beachball",
|
69
|
+
"package": "@fluentui/react-button",
|
70
|
+
"comment": "Bump @fluentui/react-aria to v9.0.0-rc.4",
|
71
|
+
"commit": "0bc1e755543ed69443d5d03e1976c630583242f7"
|
72
|
+
},
|
73
|
+
{
|
74
|
+
"author": "beachball",
|
75
|
+
"package": "@fluentui/react-button",
|
76
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.4",
|
77
|
+
"commit": "0bc1e755543ed69443d5d03e1976c630583242f7"
|
78
|
+
},
|
79
|
+
{
|
80
|
+
"author": "beachball",
|
81
|
+
"package": "@fluentui/react-button",
|
82
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.4",
|
83
|
+
"commit": "0bc1e755543ed69443d5d03e1976c630583242f7"
|
84
|
+
}
|
85
|
+
]
|
86
|
+
}
|
87
|
+
},
|
88
|
+
{
|
89
|
+
"date": "Fri, 18 Feb 2022 13:35:28 GMT",
|
90
|
+
"tag": "@fluentui/react-button_v9.0.0-rc.3",
|
91
|
+
"version": "9.0.0-rc.3",
|
92
|
+
"comments": {
|
93
|
+
"prerelease": [
|
94
|
+
{
|
95
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
96
|
+
"package": "@fluentui/react-button",
|
97
|
+
"commit": "0b7d30b6ecb6f20d2ac4d4edbfb327a8f8f915a0",
|
98
|
+
"comment": "SplitButton: Fixing issue where menuIcon prop was not being respected."
|
99
|
+
},
|
100
|
+
{
|
101
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
102
|
+
"package": "@fluentui/react-button",
|
103
|
+
"commit": "d45ba4664643f36cce5674b1d05645feae0e09a5",
|
104
|
+
"comment": "Button: Updating stories to fix a11y issues."
|
105
|
+
},
|
106
|
+
{
|
107
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
108
|
+
"package": "@fluentui/react-button",
|
109
|
+
"commit": "ca590a438b12b85d32fdf8b592ada3b0e7b2314c",
|
110
|
+
"comment": "SplitButton: Fixing screen reader access issues."
|
111
|
+
},
|
112
|
+
{
|
113
|
+
"author": "lingfangao@hotmail.com",
|
114
|
+
"package": "@fluentui/react-button",
|
115
|
+
"commit": "1aa9e691fcccd9a64168cea7941c0f1e71fa1d14",
|
116
|
+
"comment": "fix: Source maps contain original source code"
|
117
|
+
},
|
118
|
+
{
|
119
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
120
|
+
"package": "@fluentui/react-button",
|
121
|
+
"commit": "c7718355f464d9d3e7ec4c0ef0f39dac3d196014",
|
122
|
+
"comment": "Button: Adding tests and fixing issues in SplitButton and ToggleButton."
|
123
|
+
},
|
124
|
+
{
|
125
|
+
"author": "beachball",
|
126
|
+
"package": "@fluentui/react-button",
|
127
|
+
"comment": "Bump @fluentui/keyboard-keys to v9.0.0-rc.3",
|
128
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
129
|
+
},
|
130
|
+
{
|
131
|
+
"author": "beachball",
|
132
|
+
"package": "@fluentui/react-button",
|
133
|
+
"comment": "Bump @fluentui/react-aria to v9.0.0-rc.3",
|
134
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
135
|
+
},
|
136
|
+
{
|
137
|
+
"author": "beachball",
|
138
|
+
"package": "@fluentui/react-button",
|
139
|
+
"comment": "Bump @fluentui/react-tabster to v9.0.0-rc.3",
|
140
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
141
|
+
},
|
142
|
+
{
|
143
|
+
"author": "beachball",
|
144
|
+
"package": "@fluentui/react-button",
|
145
|
+
"comment": "Bump @fluentui/react-utilities to v9.0.0-rc.3",
|
146
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
147
|
+
},
|
148
|
+
{
|
149
|
+
"author": "beachball",
|
150
|
+
"package": "@fluentui/react-button",
|
151
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3",
|
152
|
+
"commit": "3b9c1e931c23173da3d1af0c696cdc58516ce504"
|
153
|
+
}
|
154
|
+
]
|
155
|
+
}
|
156
|
+
},
|
157
|
+
{
|
158
|
+
"date": "Thu, 10 Feb 2022 08:51:46 GMT",
|
6
159
|
"tag": "@fluentui/react-button_v9.0.0-rc.1",
|
7
160
|
"version": "9.0.0-rc.1",
|
8
161
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,57 @@
|
|
1
1
|
# Change Log - @fluentui/react-button
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Fri, 04 Mar 2022 05:15:48 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.0.0-rc.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.5)
|
8
|
+
|
9
|
+
Fri, 04 Mar 2022 05:15:48 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.4..@fluentui/react-button_v9.0.0-rc.5)
|
11
|
+
|
12
|
+
### Changes
|
13
|
+
|
14
|
+
- 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)
|
15
|
+
- Button: Exporting classNames of individual slots. ([PR #20977](https://github.com/microsoft/fluentui/pull/20977) by Humberto.Morimoto@microsoft.com)
|
16
|
+
- Bump @fluentui/keyboard-keys to v9.0.0-rc.4 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
|
17
|
+
- Bump @fluentui/react-aria to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
|
18
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
|
19
|
+
- Bump @fluentui/react-theme to v9.0.0-rc.4 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
|
20
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.5 ([PR #21947](https://github.com/microsoft/fluentui/pull/21947) by beachball)
|
21
|
+
|
22
|
+
## [9.0.0-rc.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.4)
|
23
|
+
|
24
|
+
Tue, 01 Mar 2022 02:17:35 GMT
|
25
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.3..@fluentui/react-button_v9.0.0-rc.4)
|
26
|
+
|
27
|
+
### Changes
|
28
|
+
|
29
|
+
- fix: Add react-theme as dependency ([PR #21825](https://github.com/microsoft/fluentui/pull/21825) by olfedias@microsoft.com)
|
30
|
+
- Bump @fluentui/react-aria to v9.0.0-rc.4 ([PR #21884](https://github.com/microsoft/fluentui/pull/21884) by beachball)
|
31
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.4 ([PR #21884](https://github.com/microsoft/fluentui/pull/21884) by beachball)
|
32
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.4 ([PR #21884](https://github.com/microsoft/fluentui/pull/21884) by beachball)
|
33
|
+
|
34
|
+
## [9.0.0-rc.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.3)
|
35
|
+
|
36
|
+
Fri, 18 Feb 2022 13:35:28 GMT
|
37
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-rc.1..@fluentui/react-button_v9.0.0-rc.3)
|
38
|
+
|
39
|
+
### Changes
|
40
|
+
|
41
|
+
- SplitButton: Fixing issue where menuIcon prop was not being respected. ([PR #21683](https://github.com/microsoft/fluentui/pull/21683) by Humberto.Morimoto@microsoft.com)
|
42
|
+
- Button: Updating stories to fix a11y issues. ([PR #21679](https://github.com/microsoft/fluentui/pull/21679) by Humberto.Morimoto@microsoft.com)
|
43
|
+
- SplitButton: Fixing screen reader access issues. ([PR #21703](https://github.com/microsoft/fluentui/pull/21703) by Humberto.Morimoto@microsoft.com)
|
44
|
+
- fix: Source maps contain original source code ([PR #21690](https://github.com/microsoft/fluentui/pull/21690) by lingfangao@hotmail.com)
|
45
|
+
- Button: Adding tests and fixing issues in SplitButton and ToggleButton. ([PR #21719](https://github.com/microsoft/fluentui/pull/21719) by Humberto.Morimoto@microsoft.com)
|
46
|
+
- Bump @fluentui/keyboard-keys to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
47
|
+
- Bump @fluentui/react-aria to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
48
|
+
- Bump @fluentui/react-tabster to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
49
|
+
- Bump @fluentui/react-utilities to v9.0.0-rc.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
50
|
+
- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.3 ([PR #21800](https://github.com/microsoft/fluentui/pull/21800) by beachball)
|
51
|
+
|
7
52
|
## [9.0.0-rc.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-rc.1)
|
8
53
|
|
9
|
-
Thu, 10 Feb 2022 08:
|
54
|
+
Thu, 10 Feb 2022 08:51:46 GMT
|
10
55
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-beta.5..@fluentui/react-button_v9.0.0-rc.1)
|
11
56
|
|
12
57
|
### Changes
|
package/dist/react-button.d.ts
CHANGED
@@ -4,13 +4,16 @@ 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
|
14
|
+
export declare const buttonClassName: string;
|
15
|
+
|
16
|
+
export declare const buttonClassNames: SlotClassNames<ButtonSlots>;
|
14
17
|
|
15
18
|
declare type ButtonCommons = {
|
16
19
|
/**
|
@@ -81,7 +84,9 @@ export declare type ButtonState = ComponentState<ButtonSlots> & ButtonCommons &
|
|
81
84
|
*/
|
82
85
|
export declare const CompoundButton: ForwardRefComponent<CompoundButtonProps>;
|
83
86
|
|
84
|
-
export declare const compoundButtonClassName
|
87
|
+
export declare const compoundButtonClassName: string;
|
88
|
+
|
89
|
+
export declare const compoundButtonClassNames: SlotClassNames<CompoundButtonSlots>;
|
85
90
|
|
86
91
|
export declare type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> & Partial<ButtonCommons>;
|
87
92
|
|
@@ -103,7 +108,9 @@ export declare type CompoundButtonState = ComponentState<CompoundButtonSlots> &
|
|
103
108
|
*/
|
104
109
|
export declare const MenuButton: ForwardRefComponent<MenuButtonProps>;
|
105
110
|
|
106
|
-
export declare const menuButtonClassName
|
111
|
+
export declare const menuButtonClassName: string;
|
112
|
+
|
113
|
+
export declare const menuButtonClassNames: SlotClassNames<MenuButtonSlots>;
|
107
114
|
|
108
115
|
export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>>;
|
109
116
|
|
@@ -144,7 +151,9 @@ export declare const renderSplitButton_unstable: (state: SplitButtonState) => JS
|
|
144
151
|
*/
|
145
152
|
export declare const SplitButton: ForwardRefComponent<SplitButtonProps>;
|
146
153
|
|
147
|
-
export declare const splitButtonClassName
|
154
|
+
export declare const splitButtonClassName: string;
|
155
|
+
|
156
|
+
export declare const splitButtonClassNames: SlotClassNames<SplitButtonSlots>;
|
148
157
|
|
149
158
|
export declare type SplitButtonProps = ComponentProps<SplitButtonSlots> & Omit<ButtonProps, 'root'> & Omit<MenuButtonProps, 'root'>;
|
150
159
|
|
@@ -170,7 +179,9 @@ export declare type SplitButtonState = ComponentState<SplitButtonSlots> & Omit<B
|
|
170
179
|
*/
|
171
180
|
export declare const ToggleButton: ForwardRefComponent<ToggleButtonProps>;
|
172
181
|
|
173
|
-
export declare const toggleButtonClassName
|
182
|
+
export declare const toggleButtonClassName: string;
|
183
|
+
|
184
|
+
export declare const toggleButtonClassNames: SlotClassNames<ButtonSlots>;
|
174
185
|
|
175
186
|
declare type ToggleButtonCommons = {
|
176
187
|
/**
|
package/lib/Button.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"Button.js","sourceRoot":"../src/","sources":["Button.tsx"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC","sourcesContent":["export * from './components/Button/index';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CompoundButton.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"CompoundButton.js","sourceRoot":"../src/","sources":["CompoundButton.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAC","sourcesContent":["export * from './components/CompoundButton/index';\n"]}
|
package/lib/MenuButton.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"MenuButton.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"MenuButton.js","sourceRoot":"../src/","sources":["MenuButton.ts"],"names":[],"mappings":"AAAA,cAAc,+BAA+B,CAAC","sourcesContent":["export * from './components/MenuButton/index';\n"]}
|
package/lib/SplitButton.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SplitButton.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"SplitButton.js","sourceRoot":"../src/","sources":["SplitButton.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC","sourcesContent":["export * from './components/SplitButton/index';\n"]}
|
package/lib/ToggleButton.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"ToggleButton.js","sourceRoot":"../src/","sources":["ToggleButton.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC","sourcesContent":["export * from './components/ToggleButton/index';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;AAEA,EAAA,wBAAwB,CAAC,KAAD,CAAxB;AAEA,SAAO,qBAAqB,CAAC,KAAD,CAA5B,CALsF,CAMtF;AACD,CAPuD,CAAjD;AASP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_unstable(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ButtonProps>;\n\nButton.displayName = 'Button';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"Button.types.js","sourceRoot":"","sources":["
|
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"]}
|
@@ -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,5 @@
|
|
1
1
|
export * from './Button';
|
2
2
|
export * from './renderButton';
|
3
3
|
export * from './useButton';
|
4
|
-
export { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';
|
4
|
+
export { buttonClassName, buttonClassNames, useButtonStyles_unstable } from './useButtonStyles';
|
5
5
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
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,gBAAgB,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, buttonClassNames, useButtonStyles_unstable } from './useButtonStyles';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/Button/renderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,CAArC;AACA,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA;AAAZ,MAA6B,KAAnC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAD7C,EAEG,CAAC,QAAD,IAAa,KAAK,CAAC,IAAN,CAAW,QAF3B,EAGG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAH7C,CADF;AAOD,CAXM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { ButtonSlots, ButtonState } from './Button.types';\n\n/**\n * Renders a Button component by passing the state defined props to the appropriate slots.\n */\nexport const renderButton_unstable = (state: ButtonState) => {\n const { slots, slotProps } = getSlots<ButtonSlots>(state);\n const { iconOnly, iconPosition } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {iconPosition !== 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && state.root.children}\n {iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
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,3 +1,5 @@
|
|
1
|
-
import type {
|
2
|
-
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
2
|
+
import type { ButtonSlots, ButtonState } from './Button.types';
|
3
|
+
export declare const buttonClassNames: SlotClassNames<ButtonSlots>;
|
4
|
+
export declare const buttonClassName: string;
|
3
5
|
export declare const useButtonStyles_unstable: (state: ButtonState) => ButtonState;
|
@@ -1,7 +1,12 @@
|
|
1
1
|
import { shorthands, __styles, mergeClasses } from '@griffel/react';
|
2
2
|
import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';
|
3
3
|
import { tokens } from '@fluentui/react-theme';
|
4
|
-
export const
|
4
|
+
export const buttonClassNames = {
|
5
|
+
root: 'fui-Button',
|
6
|
+
icon: 'fui-Button__icon'
|
7
|
+
}; // TODO temporary export to pass conformance test.
|
8
|
+
|
9
|
+
export const buttonClassName = buttonClassNames.root;
|
5
10
|
|
6
11
|
const useRootStyles = /*#__PURE__*/__styles({
|
7
12
|
"base": {
|
@@ -402,7 +407,7 @@ export const useButtonStyles_unstable = state => {
|
|
402
407
|
shape,
|
403
408
|
size
|
404
409
|
} = state;
|
405
|
-
state.root.className = mergeClasses(
|
410
|
+
state.root.className = mergeClasses(buttonClassNames.root, // Root styles
|
406
411
|
rootStyles.base, block && rootStyles.block, appearance && rootStyles[appearance], rootStyles[size], rootStyles[shape], // Disabled styles
|
407
412
|
(disabled || disabledFocusable) && rootDisabledStyles.base, appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance], // Focus styles
|
408
413
|
rootFocusStyles.base, appearance === 'primary' && rootFocusStyles.primary, rootFocusStyles[size], rootFocusStyles[shape], // Icon-only styles
|
@@ -410,7 +415,7 @@ export const useButtonStyles_unstable = state => {
|
|
410
415
|
state.root.className);
|
411
416
|
|
412
417
|
if (state.icon) {
|
413
|
-
state.icon.className = mergeClasses(iconStyles.base, iconStyles[size], state.icon.className);
|
418
|
+
state.icon.className = mergeClasses(buttonClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);
|
414
419
|
}
|
415
420
|
|
416
421
|
return state;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button/useButtonStyles.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
1
|
+
{"version":3,"sources":["components/Button/useButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots, ButtonState } from './Button.types';\n\nexport const buttonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-Button',\n icon: 'fui-Button__icon',\n};\n\n// TODO temporary export to pass conformance test.\nexport const buttonClassName = buttonClassNames.root;\n\nconst useRootStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n verticalAlign: 'middle',\n\n ...shorthands.margin(0),\n\n maxWidth: '280px',\n\n ...shorthands.overflow('hidden'),\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n\n backgroundColor: tokens.colorNeutralBackground1,\n color: tokens.colorNeutralForeground1,\n ...shorthands.border(tokens.strokeWidthThin, 'solid', tokens.colorNeutralStroke1),\n\n fontFamily: tokens.fontFamilyBase,\n\n outlineStyle: 'none',\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n color: tokens.colorNeutralForeground1,\n\n cursor: 'pointer',\n },\n\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n color: tokens.colorNeutralForeground1,\n\n outlineStyle: 'none',\n },\n },\n\n // Block styles\n block: {\n maxWidth: '100%',\n width: '100%',\n },\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n },\n primary: {\n backgroundColor: tokens.colorBrandBackground,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n\n // Shape variations\n circular: {\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n },\n rounded: {\n /* The borderRadius rounded styles are handled in the size variations */\n },\n square: {\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n },\n\n // Size variations\n small: {\n ...shorthands.gap('4px'),\n ...shorthands.padding('0', '8px'),\n\n height: '24px',\n minWidth: '64px',\n\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n lineHeight: tokens.lineHeightBase200,\n },\n medium: {\n ...shorthands.gap('6px'),\n ...shorthands.padding('0', '12px'),\n\n height: '32px',\n minWidth: '96px',\n\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n\n fontSize: tokens.fontSizeBase300,\n fontWeight: tokens.fontWeightSemibold,\n lineHeight: tokens.lineHeightBase300,\n },\n large: {\n ...shorthands.gap('6px'),\n ...shorthands.padding('0', '16px'),\n\n height: '40px',\n minWidth: '96px',\n\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n\n fontSize: tokens.fontSizeBase400,\n fontWeight: tokens.fontWeightSemibold,\n lineHeight: tokens.lineHeightBase400,\n },\n});\n\nconst useRootDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n },\n\n ':active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n cursor: 'not-allowed',\n },\n },\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n },\n primary: {\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n ...shorthands.borderColor('transparent'),\n },\n\n ':active': {\n ...shorthands.borderColor('transparent'),\n },\n },\n subtle: {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n\n ':active': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n\n ':active': {\n backgroundColor: 'transparent',\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nconst useRootFocusStyles = makeStyles({\n // TODO: `overflow: 'hidden'` on the root does not pay well with `position: absolute`\n // used by the outline pseudo-element. Need to introduce a text container for children and set\n // overflow there so that default focus outline can work\n //\n // base: createFocusOutlineStyle(),\n // circular: createFocusOutlineStyle({ style: { outlineRadius: tokens.global.borderRadius.circular } }),\n // primary: createFocusOutlineStyle({ style: { outlineOffset: '2px' } }),\n // square: createFocusOutlineStyle({ style: { outlineRadius: tokens.global.borderRadius.none } }),\n\n base: createCustomFocusIndicatorStyle({\n ...shorthands.borderColor('transparent'),\n outlineColor: 'transparent',\n outlineWidth: '2px',\n outlineStyle: 'solid',\n boxShadow: `\n ${tokens.shadow4},\n 0 0 0 2px ${tokens.colorStrokeFocus2}\n `,\n zIndex: 1,\n }),\n\n circular: createCustomFocusIndicatorStyle({\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n }),\n rounded: {},\n // Primary styles\n primary: createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorNeutralForegroundOnBrand),\n boxShadow: `${tokens.shadow2}, 0 0 0 2px ${tokens.colorStrokeFocus2}`,\n }),\n square: createCustomFocusIndicatorStyle({\n ...shorthands.borderRadius(tokens.borderRadiusNone),\n }),\n\n // Size variations\n small: createCustomFocusIndicatorStyle({\n ...shorthands.borderRadius(tokens.borderRadiusSmall),\n }),\n medium: createCustomFocusIndicatorStyle({\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n }),\n large: createCustomFocusIndicatorStyle({\n ...shorthands.borderRadius(tokens.borderRadiusLarge),\n }),\n});\n\nconst useRootIconOnlyStyles = makeStyles({\n // Size variations\n small: {\n ...shorthands.padding('4px'),\n\n minWidth: '28px',\n maxWidth: '28px',\n },\n medium: {\n ...shorthands.padding('4px'),\n\n minWidth: '32px',\n maxWidth: '32px',\n },\n large: {\n ...shorthands.padding('6px'),\n\n minWidth: '40px',\n maxWidth: '40px',\n },\n});\n\nconst useIconStyles = makeStyles({\n // Base styles\n base: {\n alignItems: 'center',\n display: 'inline-flex',\n justifyContent: 'center',\n },\n\n // Size variations\n small: {\n fontSize: '20px',\n height: '20px',\n width: '20px',\n },\n medium: {\n fontSize: '20px',\n height: '20px',\n width: '20px',\n },\n large: {\n fontSize: '24px',\n height: '24px',\n width: '24px',\n },\n});\n\nexport const useButtonStyles_unstable = (state: ButtonState): ButtonState => {\n const rootStyles = useRootStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const rootFocusStyles = useRootFocusStyles();\n const rootIconOnlyStyles = useRootIconOnlyStyles();\n const iconStyles = useIconStyles();\n\n const { appearance, block, disabled, disabledFocusable, iconOnly, shape, size } = state;\n\n state.root.className = mergeClasses(\n buttonClassNames.root,\n\n // Root styles\n rootStyles.base,\n block && rootStyles.block,\n appearance && rootStyles[appearance],\n rootStyles[size],\n rootStyles[shape],\n\n // Disabled styles\n (disabled || disabledFocusable) && rootDisabledStyles.base,\n appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance],\n\n // Focus styles\n rootFocusStyles.base,\n appearance === 'primary' && rootFocusStyles.primary,\n rootFocusStyles[size],\n rootFocusStyles[shape],\n\n // Icon-only styles\n iconOnly && rootIconOnlyStyles[size],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(buttonClassNames.icon, iconStyles.base, iconStyles[size], state.icon.className);\n }\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/CompoundButton/CompoundButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,gCAAT,QAAiD,2BAAjD;AAIA;;AAEG;;AACH,OAAO,MAAM,cAAc,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtG,QAAM,KAAK,GAAG,0BAA0B,CAAC,KAAD,EAAQ,GAAR,CAAxC;AAEA,EAAA,gCAAgC,CAAC,KAAD,CAAhC;AAEA,SAAO,6BAA6B,CAAC,KAAD,CAApC,CALsG,CAMtG;AACD,CAPuE,CAAjE;AASP,cAAc,CAAC,WAAf,GAA6B,gBAA7B","sourcesContent":["import * as React from 'react';\nimport { renderCompoundButton_unstable } from './renderCompoundButton';\nimport { useCompoundButton_unstable } from './useCompoundButton';\nimport { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';\nimport type { CompoundButtonProps } from './CompoundButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * CompoundButtons are buttons that can have secondary content that adds extra information to the user.\n */\nexport const CompoundButton: ForwardRefComponent<CompoundButtonProps> = React.forwardRef((props, ref) => {\n const state = useCompoundButton_unstable(props, ref);\n\n useCompoundButtonStyles_unstable(state);\n\n return renderCompoundButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<CompoundButtonProps>;\n\nCompoundButton.displayName = 'CompoundButton';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"CompoundButton.types.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"CompoundButton.types.js","sourceRoot":"../src/","sources":["components/CompoundButton/CompoundButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';\n\nexport type CompoundButtonSlots = ButtonSlots & {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: Slot<'span'>;\n\n /**\n * Container that wraps the children and the secondaryContent slot.\n */\n contentContainer: NonNullable<Slot<'span'>>;\n};\n\nexport type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> & Partial<ButtonCommons>;\n\nexport type CompoundButtonState = ComponentState<CompoundButtonSlots> &\n Omit<ButtonState, keyof ButtonSlots | 'components'>;\n"]}
|
@@ -2,4 +2,4 @@ export * from './CompoundButton';
|
|
2
2
|
export * from './CompoundButton.types';
|
3
3
|
export * from './renderCompoundButton';
|
4
4
|
export * from './useCompoundButton';
|
5
|
-
export { compoundButtonClassName, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';
|
5
|
+
export { compoundButtonClassName, compoundButtonClassNames, useCompoundButtonStyles_unstable, } from './useCompoundButtonStyles';
|
@@ -2,5 +2,5 @@ export * from './CompoundButton';
|
|
2
2
|
export * from './CompoundButton.types';
|
3
3
|
export * from './renderCompoundButton';
|
4
4
|
export * from './useCompoundButton';
|
5
|
-
export { compoundButtonClassName, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';
|
5
|
+
export { compoundButtonClassName, compoundButtonClassNames, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';
|
6
6
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["components/CompoundButton/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAd;AACA,cAAc,wBAAd;AACA,cAAc,wBAAd;AACA,cAAc,qBAAd;AACA,SACE,uBADF,EAEE,wBAFF,EAGE,gCAHF,QAIO,2BAJP","sourcesContent":["export * from './CompoundButton';\nexport * from './CompoundButton.types';\nexport * from './renderCompoundButton';\nexport * from './useCompoundButton';\nexport {\n compoundButtonClassName,\n compoundButtonClassNames,\n useCompoundButtonStyles_unstable,\n} from './useCompoundButtonStyles';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/CompoundButton/renderCompoundButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,6BAA6B,GAAI,KAAD,IAA+B;AAC1E,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAsB,KAAtB,CAArC;AACA,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA;AAAZ,MAA6B,KAAnC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAD7C,EAEG,CAAC,QAAD,iBACC,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,gBAAP,EAAuB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAvB,EACG,SAAS,CAAC,IAAV,CAAe,QADlB,EAEG,KAAK,CAAC,gBAAN,iBAA0B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,gBAAP,EAAuB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAvB,CAF7B,CAHJ,EAQG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAR7C,CADF;AAYD,CAhBM","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { CompoundButtonSlots, CompoundButtonState } from './CompoundButton.types';\n\n/**\n * Renders a CompoundButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderCompoundButton_unstable = (state: CompoundButtonState) => {\n const { slots, slotProps } = getSlots<CompoundButtonSlots>(state);\n const { iconOnly, iconPosition } = state;\n\n return (\n <slots.root {...slotProps.root}>\n {iconPosition !== 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n {!iconOnly && (\n <slots.contentContainer {...slotProps.contentContainer}>\n {slotProps.root.children}\n {slots.secondaryContent && <slots.secondaryContent {...slotProps.secondaryContent} />}\n </slots.contentContainer>\n )}\n {iconPosition === 'after' && slots.icon && <slots.icon {...slotProps.icon} />}\n </slots.root>\n );\n};\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/CompoundButton/useCompoundButton.ts"],"names":[],"mappings":"AACA,SAAS,gBAAT,QAAiC,2BAAjC;AAEA,SAAS,kBAAT,QAAmC,iBAAnC;AAEA;;;;AAIG;;AACH,OAAO,MAAM,0BAA0B,GAAG,CACxC;AAAE,EAAA,gBAAF;AAAoB,EAAA,gBAApB;AAAsC,KAAG;AAAzC,CADwC,EAExC,GAFwC,KAGjB;AACvB,SAAO,EACL;AACA,OAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAFhB;AAIL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE,MAFI;AAGV,MAAA,gBAAgB,EAAE,MAHR;AAIV,MAAA,gBAAgB,EAAE;AAJR,KALP;AAWL,IAAA,gBAAgB,EAAE,gBAAgB,CAAC,gBAAD,EAAmB;AAAE,MAAA,QAAQ,EAAE;AAAZ,KAAnB,CAX7B;AAYL,IAAA,gBAAgB,EAAE,gBAAgB,CAAC,gBAAD;AAZ7B,GAAP;AAcD,CAlBM","sourcesContent":["import * as React from 'react';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport type { CompoundButtonProps, CompoundButtonState } from './CompoundButton.types';\nimport { useButton_unstable } from '../Button/index';\n\n/**\n * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.\n * @param props - User provided props to the CompoundButton component.\n * @param ref - User provided ref to be passed to the CompoundButton component.\n */\nexport const useCompoundButton_unstable = (\n { contentContainer, secondaryContent, ...props }: CompoundButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): CompoundButtonState => {\n return {\n // Button state\n ...useButton_unstable(props, ref),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n contentContainer: 'span',\n secondaryContent: 'span',\n },\n contentContainer: resolveShorthand(contentContainer, { required: true }),\n secondaryContent: resolveShorthand(secondaryContent),\n };\n};\n"],"sourceRoot":"../src/"}
|
@@ -1,3 +1,5 @@
|
|
1
|
-
import type {
|
2
|
-
|
1
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
2
|
+
import type { CompoundButtonSlots, CompoundButtonState } from './CompoundButton.types';
|
3
|
+
export declare const compoundButtonClassNames: SlotClassNames<CompoundButtonSlots>;
|
4
|
+
export declare const compoundButtonClassName: string;
|
3
5
|
export declare const useCompoundButtonStyles_unstable: (state: CompoundButtonState) => CompoundButtonState;
|