@fluentui/react-card 0.0.0-nightly-20220509-0421.1 → 0.0.0-nightly-20220510-0420.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +21 -15
- package/CHANGELOG.md +11 -10
- package/lib/components/Card/useCardStyles.js +80 -74
- package/lib/components/Card/useCardStyles.js.map +1 -1
- package/lib-commonjs/components/Card/useCardStyles.js +80 -74
- package/lib-commonjs/components/Card/useCardStyles.js.map +1 -1
- package/package.json +7 -7
package/CHANGELOG.json
CHANGED
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
"name": "@fluentui/react-card",
|
|
3
3
|
"entries": [
|
|
4
4
|
{
|
|
5
|
-
"date": "
|
|
6
|
-
"tag": "@fluentui/react-card_v0.0.0-nightly-
|
|
7
|
-
"version": "0.0.0-nightly-
|
|
5
|
+
"date": "Tue, 10 May 2022 04:31:41 GMT",
|
|
6
|
+
"tag": "@fluentui/react-card_v0.0.0-nightly-20220510-0420.1",
|
|
7
|
+
"version": "0.0.0-nightly-20220510-0420.1",
|
|
8
8
|
"comments": {
|
|
9
9
|
"prerelease": [
|
|
10
10
|
{
|
|
@@ -13,41 +13,47 @@
|
|
|
13
13
|
"commit": "not available",
|
|
14
14
|
"comment": "Release nightly v9"
|
|
15
15
|
},
|
|
16
|
+
{
|
|
17
|
+
"author": "39736248+andrefcdias@users.noreply.github.com",
|
|
18
|
+
"package": "@fluentui/react-card",
|
|
19
|
+
"commit": "a42bebb19d1403bfbde96cfb4b09e3ce32490ec6",
|
|
20
|
+
"comment": "CardPreview now expands properly, all the way to the Card's edges"
|
|
21
|
+
},
|
|
16
22
|
{
|
|
17
23
|
"author": "beachball",
|
|
18
24
|
"package": "@fluentui/react-card",
|
|
19
|
-
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-
|
|
20
|
-
"commit": "
|
|
25
|
+
"comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20220510-0420.1",
|
|
26
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
21
27
|
},
|
|
22
28
|
{
|
|
23
29
|
"author": "beachball",
|
|
24
30
|
"package": "@fluentui/react-card",
|
|
25
|
-
"comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-
|
|
26
|
-
"commit": "
|
|
31
|
+
"comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-20220510-0420.1",
|
|
32
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
27
33
|
},
|
|
28
34
|
{
|
|
29
35
|
"author": "beachball",
|
|
30
36
|
"package": "@fluentui/react-card",
|
|
31
|
-
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-
|
|
32
|
-
"commit": "
|
|
37
|
+
"comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20220510-0420.1",
|
|
38
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
33
39
|
},
|
|
34
40
|
{
|
|
35
41
|
"author": "beachball",
|
|
36
42
|
"package": "@fluentui/react-card",
|
|
37
|
-
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-
|
|
38
|
-
"commit": "
|
|
43
|
+
"comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220510-0420.1",
|
|
44
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
39
45
|
},
|
|
40
46
|
{
|
|
41
47
|
"author": "beachball",
|
|
42
48
|
"package": "@fluentui/react-card",
|
|
43
|
-
"comment": "Bump @fluentui/react-text to v0.0.0-nightly-
|
|
44
|
-
"commit": "
|
|
49
|
+
"comment": "Bump @fluentui/react-text to v0.0.0-nightly-20220510-0420.1",
|
|
50
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
45
51
|
},
|
|
46
52
|
{
|
|
47
53
|
"author": "beachball",
|
|
48
54
|
"package": "@fluentui/react-card",
|
|
49
|
-
"comment": "Bump @fluentui/react-button to v0.0.0-nightly-
|
|
50
|
-
"commit": "
|
|
55
|
+
"comment": "Bump @fluentui/react-button to v0.0.0-nightly-20220510-0420.1",
|
|
56
|
+
"commit": "23be9682b20fba2ea59bbb882e2225b9bc81133a"
|
|
51
57
|
}
|
|
52
58
|
]
|
|
53
59
|
}
|
package/CHANGELOG.md
CHANGED
|
@@ -1,23 +1,24 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-card
|
|
2
2
|
|
|
3
|
-
This log was last generated on
|
|
3
|
+
This log was last generated on Tue, 10 May 2022 04:31:41 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
-
## [0.0.0-nightly-
|
|
7
|
+
## [0.0.0-nightly-20220510-0420.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v0.0.0-nightly-20220510-0420.1)
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.0-beta.14..@fluentui/react-card_v0.0.0-nightly-
|
|
9
|
+
Tue, 10 May 2022 04:31:41 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-card_v9.0.0-beta.14..@fluentui/react-card_v0.0.0-nightly-20220510-0420.1)
|
|
11
11
|
|
|
12
12
|
### Changes
|
|
13
13
|
|
|
14
14
|
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by email not defined)
|
|
15
|
-
-
|
|
16
|
-
- Bump @fluentui/react-
|
|
17
|
-
- Bump @fluentui/react-
|
|
18
|
-
- Bump @fluentui/react-
|
|
19
|
-
- Bump @fluentui/react-
|
|
20
|
-
- Bump @fluentui/react-
|
|
15
|
+
- CardPreview now expands properly, all the way to the Card's edges ([PR #22761](https://github.com/microsoft/fluentui/pull/22761) by 39736248+andrefcdias@users.noreply.github.com)
|
|
16
|
+
- Bump @fluentui/react-utilities to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
17
|
+
- Bump @fluentui/react-tabster to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
18
|
+
- Bump @fluentui/react-theme to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
19
|
+
- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
20
|
+
- Bump @fluentui/react-text to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
21
|
+
- Bump @fluentui/react-button to v0.0.0-nightly-20220510-0420.1 ([commit](https://github.com/microsoft/fluentui/commit/23be9682b20fba2ea59bbb882e2225b9bc81133a) by beachball)
|
|
21
22
|
|
|
22
23
|
## [9.0.0-beta.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-card_v9.0.0-beta.14)
|
|
23
24
|
|
|
@@ -16,132 +16,138 @@ export const cardClassNames = {
|
|
|
16
16
|
const useStyles = /*#__PURE__*/__styles({
|
|
17
17
|
"root": {
|
|
18
18
|
"mc9l5x": "ftgm304",
|
|
19
|
+
"qhf8xq": "f10pi13n",
|
|
19
20
|
"B68tc82": "f1p9o1ba",
|
|
20
21
|
"Bmxbyg5": "f1sil6mw",
|
|
21
22
|
"sj55zd": "f19n0e5",
|
|
22
|
-
"icvyot": "fzkkow9",
|
|
23
|
-
"vrafjx": ["fcdblym", "fjik90z"],
|
|
24
|
-
"oivjwe": "fg706s2",
|
|
25
|
-
"wvpqe5": ["fjik90z", "fcdblym"],
|
|
26
|
-
"B4j52fo": "f192inf7",
|
|
27
|
-
"Bekrc4i": ["f5tn483", "f1ojsxk5"],
|
|
28
|
-
"Bn0qgzm": "f1vxd6vx",
|
|
29
|
-
"ibv6hh": ["f1ojsxk5", "f5tn483"],
|
|
30
23
|
"Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
|
|
31
24
|
"Beyfa6y": ["f16jpd5f", "f1aa9q02"],
|
|
32
25
|
"B7oj6ja": ["f1jar5jt", "fyu767a"],
|
|
33
26
|
"Btl43ni": ["fyu767a", "f1jar5jt"],
|
|
27
|
+
"E3zdtr": "f1mdlcz9",
|
|
28
|
+
"bn5sak": "frwkxtg",
|
|
29
|
+
"Eqx8gd": ["f1n6gb5g", "f15yvnhg"],
|
|
30
|
+
"B1piin3": ["f15yvnhg", "f1n6gb5g"],
|
|
31
|
+
"By385i5": "fo72kxq",
|
|
32
|
+
"Bsft5z2": "f13zj6fq",
|
|
33
|
+
"B80jsxd": "f1nwj1ja",
|
|
34
|
+
"Bm2nyyq": "f8rth92",
|
|
35
|
+
"Barhvk9": ["flthirb", "ftkbnf5"],
|
|
36
|
+
"Bw17bha": "f1lh990p",
|
|
37
|
+
"vfts7": ["ftkbnf5", "flthirb"],
|
|
38
|
+
"xrcqlc": "f6czdpx",
|
|
39
|
+
"Ihftqj": ["f13hvwk3", "f1en4csx"],
|
|
40
|
+
"Bcgy8vk": "f1i1u9k0",
|
|
41
|
+
"Bhxzhr1": ["f1en4csx", "f13hvwk3"],
|
|
42
|
+
"B3778ie": ["f1ibwz09", "f1kp91vd"],
|
|
43
|
+
"d9w3h3": ["f1kp91vd", "f1ibwz09"],
|
|
44
|
+
"Bl18szs": ["f1pix4dl", "f13nd1z4"],
|
|
45
|
+
"B4j8arr": ["f13nd1z4", "f1pix4dl"],
|
|
34
46
|
"Ecqjvq": "f70or3y",
|
|
35
47
|
"B39syqp": ["f1s27jks", "f1x7x6se"],
|
|
36
48
|
"m3o775": "f1q2lvbs",
|
|
37
49
|
"I0kkcn": ["f1x7x6se", "f1s27jks"]
|
|
38
50
|
},
|
|
51
|
+
"interactiveNoOutline": {
|
|
52
|
+
"Be0v6ae": "ftr40te",
|
|
53
|
+
"B5kxglz": ["fcsoo7g", "f1rl4q8i"],
|
|
54
|
+
"B3pwyw6": "fbb4roj",
|
|
55
|
+
"Bymgtzf": ["f1rl4q8i", "fcsoo7g"],
|
|
56
|
+
"dmfk": "fd4vwcp",
|
|
57
|
+
"B4ofi8": ["f1crelnc", "fup9tr0"],
|
|
58
|
+
"jgq6uv": "f12d33p4",
|
|
59
|
+
"Baxewws": ["fup9tr0", "f1crelnc"]
|
|
60
|
+
},
|
|
39
61
|
"filledInteractive": {
|
|
40
62
|
"Bceei9c": "f1k6fduh",
|
|
41
63
|
"De3pzq": "fxugw4r",
|
|
42
|
-
"g2u3we": "fghlq4f",
|
|
43
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
44
|
-
"B9xav0g": "fb073pr",
|
|
45
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
46
64
|
"E5pizo": "f1whvlc6",
|
|
65
|
+
"B0n5ga8": "f16gxe2i",
|
|
66
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
67
|
+
"B1q35kw": "f1osi826",
|
|
68
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
47
69
|
"Jwef8y": "f1knas48",
|
|
48
|
-
"Bgoe8wy": "fpa59ij",
|
|
49
|
-
"Bwzppfd": ["f1rhln42", "f1l1ogpg"],
|
|
50
|
-
"oetu4i": "fz67qlh",
|
|
51
|
-
"gg5e9n": ["f1l1ogpg", "f1rhln42"],
|
|
52
70
|
"Bvxd0ez": "f1m145df",
|
|
53
|
-
"ecr2s2": "fb40n2d"
|
|
54
|
-
"B6oc9vd": "f7cshhm",
|
|
55
|
-
"ak43y8": ["f1bzyac8", "f131p3c2"],
|
|
56
|
-
"wmxk5l": "f1bazisv",
|
|
57
|
-
"B50zh58": ["f131p3c2", "f1bzyac8"]
|
|
71
|
+
"ecr2s2": "fb40n2d"
|
|
58
72
|
},
|
|
59
73
|
"filled": {
|
|
60
74
|
"De3pzq": "fxugw4r",
|
|
61
|
-
"
|
|
62
|
-
"
|
|
63
|
-
"
|
|
64
|
-
"
|
|
65
|
-
"
|
|
75
|
+
"E5pizo": "f1whvlc6",
|
|
76
|
+
"B0n5ga8": "f16gxe2i",
|
|
77
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
78
|
+
"B1q35kw": "f1osi826",
|
|
79
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
66
80
|
},
|
|
67
81
|
"filledAlternativeInteractive": {
|
|
68
82
|
"Bceei9c": "f1k6fduh",
|
|
69
83
|
"De3pzq": "f1dmdbja",
|
|
70
|
-
"g2u3we": "fghlq4f",
|
|
71
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
72
|
-
"B9xav0g": "fb073pr",
|
|
73
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
74
84
|
"E5pizo": "f1whvlc6",
|
|
85
|
+
"B0n5ga8": "f16gxe2i",
|
|
86
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
87
|
+
"B1q35kw": "f1osi826",
|
|
88
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
75
89
|
"Jwef8y": "f1uvynv3",
|
|
76
|
-
"Bgoe8wy": "fpa59ij",
|
|
77
|
-
"Bwzppfd": ["f1rhln42", "f1l1ogpg"],
|
|
78
|
-
"oetu4i": "fz67qlh",
|
|
79
|
-
"gg5e9n": ["f1l1ogpg", "f1rhln42"],
|
|
80
90
|
"Bvxd0ez": "f1m145df",
|
|
81
|
-
"ecr2s2": "f1yhgkbh"
|
|
82
|
-
"B6oc9vd": "f7cshhm",
|
|
83
|
-
"ak43y8": ["f1bzyac8", "f131p3c2"],
|
|
84
|
-
"wmxk5l": "f1bazisv",
|
|
85
|
-
"B50zh58": ["f131p3c2", "f1bzyac8"]
|
|
91
|
+
"ecr2s2": "f1yhgkbh"
|
|
86
92
|
},
|
|
87
93
|
"filledAlternative": {
|
|
88
94
|
"De3pzq": "f1dmdbja",
|
|
89
|
-
"
|
|
90
|
-
"
|
|
91
|
-
"
|
|
92
|
-
"
|
|
93
|
-
"
|
|
95
|
+
"E5pizo": "f1whvlc6",
|
|
96
|
+
"B0n5ga8": "f16gxe2i",
|
|
97
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
98
|
+
"B1q35kw": "f1osi826",
|
|
99
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
94
100
|
},
|
|
95
101
|
"outlineInteractive": {
|
|
96
102
|
"Bceei9c": "f1k6fduh",
|
|
97
103
|
"De3pzq": "f1c21dwh",
|
|
98
|
-
"g2u3we": "fj3muxo",
|
|
99
|
-
"h3c5rm": ["f1akhkt", "f1lxtadh"],
|
|
100
|
-
"B9xav0g": "f1aperda",
|
|
101
|
-
"zhjwy3": ["f1lxtadh", "f1akhkt"],
|
|
102
104
|
"E5pizo": "f1couhl3",
|
|
105
|
+
"B0n5ga8": "ft83z1f",
|
|
106
|
+
"s924m2": ["f1g4150c", "f192dr6e"],
|
|
107
|
+
"B1q35kw": "f1qnawh6",
|
|
108
|
+
"Gp14am": ["f192dr6e", "f1g4150c"],
|
|
103
109
|
"Jwef8y": "fjxutwb",
|
|
104
|
-
"
|
|
105
|
-
"
|
|
106
|
-
"
|
|
107
|
-
"
|
|
110
|
+
"Be0v6ae": "f1llr77y",
|
|
111
|
+
"B5kxglz": ["fzk0khw", "fjj8tog"],
|
|
112
|
+
"B3pwyw6": "fb1u8ub",
|
|
113
|
+
"Bymgtzf": ["fjj8tog", "fzk0khw"],
|
|
108
114
|
"ecr2s2": "fophhak",
|
|
109
|
-
"
|
|
110
|
-
"
|
|
111
|
-
"
|
|
112
|
-
"
|
|
115
|
+
"dmfk": "f1uohb70",
|
|
116
|
+
"B4ofi8": ["f1jm7v1n", "f1bus3rq"],
|
|
117
|
+
"jgq6uv": "f1fbu7rr",
|
|
118
|
+
"Baxewws": ["f1bus3rq", "f1jm7v1n"]
|
|
113
119
|
},
|
|
114
120
|
"outline": {
|
|
115
121
|
"De3pzq": "f1c21dwh",
|
|
116
|
-
"
|
|
117
|
-
"
|
|
118
|
-
"
|
|
119
|
-
"
|
|
120
|
-
"
|
|
122
|
+
"E5pizo": "f1couhl3",
|
|
123
|
+
"B0n5ga8": "ft83z1f",
|
|
124
|
+
"s924m2": ["f1g4150c", "f192dr6e"],
|
|
125
|
+
"B1q35kw": "f1qnawh6",
|
|
126
|
+
"Gp14am": ["f192dr6e", "f1g4150c"]
|
|
121
127
|
},
|
|
122
128
|
"subtleInteractive": {
|
|
123
129
|
"Bceei9c": "f1k6fduh",
|
|
124
130
|
"De3pzq": "fhovq9v",
|
|
125
|
-
"g2u3we": "fghlq4f",
|
|
126
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
127
|
-
"B9xav0g": "fb073pr",
|
|
128
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
129
131
|
"E5pizo": "f1couhl3",
|
|
132
|
+
"B0n5ga8": "f16gxe2i",
|
|
133
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
134
|
+
"B1q35kw": "f1osi826",
|
|
135
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
130
136
|
"Jwef8y": "f1t94bn6",
|
|
131
137
|
"ecr2s2": "f1wfn5kd"
|
|
132
138
|
},
|
|
133
139
|
"subtle": {
|
|
134
140
|
"De3pzq": "fhovq9v",
|
|
135
|
-
"
|
|
136
|
-
"
|
|
137
|
-
"
|
|
138
|
-
"
|
|
139
|
-
"
|
|
141
|
+
"E5pizo": "f1couhl3",
|
|
142
|
+
"B0n5ga8": "f16gxe2i",
|
|
143
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
144
|
+
"B1q35kw": "f1osi826",
|
|
145
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
140
146
|
}
|
|
141
147
|
}, {
|
|
142
|
-
"d": [".ftgm304{display:block;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".
|
|
143
|
-
"h": [".
|
|
144
|
-
"a": [".
|
|
148
|
+
"d": [".ftgm304{display:block;}", ".f10pi13n{position:relative;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1mdlcz9::after{position:absolute;}", ".frwkxtg::after{top:0;}", ".f1n6gb5g::after{left:0;}", ".f15yvnhg::after{right:0;}", ".fo72kxq::after{bottom:0;}", ".f13zj6fq::after{content:\"\";}", ".f1nwj1ja::after{pointer-events:none;}", ".f8rth92::after{border-top-style:solid;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f1lh990p::after{border-bottom-style:solid;}", ".f6czdpx::after{border-top-width:var(--strokeWidthThin);}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f1i1u9k0::after{border-bottom-width:var(--strokeWidthThin);}", ".f1ibwz09::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kp91vd::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1pix4dl::after{border-top-right-radius:var(--borderRadiusMedium);}", ".f13nd1z4::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f70or3y>*:not(.fui-CardPreview){margin-top:12px;}", ".f1s27jks>*:not(.fui-CardPreview){margin-right:12px;}", ".f1x7x6se>*:not(.fui-CardPreview){margin-left:12px;}", ".f1q2lvbs>*:not(.fui-CardPreview){margin-bottom:12px;}", ".f1k6fduh{cursor:pointer;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1whvlc6{box-shadow:var(--shadow4);}", ".f16gxe2i::after{border-top-color:var(--colorTransparentStroke);}", ".fpgykix::after{border-right-color:var(--colorTransparentStroke);}", ".fzybk4o::after{border-left-color:var(--colorTransparentStroke);}", ".f1osi826::after{border-bottom-color:var(--colorTransparentStroke);}", ".f1dmdbja{background-color:var(--colorNeutralBackground2);}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1couhl3{box-shadow:none;}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}", ".fhovq9v{background-color:var(--colorSubtleBackground);}"],
|
|
149
|
+
"h": [".ftr40te:hover::after{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fcsoo7g:hover::after{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f1rl4q8i:hover::after{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fbb4roj:hover::after{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".f1m145df:hover{box-shadow:var(--shadow8);}", ".f1uvynv3:hover{background-color:var(--colorNeutralBackground2Hover);}", ".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}", ".f1llr77y:hover::after{border-top-color:var(--colorNeutralStroke1Hover);}", ".fzk0khw:hover::after{border-right-color:var(--colorNeutralStroke1Hover);}", ".fjj8tog:hover::after{border-left-color:var(--colorNeutralStroke1Hover);}", ".fb1u8ub:hover::after{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}"],
|
|
150
|
+
"a": [".fd4vwcp:active::after{border-top-color:var(--colorTransparentStrokeInteractive);}", ".f1crelnc:active::after{border-right-color:var(--colorTransparentStrokeInteractive);}", ".fup9tr0:active::after{border-left-color:var(--colorTransparentStrokeInteractive);}", ".f12d33p4:active::after{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".f1yhgkbh:active{background-color:var(--colorNeutralBackground2Pressed);}", ".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}", ".f1uohb70:active::after{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1jm7v1n:active::after{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f1bus3rq:active::after{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1fbu7rr:active::after{border-bottom-color:var(--colorNeutralStroke1Pressed);}", ".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}"]
|
|
145
151
|
});
|
|
146
152
|
/**
|
|
147
153
|
* Apply styling to the Card slots based on the state
|
|
@@ -151,7 +157,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
|
151
157
|
export const useCardStyles_unstable = state => {
|
|
152
158
|
const styles = useStyles();
|
|
153
159
|
const interactive = state.root.onClick || state.root.onMouseUp || state.root.onMouseDown || state.root.onPointerUp || state.root.onPointerDown || state.root.onTouchStart || state.root.onTouchEnd;
|
|
154
|
-
state.root.className = mergeClasses(cardClassNames.root, styles.root, state.appearance === 'filled' && styles.filled, state.appearance === 'filled-alternative' && styles.filledAlternative, state.appearance === 'outline' && styles.outline, state.appearance === 'subtle' && styles.subtle, interactive && state.appearance === 'filled' && styles.filledInteractive, interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive, interactive && state.appearance === 'outline' && styles.outlineInteractive, interactive && state.appearance === 'subtle' && styles.subtleInteractive, state.root.className);
|
|
160
|
+
state.root.className = mergeClasses(cardClassNames.root, styles.root, state.appearance === 'filled' && styles.filled, state.appearance === 'filled-alternative' && styles.filledAlternative, state.appearance === 'outline' && styles.outline, state.appearance === 'subtle' && styles.subtle, interactive && state.appearance === 'filled' && styles.filledInteractive, interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive, interactive && state.appearance === 'outline' && styles.outlineInteractive, interactive && state.appearance === 'subtle' && styles.subtleInteractive, interactive && state.appearance !== 'outline' && styles.interactiveNoOutline, state.root.className);
|
|
155
161
|
return state;
|
|
156
162
|
};
|
|
157
163
|
//# sourceMappingURL=useCardStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Card/useCardStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,qBAAT,QAAsC,sBAAtC;AAIA;;AAEG;;AACH,OAAO,MAAM,aAAa,GAAG,UAAtB;AACP,OAAO,MAAM,cAAc,GAA8B;AACvD,EAAA,IAAI,EAAE;AADiD,CAAlD;AAIP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;
|
|
1
|
+
{"version":3,"sources":["components/Card/useCardStyles.ts"],"names":[],"mappings":"AAAA,SAAS,UAAT,YAAiC,YAAjC,QAAqD,gBAArD;AACA,SAAS,MAAT,QAAuB,uBAAvB;AACA,SAAS,qBAAT,QAAsC,sBAAtC;AAIA;;AAEG;;AACH,OAAO,MAAM,aAAa,GAAG,UAAtB;AACP,OAAO,MAAM,cAAc,GAA8B;AACvD,EAAA,IAAI,EAAE;AADiD,CAAlD;AAIP;;AAEG;;AACH,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAoJA;;AAEG;;;AACH,OAAO,MAAM,sBAAsB,GAAI,KAAD,IAAgC;AACpE,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,QAAM,WAAW,GACf,KAAK,CAAC,IAAN,CAAW,OAAX,IACA,KAAK,CAAC,IAAN,CAAW,SADX,IAEA,KAAK,CAAC,IAAN,CAAW,WAFX,IAGA,KAAK,CAAC,IAAN,CAAW,WAHX,IAIA,KAAK,CAAC,IAAN,CAAW,aAJX,IAKA,KAAK,CAAC,IAAN,CAAW,YALX,IAMA,KAAK,CAAC,IAAN,CAAW,UAPb;AASA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,cAAc,CAAC,IADkB,EAEjC,MAAM,CAAC,IAF0B,EAGjC,KAAK,CAAC,UAAN,KAAqB,QAArB,IAAiC,MAAM,CAAC,MAHP,EAIjC,KAAK,CAAC,UAAN,KAAqB,oBAArB,IAA6C,MAAM,CAAC,iBAJnB,EAKjC,KAAK,CAAC,UAAN,KAAqB,SAArB,IAAkC,MAAM,CAAC,OALR,EAMjC,KAAK,CAAC,UAAN,KAAqB,QAArB,IAAiC,MAAM,CAAC,MANP,EAOjC,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,QAApC,IAAgD,MAAM,CAAC,iBAPtB,EAQjC,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,oBAApC,IAA4D,MAAM,CAAC,4BARlC,EASjC,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,SAApC,IAAiD,MAAM,CAAC,kBATvB,EAUjC,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,QAApC,IAAgD,MAAM,CAAC,iBAVtB,EAWjC,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,SAApC,IAAiD,MAAM,CAAC,oBAXvB,EAYjC,KAAK,CAAC,IAAN,CAAW,SAZsB,CAAnC;AAeA,SAAO,KAAP;AACD,CA5BM","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { cardPreviewClassNames } from '../CardPreview/index';\nimport type { CardSlots, CardState } from './Card.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `cardClassNames.root` instead.\n */\nexport const cardClassName = 'fui-Card';\nexport const cardClassNames: SlotClassNames<CardSlots> = {\n root: 'fui-Card',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'block',\n position: 'relative',\n ...shorthands.overflow('hidden'),\n color: tokens.colorNeutralForeground1,\n\n // TODO: Extract this to separate stiles when tackling the `size` prop\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n // TODO: Extract this to separate styles when tackling the `size` prop\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n\n [`> *:not(.${cardPreviewClassNames.root})`]: {\n // TODO: Extract this to separate styles when tackling the `size` prop\n ...shorthands.margin('12px'),\n },\n },\n\n interactiveNoOutline: {\n ':hover::after': {\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n ':active::after': {\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n },\n\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n },\n },\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed,\n },\n },\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n },\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n },\n },\n },\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n});\n\n/**\n * Apply styling to the Card slots based on the state\n */\nexport const useCardStyles_unstable = (state: CardState): CardState => {\n const styles = useStyles();\n\n const interactive =\n state.root.onClick ||\n state.root.onMouseUp ||\n state.root.onMouseDown ||\n state.root.onPointerUp ||\n state.root.onPointerDown ||\n state.root.onTouchStart ||\n state.root.onTouchEnd;\n\n state.root.className = mergeClasses(\n cardClassNames.root,\n styles.root,\n state.appearance === 'filled' && styles.filled,\n state.appearance === 'filled-alternative' && styles.filledAlternative,\n state.appearance === 'outline' && styles.outline,\n state.appearance === 'subtle' && styles.subtle,\n interactive && state.appearance === 'filled' && styles.filledInteractive,\n interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive,\n interactive && state.appearance === 'outline' && styles.outlineInteractive,\n interactive && state.appearance === 'subtle' && styles.subtleInteractive,\n interactive && state.appearance !== 'outline' && styles.interactiveNoOutline,\n state.root.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -26,132 +26,138 @@ exports.cardClassNames = {
|
|
|
26
26
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
|
27
27
|
"root": {
|
|
28
28
|
"mc9l5x": "ftgm304",
|
|
29
|
+
"qhf8xq": "f10pi13n",
|
|
29
30
|
"B68tc82": "f1p9o1ba",
|
|
30
31
|
"Bmxbyg5": "f1sil6mw",
|
|
31
32
|
"sj55zd": "f19n0e5",
|
|
32
|
-
"icvyot": "fzkkow9",
|
|
33
|
-
"vrafjx": ["fcdblym", "fjik90z"],
|
|
34
|
-
"oivjwe": "fg706s2",
|
|
35
|
-
"wvpqe5": ["fjik90z", "fcdblym"],
|
|
36
|
-
"B4j52fo": "f192inf7",
|
|
37
|
-
"Bekrc4i": ["f5tn483", "f1ojsxk5"],
|
|
38
|
-
"Bn0qgzm": "f1vxd6vx",
|
|
39
|
-
"ibv6hh": ["f1ojsxk5", "f5tn483"],
|
|
40
33
|
"Bbmb7ep": ["f1aa9q02", "f16jpd5f"],
|
|
41
34
|
"Beyfa6y": ["f16jpd5f", "f1aa9q02"],
|
|
42
35
|
"B7oj6ja": ["f1jar5jt", "fyu767a"],
|
|
43
36
|
"Btl43ni": ["fyu767a", "f1jar5jt"],
|
|
37
|
+
"E3zdtr": "f1mdlcz9",
|
|
38
|
+
"bn5sak": "frwkxtg",
|
|
39
|
+
"Eqx8gd": ["f1n6gb5g", "f15yvnhg"],
|
|
40
|
+
"B1piin3": ["f15yvnhg", "f1n6gb5g"],
|
|
41
|
+
"By385i5": "fo72kxq",
|
|
42
|
+
"Bsft5z2": "f13zj6fq",
|
|
43
|
+
"B80jsxd": "f1nwj1ja",
|
|
44
|
+
"Bm2nyyq": "f8rth92",
|
|
45
|
+
"Barhvk9": ["flthirb", "ftkbnf5"],
|
|
46
|
+
"Bw17bha": "f1lh990p",
|
|
47
|
+
"vfts7": ["ftkbnf5", "flthirb"],
|
|
48
|
+
"xrcqlc": "f6czdpx",
|
|
49
|
+
"Ihftqj": ["f13hvwk3", "f1en4csx"],
|
|
50
|
+
"Bcgy8vk": "f1i1u9k0",
|
|
51
|
+
"Bhxzhr1": ["f1en4csx", "f13hvwk3"],
|
|
52
|
+
"B3778ie": ["f1ibwz09", "f1kp91vd"],
|
|
53
|
+
"d9w3h3": ["f1kp91vd", "f1ibwz09"],
|
|
54
|
+
"Bl18szs": ["f1pix4dl", "f13nd1z4"],
|
|
55
|
+
"B4j8arr": ["f13nd1z4", "f1pix4dl"],
|
|
44
56
|
"Ecqjvq": "f70or3y",
|
|
45
57
|
"B39syqp": ["f1s27jks", "f1x7x6se"],
|
|
46
58
|
"m3o775": "f1q2lvbs",
|
|
47
59
|
"I0kkcn": ["f1x7x6se", "f1s27jks"]
|
|
48
60
|
},
|
|
61
|
+
"interactiveNoOutline": {
|
|
62
|
+
"Be0v6ae": "ftr40te",
|
|
63
|
+
"B5kxglz": ["fcsoo7g", "f1rl4q8i"],
|
|
64
|
+
"B3pwyw6": "fbb4roj",
|
|
65
|
+
"Bymgtzf": ["f1rl4q8i", "fcsoo7g"],
|
|
66
|
+
"dmfk": "fd4vwcp",
|
|
67
|
+
"B4ofi8": ["f1crelnc", "fup9tr0"],
|
|
68
|
+
"jgq6uv": "f12d33p4",
|
|
69
|
+
"Baxewws": ["fup9tr0", "f1crelnc"]
|
|
70
|
+
},
|
|
49
71
|
"filledInteractive": {
|
|
50
72
|
"Bceei9c": "f1k6fduh",
|
|
51
73
|
"De3pzq": "fxugw4r",
|
|
52
|
-
"g2u3we": "fghlq4f",
|
|
53
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
54
|
-
"B9xav0g": "fb073pr",
|
|
55
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
56
74
|
"E5pizo": "f1whvlc6",
|
|
75
|
+
"B0n5ga8": "f16gxe2i",
|
|
76
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
77
|
+
"B1q35kw": "f1osi826",
|
|
78
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
57
79
|
"Jwef8y": "f1knas48",
|
|
58
|
-
"Bgoe8wy": "fpa59ij",
|
|
59
|
-
"Bwzppfd": ["f1rhln42", "f1l1ogpg"],
|
|
60
|
-
"oetu4i": "fz67qlh",
|
|
61
|
-
"gg5e9n": ["f1l1ogpg", "f1rhln42"],
|
|
62
80
|
"Bvxd0ez": "f1m145df",
|
|
63
|
-
"ecr2s2": "fb40n2d"
|
|
64
|
-
"B6oc9vd": "f7cshhm",
|
|
65
|
-
"ak43y8": ["f1bzyac8", "f131p3c2"],
|
|
66
|
-
"wmxk5l": "f1bazisv",
|
|
67
|
-
"B50zh58": ["f131p3c2", "f1bzyac8"]
|
|
81
|
+
"ecr2s2": "fb40n2d"
|
|
68
82
|
},
|
|
69
83
|
"filled": {
|
|
70
84
|
"De3pzq": "fxugw4r",
|
|
71
|
-
"
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"
|
|
85
|
+
"E5pizo": "f1whvlc6",
|
|
86
|
+
"B0n5ga8": "f16gxe2i",
|
|
87
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
88
|
+
"B1q35kw": "f1osi826",
|
|
89
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
76
90
|
},
|
|
77
91
|
"filledAlternativeInteractive": {
|
|
78
92
|
"Bceei9c": "f1k6fduh",
|
|
79
93
|
"De3pzq": "f1dmdbja",
|
|
80
|
-
"g2u3we": "fghlq4f",
|
|
81
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
82
|
-
"B9xav0g": "fb073pr",
|
|
83
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
84
94
|
"E5pizo": "f1whvlc6",
|
|
95
|
+
"B0n5ga8": "f16gxe2i",
|
|
96
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
97
|
+
"B1q35kw": "f1osi826",
|
|
98
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
85
99
|
"Jwef8y": "f1uvynv3",
|
|
86
|
-
"Bgoe8wy": "fpa59ij",
|
|
87
|
-
"Bwzppfd": ["f1rhln42", "f1l1ogpg"],
|
|
88
|
-
"oetu4i": "fz67qlh",
|
|
89
|
-
"gg5e9n": ["f1l1ogpg", "f1rhln42"],
|
|
90
100
|
"Bvxd0ez": "f1m145df",
|
|
91
|
-
"ecr2s2": "f1yhgkbh"
|
|
92
|
-
"B6oc9vd": "f7cshhm",
|
|
93
|
-
"ak43y8": ["f1bzyac8", "f131p3c2"],
|
|
94
|
-
"wmxk5l": "f1bazisv",
|
|
95
|
-
"B50zh58": ["f131p3c2", "f1bzyac8"]
|
|
101
|
+
"ecr2s2": "f1yhgkbh"
|
|
96
102
|
},
|
|
97
103
|
"filledAlternative": {
|
|
98
104
|
"De3pzq": "f1dmdbja",
|
|
99
|
-
"
|
|
100
|
-
"
|
|
101
|
-
"
|
|
102
|
-
"
|
|
103
|
-
"
|
|
105
|
+
"E5pizo": "f1whvlc6",
|
|
106
|
+
"B0n5ga8": "f16gxe2i",
|
|
107
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
108
|
+
"B1q35kw": "f1osi826",
|
|
109
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
104
110
|
},
|
|
105
111
|
"outlineInteractive": {
|
|
106
112
|
"Bceei9c": "f1k6fduh",
|
|
107
113
|
"De3pzq": "f1c21dwh",
|
|
108
|
-
"g2u3we": "fj3muxo",
|
|
109
|
-
"h3c5rm": ["f1akhkt", "f1lxtadh"],
|
|
110
|
-
"B9xav0g": "f1aperda",
|
|
111
|
-
"zhjwy3": ["f1lxtadh", "f1akhkt"],
|
|
112
114
|
"E5pizo": "f1couhl3",
|
|
115
|
+
"B0n5ga8": "ft83z1f",
|
|
116
|
+
"s924m2": ["f1g4150c", "f192dr6e"],
|
|
117
|
+
"B1q35kw": "f1qnawh6",
|
|
118
|
+
"Gp14am": ["f192dr6e", "f1g4150c"],
|
|
113
119
|
"Jwef8y": "fjxutwb",
|
|
114
|
-
"
|
|
115
|
-
"
|
|
116
|
-
"
|
|
117
|
-
"
|
|
120
|
+
"Be0v6ae": "f1llr77y",
|
|
121
|
+
"B5kxglz": ["fzk0khw", "fjj8tog"],
|
|
122
|
+
"B3pwyw6": "fb1u8ub",
|
|
123
|
+
"Bymgtzf": ["fjj8tog", "fzk0khw"],
|
|
118
124
|
"ecr2s2": "fophhak",
|
|
119
|
-
"
|
|
120
|
-
"
|
|
121
|
-
"
|
|
122
|
-
"
|
|
125
|
+
"dmfk": "f1uohb70",
|
|
126
|
+
"B4ofi8": ["f1jm7v1n", "f1bus3rq"],
|
|
127
|
+
"jgq6uv": "f1fbu7rr",
|
|
128
|
+
"Baxewws": ["f1bus3rq", "f1jm7v1n"]
|
|
123
129
|
},
|
|
124
130
|
"outline": {
|
|
125
131
|
"De3pzq": "f1c21dwh",
|
|
126
|
-
"
|
|
127
|
-
"
|
|
128
|
-
"
|
|
129
|
-
"
|
|
130
|
-
"
|
|
132
|
+
"E5pizo": "f1couhl3",
|
|
133
|
+
"B0n5ga8": "ft83z1f",
|
|
134
|
+
"s924m2": ["f1g4150c", "f192dr6e"],
|
|
135
|
+
"B1q35kw": "f1qnawh6",
|
|
136
|
+
"Gp14am": ["f192dr6e", "f1g4150c"]
|
|
131
137
|
},
|
|
132
138
|
"subtleInteractive": {
|
|
133
139
|
"Bceei9c": "f1k6fduh",
|
|
134
140
|
"De3pzq": "fhovq9v",
|
|
135
|
-
"g2u3we": "fghlq4f",
|
|
136
|
-
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
137
|
-
"B9xav0g": "fb073pr",
|
|
138
|
-
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
139
141
|
"E5pizo": "f1couhl3",
|
|
142
|
+
"B0n5ga8": "f16gxe2i",
|
|
143
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
144
|
+
"B1q35kw": "f1osi826",
|
|
145
|
+
"Gp14am": ["fzybk4o", "fpgykix"],
|
|
140
146
|
"Jwef8y": "f1t94bn6",
|
|
141
147
|
"ecr2s2": "f1wfn5kd"
|
|
142
148
|
},
|
|
143
149
|
"subtle": {
|
|
144
150
|
"De3pzq": "fhovq9v",
|
|
145
|
-
"
|
|
146
|
-
"
|
|
147
|
-
"
|
|
148
|
-
"
|
|
149
|
-
"
|
|
151
|
+
"E5pizo": "f1couhl3",
|
|
152
|
+
"B0n5ga8": "f16gxe2i",
|
|
153
|
+
"s924m2": ["fpgykix", "fzybk4o"],
|
|
154
|
+
"B1q35kw": "f1osi826",
|
|
155
|
+
"Gp14am": ["fzybk4o", "fpgykix"]
|
|
150
156
|
}
|
|
151
157
|
}, {
|
|
152
|
-
"d": [".ftgm304{display:block;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".
|
|
153
|
-
"h": [".
|
|
154
|
-
"a": [".
|
|
158
|
+
"d": [".ftgm304{display:block;}", ".f10pi13n{position:relative;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".f1mdlcz9::after{position:absolute;}", ".frwkxtg::after{top:0;}", ".f1n6gb5g::after{left:0;}", ".f15yvnhg::after{right:0;}", ".fo72kxq::after{bottom:0;}", ".f13zj6fq::after{content:\"\";}", ".f1nwj1ja::after{pointer-events:none;}", ".f8rth92::after{border-top-style:solid;}", ".flthirb::after{border-right-style:solid;}", ".ftkbnf5::after{border-left-style:solid;}", ".f1lh990p::after{border-bottom-style:solid;}", ".f6czdpx::after{border-top-width:var(--strokeWidthThin);}", ".f13hvwk3::after{border-right-width:var(--strokeWidthThin);}", ".f1en4csx::after{border-left-width:var(--strokeWidthThin);}", ".f1i1u9k0::after{border-bottom-width:var(--strokeWidthThin);}", ".f1ibwz09::after{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f1kp91vd::after{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1pix4dl::after{border-top-right-radius:var(--borderRadiusMedium);}", ".f13nd1z4::after{border-top-left-radius:var(--borderRadiusMedium);}", ".f70or3y>*:not(.fui-CardPreview){margin-top:12px;}", ".f1s27jks>*:not(.fui-CardPreview){margin-right:12px;}", ".f1x7x6se>*:not(.fui-CardPreview){margin-left:12px;}", ".f1q2lvbs>*:not(.fui-CardPreview){margin-bottom:12px;}", ".f1k6fduh{cursor:pointer;}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".f1whvlc6{box-shadow:var(--shadow4);}", ".f16gxe2i::after{border-top-color:var(--colorTransparentStroke);}", ".fpgykix::after{border-right-color:var(--colorTransparentStroke);}", ".fzybk4o::after{border-left-color:var(--colorTransparentStroke);}", ".f1osi826::after{border-bottom-color:var(--colorTransparentStroke);}", ".f1dmdbja{background-color:var(--colorNeutralBackground2);}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1couhl3{box-shadow:none;}", ".ft83z1f::after{border-top-color:var(--colorNeutralStroke1);}", ".f1g4150c::after{border-right-color:var(--colorNeutralStroke1);}", ".f192dr6e::after{border-left-color:var(--colorNeutralStroke1);}", ".f1qnawh6::after{border-bottom-color:var(--colorNeutralStroke1);}", ".fhovq9v{background-color:var(--colorSubtleBackground);}"],
|
|
159
|
+
"h": [".ftr40te:hover::after{border-top-color:var(--colorTransparentStrokeInteractive);}", ".fcsoo7g:hover::after{border-right-color:var(--colorTransparentStrokeInteractive);}", ".f1rl4q8i:hover::after{border-left-color:var(--colorTransparentStrokeInteractive);}", ".fbb4roj:hover::after{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".f1m145df:hover{box-shadow:var(--shadow8);}", ".f1uvynv3:hover{background-color:var(--colorNeutralBackground2Hover);}", ".fjxutwb:hover{background-color:var(--colorTransparentBackgroundHover);}", ".f1llr77y:hover::after{border-top-color:var(--colorNeutralStroke1Hover);}", ".fzk0khw:hover::after{border-right-color:var(--colorNeutralStroke1Hover);}", ".fjj8tog:hover::after{border-left-color:var(--colorNeutralStroke1Hover);}", ".fb1u8ub:hover::after{border-bottom-color:var(--colorNeutralStroke1Hover);}", ".f1t94bn6:hover{background-color:var(--colorSubtleBackgroundHover);}"],
|
|
160
|
+
"a": [".fd4vwcp:active::after{border-top-color:var(--colorTransparentStrokeInteractive);}", ".f1crelnc:active::after{border-right-color:var(--colorTransparentStrokeInteractive);}", ".fup9tr0:active::after{border-left-color:var(--colorTransparentStrokeInteractive);}", ".f12d33p4:active::after{border-bottom-color:var(--colorTransparentStrokeInteractive);}", ".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".f1yhgkbh:active{background-color:var(--colorNeutralBackground2Pressed);}", ".fophhak:active{background-color:var(--colorTransparentBackgroundPressed);}", ".f1uohb70:active::after{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1jm7v1n:active::after{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f1bus3rq:active::after{border-left-color:var(--colorNeutralStroke1Pressed);}", ".f1fbu7rr:active::after{border-bottom-color:var(--colorNeutralStroke1Pressed);}", ".f1wfn5kd:active{background-color:var(--colorSubtleBackgroundPressed);}"]
|
|
155
161
|
});
|
|
156
162
|
/**
|
|
157
163
|
* Apply styling to the Card slots based on the state
|
|
@@ -161,7 +167,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
|
161
167
|
const useCardStyles_unstable = state => {
|
|
162
168
|
const styles = useStyles();
|
|
163
169
|
const interactive = state.root.onClick || state.root.onMouseUp || state.root.onMouseDown || state.root.onPointerUp || state.root.onPointerDown || state.root.onTouchStart || state.root.onTouchEnd;
|
|
164
|
-
state.root.className = react_1.mergeClasses(exports.cardClassNames.root, styles.root, state.appearance === 'filled' && styles.filled, state.appearance === 'filled-alternative' && styles.filledAlternative, state.appearance === 'outline' && styles.outline, state.appearance === 'subtle' && styles.subtle, interactive && state.appearance === 'filled' && styles.filledInteractive, interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive, interactive && state.appearance === 'outline' && styles.outlineInteractive, interactive && state.appearance === 'subtle' && styles.subtleInteractive, state.root.className);
|
|
170
|
+
state.root.className = react_1.mergeClasses(exports.cardClassNames.root, styles.root, state.appearance === 'filled' && styles.filled, state.appearance === 'filled-alternative' && styles.filledAlternative, state.appearance === 'outline' && styles.outline, state.appearance === 'subtle' && styles.subtle, interactive && state.appearance === 'filled' && styles.filledInteractive, interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive, interactive && state.appearance === 'outline' && styles.outlineInteractive, interactive && state.appearance === 'subtle' && styles.subtleInteractive, interactive && state.appearance !== 'outline' && styles.interactiveNoOutline, state.root.className);
|
|
165
171
|
return state;
|
|
166
172
|
};
|
|
167
173
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["components/Card/useCardStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,aAAA,GAAgB,UAAhB;AACA,OAAA,CAAA,cAAA,GAA4C;AACvD,EAAA,IAAI,EAAE;AADiD,CAA5C;AAIb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;
|
|
1
|
+
{"version":3,"sources":["components/Card/useCardStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,aAAA,GAAgB,UAAhB;AACA,OAAA,CAAA,cAAA,GAA4C;AACvD,EAAA,IAAI,EAAE;AADiD,CAA5C;AAIb;;AAEG;;AACH,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAoJA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAgC;AACpE,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,QAAM,WAAW,GACf,KAAK,CAAC,IAAN,CAAW,OAAX,IACA,KAAK,CAAC,IAAN,CAAW,SADX,IAEA,KAAK,CAAC,IAAN,CAAW,WAFX,IAGA,KAAK,CAAC,IAAN,CAAW,WAHX,IAIA,KAAK,CAAC,IAAN,CAAW,aAJX,IAKA,KAAK,CAAC,IAAN,CAAW,YALX,IAMA,KAAK,CAAC,IAAN,CAAW,UAPb;AASA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,cAAA,CAAe,IADM,EAErB,MAAM,CAAC,IAFc,EAGrB,KAAK,CAAC,UAAN,KAAqB,QAArB,IAAiC,MAAM,CAAC,MAHnB,EAIrB,KAAK,CAAC,UAAN,KAAqB,oBAArB,IAA6C,MAAM,CAAC,iBAJ/B,EAKrB,KAAK,CAAC,UAAN,KAAqB,SAArB,IAAkC,MAAM,CAAC,OALpB,EAMrB,KAAK,CAAC,UAAN,KAAqB,QAArB,IAAiC,MAAM,CAAC,MANnB,EAOrB,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,QAApC,IAAgD,MAAM,CAAC,iBAPlC,EAQrB,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,oBAApC,IAA4D,MAAM,CAAC,4BAR9C,EASrB,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,SAApC,IAAiD,MAAM,CAAC,kBATnC,EAUrB,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,QAApC,IAAgD,MAAM,CAAC,iBAVlC,EAWrB,WAAW,IAAI,KAAK,CAAC,UAAN,KAAqB,SAApC,IAAiD,MAAM,CAAC,oBAXnC,EAYrB,KAAK,CAAC,IAAN,CAAW,SAZU,CAAvB;AAeA,SAAO,KAAP;AACD,CA5BM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import { shorthands, makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { cardPreviewClassNames } from '../CardPreview/index';\nimport type { CardSlots, CardState } from './Card.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\n/**\n * @deprecated Use `cardClassNames.root` instead.\n */\nexport const cardClassName = 'fui-Card';\nexport const cardClassNames: SlotClassNames<CardSlots> = {\n root: 'fui-Card',\n};\n\n/**\n * Styles for the root slot\n */\nconst useStyles = makeStyles({\n root: {\n display: 'block',\n position: 'relative',\n ...shorthands.overflow('hidden'),\n color: tokens.colorNeutralForeground1,\n\n // TODO: Extract this to separate stiles when tackling the `size` prop\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n\n '::after': {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n content: '\"\"',\n pointerEvents: 'none',\n\n ...shorthands.borderStyle('solid'),\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n // TODO: Extract this to separate styles when tackling the `size` prop\n ...shorthands.borderRadius(tokens.borderRadiusMedium),\n },\n\n [`> *:not(.${cardPreviewClassNames.root})`]: {\n // TODO: Extract this to separate styles when tackling the `size` prop\n ...shorthands.margin('12px'),\n },\n },\n\n interactiveNoOutline: {\n ':hover::after': {\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n ':active::after': {\n ...shorthands.borderColor(tokens.colorTransparentStrokeInteractive),\n },\n },\n\n filledInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n },\n },\n filled: {\n backgroundColor: tokens.colorNeutralBackground1,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n filledAlternativeInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground2Hover,\n boxShadow: tokens.shadow8,\n },\n ':active': {\n backgroundColor: tokens.colorNeutralBackground2Pressed,\n },\n },\n filledAlternative: {\n backgroundColor: tokens.colorNeutralBackground2,\n boxShadow: tokens.shadow4,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n outlineInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n },\n },\n ':active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n },\n },\n },\n outline: {\n backgroundColor: tokens.colorTransparentBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n },\n },\n subtleInteractive: {\n cursor: 'pointer',\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n },\n ':active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n },\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackground,\n boxShadow: 'none',\n\n '::after': {\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n },\n },\n});\n\n/**\n * Apply styling to the Card slots based on the state\n */\nexport const useCardStyles_unstable = (state: CardState): CardState => {\n const styles = useStyles();\n\n const interactive =\n state.root.onClick ||\n state.root.onMouseUp ||\n state.root.onMouseDown ||\n state.root.onPointerUp ||\n state.root.onPointerDown ||\n state.root.onTouchStart ||\n state.root.onTouchEnd;\n\n state.root.className = mergeClasses(\n cardClassNames.root,\n styles.root,\n state.appearance === 'filled' && styles.filled,\n state.appearance === 'filled-alternative' && styles.filledAlternative,\n state.appearance === 'outline' && styles.outline,\n state.appearance === 'subtle' && styles.subtle,\n interactive && state.appearance === 'filled' && styles.filledInteractive,\n interactive && state.appearance === 'filled-alternative' && styles.filledAlternativeInteractive,\n interactive && state.appearance === 'outline' && styles.outlineInteractive,\n interactive && state.appearance === 'subtle' && styles.subtleInteractive,\n interactive && state.appearance !== 'outline' && styles.interactiveNoOutline,\n state.root.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-card",
|
|
3
|
-
"version": "0.0.0-nightly-
|
|
3
|
+
"version": "0.0.0-nightly-20220510-0420.1",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Card container components for Fluent UI React.",
|
|
6
6
|
"main": "lib-commonjs/index.js",
|
|
@@ -30,16 +30,16 @@
|
|
|
30
30
|
"devDependencies": {
|
|
31
31
|
"@fluentui/eslint-plugin": "*",
|
|
32
32
|
"@fluentui/react-conformance": "*",
|
|
33
|
-
"@fluentui/react-conformance-griffel": "0.0.0-nightly-
|
|
33
|
+
"@fluentui/react-conformance-griffel": "0.0.0-nightly-20220510-0420.1",
|
|
34
34
|
"@fluentui/scripts": "^1.0.0",
|
|
35
|
-
"@fluentui/react-text": "0.0.0-nightly-
|
|
36
|
-
"@fluentui/react-button": "0.0.0-nightly-
|
|
35
|
+
"@fluentui/react-text": "0.0.0-nightly-20220510-0420.1",
|
|
36
|
+
"@fluentui/react-button": "0.0.0-nightly-20220510-0420.1"
|
|
37
37
|
},
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@griffel/react": "1.0.3",
|
|
40
|
-
"@fluentui/react-utilities": "0.0.0-nightly-
|
|
41
|
-
"@fluentui/react-tabster": "0.0.0-nightly-
|
|
42
|
-
"@fluentui/react-theme": "0.0.0-nightly-
|
|
40
|
+
"@fluentui/react-utilities": "0.0.0-nightly-20220510-0420.1",
|
|
41
|
+
"@fluentui/react-tabster": "0.0.0-nightly-20220510-0420.1",
|
|
42
|
+
"@fluentui/react-theme": "0.0.0-nightly-20220510-0420.1",
|
|
43
43
|
"tslib": "^2.1.0"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|