@fluentui/react-avatar 9.0.4 → 9.1.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 +214 -6
- package/CHANGELOG.md +52 -7
- package/README-AvatarGroup.md +63 -39
- package/SPEC-AvatarGroup.md +103 -85
- package/dist/index.d.ts +97 -64
- package/lib/AvatarGroupPopover.js +2 -0
- package/lib/AvatarGroupPopover.js.map +1 -0
- package/lib/components/Avatar/useAvatar.js +3 -7
- package/lib/components/Avatar/useAvatar.js.map +1 -1
- package/lib/components/Avatar/useAvatarStyles.js +2 -2
- package/lib/components/Avatar/useAvatarStyles.js.map +1 -1
- package/lib/components/AvatarGroup/AvatarGroup.js +4 -2
- package/lib/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/AvatarGroup.types.js.map +1 -1
- package/lib/components/AvatarGroup/index.js +1 -0
- package/lib/components/AvatarGroup/index.js.map +1 -1
- package/lib/components/AvatarGroup/renderAvatarGroup.js +5 -31
- package/lib/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroup.js +4 -62
- package/lib/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroupContextValues.js +14 -0
- package/lib/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -0
- package/lib/components/AvatarGroup/useAvatarGroupStyles.js +5 -268
- package/lib/components/AvatarGroup/useAvatarGroupStyles.js.map +1 -1
- package/lib/components/AvatarGroupItem/AvatarGroupItem.js +1 -1
- package/lib/components/AvatarGroupItem/AvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/AvatarGroupItem.types.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItem.js +10 -11
- package/lib/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.js +51 -59
- package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.js.map +1 -1
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js +16 -0
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -0
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.types.js +2 -0
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map +1 -0
- package/lib/components/AvatarGroupPopover/index.js +6 -0
- package/lib/components/AvatarGroupPopover/index.js.map +1 -0
- package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js +23 -0
- package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopover.js +102 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js +10 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js +307 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js.map +1 -0
- package/lib/contexts/AvatarGroupContext.js +7 -4
- package/lib/contexts/AvatarGroupContext.js.map +1 -1
- package/lib/index.js +4 -3
- package/lib/index.js.map +1 -1
- package/lib/utils/index.js +1 -0
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/partitionAvatarGroupItems.js +30 -0
- package/lib/utils/partitionAvatarGroupItems.js.map +1 -0
- package/lib-commonjs/{AvatarGroupOverflow.js → AvatarGroupPopover.js} +2 -2
- package/lib-commonjs/AvatarGroupPopover.js.map +1 -0
- package/lib-commonjs/components/Avatar/useAvatar.js +2 -7
- package/lib-commonjs/components/Avatar/useAvatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatarStyles.js +2 -2
- package/lib-commonjs/components/Avatar/useAvatarStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.js +5 -2
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/index.js +2 -0
- package/lib-commonjs/components/AvatarGroup/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js +4 -32
- package/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroup.js +3 -64
- package/lib-commonjs/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js +23 -0
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -0
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.js +3 -268
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js +2 -2
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js +8 -9
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.js +52 -60
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js +29 -0
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -0
- package/lib-commonjs/{contexts/AvatarGroupContext.types.js → components/AvatarGroupPopover/AvatarGroupPopover.types.js} +1 -1
- package/lib-commonjs/{contexts/AvatarGroupContext.types.js.map → components/AvatarGroupPopover/AvatarGroupPopover.types.js.map} +0 -0
- package/lib-commonjs/components/AvatarGroupPopover/index.js +18 -0
- package/lib-commonjs/components/AvatarGroupPopover/index.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js +36 -0
- package/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js +118 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js +19 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js +321 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js.map +1 -0
- package/lib-commonjs/contexts/AvatarGroupContext.js +10 -4
- package/lib-commonjs/contexts/AvatarGroupContext.js.map +1 -1
- package/lib-commonjs/index.js +60 -4
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/index.js +10 -1
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/partitionAvatarGroupItems.js +39 -0
- package/lib-commonjs/utils/partitionAvatarGroupItems.js.map +1 -0
- package/package.json +14 -12
- package/MIGRATION-AvatarGroup.md +0 -35
- package/dist/tsdoc-metadata.json +0 -11
- package/lib/AvatarGroupOverflow.js +0 -2
- package/lib/AvatarGroupOverflow.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/AvatarGroupOverflow.js +0 -15
- package/lib/components/AvatarGroupOverflow/AvatarGroupOverflow.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/AvatarGroupOverflow.types.js +0 -2
- package/lib/components/AvatarGroupOverflow/AvatarGroupOverflow.types.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/index.js +0 -6
- package/lib/components/AvatarGroupOverflow/index.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/renderAvatarGroupOverflow.js +0 -16
- package/lib/components/AvatarGroupOverflow/renderAvatarGroupOverflow.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/useAvatarGroupOverflow.js +0 -27
- package/lib/components/AvatarGroupOverflow/useAvatarGroupOverflow.js.map +0 -1
- package/lib/components/AvatarGroupOverflow/useAvatarGroupOverflowStyles.js +0 -27
- package/lib/components/AvatarGroupOverflow/useAvatarGroupOverflowStyles.js.map +0 -1
- package/lib/contexts/AvatarGroupContext.types.js +0 -2
- package/lib/contexts/AvatarGroupContext.types.js.map +0 -1
- package/lib-commonjs/AvatarGroupOverflow.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/AvatarGroupOverflow.js +0 -26
- package/lib-commonjs/components/AvatarGroupOverflow/AvatarGroupOverflow.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/AvatarGroupOverflow.types.js +0 -6
- package/lib-commonjs/components/AvatarGroupOverflow/AvatarGroupOverflow.types.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/index.js +0 -18
- package/lib-commonjs/components/AvatarGroupOverflow/index.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/renderAvatarGroupOverflow.js +0 -27
- package/lib-commonjs/components/AvatarGroupOverflow/renderAvatarGroupOverflow.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/useAvatarGroupOverflow.js +0 -37
- package/lib-commonjs/components/AvatarGroupOverflow/useAvatarGroupOverflow.js.map +0 -1
- package/lib-commonjs/components/AvatarGroupOverflow/useAvatarGroupOverflowStyles.js +0 -37
- package/lib-commonjs/components/AvatarGroupOverflow/useAvatarGroupOverflowStyles.js.map +0 -1
|
@@ -0,0 +1,321 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useAvatarGroupPopoverStyles_unstable = exports.avatarGroupPopoverClassNames = void 0;
|
|
7
|
+
|
|
8
|
+
const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
|
|
9
|
+
|
|
10
|
+
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
11
|
+
|
|
12
|
+
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
|
13
|
+
|
|
14
|
+
const useAvatarGroupItemStyles_1 = /*#__PURE__*/require("../AvatarGroupItem/useAvatarGroupItemStyles");
|
|
15
|
+
|
|
16
|
+
const useAvatarStyles_1 = /*#__PURE__*/require("../Avatar/useAvatarStyles");
|
|
17
|
+
|
|
18
|
+
exports.avatarGroupPopoverClassNames = {
|
|
19
|
+
root: 'fui-AvatarGroupPopover',
|
|
20
|
+
content: 'fui-AvatarGroupPopover__content',
|
|
21
|
+
popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',
|
|
22
|
+
tooltip: 'fui-AvatarGroupPopover__tooltip',
|
|
23
|
+
triggerButton: 'fui-AvatarGroupPopover__triggerButton'
|
|
24
|
+
};
|
|
25
|
+
/**
|
|
26
|
+
* Styles for the content slot.
|
|
27
|
+
*/
|
|
28
|
+
|
|
29
|
+
const useContentStyles = /*#__PURE__*/react_1.__styles({
|
|
30
|
+
"base": {
|
|
31
|
+
"dclx09": "ftrb29c",
|
|
32
|
+
"B6of3ja": "f1hu3pq6",
|
|
33
|
+
"t21cq0": ["f11qmguv", "f1tyq0we"],
|
|
34
|
+
"jrapky": "f19f4twv",
|
|
35
|
+
"Frg6f3": ["f1tyq0we", "f11qmguv"],
|
|
36
|
+
"z8tnut": "f1g0x7ka",
|
|
37
|
+
"z189sj": ["fhxju0i", "f1cnd47f"],
|
|
38
|
+
"Byoj8tv": "f1qch9an",
|
|
39
|
+
"uwmqm3": ["f1cnd47f", "fhxju0i"]
|
|
40
|
+
}
|
|
41
|
+
}, {
|
|
42
|
+
"d": [".ftrb29c{list-style-type:none;}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}"]
|
|
43
|
+
});
|
|
44
|
+
/**
|
|
45
|
+
* Styles for the popoverSurface slot.
|
|
46
|
+
*/
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
const usePopoverSurfaceStyles = /*#__PURE__*/react_1.__styles({
|
|
50
|
+
"base": {
|
|
51
|
+
"Bxyxcbc": "fopcw2o",
|
|
52
|
+
"sshi5w": "f1n5o1gx",
|
|
53
|
+
"B68tc82": "f1p9o1ba",
|
|
54
|
+
"Bmxbyg5": "fqkkaap",
|
|
55
|
+
"z8tnut": "f1kwiid1",
|
|
56
|
+
"z189sj": ["f1vdfbxk", "f1f5gg8d"],
|
|
57
|
+
"Byoj8tv": "f5b47ha",
|
|
58
|
+
"uwmqm3": ["f1f5gg8d", "f1vdfbxk"],
|
|
59
|
+
"a9b677": "f13dwy2t"
|
|
60
|
+
}
|
|
61
|
+
}, {
|
|
62
|
+
"d": [".fopcw2o{max-height:220px;}", ".f1n5o1gx{min-height:80px;}", ".f1p9o1ba{overflow-x:hidden;}", ".fqkkaap{overflow-y:scroll;}", ".f1kwiid1{padding-top:var(--spacingVerticalS);}", ".f1vdfbxk{padding-right:var(--spacingHorizontalS);}", ".f1f5gg8d{padding-left:var(--spacingHorizontalS);}", ".f5b47ha{padding-bottom:var(--spacingVerticalS);}", ".f13dwy2t{width:220px;}"]
|
|
63
|
+
});
|
|
64
|
+
/**
|
|
65
|
+
* Styles for the triggerButton slot.
|
|
66
|
+
*/
|
|
67
|
+
|
|
68
|
+
|
|
69
|
+
const useTriggerButtonStyles = /*#__PURE__*/react_1.__styles({
|
|
70
|
+
"base": {
|
|
71
|
+
"mc9l5x": "ftuwxu6",
|
|
72
|
+
"qhf8xq": "f10pi13n",
|
|
73
|
+
"Bnnss6s": "fi64zpg",
|
|
74
|
+
"Brf1p80": "f4d9j23",
|
|
75
|
+
"Bt984gj": "f122n59",
|
|
76
|
+
"sj55zd": "f19n0e5",
|
|
77
|
+
"De3pzq": "fxugw4r",
|
|
78
|
+
"g2u3we": "fj3muxo",
|
|
79
|
+
"h3c5rm": ["f1akhkt", "f1lxtadh"],
|
|
80
|
+
"B9xav0g": "f1aperda",
|
|
81
|
+
"zhjwy3": ["f1lxtadh", "f1akhkt"],
|
|
82
|
+
"Bbmb7ep": ["f8fbkgy", "f1nfllo7"],
|
|
83
|
+
"Beyfa6y": ["f1nfllo7", "f8fbkgy"],
|
|
84
|
+
"B7oj6ja": ["f1djnp8u", "f1s8kh49"],
|
|
85
|
+
"Btl43ni": ["f1s8kh49", "f1djnp8u"],
|
|
86
|
+
"icvyot": "fzkkow9",
|
|
87
|
+
"vrafjx": ["fcdblym", "fjik90z"],
|
|
88
|
+
"oivjwe": "fg706s2",
|
|
89
|
+
"wvpqe5": ["fjik90z", "fcdblym"],
|
|
90
|
+
"z8tnut": "f1g0x7ka",
|
|
91
|
+
"z189sj": ["fhxju0i", "f1cnd47f"],
|
|
92
|
+
"Byoj8tv": "f1qch9an",
|
|
93
|
+
"uwmqm3": ["f1cnd47f", "fhxju0i"],
|
|
94
|
+
"Bjwas2f": "fw33nwi",
|
|
95
|
+
"Bn1d65q": ["f1ptkjjm", "fmzzjfk"],
|
|
96
|
+
"Bxeuatn": "f15j0dln",
|
|
97
|
+
"n51gp8": ["fmzzjfk", "f1ptkjjm"]
|
|
98
|
+
},
|
|
99
|
+
"pie": {
|
|
100
|
+
"De3pzq": "f1c21dwh",
|
|
101
|
+
"g2u3we": "fghlq4f",
|
|
102
|
+
"h3c5rm": ["f1gn591s", "fjscplz"],
|
|
103
|
+
"B9xav0g": "fb073pr",
|
|
104
|
+
"zhjwy3": ["fjscplz", "f1gn591s"],
|
|
105
|
+
"sj55zd": "f44pa96"
|
|
106
|
+
},
|
|
107
|
+
"focusIndicator": {
|
|
108
|
+
"Brovlpu": "ftqa4ok",
|
|
109
|
+
"B486eqv": "f2hkw1w",
|
|
110
|
+
"r6j8yp": "f9sgzds",
|
|
111
|
+
"w235jp": ["fut1j4r", "fkf1fqv"],
|
|
112
|
+
"Bjm0d8m": "f1t0sa4d",
|
|
113
|
+
"jwfw70": ["fkf1fqv", "fut1j4r"],
|
|
114
|
+
"Hbfjuj": "fikr5py",
|
|
115
|
+
"zog540": "f1rsleix",
|
|
116
|
+
"yj03m6": "fv9e16l"
|
|
117
|
+
},
|
|
118
|
+
"pieFocusIndicator": {
|
|
119
|
+
"Brovlpu": "ftqa4ok",
|
|
120
|
+
"B486eqv": "f2hkw1w",
|
|
121
|
+
"oszr8s": "f1y8129k",
|
|
122
|
+
"B50rz4d": ["fu21ej", "f1pmrd9z"],
|
|
123
|
+
"Bb145of": "f1vgtxyk",
|
|
124
|
+
"Bxp30wo": ["f1pmrd9z", "fu21ej"],
|
|
125
|
+
"d5lb0k": "f1pah1tb",
|
|
126
|
+
"Bvq7845": ["f1q2ljzj", "f1cf0pyq"],
|
|
127
|
+
"Bt5y04j": "fgb2zbd",
|
|
128
|
+
"Bt3jgif": ["f1cf0pyq", "f1q2ljzj"],
|
|
129
|
+
"r6j8yp": "fm5t4ci",
|
|
130
|
+
"w235jp": ["f1f04vxt", "f1bag0yd"],
|
|
131
|
+
"Bjm0d8m": "fxk9raq",
|
|
132
|
+
"jwfw70": ["f1bag0yd", "f1f04vxt"]
|
|
133
|
+
},
|
|
134
|
+
"states": {
|
|
135
|
+
"Bi91k9c": "feu1g3u",
|
|
136
|
+
"Jwef8y": "f1knas48",
|
|
137
|
+
"Bgoe8wy": "fvcxoqz",
|
|
138
|
+
"Bwzppfd": ["f1ub3y4t", "f1m52nbi"],
|
|
139
|
+
"oetu4i": "f1xlaoq0",
|
|
140
|
+
"gg5e9n": ["f1m52nbi", "f1ub3y4t"],
|
|
141
|
+
"lj723h": "f1g4hkjv",
|
|
142
|
+
"ecr2s2": "fb40n2d",
|
|
143
|
+
"B6oc9vd": "fvs00aa",
|
|
144
|
+
"ak43y8": ["f1assf6x", "f4ruux4"],
|
|
145
|
+
"wmxk5l": "fumykes",
|
|
146
|
+
"B50zh58": ["f4ruux4", "f1assf6x"]
|
|
147
|
+
},
|
|
148
|
+
"selected": {
|
|
149
|
+
"sj55zd": "f14nttnl",
|
|
150
|
+
"De3pzq": "f1nfm20t",
|
|
151
|
+
"g2u3we": "f1ly1fcm",
|
|
152
|
+
"h3c5rm": ["fi8bssc", "fj6btzu"],
|
|
153
|
+
"B9xav0g": "f1s9tnsa",
|
|
154
|
+
"zhjwy3": ["fj6btzu", "fi8bssc"]
|
|
155
|
+
},
|
|
156
|
+
"icon12": {
|
|
157
|
+
"Be2twd7": "f1ugzwwg"
|
|
158
|
+
},
|
|
159
|
+
"icon16": {
|
|
160
|
+
"Be2twd7": "f4ybsrx"
|
|
161
|
+
},
|
|
162
|
+
"icon20": {
|
|
163
|
+
"Be2twd7": "fe5j1ua"
|
|
164
|
+
},
|
|
165
|
+
"icon24": {
|
|
166
|
+
"Be2twd7": "f1rt2boy"
|
|
167
|
+
},
|
|
168
|
+
"icon28": {
|
|
169
|
+
"Be2twd7": "f24l1pt"
|
|
170
|
+
},
|
|
171
|
+
"icon32": {
|
|
172
|
+
"Be2twd7": "ffl51b"
|
|
173
|
+
},
|
|
174
|
+
"icon48": {
|
|
175
|
+
"Be2twd7": "f18m8u13"
|
|
176
|
+
},
|
|
177
|
+
"caption2Strong": {
|
|
178
|
+
"Bahqtrf": "fk6fouc",
|
|
179
|
+
"Be2twd7": "f13mqy1h",
|
|
180
|
+
"Bhrd7zp": "fl43uef",
|
|
181
|
+
"Bg96gwp": "fcpl73t"
|
|
182
|
+
},
|
|
183
|
+
"caption1Strong": {
|
|
184
|
+
"Bahqtrf": "fk6fouc",
|
|
185
|
+
"Be2twd7": "fy9rknc",
|
|
186
|
+
"Bhrd7zp": "fl43uef",
|
|
187
|
+
"Bg96gwp": "fwrc4pm"
|
|
188
|
+
},
|
|
189
|
+
"body1Strong": {
|
|
190
|
+
"Bahqtrf": "fk6fouc",
|
|
191
|
+
"Be2twd7": "fkhj508",
|
|
192
|
+
"Bhrd7zp": "fl43uef",
|
|
193
|
+
"Bg96gwp": "f1i3iumi"
|
|
194
|
+
},
|
|
195
|
+
"subtitle2": {
|
|
196
|
+
"Bahqtrf": "fk6fouc",
|
|
197
|
+
"Be2twd7": "fod5ikn",
|
|
198
|
+
"Bhrd7zp": "fl43uef",
|
|
199
|
+
"Bg96gwp": "faaz57k"
|
|
200
|
+
},
|
|
201
|
+
"subtitle1": {
|
|
202
|
+
"Bahqtrf": "fk6fouc",
|
|
203
|
+
"Be2twd7": "f1pp30po",
|
|
204
|
+
"Bhrd7zp": "fl43uef",
|
|
205
|
+
"Bg96gwp": "f106mvju"
|
|
206
|
+
},
|
|
207
|
+
"title3": {
|
|
208
|
+
"Bahqtrf": "fk6fouc",
|
|
209
|
+
"Be2twd7": "f1x0m3f5",
|
|
210
|
+
"Bhrd7zp": "fl43uef",
|
|
211
|
+
"Bg96gwp": "fb86gi6"
|
|
212
|
+
},
|
|
213
|
+
"borderThin": {
|
|
214
|
+
"B4j52fo": "f192inf7",
|
|
215
|
+
"Bekrc4i": ["f5tn483", "f1ojsxk5"],
|
|
216
|
+
"Bn0qgzm": "f1vxd6vx",
|
|
217
|
+
"ibv6hh": ["f1ojsxk5", "f5tn483"]
|
|
218
|
+
},
|
|
219
|
+
"borderThick": {
|
|
220
|
+
"B4j52fo": "f18zi460",
|
|
221
|
+
"Bekrc4i": ["f1wpluaz", "fsfsuhs"],
|
|
222
|
+
"Bn0qgzm": "fmklw6v",
|
|
223
|
+
"ibv6hh": ["fsfsuhs", "f1wpluaz"]
|
|
224
|
+
},
|
|
225
|
+
"borderThicker": {
|
|
226
|
+
"B4j52fo": "fgx37oo",
|
|
227
|
+
"Bekrc4i": ["f130t4y6", "f1efpmoh"],
|
|
228
|
+
"Bn0qgzm": "fv51ejd",
|
|
229
|
+
"ibv6hh": ["f1efpmoh", "f130t4y6"]
|
|
230
|
+
},
|
|
231
|
+
"borderThickest": {
|
|
232
|
+
"B4j52fo": "fwn6jck",
|
|
233
|
+
"Bekrc4i": ["figl7jc", "f1g0iy8l"],
|
|
234
|
+
"Bn0qgzm": "f1b8shu7",
|
|
235
|
+
"ibv6hh": ["f1g0iy8l", "figl7jc"]
|
|
236
|
+
}
|
|
237
|
+
}, {
|
|
238
|
+
"d": [".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f10pi13n{position:relative;}", ".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}", ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}", ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}", ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}", ".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f44pa96{color:transparent;}", ".f9sgzds.fui-focus-visible{border-top-color:transparent;}", ".fut1j4r.fui-focus-visible{border-right-color:transparent;}", ".fkf1fqv.fui-focus-visible{border-left-color:transparent;}", ".f1t0sa4d.fui-focus-visible{border-bottom-color:transparent;}", ".fikr5py.fui-focus-visible{outline-color:var(--colorStrokeFocus2);}", ".f1rsleix.fui-focus-visible{outline-width:var(--strokeWidthThick);}", ".fv9e16l.fui-focus-visible{outline-style:solid;}", ".f1y8129k.fui-focus-visible{border-top-width:var(--strokeWidthThick);}", ".fu21ej.fui-focus-visible{border-right-width:var(--strokeWidthThick);}", ".f1pmrd9z.fui-focus-visible{border-left-width:var(--strokeWidthThick);}", ".f1vgtxyk.fui-focus-visible{border-bottom-width:var(--strokeWidthThick);}", ".f1pah1tb.fui-focus-visible{border-top-style:solid;}", ".f1q2ljzj.fui-focus-visible{border-right-style:solid;}", ".f1cf0pyq.fui-focus-visible{border-left-style:solid;}", ".fgb2zbd.fui-focus-visible{border-bottom-style:solid;}", ".fm5t4ci.fui-focus-visible{border-top-color:var(--colorStrokeFocus2);}", ".f1f04vxt.fui-focus-visible{border-right-color:var(--colorStrokeFocus2);}", ".f1bag0yd.fui-focus-visible{border-left-color:var(--colorStrokeFocus2);}", ".fxk9raq.fui-focus-visible{border-bottom-color:var(--colorStrokeFocus2);}", ".f14nttnl{color:var(--colorNeutralForeground1Selected);}", ".f1nfm20t{background-color:var(--colorNeutralBackground1Selected);}", ".f1ly1fcm{border-top-color:var(--colorNeutralStroke1Selected);}", ".fi8bssc{border-right-color:var(--colorNeutralStroke1Selected);}", ".fj6btzu{border-left-color:var(--colorNeutralStroke1Selected);}", ".f1s9tnsa{border-bottom-color:var(--colorNeutralStroke1Selected);}", ".f1ugzwwg{font-size:12px;}", ".f4ybsrx{font-size:16px;}", ".fe5j1ua{font-size:20px;}", ".f1rt2boy{font-size:24px;}", ".f24l1pt{font-size:28px;}", ".ffl51b{font-size:32px;}", ".f18m8u13{font-size:48px;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f106mvju{line-height:var(--lineHeightBase500);}", ".f1x0m3f5{font-size:var(--fontSizeBase600);}", ".fb86gi6{line-height:var(--lineHeightBase600);}", ".f192inf7{border-top-width:var(--strokeWidthThin);}", ".f5tn483{border-right-width:var(--strokeWidthThin);}", ".f1ojsxk5{border-left-width:var(--strokeWidthThin);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".f18zi460{border-top-width:var(--strokeWidthThick);}", ".f1wpluaz{border-right-width:var(--strokeWidthThick);}", ".fsfsuhs{border-left-width:var(--strokeWidthThick);}", ".fmklw6v{border-bottom-width:var(--strokeWidthThick);}", ".fgx37oo{border-top-width:var(--strokeWidthThicker);}", ".f130t4y6{border-right-width:var(--strokeWidthThicker);}", ".f1efpmoh{border-left-width:var(--strokeWidthThicker);}", ".fv51ejd{border-bottom-width:var(--strokeWidthThicker);}", ".fwn6jck{border-top-width:var(--strokeWidthThickest);}", ".figl7jc{border-right-width:var(--strokeWidthThickest);}", ".f1g0iy8l{border-left-width:var(--strokeWidthThickest);}", ".f1b8shu7{border-bottom-width:var(--strokeWidthThickest);}"],
|
|
239
|
+
"m": [["@media (forced-colors: active){.fw33nwi{border-top-color:CanvasText;}}", {
|
|
240
|
+
"m": "(forced-colors: active)"
|
|
241
|
+
}], ["@media (forced-colors: active){.f1ptkjjm{border-right-color:CanvasText;}.fmzzjfk{border-left-color:CanvasText;}}", {
|
|
242
|
+
"m": "(forced-colors: active)"
|
|
243
|
+
}], ["@media (forced-colors: active){.f15j0dln{border-bottom-color:CanvasText;}}", {
|
|
244
|
+
"m": "(forced-colors: active)"
|
|
245
|
+
}], ["@media (forced-colors: active){.fmzzjfk{border-left-color:CanvasText;}.f1ptkjjm{border-right-color:CanvasText;}}", {
|
|
246
|
+
"m": "(forced-colors: active)"
|
|
247
|
+
}]],
|
|
248
|
+
"f": [".ftqa4ok:focus{outline-style:none;}"],
|
|
249
|
+
"i": [".f2hkw1w:focus-visible{outline-style:none;}"],
|
|
250
|
+
"h": [".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fvcxoqz:hover{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1ub3y4t:hover{border-right-color:var(--colorNeutralStroke1Hover);}", ".f1m52nbi:hover{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1xlaoq0:hover{border-bottom-color:var(--colorNeutralStroke1Hover);}"],
|
|
251
|
+
"a": [".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}", ".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".fvs00aa:active{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1assf6x:active{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f4ruux4:active{border-left-color:var(--colorNeutralStroke1Pressed);}", ".fumykes:active{border-bottom-color:var(--colorNeutralStroke1Pressed);}"]
|
|
252
|
+
});
|
|
253
|
+
/**
|
|
254
|
+
* Apply styling to the AvatarGroupPopover slots based on the state
|
|
255
|
+
*/
|
|
256
|
+
|
|
257
|
+
|
|
258
|
+
const useAvatarGroupPopoverStyles_unstable = state => {
|
|
259
|
+
const {
|
|
260
|
+
indicator,
|
|
261
|
+
size,
|
|
262
|
+
layout,
|
|
263
|
+
popoverOpen
|
|
264
|
+
} = state;
|
|
265
|
+
const sizeStyles = useAvatarStyles_1.useSizeStyles();
|
|
266
|
+
const triggerButtonStyles = useTriggerButtonStyles();
|
|
267
|
+
const contentStyles = useContentStyles();
|
|
268
|
+
const popoverSurfaceStyles = usePopoverSurfaceStyles();
|
|
269
|
+
const groupChildClassName = useAvatarGroupItemStyles_1.useGroupChildClassName(layout, size, true);
|
|
270
|
+
const triggerButtonClasses = [];
|
|
271
|
+
|
|
272
|
+
if (size < 36) {
|
|
273
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThin);
|
|
274
|
+
} else if (size < 56) {
|
|
275
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThick);
|
|
276
|
+
} else if (size < 72) {
|
|
277
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThicker);
|
|
278
|
+
} else {
|
|
279
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThickest);
|
|
280
|
+
}
|
|
281
|
+
|
|
282
|
+
if (indicator === 'count') {
|
|
283
|
+
if (size <= 24) {
|
|
284
|
+
triggerButtonClasses.push(triggerButtonStyles.caption2Strong);
|
|
285
|
+
} else if (size <= 28) {
|
|
286
|
+
triggerButtonClasses.push(triggerButtonStyles.caption1Strong);
|
|
287
|
+
} else if (size <= 40) {
|
|
288
|
+
triggerButtonClasses.push(triggerButtonStyles.body1Strong);
|
|
289
|
+
} else if (size <= 56) {
|
|
290
|
+
triggerButtonClasses.push(triggerButtonStyles.subtitle2);
|
|
291
|
+
} else if (size <= 96) {
|
|
292
|
+
triggerButtonClasses.push(triggerButtonStyles.subtitle1);
|
|
293
|
+
} else {
|
|
294
|
+
triggerButtonClasses.push(triggerButtonStyles.title3);
|
|
295
|
+
}
|
|
296
|
+
} else {
|
|
297
|
+
if (size <= 16) {
|
|
298
|
+
triggerButtonClasses.push(triggerButtonStyles.icon12);
|
|
299
|
+
} else if (size <= 24) {
|
|
300
|
+
triggerButtonClasses.push(triggerButtonStyles.icon16);
|
|
301
|
+
} else if (size <= 40) {
|
|
302
|
+
triggerButtonClasses.push(triggerButtonStyles.icon20);
|
|
303
|
+
} else if (size <= 48) {
|
|
304
|
+
triggerButtonClasses.push(triggerButtonStyles.icon24);
|
|
305
|
+
} else if (size <= 56) {
|
|
306
|
+
triggerButtonClasses.push(triggerButtonStyles.icon28);
|
|
307
|
+
} else if (size <= 72) {
|
|
308
|
+
triggerButtonClasses.push(triggerButtonStyles.icon32);
|
|
309
|
+
} else {
|
|
310
|
+
triggerButtonClasses.push(triggerButtonStyles.icon48);
|
|
311
|
+
}
|
|
312
|
+
}
|
|
313
|
+
|
|
314
|
+
state.triggerButton.className = react_1.mergeClasses(exports.avatarGroupPopoverClassNames.triggerButton, groupChildClassName, sizeStyles[size], triggerButtonStyles.base, layout === 'pie' && triggerButtonStyles.pie, layout === 'pie' && triggerButtonStyles.pieFocusIndicator, layout !== 'pie' && triggerButtonStyles.focusIndicator, layout !== 'pie' && triggerButtonStyles.states, layout !== 'pie' && popoverOpen && triggerButtonStyles.selected, ...triggerButtonClasses, state.triggerButton.className);
|
|
315
|
+
state.content.className = react_1.mergeClasses(exports.avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);
|
|
316
|
+
state.popoverSurface.className = react_1.mergeClasses(exports.avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);
|
|
317
|
+
return state;
|
|
318
|
+
};
|
|
319
|
+
|
|
320
|
+
exports.useAvatarGroupPopoverStyles_unstable = useAvatarGroupPopoverStyles_unstable;
|
|
321
|
+
//# sourceMappingURL=useAvatarGroupPopoverStyles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/AvatarGroupPopover/useAvatarGroupPopoverStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles';\nimport type { AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupPopoverClassNames: SlotClassNames<AvatarGroupPopoverSlots> = {\n root: 'fui-AvatarGroupPopover',\n content: 'fui-AvatarGroupPopover__content',\n popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',\n tooltip: 'fui-AvatarGroupPopover__tooltip',\n triggerButton: 'fui-AvatarGroupPopover__triggerButton',\n};\n\n/**\n * Styles for the content slot.\n */\nconst useContentStyles = makeStyles({\n base: {\n listStyleType: 'none',\n ...shorthands.margin('0'),\n ...shorthands.padding('0'),\n },\n});\n\n/**\n * Styles for the popoverSurface slot.\n */\nconst usePopoverSurfaceStyles = makeStyles({\n base: {\n maxHeight: '220px',\n minHeight: '80px',\n ...shorthands.overflow('hidden', 'scroll'),\n ...shorthands.padding(tokens.spacingVerticalS, tokens.spacingHorizontalS),\n width: '220px',\n },\n});\n\n/**\n * Styles for the triggerButton slot.\n */\nconst useTriggerButtonStyles = makeStyles({\n base: {\n display: 'inline-flex',\n position: 'relative',\n flexShrink: 0,\n justifyContent: 'center',\n alignItems: 'center',\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderRadius(tokens.borderRadiusCircular),\n ...shorthands.borderStyle('solid'),\n ...shorthands.padding(0),\n\n // Match color to Avatar's outline color.\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('CanvasText'),\n },\n },\n\n pie: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor(tokens.colorTransparentStroke),\n color: 'transparent',\n },\n\n // These styles match the default button styles.\n focusIndicator: createCustomFocusIndicatorStyle({\n ...shorthands.borderColor('transparent'),\n outlineColor: tokens.colorStrokeFocus2,\n outlineWidth: tokens.strokeWidthThick,\n outlineStyle: 'solid',\n }),\n\n // This custom focus indicator is required for the pie layout due to the clip-path applied to the root\n pieFocusIndicator: createCustomFocusIndicatorStyle({\n ...shorthands.border(tokens.strokeWidthThick, 'solid', tokens.colorStrokeFocus2),\n }),\n\n states: {\n '&:hover': {\n color: tokens.colorNeutralForeground1Hover,\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n },\n '&:active': {\n color: tokens.colorNeutralForeground1Pressed,\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n },\n },\n\n selected: {\n color: tokens.colorNeutralForeground1Selected,\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n },\n\n icon12: { fontSize: '12px' },\n icon16: { fontSize: '16px' },\n icon20: { fontSize: '20px' },\n icon24: { fontSize: '24px' },\n icon28: { fontSize: '28px' },\n icon32: { fontSize: '32px' },\n icon48: { fontSize: '48px' },\n caption2Strong: { ...typographyStyles.caption2Strong },\n caption1Strong: { ...typographyStyles.caption1Strong },\n body1Strong: { ...typographyStyles.body1Strong },\n subtitle2: { ...typographyStyles.subtitle2 },\n subtitle1: { ...typographyStyles.subtitle1 },\n title3: { ...typographyStyles.title3 },\n borderThin: { ...shorthands.borderWidth(tokens.strokeWidthThin) },\n borderThick: { ...shorthands.borderWidth(tokens.strokeWidthThick) },\n borderThicker: { ...shorthands.borderWidth(tokens.strokeWidthThicker) },\n borderThickest: { ...shorthands.borderWidth(tokens.strokeWidthThickest) },\n});\n\n/**\n * Apply styling to the AvatarGroupPopover slots based on the state\n */\nexport const useAvatarGroupPopoverStyles_unstable = (state: AvatarGroupPopoverState): AvatarGroupPopoverState => {\n const { indicator, size, layout, popoverOpen } = state;\n const sizeStyles = useSizeStyles();\n const triggerButtonStyles = useTriggerButtonStyles();\n const contentStyles = useContentStyles();\n const popoverSurfaceStyles = usePopoverSurfaceStyles();\n const groupChildClassName = useGroupChildClassName(layout, size, true);\n\n const triggerButtonClasses = [];\n\n if (size < 36) {\n triggerButtonClasses.push(triggerButtonStyles.borderThin);\n } else if (size < 56) {\n triggerButtonClasses.push(triggerButtonStyles.borderThick);\n } else if (size < 72) {\n triggerButtonClasses.push(triggerButtonStyles.borderThicker);\n } else {\n triggerButtonClasses.push(triggerButtonStyles.borderThickest);\n }\n\n if (indicator === 'count') {\n if (size <= 24) {\n triggerButtonClasses.push(triggerButtonStyles.caption2Strong);\n } else if (size <= 28) {\n triggerButtonClasses.push(triggerButtonStyles.caption1Strong);\n } else if (size <= 40) {\n triggerButtonClasses.push(triggerButtonStyles.body1Strong);\n } else if (size <= 56) {\n triggerButtonClasses.push(triggerButtonStyles.subtitle2);\n } else if (size <= 96) {\n triggerButtonClasses.push(triggerButtonStyles.subtitle1);\n } else {\n triggerButtonClasses.push(triggerButtonStyles.title3);\n }\n } else {\n if (size <= 16) {\n triggerButtonClasses.push(triggerButtonStyles.icon12);\n } else if (size <= 24) {\n triggerButtonClasses.push(triggerButtonStyles.icon16);\n } else if (size <= 40) {\n triggerButtonClasses.push(triggerButtonStyles.icon20);\n } else if (size <= 48) {\n triggerButtonClasses.push(triggerButtonStyles.icon24);\n } else if (size <= 56) {\n triggerButtonClasses.push(triggerButtonStyles.icon28);\n } else if (size <= 72) {\n triggerButtonClasses.push(triggerButtonStyles.icon32);\n } else {\n triggerButtonClasses.push(triggerButtonStyles.icon48);\n }\n }\n\n state.triggerButton.className = mergeClasses(\n avatarGroupPopoverClassNames.triggerButton,\n groupChildClassName,\n sizeStyles[size],\n triggerButtonStyles.base,\n layout === 'pie' && triggerButtonStyles.pie,\n layout === 'pie' && triggerButtonStyles.pieFocusIndicator,\n layout !== 'pie' && triggerButtonStyles.focusIndicator,\n layout !== 'pie' && triggerButtonStyles.states,\n layout !== 'pie' && popoverOpen && triggerButtonStyles.selected,\n ...triggerButtonClasses,\n state.triggerButton.className,\n );\n\n state.content.className = mergeClasses(\n avatarGroupPopoverClassNames.content,\n contentStyles.base,\n state.content.className,\n );\n\n state.popoverSurface.className = mergeClasses(\n avatarGroupPopoverClassNames.popoverSurface,\n popoverSurfaceStyles.base,\n state.popoverSurface.className,\n );\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -3,14 +3,20 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.AvatarGroupContext = void 0;
|
|
6
|
+
exports.useAvatarGroupContext_unstable = exports.AvatarGroupProvider = exports.AvatarGroupContext = void 0;
|
|
7
7
|
|
|
8
8
|
const react_context_selector_1 = /*#__PURE__*/require("@fluentui/react-context-selector");
|
|
9
9
|
/**
|
|
10
|
-
* AvatarGroupContext is provided by AvatarGroup
|
|
10
|
+
* AvatarGroupContext is provided by AvatarGroup and AvatarGroupPopover. It's consumed by AvatarGroupItem to determine
|
|
11
|
+
* default values of some props.
|
|
11
12
|
*/
|
|
12
|
-
// eslint-disable-next-line @fluentui/no-context-default-value
|
|
13
13
|
|
|
14
14
|
|
|
15
|
-
exports.AvatarGroupContext = /*#__PURE__*/react_context_selector_1.createContext(
|
|
15
|
+
exports.AvatarGroupContext = /*#__PURE__*/react_context_selector_1.createContext(undefined);
|
|
16
|
+
const avatarGroupContextDefaultValue = {};
|
|
17
|
+
exports.AvatarGroupProvider = exports.AvatarGroupContext.Provider;
|
|
18
|
+
|
|
19
|
+
const useAvatarGroupContext_unstable = selector => react_context_selector_1.useContextSelector(exports.AvatarGroupContext, (ctx = avatarGroupContextDefaultValue) => selector(ctx));
|
|
20
|
+
|
|
21
|
+
exports.useAvatarGroupContext_unstable = useAvatarGroupContext_unstable;
|
|
16
22
|
//# sourceMappingURL=AvatarGroupContext.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["contexts/AvatarGroupContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;AAIA
|
|
1
|
+
{"version":3,"sources":["contexts/AvatarGroupContext.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,wBAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;AAIA;;;AAGG;;;AACU,OAAA,CAAA,kBAAA,gBAAuD,wBAAA,CAAA,aAAA,CAClE,SADkE,CAAvD;AAIb,MAAM,8BAA8B,GAA4B,EAAhE;AAEa,OAAA,CAAA,mBAAA,GAAsB,OAAA,CAAA,kBAAA,CAAmB,QAAzC;;AAEN,MAAM,8BAA8B,GAAO,QAAJ,IAC5C,wBAAA,CAAA,kBAAA,CAAmB,OAAA,CAAA,kBAAnB,EAAuC,CAAC,GAAG,GAAG,8BAAP,KAA0C,QAAQ,CAAC,GAAD,CAAzF,CADK;;AAAM,OAAA,CAAA,8BAAA,GAA8B,8BAA9B","sourcesContent":["import { createContext, useContextSelector, ContextSelector } from '@fluentui/react-context-selector';\nimport type { Context } from '@fluentui/react-context-selector';\nimport type { AvatarGroupContextValue } from '../AvatarGroup';\n\n/**\n * AvatarGroupContext is provided by AvatarGroup and AvatarGroupPopover. It's consumed by AvatarGroupItem to determine\n * default values of some props.\n */\nexport const AvatarGroupContext: Context<AvatarGroupContextValue> = createContext<AvatarGroupContextValue | undefined>(\n undefined,\n) as Context<AvatarGroupContextValue>;\n\nconst avatarGroupContextDefaultValue: AvatarGroupContextValue = {};\n\nexport const AvatarGroupProvider = AvatarGroupContext.Provider;\n\nexport const useAvatarGroupContext_unstable = <T>(selector: ContextSelector<AvatarGroupContextValue, T>): T =>\n useContextSelector(AvatarGroupContext, (ctx = avatarGroupContextDefaultValue) => selector(ctx));\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -3,9 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.useAvatarGroupItem_unstable = exports.useAvatarGroupItemStyles_unstable = exports.renderAvatarGroupItem_unstable = exports.avatarGroupItemClassNames = exports.AvatarGroupItem = exports.useAvatarGroup_unstable = exports.useAvatarGroupStyles_unstable = exports.renderAvatarGroup_unstable = exports.avatarGroupClassNames = exports.AvatarGroup = exports.getInitials = exports.useAvatar_unstable = exports.useAvatarStyles_unstable = exports.renderAvatar_unstable = exports.avatarClassNames = exports.Avatar = void 0;
|
|
7
|
-
|
|
8
|
-
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
6
|
+
exports.useAvatarGroupContext_unstable = exports.AvatarGroupProvider = exports.useAvatarGroupPopover_unstable = exports.useAvatarGroupPopoverStyles_unstable = exports.renderAvatarGroupPopover_unstable = exports.avatarGroupPopoverClassNames = exports.AvatarGroupPopover = exports.useAvatarGroupItem_unstable = exports.useAvatarGroupItemStyles_unstable = exports.renderAvatarGroupItem_unstable = exports.avatarGroupItemClassNames = exports.AvatarGroupItem = exports.useAvatarGroup_unstable = exports.useAvatarGroupStyles_unstable = exports.useAvatarGroupContextValues = exports.renderAvatarGroup_unstable = exports.avatarGroupClassNames = exports.AvatarGroup = exports.partitionAvatarGroupItems = exports.getInitials = exports.useAvatar_unstable = exports.useAvatarStyles_unstable = exports.renderAvatar_unstable = exports.avatarClassNames = exports.Avatar = void 0;
|
|
9
7
|
|
|
10
8
|
var Avatar_1 = /*#__PURE__*/require("./Avatar");
|
|
11
9
|
|
|
@@ -48,6 +46,12 @@ Object.defineProperty(exports, "getInitials", {
|
|
|
48
46
|
return index_1.getInitials;
|
|
49
47
|
}
|
|
50
48
|
});
|
|
49
|
+
Object.defineProperty(exports, "partitionAvatarGroupItems", {
|
|
50
|
+
enumerable: true,
|
|
51
|
+
get: function () {
|
|
52
|
+
return index_1.partitionAvatarGroupItems;
|
|
53
|
+
}
|
|
54
|
+
});
|
|
51
55
|
|
|
52
56
|
var AvatarGroup_1 = /*#__PURE__*/require("./AvatarGroup");
|
|
53
57
|
|
|
@@ -69,6 +73,12 @@ Object.defineProperty(exports, "renderAvatarGroup_unstable", {
|
|
|
69
73
|
return AvatarGroup_1.renderAvatarGroup_unstable;
|
|
70
74
|
}
|
|
71
75
|
});
|
|
76
|
+
Object.defineProperty(exports, "useAvatarGroupContextValues", {
|
|
77
|
+
enumerable: true,
|
|
78
|
+
get: function () {
|
|
79
|
+
return AvatarGroup_1.useAvatarGroupContextValues;
|
|
80
|
+
}
|
|
81
|
+
});
|
|
72
82
|
Object.defineProperty(exports, "useAvatarGroupStyles_unstable", {
|
|
73
83
|
enumerable: true,
|
|
74
84
|
get: function () {
|
|
@@ -115,5 +125,51 @@ Object.defineProperty(exports, "useAvatarGroupItem_unstable", {
|
|
|
115
125
|
}
|
|
116
126
|
});
|
|
117
127
|
|
|
118
|
-
|
|
128
|
+
var AvatarGroupPopover_1 = /*#__PURE__*/require("./AvatarGroupPopover");
|
|
129
|
+
|
|
130
|
+
Object.defineProperty(exports, "AvatarGroupPopover", {
|
|
131
|
+
enumerable: true,
|
|
132
|
+
get: function () {
|
|
133
|
+
return AvatarGroupPopover_1.AvatarGroupPopover;
|
|
134
|
+
}
|
|
135
|
+
});
|
|
136
|
+
Object.defineProperty(exports, "avatarGroupPopoverClassNames", {
|
|
137
|
+
enumerable: true,
|
|
138
|
+
get: function () {
|
|
139
|
+
return AvatarGroupPopover_1.avatarGroupPopoverClassNames;
|
|
140
|
+
}
|
|
141
|
+
});
|
|
142
|
+
Object.defineProperty(exports, "renderAvatarGroupPopover_unstable", {
|
|
143
|
+
enumerable: true,
|
|
144
|
+
get: function () {
|
|
145
|
+
return AvatarGroupPopover_1.renderAvatarGroupPopover_unstable;
|
|
146
|
+
}
|
|
147
|
+
});
|
|
148
|
+
Object.defineProperty(exports, "useAvatarGroupPopoverStyles_unstable", {
|
|
149
|
+
enumerable: true,
|
|
150
|
+
get: function () {
|
|
151
|
+
return AvatarGroupPopover_1.useAvatarGroupPopoverStyles_unstable;
|
|
152
|
+
}
|
|
153
|
+
});
|
|
154
|
+
Object.defineProperty(exports, "useAvatarGroupPopover_unstable", {
|
|
155
|
+
enumerable: true,
|
|
156
|
+
get: function () {
|
|
157
|
+
return AvatarGroupPopover_1.useAvatarGroupPopover_unstable;
|
|
158
|
+
}
|
|
159
|
+
});
|
|
160
|
+
|
|
161
|
+
var index_2 = /*#__PURE__*/require("./contexts/index");
|
|
162
|
+
|
|
163
|
+
Object.defineProperty(exports, "AvatarGroupProvider", {
|
|
164
|
+
enumerable: true,
|
|
165
|
+
get: function () {
|
|
166
|
+
return index_2.AvatarGroupProvider;
|
|
167
|
+
}
|
|
168
|
+
});
|
|
169
|
+
Object.defineProperty(exports, "useAvatarGroupContext_unstable", {
|
|
170
|
+
enumerable: true,
|
|
171
|
+
get: function () {
|
|
172
|
+
return index_2.useAvatarGroupContext_unstable;
|
|
173
|
+
}
|
|
174
|
+
});
|
|
119
175
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["index.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"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","sourcesContent":["export {\n Avatar,\n avatarClassNames,\n renderAvatar_unstable,\n useAvatarStyles_unstable,\n useAvatar_unstable,\n} from './Avatar';\nexport type { AvatarNamedColor, AvatarProps, AvatarSlots, AvatarState, AvatarSizes } from './Avatar';\nexport { getInitials, partitionAvatarGroupItems } from './utils/index';\nexport type { PartitionAvatarGroupItemsOptions } from './utils/index';\nexport {\n AvatarGroup,\n avatarGroupClassNames,\n renderAvatarGroup_unstable,\n useAvatarGroupContextValues,\n useAvatarGroupStyles_unstable,\n useAvatarGroup_unstable,\n} from './AvatarGroup';\nexport type {\n AvatarGroupProps,\n AvatarGroupSlots,\n AvatarGroupState,\n AvatarGroupContextValue,\n AvatarGroupContextValues,\n} from './AvatarGroup';\nexport {\n AvatarGroupItem,\n avatarGroupItemClassNames,\n renderAvatarGroupItem_unstable,\n useAvatarGroupItemStyles_unstable,\n useAvatarGroupItem_unstable,\n} from './AvatarGroupItem';\nexport type { AvatarGroupItemProps, AvatarGroupItemSlots, AvatarGroupItemState } from './AvatarGroupItem';\nexport {\n AvatarGroupPopover,\n avatarGroupPopoverClassNames,\n renderAvatarGroupPopover_unstable,\n useAvatarGroupPopoverStyles_unstable,\n useAvatarGroupPopover_unstable,\n} from './AvatarGroupPopover';\nexport type { AvatarGroupPopoverProps, AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover';\nexport { AvatarGroupProvider, useAvatarGroupContext_unstable } from './contexts/index';\n"],"sourceRoot":"../src/"}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.getInitials = void 0;
|
|
6
|
+
exports.partitionAvatarGroupItems = exports.getInitials = void 0;
|
|
7
7
|
|
|
8
8
|
var getInitials_1 = /*#__PURE__*/require("./getInitials");
|
|
9
9
|
|
|
@@ -13,4 +13,13 @@ Object.defineProperty(exports, "getInitials", {
|
|
|
13
13
|
return getInitials_1.getInitials;
|
|
14
14
|
}
|
|
15
15
|
});
|
|
16
|
+
|
|
17
|
+
var partitionAvatarGroupItems_1 = /*#__PURE__*/require("./partitionAvatarGroupItems");
|
|
18
|
+
|
|
19
|
+
Object.defineProperty(exports, "partitionAvatarGroupItems", {
|
|
20
|
+
enumerable: true,
|
|
21
|
+
get: function () {
|
|
22
|
+
return partitionAvatarGroupItems_1.partitionAvatarGroupItems;
|
|
23
|
+
}
|
|
24
|
+
});
|
|
16
25
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["utils/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,aAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,aAAA,CAAA,WAAA;EAAW;AAAX,CAAA","sourcesContent":["export { getInitials } from './getInitials';\n"],"sourceRoot":"../src/"}
|
|
1
|
+
{"version":3,"sources":["utils/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,aAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,aAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,aAAA,CAAA,WAAA;EAAW;AAAX,CAAA;;AACT,IAAA,2BAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,2BAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA","sourcesContent":["export { getInitials } from './getInitials';\nexport { partitionAvatarGroupItems } from './partitionAvatarGroupItems';\nexport type { PartitionAvatarGroupItemsOptions } from './partitionAvatarGroupItems';\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.partitionAvatarGroupItems = void 0;
|
|
7
|
+
/**
|
|
8
|
+
* Get the inline items and overflowing items based on the array of AvatarGroupItems needed for AvatarGroup.
|
|
9
|
+
*
|
|
10
|
+
* @param options - Configure the partition options
|
|
11
|
+
*
|
|
12
|
+
* @returns Two arrays split into inline items and overflow items based on maxInlineItems.
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
const partitionAvatarGroupItems = options => {
|
|
16
|
+
var _a;
|
|
17
|
+
|
|
18
|
+
const {
|
|
19
|
+
items
|
|
20
|
+
} = options;
|
|
21
|
+
const isPie = options.layout === 'pie';
|
|
22
|
+
|
|
23
|
+
if (isPie) {
|
|
24
|
+
return {
|
|
25
|
+
inlineItems: items.slice(0, 3),
|
|
26
|
+
overflowItems: items
|
|
27
|
+
};
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
const maxInlineItems = (_a = options.maxInlineItems) !== null && _a !== void 0 ? _a : 5;
|
|
31
|
+
const inlineCount = -(maxInlineItems - (items.length > maxInlineItems ? 1 : 0));
|
|
32
|
+
return {
|
|
33
|
+
inlineItems: items.slice(inlineCount),
|
|
34
|
+
overflowItems: items.slice(0, inlineCount)
|
|
35
|
+
};
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
exports.partitionAvatarGroupItems = partitionAvatarGroupItems;
|
|
39
|
+
//# sourceMappingURL=partitionAvatarGroupItems.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["utils/partitionAvatarGroupItems.ts"],"names":[],"mappings":";;;;;;AAMA;;;;;;AAMG;;AACI,MAAM,yBAAyB,GAAO,OAAJ,IAAoD;;;EAC3F,MAAM;IAAE;EAAF,IAAY,OAAlB;EACA,MAAM,KAAK,GAAG,OAAO,CAAC,MAAR,KAAmB,KAAjC;;EAEA,IAAI,KAAJ,EAAW;IACT,OAAO;MACL,WAAW,EAAE,KAAK,CAAC,KAAN,CAAY,CAAZ,EAAe,CAAf,CADR;MAEL,aAAa,EAAE;IAFV,CAAP;EAID;;EAED,MAAM,cAAc,GAAG,CAAA,EAAA,GAAA,OAAO,CAAC,cAAR,MAAsB,IAAtB,IAAsB,EAAA,KAAA,KAAA,CAAtB,GAAsB,EAAtB,GAA0B,CAAjD;EACA,MAAM,WAAW,GAAG,EAAE,cAAc,IAAI,KAAK,CAAC,MAAN,GAAe,cAAf,GAAgC,CAAhC,GAAoC,CAAxC,CAAhB,CAApB;EAEA,OAAO;IACL,WAAW,EAAE,KAAK,CAAC,KAAN,CAAY,WAAZ,CADR;IAEL,aAAa,EAAE,KAAK,CAAC,KAAN,CAAY,CAAZ,EAAe,WAAf;EAFV,CAAP;AAID,CAlBM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","sourcesContent":["export type PartitionAvatarGroupItemsOptions<T> = {\n items: readonly T[];\n layout?: 'spread' | 'stack' | 'pie';\n maxInlineItems?: number;\n};\n\n/**\n * Get the inline items and overflowing items based on the array of AvatarGroupItems needed for AvatarGroup.\n *\n * @param options - Configure the partition options\n *\n * @returns Two arrays split into inline items and overflow items based on maxInlineItems.\n */\nexport const partitionAvatarGroupItems = <T>(options: PartitionAvatarGroupItemsOptions<T>) => {\n const { items } = options;\n const isPie = options.layout === 'pie';\n\n if (isPie) {\n return {\n inlineItems: items.slice(0, 3),\n overflowItems: items,\n };\n }\n\n const maxInlineItems = options.maxInlineItems ?? 5;\n const inlineCount = -(maxInlineItems - (items.length > maxInlineItems ? 1 : 0));\n\n return {\n inlineItems: items.slice(inlineCount),\n overflowItems: items.slice(0, inlineCount),\n };\n};\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-avatar",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.1.1",
|
|
4
4
|
"description": "React components for building Microsoft web experiences.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -19,30 +19,32 @@
|
|
|
19
19
|
"just": "just-scripts",
|
|
20
20
|
"lint": "just-scripts lint",
|
|
21
21
|
"start": "yarn storybook",
|
|
22
|
+
"e2e": "yarn cypress run --component",
|
|
23
|
+
"e2e:local": "yarn cypress open --component",
|
|
22
24
|
"test": "jest --passWithNoTests",
|
|
23
25
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
|
24
26
|
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/types/packages/react-components/react-avatar/src && yarn docs",
|
|
25
|
-
"storybook": "
|
|
27
|
+
"storybook": "start-storybook",
|
|
26
28
|
"type-check": "tsc -b tsconfig.json"
|
|
27
29
|
},
|
|
28
30
|
"devDependencies": {
|
|
29
31
|
"@fluentui/eslint-plugin": "*",
|
|
30
32
|
"@fluentui/react-conformance": "*",
|
|
31
|
-
"@fluentui/react-conformance-griffel": "9.0.0-beta.
|
|
33
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.14",
|
|
32
34
|
"@fluentui/scripts": "^1.0.0",
|
|
33
35
|
"es6-weak-map": "^2.0.2"
|
|
34
36
|
},
|
|
35
37
|
"dependencies": {
|
|
36
|
-
"@fluentui/react-badge": "^9.0.
|
|
37
|
-
"@fluentui/react-context-selector": "^9.0.
|
|
38
|
+
"@fluentui/react-badge": "^9.0.6",
|
|
39
|
+
"@fluentui/react-context-selector": "^9.0.3",
|
|
38
40
|
"@fluentui/react-icons": "^2.0.175",
|
|
39
|
-
"@fluentui/react-popover": "^9.
|
|
40
|
-
"@fluentui/react-shared-contexts": "^9.0.
|
|
41
|
-
"@fluentui/react-tabster": "^9.1.
|
|
42
|
-
"@fluentui/react-theme": "^9.
|
|
43
|
-
"@fluentui/react-tooltip": "^9.0.
|
|
44
|
-
"@fluentui/react-utilities": "^9.0
|
|
45
|
-
"@griffel/react": "^1.
|
|
41
|
+
"@fluentui/react-popover": "^9.1.1",
|
|
42
|
+
"@fluentui/react-shared-contexts": "^9.0.1",
|
|
43
|
+
"@fluentui/react-tabster": "^9.1.1",
|
|
44
|
+
"@fluentui/react-theme": "^9.1.0",
|
|
45
|
+
"@fluentui/react-tooltip": "^9.0.6",
|
|
46
|
+
"@fluentui/react-utilities": "^9.1.0",
|
|
47
|
+
"@griffel/react": "^1.3.0",
|
|
46
48
|
"tslib": "^2.1.0"
|
|
47
49
|
},
|
|
48
50
|
"peerDependencies": {
|