@fluentui/react-avatar 9.4.4 → 9.4.6
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/.swcrc +30 -0
- package/CHANGELOG.json +121 -1
- package/CHANGELOG.md +35 -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 +1 -11
- package/lib/components/Avatar/renderAvatar.js.map +1 -1
- package/lib/components/Avatar/useAvatar.js +2 -2
- package/lib/components/Avatar/useAvatar.js.map +1 -1
- package/lib/components/Avatar/useAvatarStyles.js.map +1 -1
- 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 +1 -3
- package/lib/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroup.js +1 -0
- package/lib/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -1
- package/lib/components/AvatarGroup/useAvatarGroupStyles.js.map +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/index.js.map +1 -1
- package/lib/components/AvatarGroupItem/renderAvatarGroupItem.js +1 -7
- package/lib/components/AvatarGroupItem/renderAvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItem.js +1 -0
- package/lib/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.js.map +1 -1
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js +1 -0
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/AvatarGroupPopover.types.js +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 +3 -13
- package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopover.js +4 -4
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -1
- package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js.map +1 -1
- package/lib/contexts/AvatarContext.js +2 -4
- 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 +5 -8
- package/lib/utils/getInitials.js.map +1 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/partitionAvatarGroupItems.js +3 -4
- package/lib/utils/partitionAvatarGroupItems.js.map +1 -1
- package/lib-commonjs/Avatar.js +5 -4
- package/lib-commonjs/Avatar.js.map +1 -1
- package/lib-commonjs/AvatarGroup.js +5 -4
- package/lib-commonjs/AvatarGroup.js.map +1 -1
- package/lib-commonjs/AvatarGroupItem.js +5 -4
- package/lib-commonjs/AvatarGroupItem.js.map +1 -1
- package/lib-commonjs/AvatarGroupPopover.js +5 -4
- package/lib-commonjs/AvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/Avatar/Avatar.js +19 -17
- package/lib-commonjs/components/Avatar/Avatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/Avatar.types.js +3 -2
- package/lib-commonjs/components/Avatar/Avatar.types.js.map +1 -1
- package/lib-commonjs/components/Avatar/index.js +9 -8
- package/lib-commonjs/components/Avatar/index.js.map +1 -1
- package/lib-commonjs/components/Avatar/renderAvatar.js +13 -23
- package/lib-commonjs/components/Avatar/renderAvatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatar.js +186 -158
- package/lib-commonjs/components/Avatar/useAvatar.js.map +1 -1
- package/lib-commonjs/components/Avatar/useAvatarStyles.js +889 -510
- package/lib-commonjs/components/Avatar/useAvatarStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.js +21 -23
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.types.js +3 -2
- package/lib-commonjs/components/AvatarGroup/AvatarGroup.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/index.js +10 -9
- package/lib-commonjs/components/AvatarGroup/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js +16 -21
- package/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroup.js +33 -33
- package/lib-commonjs/components/AvatarGroup/useAvatarGroup.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js +16 -17
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js.map +1 -1
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.js +47 -37
- package/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js +19 -21
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.types.js +3 -2
- package/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/index.js +9 -8
- package/lib-commonjs/components/AvatarGroupItem/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/renderAvatarGroupItem.js +13 -22
- package/lib-commonjs/components/AvatarGroupItem/renderAvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js +59 -68
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.js +379 -224
- package/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js +21 -22
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.types.js +5 -2
- package/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/index.js +9 -8
- package/lib-commonjs/components/AvatarGroupPopover/index.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js +19 -32
- package/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js +89 -99
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js +15 -13
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +1 -1
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js +527 -272
- package/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js.map +1 -1
- package/lib-commonjs/contexts/AvatarContext.js +18 -17
- package/lib-commonjs/contexts/AvatarContext.js.map +1 -1
- package/lib-commonjs/contexts/AvatarGroupContext.js +17 -12
- package/lib-commonjs/contexts/AvatarGroupContext.js.map +1 -1
- package/lib-commonjs/contexts/index.js +6 -5
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/index.js +45 -172
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/getInitials.js +44 -60
- package/lib-commonjs/utils/getInitials.js.map +1 -1
- package/lib-commonjs/utils/index.js +14 -16
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/partitionAvatarGroupItems.js +25 -26
- package/lib-commonjs/utils/partitionAvatarGroupItems.js.map +1 -1
- package/package.json +14 -13
- package/lib-amd/Avatar.js +0 -6
- package/lib-amd/Avatar.js.map +0 -1
- package/lib-amd/AvatarGroup.js +0 -6
- package/lib-amd/AvatarGroup.js.map +0 -1
- package/lib-amd/AvatarGroupItem.js +0 -6
- package/lib-amd/AvatarGroupItem.js.map +0 -1
- package/lib-amd/AvatarGroupPopover.js +0 -6
- package/lib-amd/AvatarGroupPopover.js.map +0 -1
- package/lib-amd/components/Avatar/Avatar.js +0 -14
- package/lib-amd/components/Avatar/Avatar.js.map +0 -1
- package/lib-amd/components/Avatar/Avatar.types.js +0 -5
- package/lib-amd/components/Avatar/Avatar.types.js.map +0 -1
- package/lib-amd/components/Avatar/index.js +0 -10
- package/lib-amd/components/Avatar/index.js.map +0 -1
- package/lib-amd/components/Avatar/renderAvatar.js +0 -16
- package/lib-amd/components/Avatar/renderAvatar.js.map +0 -1
- package/lib-amd/components/Avatar/useAvatar.js +0 -178
- package/lib-amd/components/Avatar/useAvatar.js.map +0 -1
- package/lib-amd/components/Avatar/useAvatarStyles.js +0 -425
- package/lib-amd/components/Avatar/useAvatarStyles.js.map +0 -1
- package/lib-amd/components/AvatarGroup/AvatarGroup.js +0 -19
- package/lib-amd/components/AvatarGroup/AvatarGroup.js.map +0 -1
- package/lib-amd/components/AvatarGroup/AvatarGroup.types.js +0 -5
- package/lib-amd/components/AvatarGroup/AvatarGroup.types.js.map +0 -1
- package/lib-amd/components/AvatarGroup/index.js +0 -11
- package/lib-amd/components/AvatarGroup/index.js.map +0 -1
- package/lib-amd/components/AvatarGroup/renderAvatarGroup.js +0 -15
- package/lib-amd/components/AvatarGroup/renderAvatarGroup.js.map +0 -1
- package/lib-amd/components/AvatarGroup/useAvatarGroup.js +0 -29
- package/lib-amd/components/AvatarGroup/useAvatarGroup.js.map +0 -1
- package/lib-amd/components/AvatarGroup/useAvatarGroupContextValues.js +0 -15
- package/lib-amd/components/AvatarGroup/useAvatarGroupContextValues.js.map +0 -1
- package/lib-amd/components/AvatarGroup/useAvatarGroupStyles.js +0 -36
- package/lib-amd/components/AvatarGroup/useAvatarGroupStyles.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/AvatarGroupItem.js +0 -18
- package/lib-amd/components/AvatarGroupItem/AvatarGroupItem.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/AvatarGroupItem.types.js +0 -5
- package/lib-amd/components/AvatarGroupItem/AvatarGroupItem.types.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/index.js +0 -10
- package/lib-amd/components/AvatarGroupItem/index.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/renderAvatarGroupItem.js +0 -16
- package/lib-amd/components/AvatarGroupItem/renderAvatarGroupItem.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/useAvatarGroupItem.js +0 -58
- package/lib-amd/components/AvatarGroupItem/useAvatarGroupItem.js.map +0 -1
- package/lib-amd/components/AvatarGroupItem/useAvatarGroupItemStyles.js +0 -236
- package/lib-amd/components/AvatarGroupItem/useAvatarGroupItemStyles.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/AvatarGroupPopover.js +0 -19
- package/lib-amd/components/AvatarGroupPopover/AvatarGroupPopover.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/AvatarGroupPopover.types.js +0 -5
- package/lib-amd/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/index.js +0 -10
- package/lib-amd/components/AvatarGroupPopover/index.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/renderAvatarGroupPopover.js +0 -20
- package/lib-amd/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopover.js +0 -86
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopover.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js +0 -14
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map +0 -1
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js +0 -136
- package/lib-amd/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.js.map +0 -1
- package/lib-amd/contexts/AvatarContext.js +0 -17
- package/lib-amd/contexts/AvatarContext.js.map +0 -1
- package/lib-amd/contexts/AvatarGroupContext.js +0 -20
- package/lib-amd/contexts/AvatarGroupContext.js.map +0 -1
- package/lib-amd/contexts/index.js +0 -7
- package/lib-amd/contexts/index.js.map +0 -1
- package/lib-amd/index.js +0 -33
- package/lib-amd/index.js.map +0 -1
- package/lib-amd/utils/getInitials.js +0 -87
- package/lib-amd/utils/getInitials.js.map +0 -1
- package/lib-amd/utils/index.js +0 -8
- package/lib-amd/utils/index.js.map +0 -1
- package/lib-amd/utils/partitionAvatarGroupItems.js +0 -32
- package/lib-amd/utils/partitionAvatarGroupItems.js.map +0 -1
|
@@ -1,172 +1,200 @@
|
|
|
1
1
|
"use strict";
|
|
2
|
-
|
|
3
2
|
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
|
|
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
|
+
DEFAULT_STRINGS: ()=>DEFAULT_STRINGS,
|
|
13
|
+
useAvatar_unstable: ()=>useAvatar_unstable
|
|
5
14
|
});
|
|
6
|
-
|
|
7
|
-
const
|
|
8
|
-
const
|
|
9
|
-
const
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
const
|
|
13
|
-
const
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
15
|
+
const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
|
|
16
|
+
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
17
|
+
const _reactUtilities = require("@fluentui/react-utilities");
|
|
18
|
+
const _index = require("../../utils/index");
|
|
19
|
+
const _reactIcons = require("@fluentui/react-icons");
|
|
20
|
+
const _reactBadge = require("@fluentui/react-badge");
|
|
21
|
+
const _reactSharedContexts = require("@fluentui/react-shared-contexts");
|
|
22
|
+
const _avatarContext = require("../../contexts/AvatarContext");
|
|
23
|
+
const DEFAULT_STRINGS = {
|
|
24
|
+
active: 'active',
|
|
25
|
+
inactive: 'inactive'
|
|
17
26
|
};
|
|
18
|
-
const useAvatar_unstable = (props, ref)
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
} =
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
name,
|
|
28
|
-
size = contextSize !== null && contextSize !== void 0 ? contextSize : 32,
|
|
29
|
-
shape = 'circular',
|
|
30
|
-
active = 'unset',
|
|
31
|
-
activeAppearance = 'ring',
|
|
32
|
-
idForColor
|
|
33
|
-
} = props;
|
|
34
|
-
let {
|
|
35
|
-
color = 'neutral'
|
|
36
|
-
} = props;
|
|
37
|
-
// Resolve 'colorful' to a specific color name
|
|
38
|
-
if (color === 'colorful') {
|
|
39
|
-
color = avatarColors[getHashCode((_a = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _a !== void 0 ? _a : '') % avatarColors.length];
|
|
40
|
-
}
|
|
41
|
-
const baseId = react_utilities_1.useId('avatar-');
|
|
42
|
-
const root = react_utilities_1.getNativeElementProps('span', {
|
|
43
|
-
role: 'img',
|
|
44
|
-
id: baseId,
|
|
45
|
-
// aria-label and/or aria-labelledby are resolved below
|
|
46
|
-
...props,
|
|
47
|
-
ref
|
|
48
|
-
}, /* excludedPropNames: */['name']);
|
|
49
|
-
const [imageHidden, setImageHidden] = React.useState(undefined);
|
|
50
|
-
const image = react_utilities_1.resolveShorthand(props.image, {
|
|
51
|
-
defaultProps: {
|
|
52
|
-
alt: '',
|
|
53
|
-
role: 'presentation',
|
|
54
|
-
'aria-hidden': true,
|
|
55
|
-
hidden: imageHidden
|
|
27
|
+
const useAvatar_unstable = (props, ref)=>{
|
|
28
|
+
const { dir } = (0, _reactSharedContexts.useFluent_unstable)();
|
|
29
|
+
const { size: contextSize } = (0, _avatarContext.useAvatarContext)();
|
|
30
|
+
const { name , size =contextSize !== null && contextSize !== void 0 ? contextSize : 32 , shape ='circular' , active ='unset' , activeAppearance ='ring' , idForColor } = props;
|
|
31
|
+
let { color ='neutral' } = props;
|
|
32
|
+
// Resolve 'colorful' to a specific color name
|
|
33
|
+
if (color === 'colorful') {
|
|
34
|
+
var _ref;
|
|
35
|
+
color = avatarColors[getHashCode((_ref = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _ref !== void 0 ? _ref : '') % avatarColors.length];
|
|
56
36
|
}
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
37
|
+
const baseId = (0, _reactUtilities.useId)('avatar-');
|
|
38
|
+
const root = (0, _reactUtilities.getNativeElementProps)('span', {
|
|
39
|
+
role: 'img',
|
|
40
|
+
id: baseId,
|
|
41
|
+
// aria-label and/or aria-labelledby are resolved below
|
|
42
|
+
...props,
|
|
43
|
+
ref
|
|
44
|
+
}, /* excludedPropNames: */ [
|
|
45
|
+
'name'
|
|
46
|
+
]);
|
|
47
|
+
const [imageHidden, setImageHidden] = _react.useState(undefined);
|
|
48
|
+
const image = (0, _reactUtilities.resolveShorthand)(props.image, {
|
|
49
|
+
defaultProps: {
|
|
50
|
+
alt: '',
|
|
51
|
+
role: 'presentation',
|
|
52
|
+
'aria-hidden': true,
|
|
53
|
+
hidden: imageHidden
|
|
54
|
+
}
|
|
55
|
+
});
|
|
56
|
+
// Hide the image if it fails to load and restore it on a successful load
|
|
57
|
+
if (image) {
|
|
58
|
+
image.onError = (0, _reactUtilities.mergeCallbacks)(image.onError, ()=>setImageHidden(true));
|
|
59
|
+
image.onLoad = (0, _reactUtilities.mergeCallbacks)(image.onLoad, ()=>setImageHidden(undefined));
|
|
71
60
|
}
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
required: true,
|
|
82
|
-
defaultProps: {
|
|
83
|
-
children: React.createElement(react_icons_1.PersonRegular, null),
|
|
84
|
-
'aria-hidden': true
|
|
85
|
-
}
|
|
61
|
+
// Resolve the initials slot, defaulted to getInitials.
|
|
62
|
+
let initials = (0, _reactUtilities.resolveShorthand)(props.initials, {
|
|
63
|
+
required: true,
|
|
64
|
+
defaultProps: {
|
|
65
|
+
children: (0, _index.getInitials)(name, dir === 'rtl', {
|
|
66
|
+
firstInitialOnly: size <= 16
|
|
67
|
+
}),
|
|
68
|
+
id: baseId + '__initials'
|
|
69
|
+
}
|
|
86
70
|
});
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
size: getBadgeSize(size),
|
|
91
|
-
id: baseId + '__badge'
|
|
71
|
+
// Don't render the initials slot if it's empty
|
|
72
|
+
if (!(initials === null || initials === void 0 ? void 0 : initials.children)) {
|
|
73
|
+
initials = undefined;
|
|
92
74
|
}
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
} else if (initials) {
|
|
104
|
-
// root's aria-label should be the name, but fall back to being labelledby the initials if name is missing
|
|
105
|
-
root['aria-labelledby'] = initials.id + (badge ? ' ' + badge.id : '');
|
|
75
|
+
// Render the icon slot *only if* there aren't any initials or image to display
|
|
76
|
+
let icon = undefined;
|
|
77
|
+
if (!initials && (!image || imageHidden)) {
|
|
78
|
+
icon = (0, _reactUtilities.resolveShorthand)(props.icon, {
|
|
79
|
+
required: true,
|
|
80
|
+
defaultProps: {
|
|
81
|
+
children: /*#__PURE__*/ _react.createElement(_reactIcons.PersonRegular, null),
|
|
82
|
+
'aria-hidden': true
|
|
83
|
+
}
|
|
84
|
+
});
|
|
106
85
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
86
|
+
const badge = (0, _reactUtilities.resolveShorthand)(props.badge, {
|
|
87
|
+
defaultProps: {
|
|
88
|
+
size: getBadgeSize(size),
|
|
89
|
+
id: baseId + '__badge'
|
|
90
|
+
}
|
|
91
|
+
});
|
|
92
|
+
let activeAriaLabelElement;
|
|
93
|
+
// Resolve aria-label and/or aria-labelledby if not provided by the user
|
|
94
|
+
if (!root['aria-label'] && !root['aria-labelledby']) {
|
|
95
|
+
if (name) {
|
|
96
|
+
root['aria-label'] = name;
|
|
97
|
+
// Include the badge in labelledby if it exists
|
|
98
|
+
if (badge) {
|
|
99
|
+
root['aria-labelledby'] = root.id + ' ' + badge.id;
|
|
100
|
+
}
|
|
101
|
+
} else if (initials) {
|
|
102
|
+
// root's aria-label should be the name, but fall back to being labelledby the initials if name is missing
|
|
103
|
+
root['aria-labelledby'] = initials.id + (badge ? ' ' + badge.id : '');
|
|
104
|
+
}
|
|
105
|
+
// Add the active state to the aria label
|
|
106
|
+
if (active === 'active' || active === 'inactive') {
|
|
107
|
+
const activeText = DEFAULT_STRINGS[active];
|
|
108
|
+
if (root['aria-labelledby']) {
|
|
109
|
+
// If using aria-labelledby, render a hidden span and append it to the labelledby
|
|
110
|
+
const activeId = baseId + '__active';
|
|
111
|
+
root['aria-labelledby'] += ' ' + activeId;
|
|
112
|
+
activeAriaLabelElement = /*#__PURE__*/ _react.createElement("span", {
|
|
113
|
+
hidden: true,
|
|
114
|
+
id: activeId
|
|
115
|
+
}, activeText);
|
|
116
|
+
} else if (root['aria-label']) {
|
|
117
|
+
// Otherwise, just append it to the aria-label
|
|
118
|
+
root['aria-label'] += ' ' + activeText;
|
|
119
|
+
}
|
|
120
|
+
}
|
|
122
121
|
}
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
};
|
|
122
|
+
return {
|
|
123
|
+
size,
|
|
124
|
+
shape,
|
|
125
|
+
active,
|
|
126
|
+
activeAppearance,
|
|
127
|
+
activeAriaLabelElement,
|
|
128
|
+
color,
|
|
129
|
+
components: {
|
|
130
|
+
root: 'span',
|
|
131
|
+
initials: 'span',
|
|
132
|
+
icon: 'span',
|
|
133
|
+
image: 'img',
|
|
134
|
+
badge: _reactBadge.PresenceBadge
|
|
135
|
+
},
|
|
136
|
+
root,
|
|
137
|
+
initials,
|
|
138
|
+
icon,
|
|
139
|
+
image,
|
|
140
|
+
badge
|
|
141
|
+
};
|
|
144
142
|
};
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
}
|
|
143
|
+
const getBadgeSize = (size)=>{
|
|
144
|
+
if (size >= 96) {
|
|
145
|
+
return 'extra-large';
|
|
146
|
+
} else if (size >= 64) {
|
|
147
|
+
return 'large';
|
|
148
|
+
} else if (size >= 56) {
|
|
149
|
+
return 'medium';
|
|
150
|
+
} else if (size >= 40) {
|
|
151
|
+
return 'small';
|
|
152
|
+
} else if (size >= 28) {
|
|
153
|
+
return 'extra-small';
|
|
154
|
+
} else {
|
|
155
|
+
return 'tiny';
|
|
156
|
+
}
|
|
160
157
|
};
|
|
161
|
-
const avatarColors = [
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
158
|
+
const avatarColors = [
|
|
159
|
+
'dark-red',
|
|
160
|
+
'cranberry',
|
|
161
|
+
'red',
|
|
162
|
+
'pumpkin',
|
|
163
|
+
'peach',
|
|
164
|
+
'marigold',
|
|
165
|
+
'gold',
|
|
166
|
+
'brass',
|
|
167
|
+
'brown',
|
|
168
|
+
'forest',
|
|
169
|
+
'seafoam',
|
|
170
|
+
'dark-green',
|
|
171
|
+
'light-teal',
|
|
172
|
+
'teal',
|
|
173
|
+
'steel',
|
|
174
|
+
'blue',
|
|
175
|
+
'royal-blue',
|
|
176
|
+
'cornflower',
|
|
177
|
+
'navy',
|
|
178
|
+
'lavender',
|
|
179
|
+
'purple',
|
|
180
|
+
'grape',
|
|
181
|
+
'lilac',
|
|
182
|
+
'pink',
|
|
183
|
+
'magenta',
|
|
184
|
+
'plum',
|
|
185
|
+
'beige',
|
|
186
|
+
'mink',
|
|
187
|
+
'platinum',
|
|
188
|
+
'anchor'
|
|
189
|
+
];
|
|
190
|
+
const getHashCode = (str)=>{
|
|
191
|
+
let hashCode = 0;
|
|
192
|
+
for(let len = str.length - 1; len >= 0; len--){
|
|
193
|
+
const ch = str.charCodeAt(len);
|
|
194
|
+
const shift = len % 8;
|
|
195
|
+
hashCode ^= (ch << shift) + (ch >> 8 - shift); // eslint-disable-line no-bitwise
|
|
196
|
+
}
|
|
197
|
+
return hashCode;
|
|
198
|
+
}; //# sourceMappingURL=useAvatar.js.map
|
|
169
199
|
|
|
170
|
-
return hashCode;
|
|
171
|
-
};
|
|
172
200
|
//# sourceMappingURL=useAvatar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["React","require","react_utilities_1","index_1","react_icons_1","react_badge_1","react_shared_contexts_1","AvatarContext_1","exports","DEFAULT_STRINGS","active","inactive","useAvatar_unstable","props","ref","dir","useFluent_unstable","size","contextSize","useAvatarContext","name","shape","activeAppearance","idForColor","color","avatarColors","getHashCode","_a","length","baseId","useId","root","getNativeElementProps","role","id","imageHidden","setImageHidden","useState","undefined","image","resolveShorthand","defaultProps","alt","hidden","onError","mergeCallbacks","onLoad","initials","required","children","getInitials","firstInitialOnly","icon","createElement","PersonRegular","badge","getBadgeSize","activeAriaLabelElement","activeText","activeId","components","PresenceBadge","str","hashCode","len","ch","charCodeAt","shift"],"sources":["../src/packages/react-components/react-avatar/src/components/Avatar/useAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { getInitials } from '../../utils/index';\nimport type { AvatarNamedColor, AvatarProps, AvatarState } from './Avatar.types';\nimport { PersonRegular } from '@fluentui/react-icons';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useAvatarContext } from '../../contexts/AvatarContext';\n\nexport const DEFAULT_STRINGS = {\n active: 'active',\n inactive: 'inactive',\n};\n\nexport const useAvatar_unstable = (props: AvatarProps, ref: React.Ref<HTMLElement>): AvatarState => {\n const { dir } = useFluent();\n const { size: contextSize } = useAvatarContext();\n const {\n name,\n size = contextSize ?? (32 as const),\n shape = 'circular',\n active = 'unset',\n activeAppearance = 'ring',\n idForColor,\n } = props;\n let { color = 'neutral' } = props;\n\n // Resolve 'colorful' to a specific color name\n if (color === 'colorful') {\n color = avatarColors[getHashCode(idForColor ?? name ?? '') % avatarColors.length];\n }\n\n const baseId = useId('avatar-');\n\n const root: AvatarState['root'] = getNativeElementProps(\n 'span',\n {\n role: 'img',\n id: baseId,\n // aria-label and/or aria-labelledby are resolved below\n ...props,\n ref,\n },\n /* excludedPropNames: */ ['name'],\n );\n\n const [imageHidden, setImageHidden] = React.useState<true | undefined>(undefined);\n const image: AvatarState['image'] = resolveShorthand(props.image, {\n defaultProps: {\n alt: '',\n role: 'presentation',\n 'aria-hidden': true,\n hidden: imageHidden,\n },\n });\n\n // Hide the image if it fails to load and restore it on a successful load\n if (image) {\n image.onError = mergeCallbacks(image.onError, () => setImageHidden(true));\n image.onLoad = mergeCallbacks(image.onLoad, () => setImageHidden(undefined));\n }\n\n // Resolve the initials slot, defaulted to getInitials.\n let initials: AvatarState['initials'] = resolveShorthand(props.initials, {\n required: true,\n defaultProps: {\n children: getInitials(name, dir === 'rtl', { firstInitialOnly: size <= 16 }),\n id: baseId + '__initials',\n },\n });\n\n // Don't render the initials slot if it's empty\n if (!initials?.children) {\n initials = undefined;\n }\n\n // Render the icon slot *only if* there aren't any initials or image to display\n let icon: AvatarState['icon'] = undefined;\n if (!initials && (!image || imageHidden)) {\n icon = resolveShorthand(props.icon, {\n required: true,\n defaultProps: {\n children: <PersonRegular />,\n 'aria-hidden': true,\n },\n });\n }\n\n const badge: AvatarState['badge'] = resolveShorthand(props.badge, {\n defaultProps: {\n size: getBadgeSize(size),\n id: baseId + '__badge',\n },\n });\n\n let activeAriaLabelElement: AvatarState['activeAriaLabelElement'];\n\n // Resolve aria-label and/or aria-labelledby if not provided by the user\n if (!root['aria-label'] && !root['aria-labelledby']) {\n if (name) {\n root['aria-label'] = name;\n\n // Include the badge in labelledby if it exists\n if (badge) {\n root['aria-labelledby'] = root.id + ' ' + badge.id;\n }\n } else if (initials) {\n // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n root['aria-labelledby'] = initials.id + (badge ? ' ' + badge.id : '');\n }\n\n // Add the active state to the aria label\n if (active === 'active' || active === 'inactive') {\n const activeText = DEFAULT_STRINGS[active];\n if (root['aria-labelledby']) {\n // If using aria-labelledby, render a hidden span and append it to the labelledby\n const activeId = baseId + '__active';\n root['aria-labelledby'] += ' ' + activeId;\n activeAriaLabelElement = (\n <span hidden id={activeId}>\n {activeText}\n </span>\n );\n } else if (root['aria-label']) {\n // Otherwise, just append it to the aria-label\n root['aria-label'] += ' ' + activeText;\n }\n }\n }\n\n return {\n size,\n shape,\n active,\n activeAppearance,\n activeAriaLabelElement,\n color,\n\n components: {\n root: 'span',\n initials: 'span',\n icon: 'span',\n image: 'img',\n badge: PresenceBadge,\n },\n\n root,\n initials,\n icon,\n image,\n badge,\n };\n};\n\nconst getBadgeSize = (size: AvatarState['size']) => {\n if (size >= 96) {\n return 'extra-large';\n } else if (size >= 64) {\n return 'large';\n } else if (size >= 56) {\n return 'medium';\n } else if (size >= 40) {\n return 'small';\n } else if (size >= 28) {\n return 'extra-small';\n } else {\n return 'tiny';\n }\n};\n\nconst avatarColors: AvatarNamedColor[] = [\n 'dark-red',\n 'cranberry',\n 'red',\n 'pumpkin',\n 'peach',\n 'marigold',\n 'gold',\n 'brass',\n 'brown',\n 'forest',\n 'seafoam',\n 'dark-green',\n 'light-teal',\n 'teal',\n 'steel',\n 'blue',\n 'royal-blue',\n 'cornflower',\n 'navy',\n 'lavender',\n 'purple',\n 'grape',\n 'lilac',\n 'pink',\n 'magenta',\n 'plum',\n 'beige',\n 'mink',\n 'platinum',\n 'anchor',\n];\n\nconst getHashCode = (str: string): number => {\n let hashCode = 0;\n for (let len: number = str.length - 1; len >= 0; len--) {\n const ch = str.charCodeAt(len);\n const shift = len % 8;\n hashCode ^= (ch << shift) + (ch >> (8 - shift)); // eslint-disable-line no-bitwise\n }\n\n return hashCode;\n};\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../../../lib/components/Avatar/useAvatar.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, mergeCallbacks, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { getInitials } from '../../utils/index';\nimport { PersonRegular } from '@fluentui/react-icons';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useAvatarContext } from '../../contexts/AvatarContext';\nexport const DEFAULT_STRINGS = {\n active: 'active',\n inactive: 'inactive'\n};\nexport const useAvatar_unstable = (props, ref) => {\n const {\n dir\n } = useFluent();\n const {\n size: contextSize\n } = useAvatarContext();\n const {\n name,\n size = contextSize !== null && contextSize !== void 0 ? contextSize : 32,\n shape = 'circular',\n active = 'unset',\n activeAppearance = 'ring',\n idForColor\n } = props;\n let {\n color = 'neutral'\n } = props;\n // Resolve 'colorful' to a specific color name\n if (color === 'colorful') {\n var _ref;\n color = avatarColors[getHashCode((_ref = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _ref !== void 0 ? _ref : '') % avatarColors.length];\n }\n const baseId = useId('avatar-');\n const root = getNativeElementProps('span', {\n role: 'img',\n id: baseId,\n // aria-label and/or aria-labelledby are resolved below\n ...props,\n ref\n }, /* excludedPropNames: */['name']);\n const [imageHidden, setImageHidden] = React.useState(undefined);\n const image = resolveShorthand(props.image, {\n defaultProps: {\n alt: '',\n role: 'presentation',\n 'aria-hidden': true,\n hidden: imageHidden\n }\n });\n // Hide the image if it fails to load and restore it on a successful load\n if (image) {\n image.onError = mergeCallbacks(image.onError, () => setImageHidden(true));\n image.onLoad = mergeCallbacks(image.onLoad, () => setImageHidden(undefined));\n }\n // Resolve the initials slot, defaulted to getInitials.\n let initials = resolveShorthand(props.initials, {\n required: true,\n defaultProps: {\n children: getInitials(name, dir === 'rtl', {\n firstInitialOnly: size <= 16\n }),\n id: baseId + '__initials'\n }\n });\n // Don't render the initials slot if it's empty\n if (!(initials === null || initials === void 0 ? void 0 : initials.children)) {\n initials = undefined;\n }\n // Render the icon slot *only if* there aren't any initials or image to display\n let icon = undefined;\n if (!initials && (!image || imageHidden)) {\n icon = resolveShorthand(props.icon, {\n required: true,\n defaultProps: {\n children: /*#__PURE__*/React.createElement(PersonRegular, null),\n 'aria-hidden': true\n }\n });\n }\n const badge = resolveShorthand(props.badge, {\n defaultProps: {\n size: getBadgeSize(size),\n id: baseId + '__badge'\n }\n });\n let activeAriaLabelElement;\n // Resolve aria-label and/or aria-labelledby if not provided by the user\n if (!root['aria-label'] && !root['aria-labelledby']) {\n if (name) {\n root['aria-label'] = name;\n // Include the badge in labelledby if it exists\n if (badge) {\n root['aria-labelledby'] = root.id + ' ' + badge.id;\n }\n } else if (initials) {\n // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n root['aria-labelledby'] = initials.id + (badge ? ' ' + badge.id : '');\n }\n // Add the active state to the aria label\n if (active === 'active' || active === 'inactive') {\n const activeText = DEFAULT_STRINGS[active];\n if (root['aria-labelledby']) {\n // If using aria-labelledby, render a hidden span and append it to the labelledby\n const activeId = baseId + '__active';\n root['aria-labelledby'] += ' ' + activeId;\n activeAriaLabelElement = /*#__PURE__*/React.createElement(\"span\", {\n hidden: true,\n id: activeId\n }, activeText);\n } else if (root['aria-label']) {\n // Otherwise, just append it to the aria-label\n root['aria-label'] += ' ' + activeText;\n }\n }\n }\n return {\n size,\n shape,\n active,\n activeAppearance,\n activeAriaLabelElement,\n color,\n components: {\n root: 'span',\n initials: 'span',\n icon: 'span',\n image: 'img',\n badge: PresenceBadge\n },\n root,\n initials,\n icon,\n image,\n badge\n };\n};\nconst getBadgeSize = size => {\n if (size >= 96) {\n return 'extra-large';\n } else if (size >= 64) {\n return 'large';\n } else if (size >= 56) {\n return 'medium';\n } else if (size >= 40) {\n return 'small';\n } else if (size >= 28) {\n return 'extra-small';\n } else {\n return 'tiny';\n }\n};\nconst avatarColors = ['dark-red', 'cranberry', 'red', 'pumpkin', 'peach', 'marigold', 'gold', 'brass', 'brown', 'forest', 'seafoam', 'dark-green', 'light-teal', 'teal', 'steel', 'blue', 'royal-blue', 'cornflower', 'navy', 'lavender', 'purple', 'grape', 'lilac', 'pink', 'magenta', 'plum', 'beige', 'mink', 'platinum', 'anchor'];\nconst getHashCode = str => {\n let hashCode = 0;\n for (let len = str.length - 1; len >= 0; len--) {\n const ch = str.charCodeAt(len);\n const shift = len % 8;\n hashCode ^= (ch << shift) + (ch >> 8 - shift); // eslint-disable-line no-bitwise\n }\n\n return hashCode;\n};\n//# sourceMappingURL=useAvatar.js.map"],"names":["DEFAULT_STRINGS","useAvatar_unstable","active","inactive","props","ref","dir","useFluent","size","contextSize","useAvatarContext","name","shape","activeAppearance","idForColor","color","_ref","avatarColors","getHashCode","length","baseId","useId","root","getNativeElementProps","role","id","imageHidden","setImageHidden","React","useState","undefined","image","resolveShorthand","defaultProps","alt","hidden","onError","mergeCallbacks","onLoad","initials","required","children","getInitials","firstInitialOnly","icon","createElement","PersonRegular","badge","getBadgeSize","activeAriaLabelElement","activeText","activeId","components","PresenceBadge","str","hashCode","len","ch","charCodeAt","shift"],"mappings":";;;;;;;;;;;IAOaA,eAAe,MAAfA;IAIAC,kBAAkB,MAAlBA;;;6DAXU;gCACwD;uBACnD;4BACE;4BACA;qCACkB;+BACf;AAC1B,MAAMD,kBAAkB;IAC7BE,QAAQ;IACRC,UAAU;AACZ;AACO,MAAMF,qBAAqB,CAACG,OAAOC,MAAQ;IAChD,MAAM,EACJC,IAAG,EACJ,GAAGC,IAAAA,uCAAS;IACb,MAAM,EACJC,MAAMC,YAAW,EAClB,GAAGC,IAAAA,+BAAgB;IACpB,MAAM,EACJC,KAAI,EACJH,MAAOC,gBAAgB,IAAI,IAAIA,gBAAgB,KAAK,IAAIA,cAAc,EAAE,CAAA,EACxEG,OAAQ,WAAU,EAClBV,QAAS,QAAO,EAChBW,kBAAmB,OAAM,EACzBC,WAAU,EACX,GAAGV;IACJ,IAAI,EACFW,OAAQ,UAAS,EAClB,GAAGX;IACJ,8CAA8C;IAC9C,IAAIW,UAAU,YAAY;QACxB,IAAIC;QACJD,QAAQE,YAAY,CAACC,YAAY,AAACF,CAAAA,OAAOF,eAAe,IAAI,IAAIA,eAAe,KAAK,IAAIA,aAAaH,IAAI,AAAD,MAAO,IAAI,IAAIK,SAAS,KAAK,IAAIA,OAAO,EAAE,IAAIC,aAAaE,MAAM,CAAC;IAC5K,CAAC;IACD,MAAMC,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAMC,OAAOC,IAAAA,qCAAqB,EAAC,QAAQ;QACzCC,MAAM;QACNC,IAAIL;QACJ,uDAAuD;QACvD,GAAGhB,KAAK;QACRC;IACF,GAAG,sBAAsB,GAAE;QAAC;KAAO;IACnC,MAAM,CAACqB,aAAaC,eAAe,GAAGC,OAAMC,QAAQ,CAACC;IACrD,MAAMC,QAAQC,IAAAA,gCAAgB,EAAC5B,MAAM2B,KAAK,EAAE;QAC1CE,cAAc;YACZC,KAAK;YACLV,MAAM;YACN,eAAe,IAAI;YACnBW,QAAQT;QACV;IACF;IACA,yEAAyE;IACzE,IAAIK,OAAO;QACTA,MAAMK,OAAO,GAAGC,IAAAA,8BAAc,EAACN,MAAMK,OAAO,EAAE,IAAMT,eAAe,IAAI;QACvEI,MAAMO,MAAM,GAAGD,IAAAA,8BAAc,EAACN,MAAMO,MAAM,EAAE,IAAMX,eAAeG;IACnE,CAAC;IACD,uDAAuD;IACvD,IAAIS,WAAWP,IAAAA,gCAAgB,EAAC5B,MAAMmC,QAAQ,EAAE;QAC9CC,UAAU,IAAI;QACdP,cAAc;YACZQ,UAAUC,IAAAA,kBAAW,EAAC/B,MAAML,QAAQ,OAAO;gBACzCqC,kBAAkBnC,QAAQ;YAC5B;YACAiB,IAAIL,SAAS;QACf;IACF;IACA,+CAA+C;IAC/C,IAAI,CAAEmB,CAAAA,aAAa,IAAI,IAAIA,aAAa,KAAK,IAAI,KAAK,IAAIA,SAASE,QAAQ,AAAD,GAAI;QAC5EF,WAAWT;IACb,CAAC;IACD,+EAA+E;IAC/E,IAAIc,OAAOd;IACX,IAAI,CAACS,YAAa,CAAA,CAACR,SAASL,WAAU,GAAI;QACxCkB,OAAOZ,IAAAA,gCAAgB,EAAC5B,MAAMwC,IAAI,EAAE;YAClCJ,UAAU,IAAI;YACdP,cAAc;gBACZQ,UAAU,WAAW,GAAEb,OAAMiB,aAAa,CAACC,yBAAa,EAAE,IAAI;gBAC9D,eAAe,IAAI;YACrB;QACF;IACF,CAAC;IACD,MAAMC,QAAQf,IAAAA,gCAAgB,EAAC5B,MAAM2C,KAAK,EAAE;QAC1Cd,cAAc;YACZzB,MAAMwC,aAAaxC;YACnBiB,IAAIL,SAAS;QACf;IACF;IACA,IAAI6B;IACJ,wEAAwE;IACxE,IAAI,CAAC3B,IAAI,CAAC,aAAa,IAAI,CAACA,IAAI,CAAC,kBAAkB,EAAE;QACnD,IAAIX,MAAM;YACRW,IAAI,CAAC,aAAa,GAAGX;YACrB,+CAA+C;YAC/C,IAAIoC,OAAO;gBACTzB,IAAI,CAAC,kBAAkB,GAAGA,KAAKG,EAAE,GAAG,MAAMsB,MAAMtB,EAAE;YACpD,CAAC;QACH,OAAO,IAAIc,UAAU;YACnB,0GAA0G;YAC1GjB,IAAI,CAAC,kBAAkB,GAAGiB,SAASd,EAAE,GAAIsB,CAAAA,QAAQ,MAAMA,MAAMtB,EAAE,GAAG,EAAE,AAAD;QACrE,CAAC;QACD,yCAAyC;QACzC,IAAIvB,WAAW,YAAYA,WAAW,YAAY;YAChD,MAAMgD,aAAalD,eAAe,CAACE,OAAO;YAC1C,IAAIoB,IAAI,CAAC,kBAAkB,EAAE;gBAC3B,iFAAiF;gBACjF,MAAM6B,WAAW/B,SAAS;gBAC1BE,IAAI,CAAC,kBAAkB,IAAI,MAAM6B;gBACjCF,yBAAyB,WAAW,GAAErB,OAAMiB,aAAa,CAAC,QAAQ;oBAChEV,QAAQ,IAAI;oBACZV,IAAI0B;gBACN,GAAGD;YACL,OAAO,IAAI5B,IAAI,CAAC,aAAa,EAAE;gBAC7B,8CAA8C;gBAC9CA,IAAI,CAAC,aAAa,IAAI,MAAM4B;YAC9B,CAAC;QACH,CAAC;IACH,CAAC;IACD,OAAO;QACL1C;QACAI;QACAV;QACAW;QACAoC;QACAlC;QACAqC,YAAY;YACV9B,MAAM;YACNiB,UAAU;YACVK,MAAM;YACNb,OAAO;YACPgB,OAAOM,yBAAa;QACtB;QACA/B;QACAiB;QACAK;QACAb;QACAgB;IACF;AACF;AACA,MAAMC,eAAexC,CAAAA,OAAQ;IAC3B,IAAIA,QAAQ,IAAI;QACd,OAAO;IACT,OAAO,IAAIA,QAAQ,IAAI;QACrB,OAAO;IACT,OAAO,IAAIA,QAAQ,IAAI;QACrB,OAAO;IACT,OAAO,IAAIA,QAAQ,IAAI;QACrB,OAAO;IACT,OAAO,IAAIA,QAAQ,IAAI;QACrB,OAAO;IACT,OAAO;QACL,OAAO;IACT,CAAC;AACH;AACA,MAAMS,eAAe;IAAC;IAAY;IAAa;IAAO;IAAW;IAAS;IAAY;IAAQ;IAAS;IAAS;IAAU;IAAW;IAAc;IAAc;IAAQ;IAAS;IAAQ;IAAc;IAAc;IAAQ;IAAY;IAAU;IAAS;IAAS;IAAQ;IAAW;IAAQ;IAAS;IAAQ;IAAY;CAAS;AACvU,MAAMC,cAAcoC,CAAAA,MAAO;IACzB,IAAIC,WAAW;IACf,IAAK,IAAIC,MAAMF,IAAInC,MAAM,GAAG,GAAGqC,OAAO,GAAGA,MAAO;QAC9C,MAAMC,KAAKH,IAAII,UAAU,CAACF;QAC1B,MAAMG,QAAQH,MAAM;QACpBD,YAAY,AAACE,CAAAA,MAAME,KAAI,IAAMF,CAAAA,MAAM,IAAIE,KAAI,GAAI,iCAAiC;IAClF;IAEA,OAAOJ;AACT,GACA,qCAAqC"}
|