@fluentui/react-avatar 9.8.7 → 9.9.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.md +30 -2
- package/lib/Avatar.js.map +1 -1
- package/lib/AvatarGroup.js.map +1 -1
- package/lib/AvatarGroupItem.js.map +1 -1
- package/lib/AvatarGroupPopover.js.map +1 -1
- package/lib/components/Avatar/Avatar.js.map +1 -1
- package/lib/components/Avatar/Avatar.types.js.map +1 -1
- package/lib/components/Avatar/index.js.map +1 -1
- package/lib/components/Avatar/renderAvatar.js.map +1 -1
- package/lib/components/Avatar/useAvatar.js.map +1 -1
- package/lib/components/Avatar/useAvatarStyles.styles.raw.js +702 -0
- package/lib/components/Avatar/useAvatarStyles.styles.raw.js.map +1 -0
- 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.map +1 -1
- package/lib/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroupStyles.styles.raw.js +31 -0
- package/lib/components/AvatarGroup/useAvatarGroupStyles.styles.raw.js.map +1 -0
- package/lib/components/AvatarGroupItem/AvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/AvatarGroupItem.types.js.map +1 -1
- package/lib/components/AvatarGroupItem/index.js.map +1 -1
- package/lib/components/AvatarGroupItem/renderAvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.raw.js +266 -0
- package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.raw.js.map +1 -0
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map +1 -1
- package/lib/components/AvatarGroupPopover/index.js.map +1 -1
- package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js +188 -0
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js.map +1 -0
- package/lib/contexts/AvatarContext.js.map +1 -1
- package/lib/contexts/AvatarGroupContext.js.map +1 -1
- package/lib/contexts/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/getInitials.js.map +1 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/partitionAvatarGroupItems.js.map +1 -1
- package/lib-commonjs/Avatar.js.map +1 -1
- package/lib-commonjs/AvatarGroup.js.map +1 -1
- package/lib-commonjs/AvatarGroupItem.js.map +1 -1
- package/lib-commonjs/AvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/Avatar/Avatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/Avatar.types.js.map +1 -1
- package/lib-commonjs/components/Avatar/index.js.map +1 -1
- package/lib-commonjs/components/Avatar/renderAvatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatarStyles.styles.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatarStyles.styles.raw.js +723 -0
- package/lib-commonjs/components/Avatar/useAvatarStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.styles.raw.js +47 -0
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/renderAvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.raw.js +282 -0
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js +204 -0
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/contexts/AvatarContext.js.map +1 -1
- package/lib-commonjs/contexts/AvatarGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/getInitials.js.map +1 -1
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/partitionAvatarGroupItems.js.map +1 -1
- package/package.json +8 -8
|
@@ -0,0 +1,204 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
|
3
|
+
value: true
|
|
4
|
+
});
|
|
5
|
+
function _export(target, all) {
|
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: all[name]
|
|
9
|
+
});
|
|
10
|
+
}
|
|
11
|
+
_export(exports, {
|
|
12
|
+
avatarGroupPopoverClassNames: function() {
|
|
13
|
+
return avatarGroupPopoverClassNames;
|
|
14
|
+
},
|
|
15
|
+
useAvatarGroupPopoverStyles_unstable: function() {
|
|
16
|
+
return useAvatarGroupPopoverStyles_unstable;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
const _reacttabster = require("@fluentui/react-tabster");
|
|
20
|
+
const _react = require("@griffel/react");
|
|
21
|
+
const _reacttheme = require("@fluentui/react-theme");
|
|
22
|
+
const _useAvatarGroupItemStylesstyles = require("../AvatarGroupItem/useAvatarGroupItemStyles.styles");
|
|
23
|
+
const _useAvatarStylesstyles = require("../Avatar/useAvatarStyles.styles");
|
|
24
|
+
const avatarGroupPopoverClassNames = {
|
|
25
|
+
root: 'fui-AvatarGroupPopover',
|
|
26
|
+
content: 'fui-AvatarGroupPopover__content',
|
|
27
|
+
popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',
|
|
28
|
+
tooltip: 'fui-AvatarGroupPopover__tooltip',
|
|
29
|
+
triggerButton: 'fui-AvatarGroupPopover__triggerButton'
|
|
30
|
+
};
|
|
31
|
+
/**
|
|
32
|
+
* Styles for the content slot.
|
|
33
|
+
*/ const useContentStyles = (0, _react.makeStyles)({
|
|
34
|
+
base: {
|
|
35
|
+
listStyleType: 'none',
|
|
36
|
+
margin: '0',
|
|
37
|
+
padding: '0',
|
|
38
|
+
display: 'flex',
|
|
39
|
+
flexDirection: 'column'
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
/**
|
|
43
|
+
* Styles for the popoverSurface slot.
|
|
44
|
+
*/ const usePopoverSurfaceStyles = (0, _react.makeStyles)({
|
|
45
|
+
base: {
|
|
46
|
+
maxHeight: '220px',
|
|
47
|
+
minHeight: '80px',
|
|
48
|
+
overflow: 'hidden scroll',
|
|
49
|
+
padding: `${_reacttheme.tokens.spacingVerticalS} ${_reacttheme.tokens.spacingHorizontalS}`,
|
|
50
|
+
width: '220px'
|
|
51
|
+
}
|
|
52
|
+
});
|
|
53
|
+
/**
|
|
54
|
+
* Styles for the triggerButton slot.
|
|
55
|
+
*/ const useTriggerButtonStyles = (0, _react.makeStyles)({
|
|
56
|
+
base: {
|
|
57
|
+
display: 'inline-flex',
|
|
58
|
+
position: 'relative',
|
|
59
|
+
flexShrink: 0,
|
|
60
|
+
justifyContent: 'center',
|
|
61
|
+
alignItems: 'center',
|
|
62
|
+
color: _reacttheme.tokens.colorNeutralForeground1,
|
|
63
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1,
|
|
64
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStroke1),
|
|
65
|
+
borderRadius: _reacttheme.tokens.borderRadiusCircular,
|
|
66
|
+
..._react.shorthands.borderStyle('solid'),
|
|
67
|
+
padding: '0',
|
|
68
|
+
// Match color to Avatar's outline color.
|
|
69
|
+
'@media (forced-colors: active)': {
|
|
70
|
+
..._react.shorthands.borderColor('CanvasText')
|
|
71
|
+
}
|
|
72
|
+
},
|
|
73
|
+
pie: {
|
|
74
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
|
75
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorTransparentStroke),
|
|
76
|
+
color: 'transparent'
|
|
77
|
+
},
|
|
78
|
+
focusIndicator: (0, _reacttabster.createCustomFocusIndicatorStyle)({
|
|
79
|
+
border: `${_reacttheme.tokens.strokeWidthThick} solid ${_reacttheme.tokens.colorStrokeFocus2}`,
|
|
80
|
+
outlineStyle: 'none'
|
|
81
|
+
}),
|
|
82
|
+
states: {
|
|
83
|
+
'&:hover': {
|
|
84
|
+
color: _reacttheme.tokens.colorNeutralForeground1Hover,
|
|
85
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1Hover,
|
|
86
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStroke1Hover)
|
|
87
|
+
},
|
|
88
|
+
'&:active': {
|
|
89
|
+
color: _reacttheme.tokens.colorNeutralForeground1Pressed,
|
|
90
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1Pressed,
|
|
91
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStroke1Pressed)
|
|
92
|
+
}
|
|
93
|
+
},
|
|
94
|
+
selected: {
|
|
95
|
+
color: _reacttheme.tokens.colorNeutralForeground1Selected,
|
|
96
|
+
backgroundColor: _reacttheme.tokens.colorNeutralBackground1Selected,
|
|
97
|
+
..._react.shorthands.borderColor(_reacttheme.tokens.colorNeutralStroke1Selected)
|
|
98
|
+
},
|
|
99
|
+
icon12: {
|
|
100
|
+
fontSize: '12px'
|
|
101
|
+
},
|
|
102
|
+
icon16: {
|
|
103
|
+
fontSize: '16px'
|
|
104
|
+
},
|
|
105
|
+
icon20: {
|
|
106
|
+
fontSize: '20px'
|
|
107
|
+
},
|
|
108
|
+
icon24: {
|
|
109
|
+
fontSize: '24px'
|
|
110
|
+
},
|
|
111
|
+
icon28: {
|
|
112
|
+
fontSize: '28px'
|
|
113
|
+
},
|
|
114
|
+
icon32: {
|
|
115
|
+
fontSize: '32px'
|
|
116
|
+
},
|
|
117
|
+
icon48: {
|
|
118
|
+
fontSize: '48px'
|
|
119
|
+
},
|
|
120
|
+
caption2Strong: {
|
|
121
|
+
..._reacttheme.typographyStyles.caption2Strong
|
|
122
|
+
},
|
|
123
|
+
caption1Strong: {
|
|
124
|
+
..._reacttheme.typographyStyles.caption1Strong
|
|
125
|
+
},
|
|
126
|
+
body1Strong: {
|
|
127
|
+
..._reacttheme.typographyStyles.body1Strong
|
|
128
|
+
},
|
|
129
|
+
subtitle2: {
|
|
130
|
+
..._reacttheme.typographyStyles.subtitle2
|
|
131
|
+
},
|
|
132
|
+
subtitle1: {
|
|
133
|
+
..._reacttheme.typographyStyles.subtitle1
|
|
134
|
+
},
|
|
135
|
+
title3: {
|
|
136
|
+
..._reacttheme.typographyStyles.title3
|
|
137
|
+
},
|
|
138
|
+
borderThin: {
|
|
139
|
+
..._react.shorthands.borderWidth(_reacttheme.tokens.strokeWidthThin)
|
|
140
|
+
},
|
|
141
|
+
borderThick: {
|
|
142
|
+
..._react.shorthands.borderWidth(_reacttheme.tokens.strokeWidthThick)
|
|
143
|
+
},
|
|
144
|
+
borderThicker: {
|
|
145
|
+
..._react.shorthands.borderWidth(_reacttheme.tokens.strokeWidthThicker)
|
|
146
|
+
},
|
|
147
|
+
borderThickest: {
|
|
148
|
+
..._react.shorthands.borderWidth(_reacttheme.tokens.strokeWidthThickest)
|
|
149
|
+
}
|
|
150
|
+
});
|
|
151
|
+
const useAvatarGroupPopoverStyles_unstable = (state)=>{
|
|
152
|
+
'use no memo';
|
|
153
|
+
const { indicator, size, layout, popoverOpen } = state;
|
|
154
|
+
const sizeStyles = (0, _useAvatarStylesstyles.useSizeStyles)();
|
|
155
|
+
const triggerButtonStyles = useTriggerButtonStyles();
|
|
156
|
+
const contentStyles = useContentStyles();
|
|
157
|
+
const popoverSurfaceStyles = usePopoverSurfaceStyles();
|
|
158
|
+
const groupChildClassName = (0, _useAvatarGroupItemStylesstyles.useGroupChildClassName)(layout, size);
|
|
159
|
+
const triggerButtonClasses = [];
|
|
160
|
+
if (size < 36) {
|
|
161
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThin);
|
|
162
|
+
} else if (size < 56) {
|
|
163
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThick);
|
|
164
|
+
} else if (size < 72) {
|
|
165
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThicker);
|
|
166
|
+
} else {
|
|
167
|
+
triggerButtonClasses.push(triggerButtonStyles.borderThickest);
|
|
168
|
+
}
|
|
169
|
+
if (indicator === 'count') {
|
|
170
|
+
if (size <= 24) {
|
|
171
|
+
triggerButtonClasses.push(triggerButtonStyles.caption2Strong);
|
|
172
|
+
} else if (size <= 28) {
|
|
173
|
+
triggerButtonClasses.push(triggerButtonStyles.caption1Strong);
|
|
174
|
+
} else if (size <= 40) {
|
|
175
|
+
triggerButtonClasses.push(triggerButtonStyles.body1Strong);
|
|
176
|
+
} else if (size <= 56) {
|
|
177
|
+
triggerButtonClasses.push(triggerButtonStyles.subtitle2);
|
|
178
|
+
} else if (size <= 96) {
|
|
179
|
+
triggerButtonClasses.push(triggerButtonStyles.subtitle1);
|
|
180
|
+
} else {
|
|
181
|
+
triggerButtonClasses.push(triggerButtonStyles.title3);
|
|
182
|
+
}
|
|
183
|
+
} else {
|
|
184
|
+
if (size <= 16) {
|
|
185
|
+
triggerButtonClasses.push(triggerButtonStyles.icon12);
|
|
186
|
+
} else if (size <= 24) {
|
|
187
|
+
triggerButtonClasses.push(triggerButtonStyles.icon16);
|
|
188
|
+
} else if (size <= 40) {
|
|
189
|
+
triggerButtonClasses.push(triggerButtonStyles.icon20);
|
|
190
|
+
} else if (size <= 48) {
|
|
191
|
+
triggerButtonClasses.push(triggerButtonStyles.icon24);
|
|
192
|
+
} else if (size <= 56) {
|
|
193
|
+
triggerButtonClasses.push(triggerButtonStyles.icon28);
|
|
194
|
+
} else if (size <= 72) {
|
|
195
|
+
triggerButtonClasses.push(triggerButtonStyles.icon32);
|
|
196
|
+
} else {
|
|
197
|
+
triggerButtonClasses.push(triggerButtonStyles.icon48);
|
|
198
|
+
}
|
|
199
|
+
}
|
|
200
|
+
state.triggerButton.className = (0, _react.mergeClasses)(avatarGroupPopoverClassNames.triggerButton, groupChildClassName, sizeStyles[size], triggerButtonStyles.base, layout === 'pie' && triggerButtonStyles.pie, triggerButtonStyles.focusIndicator, layout !== 'pie' && triggerButtonStyles.states, layout !== 'pie' && popoverOpen && triggerButtonStyles.selected, ...triggerButtonClasses, state.triggerButton.className);
|
|
201
|
+
state.content.className = (0, _react.mergeClasses)(avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);
|
|
202
|
+
state.popoverSurface.className = (0, _react.mergeClasses)(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);
|
|
203
|
+
return state;
|
|
204
|
+
};
|
package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.ts"],"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.styles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\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 margin: '0',\n padding: '0',\n display: 'flex',\n flexDirection: 'column',\n },\n});\n\n/**\n * Styles for the popoverSurface slot.\n */\nconst usePopoverSurfaceStyles = makeStyles({\n base: {\n maxHeight: '220px',\n minHeight: '80px',\n overflow: 'hidden scroll',\n 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 borderRadius: tokens.borderRadiusCircular,\n ...shorthands.borderStyle('solid'),\n 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 focusIndicator: createCustomFocusIndicatorStyle({\n border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n outlineStyle: 'none',\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 'use no memo';\n\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);\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 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"],"names":["createCustomFocusIndicatorStyle","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","useGroupChildClassName","useSizeStyles","avatarGroupPopoverClassNames","root","content","popoverSurface","tooltip","triggerButton","useContentStyles","base","listStyleType","margin","padding","display","flexDirection","usePopoverSurfaceStyles","maxHeight","minHeight","overflow","spacingVerticalS","spacingHorizontalS","width","useTriggerButtonStyles","position","flexShrink","justifyContent","alignItems","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderColor","colorNeutralStroke1","borderRadius","borderRadiusCircular","borderStyle","pie","colorTransparentBackground","colorTransparentStroke","focusIndicator","border","strokeWidthThick","colorStrokeFocus2","outlineStyle","states","colorNeutralForeground1Hover","colorNeutralBackground1Hover","colorNeutralStroke1Hover","colorNeutralForeground1Pressed","colorNeutralBackground1Pressed","colorNeutralStroke1Pressed","selected","colorNeutralForeground1Selected","colorNeutralBackground1Selected","colorNeutralStroke1Selected","icon12","fontSize","icon16","icon20","icon24","icon28","icon32","icon48","caption2Strong","caption1Strong","body1Strong","subtitle2","subtitle1","title3","borderThin","borderWidth","strokeWidthThin","borderThick","borderThicker","strokeWidthThicker","borderThickest","strokeWidthThickest","useAvatarGroupPopoverStyles_unstable","state","indicator","size","layout","popoverOpen","sizeStyles","triggerButtonStyles","contentStyles","popoverSurfaceStyles","groupChildClassName","triggerButtonClasses","push","className"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/contexts/AvatarContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AvatarShape, AvatarSize } from '../components/Avatar/Avatar.types';\n\nconst avatarContext = React.createContext<AvatarContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport interface AvatarContextValue {\n shape?: AvatarShape;\n size?: AvatarSize;\n}\n\nconst avatarContextDefaultValue: AvatarContextValue = {};\n\n/**\n * @internal\n */\nexport const AvatarContextProvider = avatarContext.Provider;\n\n/**\n * @internal\n */\nexport const useAvatarContext = () => React.useContext(avatarContext) ?? avatarContextDefaultValue;\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/contexts/AvatarContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AvatarShape, AvatarSize } from '../components/Avatar/Avatar.types';\n\nconst avatarContext = React.createContext<AvatarContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport interface AvatarContextValue {\n shape?: AvatarShape;\n size?: AvatarSize;\n}\n\nconst avatarContextDefaultValue: AvatarContextValue = {};\n\n/**\n * @internal\n */\nexport const AvatarContextProvider = avatarContext.Provider;\n\n/**\n * @internal\n */\nexport const useAvatarContext = () => React.useContext(avatarContext) ?? avatarContextDefaultValue;\n"],"names":["React","avatarContext","createContext","undefined","avatarContextDefaultValue","AvatarContextProvider","Provider","useAvatarContext","useContext"],"mappings":";;;;;;;;;;;IAkBaK,qBAAAA;;;oBAKAE;;;;;iEAvBU,QAAQ;AAG/B,MAAMN,8BAAgBD,OAAME,aAAa,CAAiCC;AAU1E,MAAMC,4BAAgD,CAAC;AAKhD,8BAA8BH,cAAcK,QAAQ,CAAC;AAKrD,MAAMC,mBAAmB;QAAMP;WAAAA,CAAAA,oBAAAA,OAAMQ,UAAU,CAACP,cAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAmCI;EAA0B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/contexts/AvatarGroupContext.ts"],"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"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/contexts/AvatarGroupContext.ts"],"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"],"names":["createContext","useContextSelector","AvatarGroupContext","undefined","avatarGroupContextDefaultValue","AvatarGroupProvider","Provider","useAvatarGroupContext_unstable","selector","ctx"],"mappings":";;;;;;;;;;;IAQaE,kBAAAA;;;uBAMAG;;;kCAEAE;;;;sCAhBsD,mCAAmC;AAQ/F,+BAA6DP,mCAAAA,EAClEG,WACoC;AAEtC,MAAMC,iCAA0D,CAAC;AAE1D,MAAMC,sBAAsBH,mBAAmBI,QAAQ,CAAC;AAExD,MAAMC,iCAAiC,CAAIC,eAChDP,wCAAAA,EAAmBC,oBAAoB,CAACO,MAAML,8BAA8B,GAAKI,SAASC,MAAM"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { AvatarGroupContext, AvatarGroupProvider, useAvatarGroupContext_unstable } from './AvatarGroupContext';\nexport type { AvatarContextValue } from './AvatarContext';\nexport { AvatarContextProvider, useAvatarContext } from './AvatarContext';\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export { AvatarGroupContext, AvatarGroupProvider, useAvatarGroupContext_unstable } from './AvatarGroupContext';\nexport type { AvatarContextValue } from './AvatarContext';\nexport { AvatarContextProvider, useAvatarContext } from './AvatarContext';\n"],"names":["AvatarGroupContext","AvatarGroupProvider","useAvatarGroupContext_unstable","AvatarContextProvider","useAvatarContext"],"mappings":";;;;;;;;;;;;eAESG,oCAAqB;;;eAFrBH,sCAAkB;;;eAAEC,uCAAmB;;;eAEhBG,+BAAgB;;;eAFEF,kDAA8B;;;oCAAQ,uBAAuB;+BAEvD,kBAAkB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Avatar,\n avatarClassNames,\n renderAvatar_unstable,\n useAvatarStyles_unstable,\n useAvatar_unstable,\n} from './Avatar';\nexport type {\n AvatarNamedColor,\n AvatarProps,\n AvatarSlots,\n AvatarState,\n AvatarShape,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n AvatarSizes,\n AvatarSize,\n} from './Avatar';\nexport { getInitials, partitionAvatarGroupItems } from './utils/index';\nexport type { PartitionAvatarGroupItems, 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 useAvatarGroupPopover_unstable,\n useAvatarGroupPopoverContextValues_unstable,\n useAvatarGroupPopoverStyles_unstable,\n} from './AvatarGroupPopover';\nexport type { AvatarGroupPopoverProps, AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover';\nexport {\n AvatarContextProvider,\n AvatarGroupProvider,\n useAvatarContext,\n useAvatarGroupContext_unstable,\n} from './contexts/index';\nexport type { AvatarContextValue } from './contexts/index';\n"],"names":["Avatar","
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Avatar,\n avatarClassNames,\n renderAvatar_unstable,\n useAvatarStyles_unstable,\n useAvatar_unstable,\n} from './Avatar';\nexport type {\n AvatarNamedColor,\n AvatarProps,\n AvatarSlots,\n AvatarState,\n AvatarShape,\n // eslint-disable-next-line @typescript-eslint/no-deprecated\n AvatarSizes,\n AvatarSize,\n} from './Avatar';\nexport { getInitials, partitionAvatarGroupItems } from './utils/index';\nexport type { PartitionAvatarGroupItems, 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 useAvatarGroupPopover_unstable,\n useAvatarGroupPopoverContextValues_unstable,\n useAvatarGroupPopoverStyles_unstable,\n} from './AvatarGroupPopover';\nexport type { AvatarGroupPopoverProps, AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover';\nexport {\n AvatarContextProvider,\n AvatarGroupProvider,\n useAvatarContext,\n useAvatarGroupContext_unstable,\n} from './contexts/index';\nexport type { AvatarContextValue } from './contexts/index';\n"],"names":["Avatar","avatarClassNames","renderAvatar_unstable","useAvatarStyles_unstable","useAvatar_unstable","getInitials","partitionAvatarGroupItems","AvatarGroup","avatarGroupClassNames","renderAvatarGroup_unstable","useAvatarGroupContextValues","useAvatarGroupStyles_unstable","useAvatarGroup_unstable","AvatarGroupItem","avatarGroupItemClassNames","renderAvatarGroupItem_unstable","useAvatarGroupItemStyles_unstable","useAvatarGroupItem_unstable","AvatarGroupPopover","avatarGroupPopoverClassNames","renderAvatarGroupPopover_unstable","useAvatarGroupPopover_unstable","useAvatarGroupPopoverContextValues_unstable","useAvatarGroupPopoverStyles_unstable","AvatarContextProvider","AvatarGroupProvider","useAvatarContext","useAvatarGroupContext_unstable"],"mappings":";;;;;;;;;;;IACEA;6BAAM;;;eAmDNwB,6BAAqB;;;eAhCrBjB,wBAAW;;;eAeXM,gCAAe;;;eAQfK,sCAAkB;;uBAUC;eAAnBO;;;eAnDAxB,wBAAgB;;;eAmBhBO,kCAAqB;;;eAerBM,0CAAyB;;;eAQzBK,gDAA4B;;;eA3BrBd,kBAAW;;;eAAEC,gCAAyB;;;eAoB7CS,+CAA8B;;IAQ9BK,iCAAiC;;;;eAvBjCX,uCAA0B;;;eAnB1BP,6BAAqB;;;eAmDrBwB,wBAAgB;;IA/BhBhB;uDAA2B;;kCAgCG;eAA9BiB;;;eAjBAX,kDAAiC;;;eACjCC,4CAA2B;;;eAQ3BK,+DAA2C;;;eAC3CC,wDAAoC;;;eAFpCF,kDAA8B;;IAtB9BV;yDAA6B;;;eAC7BC,oCAAuB;;;eArBvBT,gCAAwB;;;eACxBC,0BAAkB;;;wBACb,WAAW;uBAWqC,gBAAgB;6BAShE,gBAAgB;iCAchB,oBAAoB;oCASpB,uBAAuB;wBAOvB,mBAAmB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/getInitials.ts"],"sourcesContent":["/**\n * Regular expressions matching characters to ignore when calculating the initials.\n */\n\n/**\n * Regular expression matching characters within various types of enclosures, including the enclosures themselves\n * so for example, (xyz) [xyz] {xyz} all would be ignored\n */\nconst UNWANTED_ENCLOSURES_REGEX: RegExp = /[\\(\\[\\{][^\\)\\]\\}]*[\\)\\]\\}]/g;\n\n/**\n * Regular expression matching special ASCII characters except space, plus some unicode special characters.\n * Applies after unwanted enclosures have been removed\n */\nconst UNWANTED_CHARS_REGEX: RegExp = /[\\0-\\u001F\\!-/:-@\\[-`\\{-\\u00BF\\u0250-\\u036F\\uD800-\\uFFFF]/g;\n\n/**\n * Regular expression matching phone numbers. Applied after chars matching UNWANTED_CHARS_REGEX have been removed\n * and number has been trimmed for whitespaces\n */\nconst PHONENUMBER_REGEX: RegExp = /^\\d+[\\d\\s]*(:?ext|x|)\\s*\\d+$/i;\n\n/** Regular expression matching one or more spaces. */\nconst MULTIPLE_WHITESPACES_REGEX: RegExp = /\\s+/g;\n\n/**\n * Regular expression matching languages for which we currently don't support initials.\n * Arabic: Arabic, Arabic Supplement, Arabic Extended-A.\n * Korean: Hangul Jamo, Hangul Compatibility Jamo, Hangul Jamo Extended-A, Hangul Syllables, Hangul Jamo Extended-B.\n * Japanese: Hiragana, Katakana.\n * CJK: CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs,\n * CJK Unified Ideographs Extension B\n */\nconst UNSUPPORTED_TEXT_REGEX: RegExp =\n /[\\u0600-\\u06FF\\u0750-\\u077F\\u08A0-\\u08FF\\u1100-\\u11FF\\u3130-\\u318F\\uA960-\\uA97F\\uAC00-\\uD7AF\\uD7B0-\\uD7FF\\u3040-\\u309F\\u30A0-\\u30FF\\u3400-\\u4DBF\\u4E00-\\u9FFF\\uF900-\\uFAFF]|[\\uD840-\\uD869][\\uDC00-\\uDED6]/;\n\nfunction getInitialsLatin(displayName: string, isRtl: boolean, firstInitialOnly?: boolean): string {\n let initials = '';\n\n const splits: string[] = displayName.split(' ');\n if (splits.length !== 0) {\n initials += splits[0].charAt(0).toUpperCase();\n }\n\n if (!firstInitialOnly) {\n if (splits.length === 2) {\n initials += splits[1].charAt(0).toUpperCase();\n } else if (splits.length === 3) {\n initials += splits[2].charAt(0).toUpperCase();\n }\n }\n\n if (isRtl && initials.length > 1) {\n return initials.charAt(1) + initials.charAt(0);\n }\n\n return initials;\n}\n\nfunction cleanupDisplayName(displayName: string): string {\n displayName = displayName.replace(UNWANTED_ENCLOSURES_REGEX, '');\n displayName = displayName.replace(UNWANTED_CHARS_REGEX, '');\n displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX, ' ');\n displayName = displayName.trim();\n\n return displayName;\n}\n\n/**\n * Get (up to 2 characters) initials based on display name of the persona.\n *\n * @param displayName - The full name of the person or entity\n * @param isRtl - Whether the display is in RTL\n * @param options - Extra options to control the behavior of getInitials\n *\n * @returns The 1 or 2 character initials based on the name. Or an empty string if no initials\n * could be derived from the name.\n *\n * @internal\n */\nexport function getInitials(\n displayName: string | undefined | null,\n isRtl: boolean,\n options?: {\n /** Should initials be generated from phone numbers (default false) */\n allowPhoneInitials?: boolean;\n\n /** Returns only the first initial */\n firstInitialOnly?: boolean;\n },\n): string {\n if (!displayName) {\n return '';\n }\n\n displayName = cleanupDisplayName(displayName);\n\n // For names containing CJK characters, and phone numbers, we don't display initials\n if (\n UNSUPPORTED_TEXT_REGEX.test(displayName) ||\n (!options?.allowPhoneInitials && PHONENUMBER_REGEX.test(displayName))\n ) {\n return '';\n }\n\n return getInitialsLatin(displayName, isRtl, options?.firstInitialOnly);\n}\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/utils/getInitials.ts"],"sourcesContent":["/**\n * Regular expressions matching characters to ignore when calculating the initials.\n */\n\n/**\n * Regular expression matching characters within various types of enclosures, including the enclosures themselves\n * so for example, (xyz) [xyz] {xyz} all would be ignored\n */\nconst UNWANTED_ENCLOSURES_REGEX: RegExp = /[\\(\\[\\{][^\\)\\]\\}]*[\\)\\]\\}]/g;\n\n/**\n * Regular expression matching special ASCII characters except space, plus some unicode special characters.\n * Applies after unwanted enclosures have been removed\n */\nconst UNWANTED_CHARS_REGEX: RegExp = /[\\0-\\u001F\\!-/:-@\\[-`\\{-\\u00BF\\u0250-\\u036F\\uD800-\\uFFFF]/g;\n\n/**\n * Regular expression matching phone numbers. Applied after chars matching UNWANTED_CHARS_REGEX have been removed\n * and number has been trimmed for whitespaces\n */\nconst PHONENUMBER_REGEX: RegExp = /^\\d+[\\d\\s]*(:?ext|x|)\\s*\\d+$/i;\n\n/** Regular expression matching one or more spaces. */\nconst MULTIPLE_WHITESPACES_REGEX: RegExp = /\\s+/g;\n\n/**\n * Regular expression matching languages for which we currently don't support initials.\n * Arabic: Arabic, Arabic Supplement, Arabic Extended-A.\n * Korean: Hangul Jamo, Hangul Compatibility Jamo, Hangul Jamo Extended-A, Hangul Syllables, Hangul Jamo Extended-B.\n * Japanese: Hiragana, Katakana.\n * CJK: CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs,\n * CJK Unified Ideographs Extension B\n */\nconst UNSUPPORTED_TEXT_REGEX: RegExp =\n /[\\u0600-\\u06FF\\u0750-\\u077F\\u08A0-\\u08FF\\u1100-\\u11FF\\u3130-\\u318F\\uA960-\\uA97F\\uAC00-\\uD7AF\\uD7B0-\\uD7FF\\u3040-\\u309F\\u30A0-\\u30FF\\u3400-\\u4DBF\\u4E00-\\u9FFF\\uF900-\\uFAFF]|[\\uD840-\\uD869][\\uDC00-\\uDED6]/;\n\nfunction getInitialsLatin(displayName: string, isRtl: boolean, firstInitialOnly?: boolean): string {\n let initials = '';\n\n const splits: string[] = displayName.split(' ');\n if (splits.length !== 0) {\n initials += splits[0].charAt(0).toUpperCase();\n }\n\n if (!firstInitialOnly) {\n if (splits.length === 2) {\n initials += splits[1].charAt(0).toUpperCase();\n } else if (splits.length === 3) {\n initials += splits[2].charAt(0).toUpperCase();\n }\n }\n\n if (isRtl && initials.length > 1) {\n return initials.charAt(1) + initials.charAt(0);\n }\n\n return initials;\n}\n\nfunction cleanupDisplayName(displayName: string): string {\n displayName = displayName.replace(UNWANTED_ENCLOSURES_REGEX, '');\n displayName = displayName.replace(UNWANTED_CHARS_REGEX, '');\n displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX, ' ');\n displayName = displayName.trim();\n\n return displayName;\n}\n\n/**\n * Get (up to 2 characters) initials based on display name of the persona.\n *\n * @param displayName - The full name of the person or entity\n * @param isRtl - Whether the display is in RTL\n * @param options - Extra options to control the behavior of getInitials\n *\n * @returns The 1 or 2 character initials based on the name. Or an empty string if no initials\n * could be derived from the name.\n *\n * @internal\n */\nexport function getInitials(\n displayName: string | undefined | null,\n isRtl: boolean,\n options?: {\n /** Should initials be generated from phone numbers (default false) */\n allowPhoneInitials?: boolean;\n\n /** Returns only the first initial */\n firstInitialOnly?: boolean;\n },\n): string {\n if (!displayName) {\n return '';\n }\n\n displayName = cleanupDisplayName(displayName);\n\n // For names containing CJK characters, and phone numbers, we don't display initials\n if (\n UNSUPPORTED_TEXT_REGEX.test(displayName) ||\n (!options?.allowPhoneInitials && PHONENUMBER_REGEX.test(displayName))\n ) {\n return '';\n }\n\n return getInitialsLatin(displayName, isRtl, options?.firstInitialOnly);\n}\n"],"names":["UNWANTED_ENCLOSURES_REGEX","UNWANTED_CHARS_REGEX","PHONENUMBER_REGEX","MULTIPLE_WHITESPACES_REGEX","UNSUPPORTED_TEXT_REGEX","getInitialsLatin","displayName","isRtl","firstInitialOnly","initials","splits","split","length","charAt","toUpperCase","cleanupDisplayName","replace","trim","getInitials","options","test","allowPhoneInitials"],"mappings":"AAAA;;CAEC,GAED;;;CAGC;;;;;;;eAyEekB;;;AAxEhB,MAAMlB,4BAAoC;AAE1C;;;CAGC,GACD,MAAMC,uBAA+B;AAErC;;;CAGC,GACD,MAAMC,oBAA4B;AAElC,oDAAoD,GACpD,MAAMC,6BAAqC;AAE3C;;;;;;;CAOC,GACD,MAAMC,yBACJ;AAEF,SAASC,iBAAiBC,WAAmB,EAAEC,KAAc,EAAEC,gBAA0B;IACvF,IAAIC,WAAW;IAEf,MAAMC,SAAmBJ,YAAYK,KAAK,CAAC;IAC3C,IAAID,OAAOE,MAAM,KAAK,GAAG;QACvBH,YAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;IAC7C;IAEA,IAAI,CAACN,kBAAkB;QACrB,IAAIE,OAAOE,MAAM,KAAK,GAAG;YACvBH,YAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;QAC7C,OAAO,IAAIJ,OAAOE,MAAM,KAAK,GAAG;YAC9BH,YAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;QAC7C;IACF;IAEA,IAAIP,SAASE,SAASG,MAAM,GAAG,GAAG;QAChC,OAAOH,SAASI,MAAM,CAAC,KAAKJ,SAASI,MAAM,CAAC;IAC9C;IAEA,OAAOJ;AACT;AAEA,SAASM,mBAAmBT,WAAmB;IAC7CA,cAAcA,YAAYU,OAAO,CAAChB,2BAA2B;IAC7DM,cAAcA,YAAYU,OAAO,CAACf,sBAAsB;IACxDK,cAAcA,YAAYU,OAAO,CAACb,4BAA4B;IAC9DG,cAAcA,YAAYW,IAAI;IAE9B,OAAOX;AACT;AAcO,qBACLA,WAAsC,EACtCC,KAAc,EACdY,OAMC;IAED,IAAI,CAACb,aAAa;QAChB,OAAO;IACT;IAEAA,cAAcS,mBAAmBT;IAEjC,oFAAoF;IACpF,IACEF,uBAAuBgB,IAAI,CAACd,gBAC3B,EAACa,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASE,kBAAAA,AAAkB,KAAInB,kBAAkBkB,IAAI,CAACd,cACxD;QACA,OAAO;IACT;IAEA,OAAOD,iBAAiBC,aAAaC,OAAOY,YAAAA,QAAAA,YAAAA,KAAAA,IAAAA,KAAAA,IAAAA,QAASX,gBAAgB;AACvE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { getInitials } from './getInitials';\nexport { partitionAvatarGroupItems } from './partitionAvatarGroupItems';\nexport type { PartitionAvatarGroupItems, PartitionAvatarGroupItemsOptions } from './partitionAvatarGroupItems';\n"],"names":["getInitials","partitionAvatarGroupItems"],"
|
|
1
|
+
{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { getInitials } from './getInitials';\nexport { partitionAvatarGroupItems } from './partitionAvatarGroupItems';\nexport type { PartitionAvatarGroupItems, PartitionAvatarGroupItemsOptions } from './partitionAvatarGroupItems';\n"],"names":["getInitials","partitionAvatarGroupItems"],"mappings":";;;;;;;;;;;;eAASA,wBAAW;;;eACXC,oDAAyB;;;6BADN,gBAAgB;2CACF,8BAA8B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/partitionAvatarGroupItems.ts"],"sourcesContent":["export type PartitionAvatarGroupItemsOptions<T> = {\n items: readonly T[];\n layout?: 'spread' | 'stack' | 'pie';\n maxInlineItems?: number;\n};\n\nexport type PartitionAvatarGroupItems<T> = {\n inlineItems: readonly T[];\n overflowItems?: readonly T[];\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>(\n options: PartitionAvatarGroupItemsOptions<T>,\n): PartitionAvatarGroupItems<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.length > 0 ? items : undefined,\n };\n }\n\n const maxInlineItems = options.maxInlineItems ?? 5;\n const inlineCount = -(maxInlineItems - (items.length > maxInlineItems ? 1 : 0));\n const overflowItems = items.slice(0, inlineCount);\n\n return {\n inlineItems: items.slice(inlineCount),\n overflowItems: overflowItems.length > 0 ? overflowItems : undefined,\n };\n};\n"],"names":["partitionAvatarGroupItems","options","items","isPie","layout","inlineItems","slice","overflowItems","length","undefined","maxInlineItems","inlineCount"],"
|
|
1
|
+
{"version":3,"sources":["../src/utils/partitionAvatarGroupItems.ts"],"sourcesContent":["export type PartitionAvatarGroupItemsOptions<T> = {\n items: readonly T[];\n layout?: 'spread' | 'stack' | 'pie';\n maxInlineItems?: number;\n};\n\nexport type PartitionAvatarGroupItems<T> = {\n inlineItems: readonly T[];\n overflowItems?: readonly T[];\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>(\n options: PartitionAvatarGroupItemsOptions<T>,\n): PartitionAvatarGroupItems<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.length > 0 ? items : undefined,\n };\n }\n\n const maxInlineItems = options.maxInlineItems ?? 5;\n const inlineCount = -(maxInlineItems - (items.length > maxInlineItems ? 1 : 0));\n const overflowItems = items.slice(0, inlineCount);\n\n return {\n inlineItems: items.slice(inlineCount),\n overflowItems: overflowItems.length > 0 ? overflowItems : undefined,\n };\n};\n"],"names":["partitionAvatarGroupItems","options","items","isPie","layout","inlineItems","slice","overflowItems","length","undefined","maxInlineItems","inlineCount"],"mappings":"AAWA;;;;;;CAMC,GACD;;;;;;;;;;AAAO,MAAMA,4BAA4B,CACvCC;IAEA,MAAM,EAAEC,KAAK,EAAE,GAAGD;IAClB,MAAME,QAAQF,QAAQG,MAAM,KAAK;IAEjC,IAAID,OAAO;QACT,OAAO;YACLE,aAAaH,MAAMI,KAAK,CAAC,GAAG;YAC5BC,eAAeL,MAAMM,MAAM,GAAG,IAAIN,QAAQO;QAC5C;IACF;QAEuBR;IAAvB,MAAMS,iBAAiBT,CAAAA,0BAAAA,QAAQS,cAAAA,AAAc,MAAA,QAAtBT,4BAAAA,KAAAA,IAAAA,0BAA0B;IACjD,MAAMU,cAAc,CAAED,CAAAA,iBAAkBR,CAAAA,MAAMM,MAAM,GAAGE,iBAAiB,IAAI,EAAA,CAAC;IAC7E,MAAMH,gBAAgBL,MAAMI,KAAK,CAAC,GAAGK;IAErC,OAAO;QACLN,aAAaH,MAAMI,KAAK,CAACK;QACzBJ,eAAeA,cAAcC,MAAM,GAAG,IAAID,gBAAgBE;IAC5D;AACF,EAAE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-avatar",
|
|
3
|
-
"version": "9.
|
|
3
|
+
"version": "9.9.1",
|
|
4
4
|
"description": "React components for building Microsoft web experiences.",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -21,16 +21,16 @@
|
|
|
21
21
|
"@fluentui/scripts-cypress": "*"
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@fluentui/react-badge": "^9.
|
|
25
|
-
"@fluentui/react-context-selector": "^9.2.
|
|
24
|
+
"@fluentui/react-badge": "^9.4.1",
|
|
25
|
+
"@fluentui/react-context-selector": "^9.2.3",
|
|
26
26
|
"@fluentui/react-icons": "^2.0.245",
|
|
27
|
-
"@fluentui/react-popover": "^9.
|
|
27
|
+
"@fluentui/react-popover": "^9.12.1",
|
|
28
28
|
"@fluentui/react-shared-contexts": "^9.24.0",
|
|
29
|
-
"@fluentui/react-tabster": "^9.
|
|
29
|
+
"@fluentui/react-tabster": "^9.26.1",
|
|
30
30
|
"@fluentui/react-theme": "^9.1.24",
|
|
31
|
-
"@fluentui/react-tooltip": "^9.
|
|
32
|
-
"@fluentui/react-utilities": "^9.
|
|
33
|
-
"@fluentui/react-jsx-runtime": "^9.1.
|
|
31
|
+
"@fluentui/react-tooltip": "^9.8.1",
|
|
32
|
+
"@fluentui/react-utilities": "^9.23.0",
|
|
33
|
+
"@fluentui/react-jsx-runtime": "^9.1.3",
|
|
34
34
|
"@griffel/react": "^1.5.22",
|
|
35
35
|
"@swc/helpers": "^0.5.1"
|
|
36
36
|
},
|