Initial commit

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/Avatar.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "Avatar", {
+    enumerable: true,
+    get: function() {
+        return Avatar;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _renderAvatar = require("./renderAvatar");
+const _useAvatar = require("./useAvatar");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useAvatarStylesstyles = require("./useAvatarStyles.styles");
+const Avatar = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useAvatar.useAvatar_unstable)(props, ref);
+    (0, _useAvatarStylesstyles.useAvatarStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAvatarStyles_unstable')(state);
+    return (0, _renderAvatar.renderAvatar_unstable)(state);
+});
+Avatar.displayName = 'Avatar';

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatar_unstable } from './renderAvatar';\nimport { useAvatar_unstable } from './useAvatar';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarStyles_unstable } from './useAvatarStyles.styles';\nimport type { AvatarProps } from './Avatar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nexport const Avatar: ForwardRefComponent<AvatarProps> = React.forwardRef((props, ref) => {\n  const state = useAvatar_unstable(props, ref);\n\n  useAvatarStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarStyles_unstable')(state);\n\n  return renderAvatar_unstable(state);\n});\n\nAvatar.displayName = 'Avatar';\n"],"names":["Avatar","React","forwardRef","props","ref","state","useAvatar_unstable","useAvatarStyles_unstable","useCustomStyleHook_unstable","renderAvatar_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAQaA;;;eAAAA;;;;iEARU;8BACe;2BACH;qCACS;uCACH;AAIlC,MAAMA,SAAAA,WAAAA,GAA2CC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IAC/E,MAAMC,QAAQC,IAAAA,6BAAAA,EAAmBH,OAAOC;IAExCG,IAAAA,+CAAAA,EAAyBF;IAEzBG,IAAAA,gDAAAA,EAA4B,4BAA4BH;IAExD,OAAOI,IAAAA,mCAAAA,EAAsBJ;AAC/B;AAEAL,OAAOU,WAAW,GAAG"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/Avatar.types.js

@@ -0,0 +1,6 @@
+/**
+ * State used in rendering Avatar
+ */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/Avatar.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Avatar/Avatar.types.ts"],"sourcesContent":["import { PresenceBadge } from '@fluentui/react-badge';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\n/**\n * Sizes for the avatar\n * @deprecated use AvatarSize instead\n */\nexport type AvatarSizes = AvatarSize;\n/**\n * Sizes for the avatar\n */\nexport type AvatarSize = 16 | 20 | 24 | 28 | 32 | 36 | 40 | 48 | 56 | 64 | 72 | 96 | 120 | 128;\n\n/**\n * Shape of the avatar\n */\nexport type AvatarShape = 'circular' | 'square';\n\nexport type AvatarSlots = {\n  root: Slot<'span'>;\n\n  /**\n   * The Avatar's image.\n   *\n   * Usage e.g.: `image={{ src: '...' }}`\n   */\n  image?: Slot<'img'>;\n\n  /**\n   * (optional) Custom initials.\n   *\n   * It is usually not necessary to specify custom initials; by default they will be derived from the `name` prop,\n   * using the `getInitials` function.\n   *\n   * The initials are displayed when there is no image (including while the image is loading).\n   */\n  initials?: Slot<'span'>;\n\n  /**\n   * Icon to be displayed when the avatar doesn't have an image or initials.\n   *\n   * @default `PersonRegular` (the default icon's size depends on the Avatar's size)\n   */\n  icon?: Slot<'span'>;\n\n  /**\n   * Badge to show the avatar's presence status.\n   */\n  badge?: Slot<typeof PresenceBadge>;\n};\n\n/**\n * A specific named color for the Avatar\n */\nexport type 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/**\n * Properties for Avatar\n */\nexport type AvatarProps = Omit<ComponentProps<AvatarSlots>, 'color'> & {\n  /**\n   * Optional activity indicator\n   * * active: the avatar will be decorated according to activeAppearance\n   * * inactive: the avatar will be reduced in size and partially transparent\n   * * unset: normal display\n   *\n   * @default unset\n   */\n  active?: 'active' | 'inactive' | 'unset';\n\n  /**\n   * The appearance when `active=\"active\"`\n   *\n   * @default ring\n   */\n  activeAppearance?: 'ring' | 'shadow' | 'ring-shadow';\n\n  /**\n   * The color when displaying either an icon or initials.\n   * * neutral (default): gray\n   * * brand: color from the brand palette\n   * * colorful: picks a color from a set of pre-defined colors, based on a hash of the name (or idForColor if provided)\n   * * [AvatarNamedColor]: a specific color from the theme\n   *\n   * @default neutral\n   */\n  color?: 'neutral' | 'brand' | 'colorful' | AvatarNamedColor;\n\n  /**\n   * Specify a string to be used instead of the name, to determine which color to use when color=\"colorful\".\n   * Use this when a name is not available, but there is another unique identifier that can be used instead.\n   */\n  idForColor?: string | undefined;\n\n  /**\n   * The name of the person or entity represented by this Avatar. This should always be provided if it is available.\n   *\n   * The name is used to determine the initials displayed when there is no image. It is also provided to\n   * accessibility tools.\n   */\n  name?: string;\n\n  /**\n   * The avatar can have a circular or square shape.\n   * @default circular\n   */\n  shape?: AvatarShape;\n\n  /**\n   * Size of the avatar in pixels.\n   *\n   * Size is restricted to a limited set of supported values recommended for most uses (see `AvatarSizeValue`) and\n   * based on design guidelines for the Avatar control.\n   *\n   * Note: At size 16, if initials are displayed, only the first initial will be rendered.\n   *\n   * If a non-supported size is needed, set `size` to the next-smaller supported size, and set `width` and `height`\n   * to override the rendered size.\n   *\n   * For example, to set the avatar to 45px in size:\n   * `<Avatar size={40} style={{ width: '45px', height: '45px' }} />`\n   *\n   * @default 32\n   */\n  size?: AvatarSize;\n};\n\n/**\n * State used in rendering Avatar\n */\nexport type AvatarState = ComponentState<AvatarSlots> &\n  Required<Pick<AvatarProps, 'active' | 'activeAppearance' | 'shape' | 'size'>> & {\n    /**\n     * The Avatar's color, it matches props.color but with `'colorful'` resolved to a named color\n     */\n    color: NonNullable<Exclude<AvatarProps['color'], 'colorful'>>;\n\n    /**\n     * Hidden span to render the active state label for the purposes of including in the aria-labelledby, if needed.\n     */\n    activeAriaLabelElement?: JSX.Element;\n  };\n"],"names":[],"rangeMappings":";;","mappings":"AA6JA;;CAEC"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/index.js

@@ -0,0 +1,37 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    Avatar: function() {
+        return _Avatar.Avatar;
+    },
+    DEFAULT_STRINGS: function() {
+        return _useAvatar.DEFAULT_STRINGS;
+    },
+    avatarClassNames: function() {
+        return _useAvatarStylesstyles.avatarClassNames;
+    },
+    renderAvatar_unstable: function() {
+        return _renderAvatar.renderAvatar_unstable;
+    },
+    useAvatarStyles_unstable: function() {
+        return _useAvatarStylesstyles.useAvatarStyles_unstable;
+    },
+    useAvatar_unstable: function() {
+        return _useAvatar.useAvatar_unstable;
+    },
+    useSizeStyles: function() {
+        return _useAvatarStylesstyles.useSizeStyles;
+    }
+});
+const _Avatar = require("./Avatar");
+const _renderAvatar = require("./renderAvatar");
+const _useAvatar = require("./useAvatar");
+const _useAvatarStylesstyles = require("./useAvatarStyles.styles");

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Avatar/index.ts"],"sourcesContent":["export type {\n  AvatarNamedColor,\n  AvatarProps,\n  AvatarShape,\n  AvatarSize,\n  // eslint-disable-next-line @typescript-eslint/no-deprecated\n  AvatarSizes,\n  AvatarSlots,\n  AvatarState,\n} from './Avatar.types';\nexport { Avatar } from './Avatar';\nexport { renderAvatar_unstable } from './renderAvatar';\nexport { DEFAULT_STRINGS, useAvatar_unstable } from './useAvatar';\nexport { avatarClassNames, useAvatarStyles_unstable, useSizeStyles } from './useAvatarStyles.styles';\n"],"names":["Avatar","DEFAULT_STRINGS","avatarClassNames","renderAvatar_unstable","useAvatarStyles_unstable","useAvatar_unstable","useSizeStyles"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAUSA,MAAM;eAANA,cAAM;;IAENC,eAAe;eAAfA,0BAAe;;IACfC,gBAAgB;eAAhBA,uCAAgB;;IAFhBC,qBAAqB;eAArBA,mCAAqB;;IAEHC,wBAAwB;eAAxBA,+CAAwB;;IADzBC,kBAAkB;eAAlBA,6BAAkB;;IACSC,aAAa;eAAbA,oCAAa;;;wBAH3C;8BACe;2BACc;uCACsB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/renderAvatar.js

@@ -0,0 +1,24 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderAvatar_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderAvatar_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const renderAvatar_unstable = (state)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+        children: [
+            state.initials && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.initials, {}),
+            state.icon && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.icon, {}),
+            state.image && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.image, {}),
+            state.badge && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.badge, {}),
+            state.activeAriaLabelElement
+        ]
+    });
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/renderAvatar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Avatar/renderAvatar.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const renderAvatar_unstable = (state: AvatarState) => {\n  assertSlots<AvatarSlots>(state);\n\n  return (\n    <state.root>\n      {state.initials && <state.initials />}\n      {state.icon && <state.icon />}\n      {state.image && <state.image />}\n      {state.badge && <state.badge />}\n      {state.activeAriaLabelElement}\n    </state.root>\n  );\n};\n"],"names":["renderAvatar_unstable","state","assertSlots","_jsxs","root","initials","_jsx","icon","image","badge","activeAriaLabelElement"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAMaA;;;eAAAA;;;4BALb;gCAE4B;AAGrB,MAAMA,wBAAwB,CAACC;IACpCC,IAAAA,2BAAAA,EAAyBD;IAEzB,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;YACRH,MAAMI,QAAQ,IAAA,WAAA,GAAIC,IAAAA,eAAA,EAACL,MAAMI,QAAQ,EAAA,CAAA;YACjCJ,MAAMM,IAAI,IAAA,WAAA,GAAID,IAAAA,eAAA,EAACL,MAAMM,IAAI,EAAA,CAAA;YACzBN,MAAMO,KAAK,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACL,MAAMO,KAAK,EAAA,CAAA;YAC3BP,MAAMQ,KAAK,IAAA,WAAA,GAAIH,IAAAA,eAAA,EAACL,MAAMQ,KAAK,EAAA,CAAA;YAC3BR,MAAMS,sBAAsB;;;AAGnC"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/useAvatar.js

@@ -0,0 +1,204 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    DEFAULT_STRINGS: function() {
+        return DEFAULT_STRINGS;
+    },
+    useAvatar_unstable: function() {
+        return useAvatar_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactutilities = require("@fluentui/react-utilities");
+const _index = require("../../utils/index");
+const _reacticons = require("@fluentui/react-icons");
+const _reactbadge = require("@fluentui/react-badge");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _AvatarContext = require("../../contexts/AvatarContext");
+const DEFAULT_STRINGS = {
+    active: 'active',
+    inactive: 'inactive'
+};
+const useAvatar_unstable = (props, ref)=>{
+    const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const { shape: contextShape, size: contextSize } = (0, _AvatarContext.useAvatarContext)();
+    const { name, size = contextSize !== null && contextSize !== void 0 ? contextSize : 32, shape = contextShape !== null && contextShape !== void 0 ? contextShape : 'circular', active = 'unset', activeAppearance = 'ring', idForColor } = props;
+    let { color = 'neutral' } = props;
+    // Resolve 'colorful' to a specific color name
+    if (color === 'colorful') {
+        var _ref;
+        color = avatarColors[getHashCode((_ref = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _ref !== void 0 ? _ref : '') % avatarColors.length];
+    }
+    const baseId = (0, _reactutilities.useId)('avatar-');
+    const root = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('span', {
+        role: 'img',
+        id: baseId,
+        // aria-label and/or aria-labelledby are resolved below
+        ...props,
+        ref
+    }, /* excludedPropNames: */ [
+        'name'
+    ]), {
+        elementType: 'span'
+    });
+    const [imageHidden, setImageHidden] = _react.useState(undefined);
+    let image = _reactutilities.slot.optional(props.image, {
+        defaultProps: {
+            alt: '',
+            role: 'presentation',
+            'aria-hidden': true,
+            hidden: imageHidden
+        },
+        elementType: 'img'
+    }); // Image shouldn't be rendered if its src is not set
+    if (!(image === null || image === void 0 ? void 0 : image.src)) {
+        image = undefined;
+    } // Hide the image if it fails to load and restore it on a successful load
+    if (image) {
+        image.onError = (0, _reactutilities.mergeCallbacks)(image.onError, ()=>setImageHidden(true));
+        image.onLoad = (0, _reactutilities.mergeCallbacks)(image.onLoad, ()=>setImageHidden(undefined));
+    } // Resolve the initials slot, defaulted to getInitials.
+    let initials = _reactutilities.slot.optional(props.initials, {
+        renderByDefault: true,
+        defaultProps: {
+            children: (0, _index.getInitials)(name, dir === 'rtl', {
+                firstInitialOnly: size <= 16
+            }),
+            id: baseId + '__initials'
+        },
+        elementType: 'span'
+    }); // Don't render the initials slot if it's empty
+    if (!(initials === null || initials === void 0 ? void 0 : initials.children)) {
+        initials = undefined;
+    } // Render the icon slot *only if* there aren't any initials or image to display
+    let icon = undefined;
+    if (!initials && (!image || imageHidden)) {
+        icon = _reactutilities.slot.optional(props.icon, {
+            renderByDefault: true,
+            defaultProps: {
+                children: /*#__PURE__*/ _react.createElement(_reacticons.PersonRegular, null),
+                'aria-hidden': true
+            },
+            elementType: 'span'
+        });
+    }
+    const badge = _reactutilities.slot.optional(props.badge, {
+        defaultProps: {
+            size: getBadgeSize(size),
+            id: baseId + '__badge'
+        },
+        elementType: _reactbadge.PresenceBadge
+    });
+    let activeAriaLabelElement; // Resolve aria-label and/or aria-labelledby if not provided by the user
+    if (!root['aria-label'] && !root['aria-labelledby']) {
+        if (name) {
+            root['aria-label'] = name; // Include the badge in labelledby if it exists
+            if (badge) {
+                root['aria-labelledby'] = root.id + ' ' + badge.id;
+            }
+        } else if (initials) {
+            // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing
+            root['aria-labelledby'] = initials.id + (badge ? ' ' + badge.id : '');
+        } // Add the active state to the aria label
+        if (active === 'active' || active === 'inactive') {
+            const activeText = DEFAULT_STRINGS[active];
+            if (root['aria-labelledby']) {
+                // If using aria-labelledby, render a hidden span and append it to the labelledby
+                const activeId = baseId + '__active';
+                root['aria-labelledby'] += ' ' + activeId;
+                activeAriaLabelElement = /*#__PURE__*/ _react.createElement("span", {
+                    hidden: true,
+                    id: activeId
+                }, activeText);
+            } else if (root['aria-label']) {
+                // Otherwise, just append it to the aria-label
+                root['aria-label'] += ' ' + activeText;
+            }
+        }
+    }
+    return {
+        size,
+        shape,
+        active,
+        activeAppearance,
+        activeAriaLabelElement,
+        color,
+        components: {
+            root: 'span',
+            initials: 'span',
+            icon: 'span',
+            image: 'img',
+            badge: _reactbadge.PresenceBadge
+        },
+        root,
+        initials,
+        icon,
+        image,
+        badge
+    };
+};
+const getBadgeSize = (size)=>{
+    if (size >= 96) {
+        return 'extra-large';
+    } else if (size >= 64) {
+        return 'large';
+    } else if (size >= 56) {
+        return 'medium';
+    } else if (size >= 40) {
+        return 'small';
+    } else if (size >= 28) {
+        return 'extra-small';
+    } else {
+        return 'tiny';
+    }
+};
+const 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'
+];
+const getHashCode = (str)=>{
+    let hashCode = 0;
+    for(let len = str.length - 1; len >= 0; len--){
+        const ch = str.charCodeAt(len);
+        const shift = len % 8;
+        hashCode ^= (ch << shift) + (ch >> 8 - shift); // eslint-disable-line no-bitwise
+    }
+    return hashCode;
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/Avatar/useAvatarStyles.styles.js

@@ -0,0 +1,838 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    avatarClassNames: function() {
+        return avatarClassNames;
+    },
+    useAvatarStyles_unstable: function() {
+        return useAvatarStyles_unstable;
+    },
+    useSizeStyles: function() {
+        return useSizeStyles;
+    }
+});
+const _react = require("@griffel/react");
+const avatarClassNames = {
+    root: 'fui-Avatar',
+    image: 'fui-Avatar__image',
+    initials: 'fui-Avatar__initials',
+    icon: 'fui-Avatar__icon',
+    badge: 'fui-Avatar__badge'
+};
+// CSS variables used internally in Avatar's styles
+const vars = {
+    badgeRadius: '--fui-Avatar-badgeRadius',
+    badgeGap: '--fui-Avatar-badgeGap',
+    badgeAlign: '--fui-Avatar-badgeAlign',
+    ringWidth: '--fui-Avatar-ringWidth'
+};
+const useRootClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r81b29z", "r1aatmv", {
+    r: [
+        ".r81b29z{display:inline-block;flex-shrink:0;position:relative;vertical-align:middle;border-radius:var(--borderRadiusCircular);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);font-size:var(--fontSizeBase300);width:32px;height:32px;}",
+        ".r81b29z::before,.r81b29z::after{position:absolute;top:0;left:0;bottom:0;right:0;z-index:-1;margin:calc(-2 * var(--fui-Avatar-ringWidth, 0px));border-radius:inherit;transition-property:margin,opacity;transition-timing-function:var(--curveEasyEaseMax),var(--curveLinear);transition-duration:var(--durationUltraSlow),var(--durationSlower);}",
+        ".r81b29z::before{border-style:solid;border-width:var(--fui-Avatar-ringWidth);}",
+        ".r1aatmv{display:inline-block;flex-shrink:0;position:relative;vertical-align:middle;border-radius:var(--borderRadiusCircular);font-family:var(--fontFamilyBase);font-weight:var(--fontWeightSemibold);font-size:var(--fontSizeBase300);width:32px;height:32px;}",
+        ".r1aatmv::before,.r1aatmv::after{position:absolute;top:0;right:0;bottom:0;left:0;z-index:-1;margin:calc(-2 * var(--fui-Avatar-ringWidth, 0px));border-radius:inherit;transition-property:margin,opacity;transition-timing-function:var(--curveEasyEaseMax),var(--curveLinear);transition-duration:var(--durationUltraSlow),var(--durationSlower);}",
+        ".r1aatmv::before{border-style:solid;border-width:var(--fui-Avatar-ringWidth);}"
+    ],
+    s: [
+        "@media screen and (prefers-reduced-motion: reduce){.r81b29z::before,.r81b29z::after{transition-duration:0.01ms;}}",
+        "@media screen and (prefers-reduced-motion: reduce){.r1aatmv::before,.r1aatmv::after{transition-duration:0.01ms;}}"
+    ]
+});
+const useImageClassName = /*#__PURE__*/ (0, _react.__resetStyles)("r136dc0n", "rjly0nl", [
+    ".r136dc0n{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:inherit;object-fit:cover;vertical-align:top;}",
+    ".rjly0nl{position:absolute;top:0;right:0;width:100%;height:100%;border-radius:inherit;object-fit:cover;vertical-align:top;}"
+]);
+const useIconInitialsClassName = /*#__PURE__*/ (0, _react.__resetStyles)("rip04v", "r31uzil", [
+    ".rip04v{position:absolute;box-sizing:border-box;top:0;left:0;width:100%;height:100%;line-height:1;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);display:flex;align-items:center;justify-content:center;vertical-align:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:inherit;}",
+    ".r31uzil{position:absolute;box-sizing:border-box;top:0;right:0;width:100%;height:100%;line-height:1;border:var(--strokeWidthThin) solid var(--colorTransparentStroke);display:flex;align-items:center;justify-content:center;vertical-align:center;text-align:center;-webkit-user-select:none;-moz-user-select:none;user-select:none;border-radius:inherit;}"
+]);
+/**
+ * Helper to create a maskImage that punches out a circle larger than the badge by `badgeGap`.
+ * This creates a transparent gap between the badge and Avatar.
+ *
+ * Used by the icon, initials, and image slots, as well as the ring ::before pseudo-element.
+ */ const badgeMask = (margin)=>{
+    // Center the cutout at the badge's radius away from the edge.
+    // The ring (::before) also has a 2 * ringWidth margin that also needs to be offset.
+    const centerOffset = margin ? `calc(var(${vars.badgeRadius}) + ${margin})` : `var(${vars.badgeRadius})`;
+    // radial-gradient does not have anti-aliasing, so the transparent and opaque gradient stops are offset by +/- 0.25px
+    // to "fade" from transparent to opaque over a half-pixel and ease the transition.
+    const innerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) - 0.25px)`;
+    const outerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) + 0.25px)`;
+    return `radial-gradient(circle at bottom ${centerOffset} var(${vars.badgeAlign}) ${centerOffset}, ` + `transparent ${innerRadius}, white ${outerRadius})`;
+};
+const useStyles = /*#__PURE__*/ (0, _react.__styles)({
+    textCaption2Strong: {
+        Be2twd7: "f13mqy1h"
+    },
+    textCaption1Strong: {
+        Be2twd7: "fy9rknc"
+    },
+    textSubtitle2: {
+        Be2twd7: "fod5ikn"
+    },
+    textSubtitle1: {
+        Be2twd7: "f1pp30po"
+    },
+    textTitle3: {
+        Be2twd7: "f1x0m3f5"
+    },
+    squareSmall: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "fq9zq91"
+    },
+    squareMedium: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "ft85np5"
+    },
+    squareLarge: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "f1o0qvyv"
+    },
+    squareXLarge: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "f1kijzfu"
+    },
+    activeOrInactive: {
+        Bz10aip: "ftfx35i",
+        Bmy1vo4: "fv0atk9",
+        B3o57yi: "f1iry5bo",
+        Bkqvd7p: "f15n41j8",
+        Hwfdqs: "f1onx1g3"
+    },
+    ring: {
+        Ftih45: "f1wl9k8s"
+    },
+    ringBadgeCutout: {
+        f4a502: "fp2gujx"
+    },
+    ringThick: {
+        of393c: "fq1w1vq"
+    },
+    ringThicker: {
+        of393c: "fzg6ace"
+    },
+    ringThickest: {
+        of393c: "f1nu8p71"
+    },
+    shadow: {
+        Bsft5z2: "f13zj6fq"
+    },
+    shadow4: {
+        Be6vj1x: "fcjn15l"
+    },
+    shadow8: {
+        Be6vj1x: "f1tm8t9f"
+    },
+    shadow16: {
+        Be6vj1x: "f1a1aohj"
+    },
+    shadow28: {
+        Be6vj1x: "fond6v5"
+    },
+    inactive: {
+        abs64n: "fp25eh",
+        Bz10aip: "f1clczzi",
+        Bkqvd7p: "f1l3s34x",
+        Bfgortx: 0,
+        Bnvr3x9: 0,
+        b2tv09: 0,
+        Bucmhp4: 0,
+        iayac2: "flkahu5",
+        b6ubon: "fw457kn",
+        Bqinb2h: "f1wmllxl"
+    },
+    badge: {
+        qhf8xq: "f1euv43f",
+        B5kzvoi: "f1yab3r1",
+        j35jbq: [
+            "f1e31b4d",
+            "f1vgc2s3"
+        ]
+    },
+    badgeCutout: {
+        btxmck: "f1eugkqs"
+    },
+    badgeAlign: {
+        Dnlfbu: [
+            "f1tlnv9o",
+            "f1y9kyih"
+        ]
+    },
+    tiny: {
+        Bdjeniz: "f1uwoubl",
+        niu6jh: "fid048z"
+    },
+    "extra-small": {
+        Bdjeniz: "f13ar0e0",
+        niu6jh: "fid048z"
+    },
+    small: {
+        Bdjeniz: "fwwuruf",
+        niu6jh: "fid048z"
+    },
+    medium: {
+        Bdjeniz: "f1af27q5",
+        niu6jh: "fid048z"
+    },
+    large: {
+        Bdjeniz: "f18yy57a",
+        niu6jh: "f924bxt"
+    },
+    "extra-large": {
+        Bdjeniz: "f2jg042",
+        niu6jh: "f924bxt"
+    },
+    icon12: {
+        Be2twd7: "f1ugzwwg"
+    },
+    icon16: {
+        Be2twd7: "f4ybsrx"
+    },
+    icon20: {
+        Be2twd7: "fe5j1ua"
+    },
+    icon24: {
+        Be2twd7: "f1rt2boy"
+    },
+    icon28: {
+        Be2twd7: "f24l1pt"
+    },
+    icon32: {
+        Be2twd7: "ffl51b"
+    },
+    icon48: {
+        Be2twd7: "f18m8u13"
+    }
+}, {
+    d: [
+        ".f13mqy1h{font-size:var(--fontSizeBase100);}",
+        ".fy9rknc{font-size:var(--fontSizeBase200);}",
+        ".fod5ikn{font-size:var(--fontSizeBase400);}",
+        ".f1pp30po{font-size:var(--fontSizeBase500);}",
+        ".f1x0m3f5{font-size:var(--fontSizeBase600);}",
+        [
+            ".fq9zq91{border-radius:var(--borderRadiusSmall);}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".ft85np5{border-radius:var(--borderRadiusMedium);}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1o0qvyv{border-radius:var(--borderRadiusLarge);}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1kijzfu{border-radius:var(--borderRadiusXLarge);}",
+            {
+                p: -1
+            }
+        ],
+        ".ftfx35i{transform:perspective(1px);}",
+        ".fv0atk9{transition-property:transform,opacity;}",
+        ".f1iry5bo{transition-duration:var(--durationUltraSlow),var(--durationFaster);}",
+        ".f15n41j8{transition-timing-function:var(--curveEasyEaseMax),var(--curveLinear);}",
+        ".f1wl9k8s::before{content:\"\";}",
+        ".fp2gujx::before{-webkit-mask-image:radial-gradient(circle at bottom calc(var(--fui-Avatar-badgeRadius) + 2 * var(--fui-Avatar-ringWidth)) var(--fui-Avatar-badgeAlign) calc(var(--fui-Avatar-badgeRadius) + 2 * var(--fui-Avatar-ringWidth)), transparent calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) - 0.25px), white calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) + 0.25px));mask-image:radial-gradient(circle at bottom calc(var(--fui-Avatar-badgeRadius) + 2 * var(--fui-Avatar-ringWidth)) var(--fui-Avatar-badgeAlign) calc(var(--fui-Avatar-badgeRadius) + 2 * var(--fui-Avatar-ringWidth)), transparent calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) - 0.25px), white calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) + 0.25px));}",
+        ".fq1w1vq{--fui-Avatar-ringWidth:var(--strokeWidthThick);}",
+        ".fzg6ace{--fui-Avatar-ringWidth:var(--strokeWidthThicker);}",
+        ".f1nu8p71{--fui-Avatar-ringWidth:var(--strokeWidthThickest);}",
+        ".f13zj6fq::after{content:\"\";}",
+        ".fcjn15l::after{box-shadow:var(--shadow4);}",
+        ".f1tm8t9f::after{box-shadow:var(--shadow8);}",
+        ".f1a1aohj::after{box-shadow:var(--shadow16);}",
+        ".fond6v5::after{box-shadow:var(--shadow28);}",
+        ".fp25eh{opacity:0.8;}",
+        ".f1clczzi{transform:scale(0.875);}",
+        ".f1l3s34x{transition-timing-function:var(--curveDecelerateMin),var(--curveLinear);}",
+        [
+            ".flkahu5::before,.flkahu5::after{margin:0;}",
+            {
+                p: -1
+            }
+        ],
+        ".fw457kn::before,.fw457kn::after{opacity:0;}",
+        ".f1wmllxl::before,.f1wmllxl::after{transition-timing-function:var(--curveDecelerateMin),var(--curveLinear);}",
+        ".f1euv43f{position:absolute;}",
+        ".f1yab3r1{bottom:0;}",
+        ".f1e31b4d{right:0;}",
+        ".f1vgc2s3{left:0;}",
+        ".f1eugkqs{-webkit-mask-image:radial-gradient(circle at bottom var(--fui-Avatar-badgeRadius) var(--fui-Avatar-badgeAlign) var(--fui-Avatar-badgeRadius), transparent calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) - 0.25px), white calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) + 0.25px));mask-image:radial-gradient(circle at bottom var(--fui-Avatar-badgeRadius) var(--fui-Avatar-badgeAlign) var(--fui-Avatar-badgeRadius), transparent calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) - 0.25px), white calc(var(--fui-Avatar-badgeRadius) + var(--fui-Avatar-badgeGap) + 0.25px));}",
+        ".f1tlnv9o{--fui-Avatar-badgeAlign:right;}",
+        ".f1y9kyih{--fui-Avatar-badgeAlign:left;}",
+        ".f1uwoubl{--fui-Avatar-badgeRadius:3px;}",
+        ".fid048z{--fui-Avatar-badgeGap:var(--strokeWidthThin);}",
+        ".f13ar0e0{--fui-Avatar-badgeRadius:5px;}",
+        ".fwwuruf{--fui-Avatar-badgeRadius:6px;}",
+        ".f1af27q5{--fui-Avatar-badgeRadius:8px;}",
+        ".f18yy57a{--fui-Avatar-badgeRadius:10px;}",
+        ".f924bxt{--fui-Avatar-badgeGap:var(--strokeWidthThick);}",
+        ".f2jg042{--fui-Avatar-badgeRadius:14px;}",
+        ".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;}"
+    ],
+    m: [
+        [
+            "@media screen and (prefers-reduced-motion: reduce){.f1onx1g3{transition-duration:0.01ms;}}",
+            {
+                m: "screen and (prefers-reduced-motion: reduce)"
+            }
+        ]
+    ]
+});
+const useSizeStyles = /*#__PURE__*/ (0, _react.__styles)({
+    "16": {
+        a9b677: "fjw5fx7",
+        Bqenvij: "fd461yt"
+    },
+    "20": {
+        a9b677: "f64fuq3",
+        Bqenvij: "fjamq6b"
+    },
+    "24": {
+        a9b677: "fq4mcun",
+        Bqenvij: "frvgh55"
+    },
+    "28": {
+        a9b677: "f1w9dchk",
+        Bqenvij: "fxldao9"
+    },
+    "32": {
+        a9b677: "f1szoe96",
+        Bqenvij: "f1d2rq10"
+    },
+    "36": {
+        a9b677: "fpdz1er",
+        Bqenvij: "f8ljn23"
+    },
+    "40": {
+        a9b677: "feqmc2u",
+        Bqenvij: "fbhnoac"
+    },
+    "48": {
+        a9b677: "f124akge",
+        Bqenvij: "ff2sm71"
+    },
+    "56": {
+        a9b677: "f1u66zr1",
+        Bqenvij: "fzki0ko"
+    },
+    "64": {
+        a9b677: "fa9ln6p",
+        Bqenvij: "f16k9i2m"
+    },
+    "72": {
+        a9b677: "fhcae8x",
+        Bqenvij: "f1shusfg"
+    },
+    "96": {
+        a9b677: "f1kyr2gn",
+        Bqenvij: "fypu0ge"
+    },
+    "120": {
+        a9b677: "fwfqyga",
+        Bqenvij: "fjr5b71"
+    },
+    "128": {
+        a9b677: "f1iksgmy",
+        Bqenvij: "fele2au"
+    }
+}, {
+    d: [
+        ".fjw5fx7{width:16px;}",
+        ".fd461yt{height:16px;}",
+        ".f64fuq3{width:20px;}",
+        ".fjamq6b{height:20px;}",
+        ".fq4mcun{width:24px;}",
+        ".frvgh55{height:24px;}",
+        ".f1w9dchk{width:28px;}",
+        ".fxldao9{height:28px;}",
+        ".f1szoe96{width:32px;}",
+        ".f1d2rq10{height:32px;}",
+        ".fpdz1er{width:36px;}",
+        ".f8ljn23{height:36px;}",
+        ".feqmc2u{width:40px;}",
+        ".fbhnoac{height:40px;}",
+        ".f124akge{width:48px;}",
+        ".ff2sm71{height:48px;}",
+        ".f1u66zr1{width:56px;}",
+        ".fzki0ko{height:56px;}",
+        ".fa9ln6p{width:64px;}",
+        ".f16k9i2m{height:64px;}",
+        ".fhcae8x{width:72px;}",
+        ".f1shusfg{height:72px;}",
+        ".f1kyr2gn{width:96px;}",
+        ".fypu0ge{height:96px;}",
+        ".fwfqyga{width:120px;}",
+        ".fjr5b71{height:120px;}",
+        ".f1iksgmy{width:128px;}",
+        ".fele2au{height:128px;}"
+    ]
+});
+const useColorStyles = /*#__PURE__*/ (0, _react.__styles)({
+    neutral: {
+        sj55zd: "f11d4kpn",
+        De3pzq: "f18f03hv"
+    },
+    brand: {
+        sj55zd: "fonrgv7",
+        De3pzq: "f1blnnmj"
+    },
+    "dark-red": {
+        sj55zd: "fqjd1y1",
+        De3pzq: "f1vq2oo4"
+    },
+    cranberry: {
+        sj55zd: "fg9gses",
+        De3pzq: "f1lwxszt"
+    },
+    red: {
+        sj55zd: "f23f7i0",
+        De3pzq: "f1q9qhfq"
+    },
+    pumpkin: {
+        sj55zd: "fjnan08",
+        De3pzq: "fz91bi3"
+    },
+    peach: {
+        sj55zd: "fknu15p",
+        De3pzq: "f1b9nr51"
+    },
+    marigold: {
+        sj55zd: "f9603vw",
+        De3pzq: "f3z4w6d"
+    },
+    gold: {
+        sj55zd: "fmq0uwp",
+        De3pzq: "fg50kya"
+    },
+    brass: {
+        sj55zd: "f28g5vo",
+        De3pzq: "f4w2gd0"
+    },
+    brown: {
+        sj55zd: "ftl572b",
+        De3pzq: "f14wu1f4"
+    },
+    forest: {
+        sj55zd: "f1gymlvd",
+        De3pzq: "f19ut4y6"
+    },
+    seafoam: {
+        sj55zd: "fnnb6wn",
+        De3pzq: "f1n057jc"
+    },
+    "dark-green": {
+        sj55zd: "ff58qw8",
+        De3pzq: "f11t05wk"
+    },
+    "light-teal": {
+        sj55zd: "f1up9qbj",
+        De3pzq: "f42feg1"
+    },
+    teal: {
+        sj55zd: "f135dsb4",
+        De3pzq: "f6hvv1p"
+    },
+    steel: {
+        sj55zd: "f151dlcp",
+        De3pzq: "f1lnp8zf"
+    },
+    blue: {
+        sj55zd: "f1rjv50u",
+        De3pzq: "f1ggcpy6"
+    },
+    "royal-blue": {
+        sj55zd: "f1emykk5",
+        De3pzq: "f12rj61f"
+    },
+    cornflower: {
+        sj55zd: "fqsigj7",
+        De3pzq: "f8k7hur"
+    },
+    navy: {
+        sj55zd: "f1nj97xi",
+        De3pzq: "f19gw0ux"
+    },
+    lavender: {
+        sj55zd: "fwctg0i",
+        De3pzq: "ff379vm"
+    },
+    purple: {
+        sj55zd: "fjrsgpu",
+        De3pzq: "f1mzf1e1"
+    },
+    grape: {
+        sj55zd: "f1fiiydq",
+        De3pzq: "f1o4k8oy"
+    },
+    lilac: {
+        sj55zd: "f1res9jt",
+        De3pzq: "f1x6mz1o"
+    },
+    pink: {
+        sj55zd: "fv3fbbi",
+        De3pzq: "fydlv6t"
+    },
+    magenta: {
+        sj55zd: "f1f1fwnz",
+        De3pzq: "f4xb6j5"
+    },
+    plum: {
+        sj55zd: "f8ptl6j",
+        De3pzq: "fqo8e26"
+    },
+    beige: {
+        sj55zd: "f1ntv3ld",
+        De3pzq: "f101elhj"
+    },
+    mink: {
+        sj55zd: "f1fscmp",
+        De3pzq: "f13g8o5c"
+    },
+    platinum: {
+        sj55zd: "f1dr00v2",
+        De3pzq: "fkh7blw"
+    },
+    anchor: {
+        sj55zd: "f1f3ti53",
+        De3pzq: "fu4yj0j"
+    }
+}, {
+    d: [
+        ".f11d4kpn{color:var(--colorNeutralForeground3);}",
+        ".f18f03hv{background-color:var(--colorNeutralBackground6);}",
+        ".fonrgv7{color:var(--colorNeutralForegroundStaticInverted);}",
+        ".f1blnnmj{background-color:var(--colorBrandBackgroundStatic);}",
+        ".fqjd1y1{color:var(--colorPaletteDarkRedForeground2);}",
+        ".f1vq2oo4{background-color:var(--colorPaletteDarkRedBackground2);}",
+        ".fg9gses{color:var(--colorPaletteCranberryForeground2);}",
+        ".f1lwxszt{background-color:var(--colorPaletteCranberryBackground2);}",
+        ".f23f7i0{color:var(--colorPaletteRedForeground2);}",
+        ".f1q9qhfq{background-color:var(--colorPaletteRedBackground2);}",
+        ".fjnan08{color:var(--colorPalettePumpkinForeground2);}",
+        ".fz91bi3{background-color:var(--colorPalettePumpkinBackground2);}",
+        ".fknu15p{color:var(--colorPalettePeachForeground2);}",
+        ".f1b9nr51{background-color:var(--colorPalettePeachBackground2);}",
+        ".f9603vw{color:var(--colorPaletteMarigoldForeground2);}",
+        ".f3z4w6d{background-color:var(--colorPaletteMarigoldBackground2);}",
+        ".fmq0uwp{color:var(--colorPaletteGoldForeground2);}",
+        ".fg50kya{background-color:var(--colorPaletteGoldBackground2);}",
+        ".f28g5vo{color:var(--colorPaletteBrassForeground2);}",
+        ".f4w2gd0{background-color:var(--colorPaletteBrassBackground2);}",
+        ".ftl572b{color:var(--colorPaletteBrownForeground2);}",
+        ".f14wu1f4{background-color:var(--colorPaletteBrownBackground2);}",
+        ".f1gymlvd{color:var(--colorPaletteForestForeground2);}",
+        ".f19ut4y6{background-color:var(--colorPaletteForestBackground2);}",
+        ".fnnb6wn{color:var(--colorPaletteSeafoamForeground2);}",
+        ".f1n057jc{background-color:var(--colorPaletteSeafoamBackground2);}",
+        ".ff58qw8{color:var(--colorPaletteDarkGreenForeground2);}",
+        ".f11t05wk{background-color:var(--colorPaletteDarkGreenBackground2);}",
+        ".f1up9qbj{color:var(--colorPaletteLightTealForeground2);}",
+        ".f42feg1{background-color:var(--colorPaletteLightTealBackground2);}",
+        ".f135dsb4{color:var(--colorPaletteTealForeground2);}",
+        ".f6hvv1p{background-color:var(--colorPaletteTealBackground2);}",
+        ".f151dlcp{color:var(--colorPaletteSteelForeground2);}",
+        ".f1lnp8zf{background-color:var(--colorPaletteSteelBackground2);}",
+        ".f1rjv50u{color:var(--colorPaletteBlueForeground2);}",
+        ".f1ggcpy6{background-color:var(--colorPaletteBlueBackground2);}",
+        ".f1emykk5{color:var(--colorPaletteRoyalBlueForeground2);}",
+        ".f12rj61f{background-color:var(--colorPaletteRoyalBlueBackground2);}",
+        ".fqsigj7{color:var(--colorPaletteCornflowerForeground2);}",
+        ".f8k7hur{background-color:var(--colorPaletteCornflowerBackground2);}",
+        ".f1nj97xi{color:var(--colorPaletteNavyForeground2);}",
+        ".f19gw0ux{background-color:var(--colorPaletteNavyBackground2);}",
+        ".fwctg0i{color:var(--colorPaletteLavenderForeground2);}",
+        ".ff379vm{background-color:var(--colorPaletteLavenderBackground2);}",
+        ".fjrsgpu{color:var(--colorPalettePurpleForeground2);}",
+        ".f1mzf1e1{background-color:var(--colorPalettePurpleBackground2);}",
+        ".f1fiiydq{color:var(--colorPaletteGrapeForeground2);}",
+        ".f1o4k8oy{background-color:var(--colorPaletteGrapeBackground2);}",
+        ".f1res9jt{color:var(--colorPaletteLilacForeground2);}",
+        ".f1x6mz1o{background-color:var(--colorPaletteLilacBackground2);}",
+        ".fv3fbbi{color:var(--colorPalettePinkForeground2);}",
+        ".fydlv6t{background-color:var(--colorPalettePinkBackground2);}",
+        ".f1f1fwnz{color:var(--colorPaletteMagentaForeground2);}",
+        ".f4xb6j5{background-color:var(--colorPaletteMagentaBackground2);}",
+        ".f8ptl6j{color:var(--colorPalettePlumForeground2);}",
+        ".fqo8e26{background-color:var(--colorPalettePlumBackground2);}",
+        ".f1ntv3ld{color:var(--colorPaletteBeigeForeground2);}",
+        ".f101elhj{background-color:var(--colorPaletteBeigeBackground2);}",
+        ".f1fscmp{color:var(--colorPaletteMinkForeground2);}",
+        ".f13g8o5c{background-color:var(--colorPaletteMinkBackground2);}",
+        ".f1dr00v2{color:var(--colorPalettePlatinumForeground2);}",
+        ".fkh7blw{background-color:var(--colorPalettePlatinumBackground2);}",
+        ".f1f3ti53{color:var(--colorPaletteAnchorForeground2);}",
+        ".fu4yj0j{background-color:var(--colorPaletteAnchorBackground2);}"
+    ]
+});
+const useRingColorStyles = /*#__PURE__*/ (0, _react.__styles)({
+    neutral: {
+        Bic5iru: "f1uuiafn"
+    },
+    brand: {
+        Bic5iru: "f1uuiafn"
+    },
+    "dark-red": {
+        Bic5iru: "f1t2x9on"
+    },
+    cranberry: {
+        Bic5iru: "f1pvshc9"
+    },
+    red: {
+        Bic5iru: "f1ectbk9"
+    },
+    pumpkin: {
+        Bic5iru: "fvzpl0b"
+    },
+    peach: {
+        Bic5iru: "fwj2kd7"
+    },
+    marigold: {
+        Bic5iru: "fr120vy"
+    },
+    gold: {
+        Bic5iru: "f8xmmar"
+    },
+    brass: {
+        Bic5iru: "f1hbety2"
+    },
+    brown: {
+        Bic5iru: "f1vg3s4g"
+    },
+    forest: {
+        Bic5iru: "f1m3olm5"
+    },
+    seafoam: {
+        Bic5iru: "f17xiqtr"
+    },
+    "dark-green": {
+        Bic5iru: "fx32vyh"
+    },
+    "light-teal": {
+        Bic5iru: "f1mkihwv"
+    },
+    teal: {
+        Bic5iru: "fecnooh"
+    },
+    steel: {
+        Bic5iru: "f15hfgzm"
+    },
+    blue: {
+        Bic5iru: "fqproka"
+    },
+    "royal-blue": {
+        Bic5iru: "f17v2w59"
+    },
+    cornflower: {
+        Bic5iru: "fp0q1mo"
+    },
+    navy: {
+        Bic5iru: "f1nlym55"
+    },
+    lavender: {
+        Bic5iru: "f62vk8h"
+    },
+    purple: {
+        Bic5iru: "f15zl69q"
+    },
+    grape: {
+        Bic5iru: "f53w4j7"
+    },
+    lilac: {
+        Bic5iru: "fu2771t"
+    },
+    pink: {
+        Bic5iru: "fzflscs"
+    },
+    magenta: {
+        Bic5iru: "fb6rmqc"
+    },
+    plum: {
+        Bic5iru: "f1a4gm5b"
+    },
+    beige: {
+        Bic5iru: "f1qpf9z1"
+    },
+    mink: {
+        Bic5iru: "f1l7or83"
+    },
+    platinum: {
+        Bic5iru: "fzrj0iu"
+    },
+    anchor: {
+        Bic5iru: "f8oz6wf"
+    }
+}, {
+    d: [
+        ".f1uuiafn::before{color:var(--colorBrandStroke1);}",
+        ".f1t2x9on::before{color:var(--colorPaletteDarkRedBorderActive);}",
+        ".f1pvshc9::before{color:var(--colorPaletteCranberryBorderActive);}",
+        ".f1ectbk9::before{color:var(--colorPaletteRedBorderActive);}",
+        ".fvzpl0b::before{color:var(--colorPalettePumpkinBorderActive);}",
+        ".fwj2kd7::before{color:var(--colorPalettePeachBorderActive);}",
+        ".fr120vy::before{color:var(--colorPaletteMarigoldBorderActive);}",
+        ".f8xmmar::before{color:var(--colorPaletteGoldBorderActive);}",
+        ".f1hbety2::before{color:var(--colorPaletteBrassBorderActive);}",
+        ".f1vg3s4g::before{color:var(--colorPaletteBrownBorderActive);}",
+        ".f1m3olm5::before{color:var(--colorPaletteForestBorderActive);}",
+        ".f17xiqtr::before{color:var(--colorPaletteSeafoamBorderActive);}",
+        ".fx32vyh::before{color:var(--colorPaletteDarkGreenBorderActive);}",
+        ".f1mkihwv::before{color:var(--colorPaletteLightTealBorderActive);}",
+        ".fecnooh::before{color:var(--colorPaletteTealBorderActive);}",
+        ".f15hfgzm::before{color:var(--colorPaletteSteelBorderActive);}",
+        ".fqproka::before{color:var(--colorPaletteBlueBorderActive);}",
+        ".f17v2w59::before{color:var(--colorPaletteRoyalBlueBorderActive);}",
+        ".fp0q1mo::before{color:var(--colorPaletteCornflowerBorderActive);}",
+        ".f1nlym55::before{color:var(--colorPaletteNavyBorderActive);}",
+        ".f62vk8h::before{color:var(--colorPaletteLavenderBorderActive);}",
+        ".f15zl69q::before{color:var(--colorPalettePurpleBorderActive);}",
+        ".f53w4j7::before{color:var(--colorPaletteGrapeBorderActive);}",
+        ".fu2771t::before{color:var(--colorPaletteLilacBorderActive);}",
+        ".fzflscs::before{color:var(--colorPalettePinkBorderActive);}",
+        ".fb6rmqc::before{color:var(--colorPaletteMagentaBorderActive);}",
+        ".f1a4gm5b::before{color:var(--colorPalettePlumBorderActive);}",
+        ".f1qpf9z1::before{color:var(--colorPaletteBeigeBorderActive);}",
+        ".f1l7or83::before{color:var(--colorPaletteMinkBorderActive);}",
+        ".fzrj0iu::before{color:var(--colorPalettePlatinumBorderActive);}",
+        ".f8oz6wf::before{color:var(--colorPaletteAnchorBorderActive);}"
+    ]
+});
+const useAvatarStyles_unstable = (state)=>{
+    'use no memo';
+    const { size, shape, active, activeAppearance, color } = state;
+    const rootClassName = useRootClassName();
+    const imageClassName = useImageClassName();
+    const iconInitialsClassName = useIconInitialsClassName();
+    const styles = useStyles();
+    const sizeStyles = useSizeStyles();
+    const colorStyles = useColorStyles();
+    const ringColorStyles = useRingColorStyles();
+    const rootClasses = [
+        rootClassName,
+        size !== 32 && sizeStyles[size]
+    ];
+    if (state.badge) {
+        rootClasses.push(styles.badgeAlign, styles[state.badge.size || 'medium']);
+    }
+    if (size <= 24) {
+        rootClasses.push(styles.textCaption2Strong);
+    } else if (size <= 28) {
+        rootClasses.push(styles.textCaption1Strong);
+    } else if (size <= 40) {
+    // Default text size included in useRootClassName
+    } else if (size <= 56) {
+        rootClasses.push(styles.textSubtitle2);
+    } else if (size <= 96) {
+        rootClasses.push(styles.textSubtitle1);
+    } else {
+        rootClasses.push(styles.textTitle3);
+    }
+    if (shape === 'square') {
+        if (size <= 24) {
+            rootClasses.push(styles.squareSmall);
+        } else if (size <= 48) {
+            rootClasses.push(styles.squareMedium);
+        } else if (size <= 72) {
+            rootClasses.push(styles.squareLarge);
+        } else {
+            rootClasses.push(styles.squareXLarge);
+        }
+    }
+    if (active === 'active' || active === 'inactive') {
+        rootClasses.push(styles.activeOrInactive);
+        if (activeAppearance === 'ring' || activeAppearance === 'ring-shadow') {
+            rootClasses.push(styles.ring, ringColorStyles[color]);
+            if (state.badge) {
+                rootClasses.push(styles.ringBadgeCutout);
+            }
+            if (size <= 48) {
+                rootClasses.push(styles.ringThick);
+            } else if (size <= 64) {
+                rootClasses.push(styles.ringThicker);
+            } else {
+                rootClasses.push(styles.ringThickest);
+            }
+        }
+        if (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow') {
+            rootClasses.push(styles.shadow);
+            if (size <= 28) {
+                rootClasses.push(styles.shadow4);
+            } else if (size <= 48) {
+                rootClasses.push(styles.shadow8);
+            } else if (size <= 64) {
+                rootClasses.push(styles.shadow16);
+            } else {
+                rootClasses.push(styles.shadow28);
+            }
+        }
+        // Note: The inactive style overrides some of the activeAppearance styles and must be applied after them
+        if (active === 'inactive') {
+            rootClasses.push(styles.inactive);
+        }
+    }
+    state.root.className = (0, _react.mergeClasses)(avatarClassNames.root, ...rootClasses, state.root.className);
+    if (state.badge) {
+        state.badge.className = (0, _react.mergeClasses)(avatarClassNames.badge, styles.badge, state.badge.className);
+    }
+    if (state.image) {
+        state.image.className = (0, _react.mergeClasses)(avatarClassNames.image, imageClassName, colorStyles[color], state.badge && styles.badgeCutout, state.image.className);
+    }
+    if (state.initials) {
+        state.initials.className = (0, _react.mergeClasses)(avatarClassNames.initials, iconInitialsClassName, colorStyles[color], state.badge && styles.badgeCutout, state.initials.className);
+    }
+    if (state.icon) {
+        let iconSizeClass;
+        if (size <= 16) {
+            iconSizeClass = styles.icon12;
+        } else if (size <= 24) {
+            iconSizeClass = styles.icon16;
+        } else if (size <= 40) {
+            iconSizeClass = styles.icon20;
+        } else if (size <= 48) {
+            iconSizeClass = styles.icon24;
+        } else if (size <= 56) {
+            iconSizeClass = styles.icon28;
+        } else if (size <= 72) {
+            iconSizeClass = styles.icon32;
+        } else {
+            iconSizeClass = styles.icon48;
+        }
+        state.icon.className = (0, _react.mergeClasses)(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, colorStyles[color], state.badge && styles.badgeCutout, state.icon.className);
+    }
+    return state;
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/AvatarGroup.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "AvatarGroup", {
+    enumerable: true,
+    get: function() {
+        return AvatarGroup;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _renderAvatarGroup = require("./renderAvatarGroup");
+const _useAvatarGroup = require("./useAvatarGroup");
+const _useAvatarGroupContextValues = require("./useAvatarGroupContextValues");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useAvatarGroupStylesstyles = require("./useAvatarGroupStyles.styles");
+const AvatarGroup = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useAvatarGroup.useAvatarGroup_unstable)(props, ref);
+    const contextValues = (0, _useAvatarGroupContextValues.useAvatarGroupContextValues)(state);
+    (0, _useAvatarGroupStylesstyles.useAvatarGroupStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAvatarGroupStyles_unstable')(state);
+    return (0, _renderAvatarGroup.renderAvatarGroup_unstable)(state, contextValues);
+});
+AvatarGroup.displayName = 'AvatarGroup';

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/AvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nimport { useAvatarGroup_unstable } from './useAvatarGroup';\nimport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nimport type { AvatarGroupProps } from './AvatarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroup component represents a group of multiple people or entities by taking care of the arrangement\n * of individual Avatars in a spread, stack, or pie layout.\n */\nexport const AvatarGroup: ForwardRefComponent<AvatarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroup_unstable(props, ref);\n  const contextValues = useAvatarGroupContextValues(state);\n\n  useAvatarGroupStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupStyles_unstable')(state);\n\n  return renderAvatarGroup_unstable(state, contextValues);\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\n"],"names":["AvatarGroup","React","forwardRef","props","ref","state","useAvatarGroup_unstable","contextValues","useAvatarGroupContextValues","useAvatarGroupStyles_unstable","useCustomStyleHook_unstable","renderAvatarGroup_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAaaA;;;eAAAA;;;;iEAbU;mCACoB;gCACH;6CACI;qCACA;4CACE;AAQvC,MAAMA,cAAAA,WAAAA,GAAqDC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQC,IAAAA,uCAAAA,EAAwBH,OAAOC;IAC7C,MAAMG,gBAAgBC,IAAAA,wDAAAA,EAA4BH;IAElDI,IAAAA,yDAAAA,EAA8BJ;IAE9BK,IAAAA,gDAAAA,EAA4B,iCAAiCL;IAE7D,OAAOM,IAAAA,6CAAAA,EAA2BN,OAAOE;AAC3C;AAEAP,YAAYY,WAAW,GAAG"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/AvatarGroup.types.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/AvatarGroup.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/AvatarGroup.types.ts"],"sourcesContent":["import type { AvatarSize } from '../Avatar/Avatar.types';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AvatarGroupSlots = {\n  root: NonNullable<Slot<'div'>>;\n};\n\n/**\n * AvatarGroup Props\n */\nexport type AvatarGroupProps = ComponentProps<AvatarGroupSlots> & {\n  /**\n   * Layout the AvatarGroupItems should be displayed as.\n   * @default spread\n   */\n  layout?: 'spread' | 'stack' | 'pie';\n\n  /**\n   * Size of the AvatarGroupItems.\n   * @default 32\n   */\n  size?: AvatarSize;\n};\n\n/**\n * State used in rendering AvatarGroup\n */\nexport type AvatarGroupState = ComponentState<AvatarGroupSlots> & Required<Pick<AvatarGroupProps, 'layout' | 'size'>>;\n\nexport type AvatarGroupContextValue = Pick<AvatarGroupProps, 'size' | 'layout'> & {\n  isOverflow?: boolean;\n};\n\nexport type AvatarGroupContextValues = {\n  avatarGroup: AvatarGroupContextValue;\n};\n"],"names":[],"rangeMappings":"","mappings":""}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/index.js

@@ -0,0 +1,38 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    AvatarGroup: function() {
+        return _AvatarGroup.AvatarGroup;
+    },
+    avatarGroupClassNames: function() {
+        return _useAvatarGroupStylesstyles.avatarGroupClassNames;
+    },
+    defaultAvatarGroupSize: function() {
+        return _useAvatarGroup.defaultAvatarGroupSize;
+    },
+    renderAvatarGroup_unstable: function() {
+        return _renderAvatarGroup.renderAvatarGroup_unstable;
+    },
+    useAvatarGroupContextValues: function() {
+        return _useAvatarGroupContextValues.useAvatarGroupContextValues;
+    },
+    useAvatarGroupStyles_unstable: function() {
+        return _useAvatarGroupStylesstyles.useAvatarGroupStyles_unstable;
+    },
+    useAvatarGroup_unstable: function() {
+        return _useAvatarGroup.useAvatarGroup_unstable;
+    }
+});
+const _AvatarGroup = require("./AvatarGroup");
+const _renderAvatarGroup = require("./renderAvatarGroup");
+const _useAvatarGroup = require("./useAvatarGroup");
+const _useAvatarGroupStylesstyles = require("./useAvatarGroupStyles.styles");
+const _useAvatarGroupContextValues = require("./useAvatarGroupContextValues");

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/index.ts"],"sourcesContent":["export { AvatarGroup } from './AvatarGroup';\nexport type {\n  AvatarGroupContextValue,\n  AvatarGroupContextValues,\n  AvatarGroupProps,\n  AvatarGroupSlots,\n  AvatarGroupState,\n} from './AvatarGroup.types';\nexport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nexport { defaultAvatarGroupSize, useAvatarGroup_unstable } from './useAvatarGroup';\nexport { avatarGroupClassNames, useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nexport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\n"],"names":["AvatarGroup","avatarGroupClassNames","defaultAvatarGroupSize","renderAvatarGroup_unstable","useAvatarGroupContextValues","useAvatarGroupStyles_unstable","useAvatarGroup_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,WAAW;eAAXA,wBAAW;;IAUXC,qBAAqB;eAArBA,iDAAqB;;IADrBC,sBAAsB;eAAtBA,sCAAsB;;IADtBC,0BAA0B;eAA1BA,6CAA0B;;IAG1BC,2BAA2B;eAA3BA,wDAA2B;;IADJC,6BAA6B;eAA7BA,yDAA6B;;IAD5BC,uBAAuB;eAAvBA,uCAAuB;;;6BAT5B;mCAQe;gCACqB;4CACK;6CACzB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderAvatarGroup_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderAvatarGroup_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const _AvatarGroupContext = require("../../contexts/AvatarGroupContext");
+const renderAvatarGroup_unstable = (state, contextValues)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsx)(_AvatarGroupContext.AvatarGroupProvider, {
+        value: contextValues.avatarGroup,
+        children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.root, {})
+    });
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/renderAvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport type { AvatarGroupState, AvatarGroupSlots, AvatarGroupContextValues } from './AvatarGroup.types';\n\n/**\n * Render the final JSX of AvatarGroup\n */\nexport const renderAvatarGroup_unstable = (state: AvatarGroupState, contextValues: AvatarGroupContextValues) => {\n  assertSlots<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <state.root />\n    </AvatarGroupProvider>\n  );\n};\n"],"names":["renderAvatarGroup_unstable","state","contextValues","assertSlots","_jsx","AvatarGroupProvider","value","avatarGroup","root"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAUaA;;;eAAAA;;;4BATb;gCAE4B;oCACQ;AAM7B,MAAMA,6BAA6B,CAACC,OAAyBC;IAClEC,IAAAA,2BAAAA,EAA8BF;IAE9B,OAAA,WAAA,GACEG,IAAAA,eAAA,EAACC,uCAAAA,EAAAA;QAAoBC,OAAOJ,cAAcK,WAAW;kBACnD,WAAA,GAAAH,IAAAA,eAAA,EAACH,MAAMO,IAAI,EAAA,CAAA;;AAGjB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroup.js

@@ -0,0 +1,45 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    defaultAvatarGroupSize: function() {
+        return defaultAvatarGroupSize;
+    },
+    useAvatarGroup_unstable: function() {
+        return useAvatarGroup_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _reactutilities = require("@fluentui/react-utilities");
+const useAvatarGroup_unstable = (props, ref)=>{
+    const { layout = 'spread', size = defaultAvatarGroupSize } = props;
+    const root = _reactutilities.slot.always((0, _reactutilities.getIntrinsicElementProps)('div', {
+        role: 'group',
+        ...props,
+        // FIXME:
+        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`
+        // but since it would be a breaking change to fix it, we are casting ref to it's proper type
+        ref: ref
+    }, [
+        'size'
+    ]), {
+        elementType: 'div'
+    });
+    return {
+        layout,
+        size,
+        components: {
+            root: 'div'
+        },
+        root
+    };
+};
+const defaultAvatarGroupSize = 32;

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/useAvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { AvatarGroupProps, AvatarGroupState } from './AvatarGroup.types';\n\n/**\n * Create the state required to render AvatarGroup.\n *\n * The returned state can be modified with hooks such as useAvatarGroupStyles_unstable,\n * before being passed to renderAvatarGroup_unstable.\n *\n * @param props - props from this instance of AvatarGroup\n * @param ref - reference to root HTMLElement of AvatarGroup\n */\nexport const useAvatarGroup_unstable = (props: AvatarGroupProps, ref: React.Ref<HTMLElement>): AvatarGroupState => {\n  const { layout = 'spread', size = defaultAvatarGroupSize } = props;\n\n  const root = slot.always(\n    getIntrinsicElementProps(\n      'div',\n      {\n        role: 'group',\n        ...props,\n        // FIXME:\n        // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n        // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n        ref: ref as React.Ref<HTMLDivElement>,\n      },\n      ['size'],\n    ),\n    { elementType: 'div' },\n  );\n  return { layout, size, components: { root: 'div' }, root };\n};\n\nexport const defaultAvatarGroupSize = 32;\n"],"names":["defaultAvatarGroupSize","useAvatarGroup_unstable","props","ref","layout","size","root","slot","always","getIntrinsicElementProps","role","elementType","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAkCaA,sBAAAA;eAAAA;;IArBAC,uBAAAA;eAAAA;;;;iEAbU;gCACwB;AAYxC,MAAMA,0BAA0B,CAACC,OAAyBC;IAC/D,MAAM,EAAEC,SAAS,QAAQ,EAAEC,OAAOL,sBAAsB,EAAE,GAAGE;IAE7D,MAAMI,OAAOC,oBAAAA,CAAKC,MAAM,CACtBC,IAAAA,wCAAAA,EACE,OACA;QACEC,MAAM;QACN,GAAGR,KAAK;QACR,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FC,KAAKA;IACP,GACA;QAAC;KAAO,GAEV;QAAEQ,aAAa;IAAM;IAEvB,OAAO;QAAEP;QAAQC;QAAMO,YAAY;YAAEN,MAAM;QAAM;QAAGA;IAAK;AAC3D;AAEO,MAAMN,yBAAyB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAvatarGroupContextValues", {
+    enumerable: true,
+    get: function() {
+        return useAvatarGroupContextValues;
+    }
+});
+const useAvatarGroupContextValues = (state)=>{
+    const { layout, size } = state;
+    const avatarGroup = {
+        layout,
+        size
+    };
+    return {
+        avatarGroup
+    };
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroupContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroup/useAvatarGroupContextValues.ts"],"sourcesContent":["import { AvatarGroupContextValue, AvatarGroupContextValues, AvatarGroupState } from '../AvatarGroup';\n\nexport const useAvatarGroupContextValues = (state: AvatarGroupState): AvatarGroupContextValues => {\n  const { layout, size } = state;\n\n  const avatarGroup: AvatarGroupContextValue = {\n    layout,\n    size,\n  };\n\n  return { avatarGroup };\n};\n"],"names":["useAvatarGroupContextValues","state","layout","size","avatarGroup"],"rangeMappings":";;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAEaA;;;eAAAA;;;AAAN,MAAMA,8BAA8B,CAACC;IAC1C,MAAM,EAAEC,MAAM,EAAEC,IAAI,EAAE,GAAGF;IAEzB,MAAMG,cAAuC;QAC3CF;QACAC;IACF;IAEA,OAAO;QAAEC;IAAY;AACvB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.styles.js

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    avatarGroupClassNames: function() {
+        return avatarGroupClassNames;
+    },
+    useAvatarGroupStyles_unstable: function() {
+        return useAvatarGroupStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _useAvatarStylesstyles = require("../Avatar/useAvatarStyles.styles");
+const avatarGroupClassNames = {
+    root: 'fui-AvatarGroup'
+};
+/**
+ * Styles for the root slot.
+ */ const useStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        mc9l5x: "ftuwxu6",
+        qhf8xq: "f10pi13n"
+    },
+    pie: {
+        Bgl5zvf: "f1uz6ud1",
+        De3pzq: "f1ganh6p",
+        Bsw6fvg: "fe2ae1k"
+    }
+}, {
+    d: [
+        ".ftuwxu6{display:inline-flex;}",
+        ".f10pi13n{position:relative;}",
+        ".f1uz6ud1{clip-path:circle(50%);}",
+        ".f1ganh6p{background-color:var(--colorTransparentStroke);}"
+    ],
+    m: [
+        [
+            "@media (forced-colors: active){.fe2ae1k{background-color:CanvasText;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ]
+    ]
+});
+const useAvatarGroupStyles_unstable = (state)=>{
+    'use no memo';
+    const { layout, size } = state;
+    const styles = useStyles();
+    const sizeStyles = (0, _useAvatarStylesstyles.useSizeStyles)();
+    state.root.className = (0, _react.mergeClasses)(avatarGroupClassNames.root, styles.base, layout === 'pie' && sizeStyles[size], layout === 'pie' && styles.pie, state.root.className);
+    return state;
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroup/useAvatarGroupStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAvatarGroupStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nexport const avatarGroupClassNames = {\n    root: 'fui-AvatarGroup'\n};\n/**\n * Styles for the root slot.\n */ const useStyles = makeStyles({\n    base: {\n        display: 'inline-flex',\n        position: 'relative'\n    },\n    pie: {\n        clipPath: 'circle(50%)',\n        backgroundColor: tokens.colorTransparentStroke,\n        '@media (forced-colors: active)': {\n            backgroundColor: 'CanvasText'\n        }\n    }\n});\n/**\n * Apply styling to the AvatarGroup slots based on the state\n */ export const useAvatarGroupStyles_unstable = (state)=>{\n    'use no memo';\n    const { layout, size } = state;\n    const styles = useStyles();\n    const sizeStyles = useSizeStyles();\n    state.root.className = mergeClasses(avatarGroupClassNames.root, styles.base, layout === 'pie' && sizeStyles[size], layout === 'pie' && styles.pie, state.root.className);\n    return state;\n};\n"],"names":["avatarGroupClassNames","useAvatarGroupStyles_unstable","root","useStyles","__styles","base","mc9l5x","qhf8xq","pie","Bgl5zvf","De3pzq","Bsw6fvg","d","m","state","layout","size","styles","sizeStyles","useSizeStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAGaA,qBAAqB;eAArBA;;IAoBIC,6BAA6B;eAA7BA;;;uBAvBwB;uCAEX;AACvB,MAAMD,wBAAwB;IACjCE,MAAM;AACV;AACA;;CAEA,GAAI,MAAMC,YAAS,WAAA,GAAGC,IAAAA,eAAA,EAAA;IAAAC,MAAA;QAAAC,QAAA;QAAAC,QAAA;IAAA;IAAAC,KAAA;QAAAC,SAAA;QAAAC,QAAA;QAAAC,SAAA;IAAA;AAAA,GAAA;IAAAC,GAAA;QAAA;QAAA;QAAA;QAAA;KAAA;IAAAC,GAAA;QAAA;YAAA;YAAA;gBAAAA,GAAA;YAAA;SAAA;KAAA;AAAA;AAeX,MAAMZ,gCAAiCa,CAAAA;IAC9C;IACA,MAAM,EAAEC,MAAM,EAAEC,IAAAA,EAAM,GAAGF;IACzB,MAAMG,SAASd;IACf,MAAMe,aAAaC,IAAAA,oCAAa;IAChCL,MAAMZ,IAAI,CAACkB,SAAS,GAAGC,IAAAA,mBAAY,EAACrB,sBAAsBE,IAAI,EAAEe,OAAOZ,IAAI,EAAEU,WAAW,SAASG,UAAU,CAACF,KAAK,EAAED,WAAW,SAASE,OAAOT,GAAG,EAAEM,MAAMZ,IAAI,CAACkB,SAAS;IACvK,OAAON;AACX"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js

@@ -0,0 +1,23 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "AvatarGroupItem", {
+    enumerable: true,
+    get: function() {
+        return AvatarGroupItem;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _renderAvatarGroupItem = require("./renderAvatarGroupItem");
+const _useAvatarGroupItem = require("./useAvatarGroupItem");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useAvatarGroupItemStylesstyles = require("./useAvatarGroupItemStyles.styles");
+const AvatarGroupItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
+    const state = (0, _useAvatarGroupItem.useAvatarGroupItem_unstable)(props, ref);
+    (0, _useAvatarGroupItemStylesstyles.useAvatarGroupItemStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAvatarGroupItemStyles_unstable')(state);
+    return (0, _renderAvatarGroupItem.renderAvatarGroupItem_unstable)(state);
+});
+AvatarGroupItem.displayName = 'AvatarGroupItem';

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupItem/AvatarGroupItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupItem_unstable } from './renderAvatarGroupItem';\nimport { useAvatarGroupItem_unstable } from './useAvatarGroupItem';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles.styles';\nimport type { AvatarGroupItemProps } from './AvatarGroupItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroupItem component represents a single person or entity.\n * AvatarGroupItem should only be used in an AvatarGroup component.\n */\nexport const AvatarGroupItem: ForwardRefComponent<AvatarGroupItemProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroupItem_unstable(props, ref);\n\n  useAvatarGroupItemStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupItemStyles_unstable')(state);\n\n  return renderAvatarGroupItem_unstable(state);\n});\n\nAvatarGroupItem.displayName = 'AvatarGroupItem';\n"],"names":["AvatarGroupItem","React","forwardRef","props","ref","state","useAvatarGroupItem_unstable","useAvatarGroupItemStyles_unstable","useCustomStyleHook_unstable","renderAvatarGroupItem_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;;iEAZU;uCACwB;oCACH;qCACA;gDACM;AAQ3C,MAAMA,kBAAAA,WAAAA,GAA6DC,OAAMC,UAAU,CAAC,CAACC,OAAOC;IACjG,MAAMC,QAAQC,IAAAA,+CAAAA,EAA4BH,OAAOC;IAEjDG,IAAAA,iEAAAA,EAAkCF;IAElCG,IAAAA,gDAAAA,EAA4B,qCAAqCH;IAEjE,OAAOI,IAAAA,qDAAAA,EAA+BJ;AACxC;AAEAL,gBAAgBU,WAAW,GAAG"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.types.js

@@ -0,0 +1,6 @@
+/**
+ * State used in rendering AvatarGroupItem
+ */ "use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/AvatarGroupItem.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupItem/AvatarGroupItem.types.ts"],"sourcesContent":["import { AvatarGroupProps } from '../AvatarGroup/AvatarGroup.types';\nimport type { Avatar, AvatarSize } from '../../Avatar';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type AvatarGroupItemSlots = {\n  root: NonNullable<Slot<'div', 'li'>>;\n\n  /**\n   * Avatar that represents a person or entity.\n   */\n  avatar: NonNullable<Slot<typeof Avatar>>;\n\n  /**\n   * Label used for the name of the AvatarGroupItem when rendered as an overflow item.\n   * The content of the label, by default, is the `name` prop from the `avatar` slot.\n   */\n  overflowLabel: NonNullable<Slot<'span'>>;\n};\n\n/**\n * AvatarGroupItem Props\n */\nexport type AvatarGroupItemProps = Omit<ComponentProps<Partial<AvatarGroupItemSlots>, 'avatar'>, 'size' | 'shape'>;\n\n/**\n * State used in rendering AvatarGroupItem\n */\nexport type AvatarGroupItemState = ComponentState<AvatarGroupItemSlots> & {\n  /**\n   * Whether the Avatar is an overflow item.\n   *\n   * @default false\n   */\n  isOverflowItem?: boolean;\n\n  layout: AvatarGroupProps['layout'];\n  size: AvatarSize;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAwBA;;CAEC"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/index.js

@@ -0,0 +1,34 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    AvatarGroupItem: function() {
+        return _AvatarGroupItem.AvatarGroupItem;
+    },
+    avatarGroupItemClassNames: function() {
+        return _useAvatarGroupItemStylesstyles.avatarGroupItemClassNames;
+    },
+    renderAvatarGroupItem_unstable: function() {
+        return _renderAvatarGroupItem.renderAvatarGroupItem_unstable;
+    },
+    useAvatarGroupItemStyles_unstable: function() {
+        return _useAvatarGroupItemStylesstyles.useAvatarGroupItemStyles_unstable;
+    },
+    useAvatarGroupItem_unstable: function() {
+        return _useAvatarGroupItem.useAvatarGroupItem_unstable;
+    },
+    useGroupChildClassName: function() {
+        return _useAvatarGroupItemStylesstyles.useGroupChildClassName;
+    }
+});
+const _AvatarGroupItem = require("./AvatarGroupItem");
+const _renderAvatarGroupItem = require("./renderAvatarGroupItem");
+const _useAvatarGroupItem = require("./useAvatarGroupItem");
+const _useAvatarGroupItemStylesstyles = require("./useAvatarGroupItemStyles.styles");

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupItem/index.ts"],"sourcesContent":["export { AvatarGroupItem } from './AvatarGroupItem';\nexport type { AvatarGroupItemProps, AvatarGroupItemSlots, AvatarGroupItemState } from './AvatarGroupItem.types';\nexport { renderAvatarGroupItem_unstable } from './renderAvatarGroupItem';\nexport { useAvatarGroupItem_unstable } from './useAvatarGroupItem';\nexport {\n  avatarGroupItemClassNames,\n  useAvatarGroupItemStyles_unstable,\n  useGroupChildClassName,\n} from './useAvatarGroupItemStyles.styles';\n"],"names":["AvatarGroupItem","avatarGroupItemClassNames","renderAvatarGroupItem_unstable","useAvatarGroupItemStyles_unstable","useAvatarGroupItem_unstable","useGroupChildClassName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,eAAe;eAAfA,gCAAe;;IAKtBC,yBAAyB;eAAzBA,yDAAyB;;IAHlBC,8BAA8B;eAA9BA,qDAA8B;;IAIrCC,iCAAiC;eAAjCA,iEAAiC;;IAH1BC,2BAA2B;eAA3BA,+CAA2B;;IAIlCC,sBAAsB;eAAtBA,sDAAsB;;;iCAPQ;uCAEe;oCACH;gDAKrC"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/renderAvatarGroupItem.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderAvatarGroupItem_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderAvatarGroupItem_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _reactutilities = require("@fluentui/react-utilities");
+const renderAvatarGroupItem_unstable = (state)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(state.avatar, {}),
+            state.isOverflowItem && /*#__PURE__*/ (0, _jsxruntime.jsx)(state.overflowLabel, {})
+        ]
+    });
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/renderAvatarGroupItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupItem/renderAvatarGroupItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { AvatarGroupItemState, AvatarGroupItemSlots } from './AvatarGroupItem.types';\n\n/**\n * Render the final JSX of AvatarGroupItem\n */\nexport const renderAvatarGroupItem_unstable = (state: AvatarGroupItemState) => {\n  assertSlots<AvatarGroupItemSlots>(state);\n\n  return (\n    <state.root>\n      <state.avatar />\n      {state.isOverflowItem && <state.overflowLabel />}\n    </state.root>\n  );\n};\n"],"names":["renderAvatarGroupItem_unstable","state","assertSlots","_jsxs","root","_jsx","avatar","isOverflowItem","overflowLabel"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BASaA;;;eAAAA;;;4BARb;gCAE4B;AAMrB,MAAMA,iCAAiC,CAACC;IAC7CC,IAAAA,2BAAAA,EAAkCD;IAElC,OAAA,WAAA,GACEE,IAAAA,gBAAA,EAACF,MAAMG,IAAI,EAAA;;0BACTC,IAAAA,eAAA,EAACJ,MAAMK,MAAM,EAAA,CAAA;YACZL,MAAMM,cAAc,IAAA,WAAA,GAAIF,IAAAA,eAAA,EAACJ,MAAMO,aAAa,EAAA,CAAA;;;AAGnD"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js

@@ -0,0 +1,64 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAvatarGroupItem_unstable", {
+    enumerable: true,
+    get: function() {
+        return useAvatarGroupItem_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _Avatar = require("../Avatar/Avatar");
+const _AvatarGroupContext = require("../../contexts/AvatarGroupContext");
+const _useAvatarGroup = require("../AvatarGroup/useAvatarGroup");
+const _reactutilities = require("@fluentui/react-utilities");
+const _reactcontextselector = require("@fluentui/react-context-selector");
+const useAvatarGroupItem_unstable = (props, ref)=>{
+    const groupIsOverflow = (0, _AvatarGroupContext.useAvatarGroupContext_unstable)((ctx)=>ctx.isOverflow);
+    const groupSize = (0, _AvatarGroupContext.useAvatarGroupContext_unstable)((ctx)=>ctx.size);
+    const layout = (0, _AvatarGroupContext.useAvatarGroupContext_unstable)((ctx)=>ctx.layout);
+    // Since the primary slot is not an intrinsic element, getPartitionedNativeProps cannot be used here.
+    const { style, className, ...avatarSlotProps } = props;
+    const size = groupSize !== null && groupSize !== void 0 ? groupSize : _useAvatarGroup.defaultAvatarGroupSize;
+    const hasAvatarGroupContext = (0, _reactcontextselector.useHasParentContext)(_AvatarGroupContext.AvatarGroupContext);
+    if (process.env.NODE_ENV !== 'production' && !hasAvatarGroupContext) {
+        // eslint-disable-next-line no-console
+        console.warn('AvatarGroupItem must only be used inside an AvatarGroup component.');
+    }
+    return {
+        isOverflowItem: groupIsOverflow,
+        layout,
+        size,
+        components: {
+            root: groupIsOverflow ? 'li' : 'div',
+            avatar: _Avatar.Avatar,
+            overflowLabel: 'span'
+        },
+        root: _reactutilities.slot.always(props.root, {
+            defaultProps: {
+                style,
+                className
+            },
+            elementType: groupIsOverflow ? 'li' : 'div'
+        }),
+        avatar: _reactutilities.slot.always(props.avatar, {
+            defaultProps: {
+                ref,
+                size,
+                color: 'colorful',
+                ...avatarSlotProps
+            },
+            elementType: _Avatar.Avatar
+        }),
+        overflowLabel: _reactutilities.slot.always(props.overflowLabel, {
+            defaultProps: {
+                // Avatar already has its aria-label set to the name, this will prevent the name to be read twice.
+                'aria-hidden': true,
+                children: props.name
+            },
+            elementType: 'span'
+        })
+    };
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItem.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupItem/useAvatarGroupItem.ts"],"sourcesContent":["import * as React from 'react';\nimport { Avatar } from '../Avatar/Avatar';\nimport { AvatarGroupContext, useAvatarGroupContext_unstable } from '../../contexts/AvatarGroupContext';\nimport { defaultAvatarGroupSize } from '../AvatarGroup/useAvatarGroup';\nimport { slot } from '@fluentui/react-utilities';\nimport { useHasParentContext } from '@fluentui/react-context-selector';\nimport type { AvatarGroupItemProps, AvatarGroupItemState } from './AvatarGroupItem.types';\n\n/**\n * Create the state required to render AvatarGroupItem.\n *\n * The returned state can be modified with hooks such as useAvatarGroupItemStyles_unstable,\n * before being passed to renderAvatarGroupItem_unstable.\n *\n * @param props - props from this instance of AvatarGroupItem\n * @param ref - reference to root HTMLElement of AvatarGroupItem\n */\nexport const useAvatarGroupItem_unstable = (\n  props: AvatarGroupItemProps,\n  ref: React.Ref<HTMLElement>,\n): AvatarGroupItemState => {\n  const groupIsOverflow = useAvatarGroupContext_unstable(ctx => ctx.isOverflow);\n  const groupSize = useAvatarGroupContext_unstable(ctx => ctx.size);\n  const layout = useAvatarGroupContext_unstable(ctx => ctx.layout);\n  // Since the primary slot is not an intrinsic element, getPartitionedNativeProps cannot be used here.\n  const { style, className, ...avatarSlotProps } = props;\n  const size = groupSize ?? defaultAvatarGroupSize;\n  const hasAvatarGroupContext = useHasParentContext(AvatarGroupContext);\n\n  if (process.env.NODE_ENV !== 'production' && !hasAvatarGroupContext) {\n    // eslint-disable-next-line no-console\n    console.warn('AvatarGroupItem must only be used inside an AvatarGroup component.');\n  }\n\n  return {\n    isOverflowItem: groupIsOverflow,\n    layout,\n    size,\n    components: {\n      root: groupIsOverflow ? 'li' : 'div',\n      avatar: Avatar,\n      overflowLabel: 'span',\n    },\n    root: slot.always(props.root, {\n      defaultProps: {\n        style,\n        className,\n      },\n      elementType: groupIsOverflow ? 'li' : 'div',\n    }),\n    avatar: slot.always(props.avatar, {\n      defaultProps: {\n        ref,\n        size,\n        color: 'colorful',\n        ...avatarSlotProps,\n      },\n      elementType: Avatar,\n    }),\n    overflowLabel: slot.always(props.overflowLabel, {\n      defaultProps: {\n        // Avatar already has its aria-label set to the name, this will prevent the name to be read twice.\n        'aria-hidden': true,\n        children: props.name,\n      },\n      elementType: 'span',\n    }),\n  };\n};\n"],"names":["useAvatarGroupItem_unstable","props","ref","groupIsOverflow","useAvatarGroupContext_unstable","ctx","isOverflow","groupSize","size","layout","style","className","avatarSlotProps","defaultAvatarGroupSize","hasAvatarGroupContext","useHasParentContext","AvatarGroupContext","process","env","NODE_ENV","console","warn","isOverflowItem","components","root","avatar","Avatar","overflowLabel","slot","always","defaultProps","elementType","color","children","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBaA;;;eAAAA;;;;iEAjBU;wBACA;oCAC4C;gCAC5B;gCAClB;sCACe;AAY7B,MAAMA,8BAA8B,CACzCC,OACAC;IAEA,MAAMC,kBAAkBC,IAAAA,kDAAAA,EAA+BC,CAAAA,MAAOA,IAAIC,UAAU;IAC5E,MAAMC,YAAYH,IAAAA,kDAAAA,EAA+BC,CAAAA,MAAOA,IAAIG,IAAI;IAChE,MAAMC,SAASL,IAAAA,kDAAAA,EAA+BC,CAAAA,MAAOA,IAAII,MAAM;IAC/D,qGAAqG;IACrG,MAAM,EAAEC,KAAK,EAAEC,SAAS,EAAE,GAAGC,iBAAiB,GAAGX;IACjD,MAAMO,OAAOD,cAAAA,QAAAA,cAAAA,KAAAA,IAAAA,YAAaM,sCAAAA;IAC1B,MAAMC,wBAAwBC,IAAAA,yCAAAA,EAAoBC,sCAAAA;IAElD,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgB,CAACL,uBAAuB;QACnE,sCAAsC;QACtCM,QAAQC,IAAI,CAAC;IACf;IAEA,OAAO;QACLC,gBAAgBnB;QAChBM;QACAD;QACAe,YAAY;YACVC,MAAMrB,kBAAkB,OAAO;YAC/BsB,QAAQC,cAAAA;YACRC,eAAe;QACjB;QACAH,MAAMI,oBAAAA,CAAKC,MAAM,CAAC5B,MAAMuB,IAAI,EAAE;YAC5BM,cAAc;gBACZpB;gBACAC;YACF;YACAoB,aAAa5B,kBAAkB,OAAO;QACxC;QACAsB,QAAQG,oBAAAA,CAAKC,MAAM,CAAC5B,MAAMwB,MAAM,EAAE;YAChCK,cAAc;gBACZ5B;gBACAM;gBACAwB,OAAO;gBACP,GAAGpB,eAAe;YACpB;YACAmB,aAAaL,cAAAA;QACf;QACAC,eAAeC,oBAAAA,CAAKC,MAAM,CAAC5B,MAAM0B,aAAa,EAAE;YAC9CG,cAAc;gBACZ,kGAAkG;gBAClG,eAAe;gBACfG,UAAUhC,MAAMiC,IAAI;YACtB;YACAH,aAAa;QACf;IACF;AACF"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.js

@@ -0,0 +1,396 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    avatarGroupItemClassNames: function() {
+        return avatarGroupItemClassNames;
+    },
+    useAvatarGroupItemStyles_unstable: function() {
+        return useAvatarGroupItemStyles_unstable;
+    },
+    useGroupChildClassName: function() {
+        return useGroupChildClassName;
+    }
+});
+const _react = require("@griffel/react");
+const _Avatar = require("../../Avatar");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const avatarGroupItemClassNames = {
+    root: 'fui-AvatarGroupItem',
+    avatar: 'fui-AvatarGroupItem__avatar',
+    overflowLabel: 'fui-AvatarGroupItem__overflowLabel'
+};
+const avatarGroupItemDividerWidthVar = '--fuiAvatarGroupItem__divider--width';
+/**
+ * Styles for the root slot
+ */ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Bt984gj: "f122n59",
+        mc9l5x: "ftuwxu6",
+        Bnnss6s: "fi64zpg",
+        qhf8xq: "f10pi13n"
+    },
+    overflowItem: {
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f16d74zd"
+    },
+    nonOverflowItem: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "f44lkw9"
+    }
+}, {
+    d: [
+        ".f122n59{align-items:center;}",
+        ".ftuwxu6{display:inline-flex;}",
+        ".fi64zpg{flex-shrink:0;}",
+        ".f10pi13n{position:relative;}",
+        [
+            ".f16d74zd{padding:var(--spacingVerticalXS) var(--spacingHorizontalXS);}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f44lkw9{border-radius:var(--borderRadiusCircular);}",
+            {
+                p: -1
+            }
+        ]
+    ]
+});
+/**
+ * Styles for the avatar slot
+ */ const useAvatarStyles = /*#__PURE__*/ (0, _react.__styles)({
+    nonOverflowItem: {
+        qhf8xq: "f1euv43f"
+    },
+    pie: {
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "fokr779"
+    }
+}, {
+    d: [
+        ".f1euv43f{position:absolute;}",
+        [
+            ".fokr779{border-radius:0;}",
+            {
+                p: -1
+            }
+        ]
+    ]
+});
+/**
+ * Styles for the label slot
+ */ const useOverflowLabelStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Frg6f3: [
+            "foyynoy",
+            "f1vcna3q"
+        ],
+        sj55zd: "f19n0e5",
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fkhj508",
+        Bhrd7zp: "figsok6",
+        Bg96gwp: "f1i3iumi"
+    }
+}, {
+    d: [
+        ".foyynoy{margin-left:var(--spacingHorizontalS);}",
+        ".f1vcna3q{margin-right:var(--spacingHorizontalS);}",
+        ".f19n0e5{color:var(--colorNeutralForeground1);}",
+        ".fk6fouc{font-family:var(--fontFamilyBase);}",
+        ".fkhj508{font-size:var(--fontSizeBase300);}",
+        ".figsok6{font-weight:var(--fontWeightRegular);}",
+        ".f1i3iumi{line-height:var(--lineHeightBase300);}"
+    ]
+});
+/**
+ * Styles for the stack layout
+ */ const useStackStyles = /*#__PURE__*/ (0, _react.__styles)({
+    thick: {
+        E5pizo: "foiuzp5"
+    },
+    thicker: {
+        E5pizo: "f1x6o7w7"
+    },
+    thickest: {
+        E5pizo: "f2aml1u"
+    },
+    xxs: {
+        jhia2w: [
+            "f1cjco14",
+            "f13dxjc9"
+        ]
+    },
+    xs: {
+        jhia2w: [
+            "f15p6bln",
+            "f1bab3ru"
+        ]
+    },
+    s: {
+        jhia2w: [
+            "f1v53ncc",
+            "f17pu8r8"
+        ]
+    },
+    l: {
+        jhia2w: [
+            "flv48ch",
+            "fnh1ydj"
+        ]
+    }
+}, {
+    d: [
+        ".foiuzp5{box-shadow:0 0 0 var(--strokeWidthThick) var(--colorNeutralBackground2);}",
+        ".f1x6o7w7{box-shadow:0 0 0 var(--strokeWidthThicker) var(--colorNeutralBackground2);}",
+        ".f2aml1u{box-shadow:0 0 0 var(--strokeWidthThickest) var(--colorNeutralBackground2);}",
+        ".f1cjco14:not(:first-child){margin-left:calc(-1 * var(--spacingHorizontalXXS));}",
+        ".f13dxjc9:not(:first-child){margin-right:calc(-1 * var(--spacingHorizontalXXS));}",
+        ".f15p6bln:not(:first-child){margin-left:calc(-1 * var(--spacingHorizontalXS));}",
+        ".f1bab3ru:not(:first-child){margin-right:calc(-1 * var(--spacingHorizontalXS));}",
+        ".f1v53ncc:not(:first-child){margin-left:calc(-1 * var(--spacingHorizontalS));}",
+        ".f17pu8r8:not(:first-child){margin-right:calc(-1 * var(--spacingHorizontalS));}",
+        ".flv48ch:not(:first-child){margin-left:calc(-1 * var(--spacingHorizontalL));}",
+        ".fnh1ydj:not(:first-child){margin-right:calc(-1 * var(--spacingHorizontalL));}"
+    ]
+});
+/**
+ * Styles for the spread layout
+ */ const useSpreadStyles = /*#__PURE__*/ (0, _react.__styles)({
+    s: {
+        jhia2w: [
+            "f7lhxv7",
+            "f6ou2b0"
+        ]
+    },
+    mNudge: {
+        jhia2w: [
+            "f1h0okno",
+            "fnnqava"
+        ]
+    },
+    m: {
+        jhia2w: [
+            "f1wkt588",
+            "f1maio5g"
+        ]
+    },
+    l: {
+        jhia2w: [
+            "f1l333zn",
+            "f1r41m4c"
+        ]
+    },
+    xl: {
+        jhia2w: [
+            "fahr13a",
+            "f2n7rbo"
+        ]
+    }
+}, {
+    d: [
+        ".f7lhxv7:not(:first-child){margin-left:var(--spacingHorizontalS);}",
+        ".f6ou2b0:not(:first-child){margin-right:var(--spacingHorizontalS);}",
+        ".f1h0okno:not(:first-child){margin-left:var(--spacingHorizontalMNudge);}",
+        ".fnnqava:not(:first-child){margin-right:var(--spacingHorizontalMNudge);}",
+        ".f1wkt588:not(:first-child){margin-left:var(--spacingHorizontalM);}",
+        ".f1maio5g:not(:first-child){margin-right:var(--spacingHorizontalM);}",
+        ".f1l333zn:not(:first-child){margin-left:var(--spacingHorizontalL);}",
+        ".f1r41m4c:not(:first-child){margin-right:var(--spacingHorizontalL);}",
+        ".fahr13a:not(:first-child){margin-left:var(--spacingHorizontalXL);}",
+        ".f2n7rbo:not(:first-child){margin-right:var(--spacingHorizontalXL);}"
+    ]
+});
+/**
+ * Styles for the pie layout
+ */ const usePieStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        qhf8xq: "f1euv43f"
+    },
+    slices: {
+        B3gf25r: "f16m7w7k",
+        Be2twx7: [
+            "f1o4hhgz",
+            "fb4gjrz"
+        ],
+        Bvaow4n: "f1pgb5nx",
+        Gpecfs: [
+            "fugirid",
+            "f4sk99m"
+        ],
+        bhabj1: "fjreaf3",
+        B7rc6i7: [
+            "f1k4vw81",
+            "f1w1xcy7"
+        ],
+        Bwrfys5: "f1ef8vxk",
+        Bwuzm9m: [
+            "f1x2qbfv",
+            "f1xwf4nz"
+        ],
+        fflka: "ff6xuso",
+        do7bja: "fzpvk6c",
+        Be8zqhl: "f4onu7f",
+        Bij0kh0: [
+            "f1ydfez1",
+            "fjensob"
+        ],
+        Bwexnyt: "f1yv732j",
+        Bhe5x6o: "fchq2fj",
+        B3kv7bh: "ff5binh"
+    },
+    rtlSlices: {
+        B3gf25r: "f5vdl61",
+        Bvaow4n: "f1bnra92",
+        bhabj1: "f4ibo7t",
+        Bwrfys5: "f17heuis",
+        Bwuzm9m: [
+            "f64f2ud",
+            "f1yjglu3"
+        ],
+        Be8zqhl: "fa6l61x",
+        Bij0kh0: [
+            "f1w2396a",
+            "f14ab3yo"
+        ]
+    },
+    thick: {
+        uiicq7: "fnyfzln"
+    },
+    thicker: {
+        uiicq7: "f1xdzzot"
+    },
+    thickest: {
+        uiicq7: "f1auhru5"
+    }
+}, {
+    d: [
+        ".f1euv43f{position:absolute;}",
+        ".f16m7w7k:nth-of-type(1):nth-last-of-type(2){clip-path:inset(0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)) 0 25%);}",
+        ".f1o4hhgz:nth-of-type(1):nth-last-of-type(2){left:-25%;}",
+        ".fb4gjrz:nth-of-type(1):nth-last-of-type(2){right:-25%;}",
+        ".f1pgb5nx:nth-of-type(2):nth-last-of-type(1){clip-path:inset(0 25% 0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)));}",
+        ".fugirid:nth-of-type(2):nth-last-of-type(1){left:25%;}",
+        ".f4sk99m:nth-of-type(2):nth-last-of-type(1){right:25%;}",
+        ".fjreaf3:nth-of-type(1):nth-last-of-type(3){clip-path:inset(0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)) 0 25%);}",
+        ".f1k4vw81:nth-of-type(1):nth-last-of-type(3){left:-25%;}",
+        ".f1w1xcy7:nth-of-type(1):nth-last-of-type(3){right:-25%;}",
+        ".f1ef8vxk:nth-of-type(2):nth-last-of-type(2){clip-path:inset(0 0 var(--fuiAvatarGroupItem__divider--width) var(--fuiAvatarGroupItem__divider--width));}",
+        ".f1x2qbfv:nth-of-type(2):nth-last-of-type(2){left:50%;}",
+        ".f1xwf4nz:nth-of-type(2):nth-last-of-type(2){right:50%;}",
+        ".ff6xuso:nth-of-type(2):nth-last-of-type(2){transform:scale(0.5);}",
+        ".fzpvk6c:nth-of-type(2):nth-last-of-type(2){transform-origin:0 0;}",
+        ".f4onu7f:nth-of-type(3):nth-last-of-type(1){clip-path:inset(var(--fuiAvatarGroupItem__divider--width) 0 0 var(--fuiAvatarGroupItem__divider--width));}",
+        ".f1ydfez1:nth-of-type(3):nth-last-of-type(1){left:50%;}",
+        ".fjensob:nth-of-type(3):nth-last-of-type(1){right:50%;}",
+        ".f1yv732j:nth-of-type(3):nth-last-of-type(1){top:50%;}",
+        ".fchq2fj:nth-of-type(3):nth-last-of-type(1){transform:scale(0.5);}",
+        ".ff5binh:nth-of-type(3):nth-last-of-type(1){transform-origin:0 0;}",
+        ".f5vdl61:nth-of-type(1):nth-last-of-type(2){clip-path:inset(0 25% 0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)));}",
+        ".f1bnra92:nth-of-type(2):nth-last-of-type(1){clip-path:inset(0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)) 0 25%);}",
+        ".f4ibo7t:nth-of-type(1):nth-last-of-type(3){clip-path:inset(0 25% 0 calc(25% + (var(--fuiAvatarGroupItem__divider--width) / 2)));}",
+        ".f17heuis:nth-of-type(2):nth-last-of-type(2){clip-path:inset(0 var(--fuiAvatarGroupItem__divider--width) var(--fuiAvatarGroupItem__divider--width) 0);}",
+        ".f64f2ud:nth-of-type(2):nth-last-of-type(2){left:0;}",
+        ".f1yjglu3:nth-of-type(2):nth-last-of-type(2){right:0;}",
+        ".fa6l61x:nth-of-type(3):nth-last-of-type(1){clip-path:inset(var(--fuiAvatarGroupItem__divider--width) var(--fuiAvatarGroupItem__divider--width) 0 0);}",
+        ".f1w2396a:nth-of-type(3):nth-last-of-type(1){left:0;}",
+        ".f14ab3yo:nth-of-type(3):nth-last-of-type(1){right:0;}",
+        ".fnyfzln{--fuiAvatarGroupItem__divider--width:var(--strokeWidthThick);}",
+        ".f1xdzzot{--fuiAvatarGroupItem__divider--width:var(--strokeWidthThicker);}",
+        ".f1auhru5{--fuiAvatarGroupItem__divider--width:var(--strokeWidthThickest);}"
+    ]
+});
+const useAvatarGroupItemStyles_unstable = (state)=>{
+    'use no memo';
+    const { isOverflowItem, layout, size } = state;
+    const { dir } = (0, _reactsharedcontexts.useFluent_unstable)();
+    const avatarStyles = useAvatarStyles();
+    const overflowLabelStyles = useOverflowLabelStyles();
+    const pieStyles = usePieStyles();
+    const rootStyles = useRootStyles();
+    const sizeStyles = (0, _Avatar.useSizeStyles)();
+    const groupChildClassName = useGroupChildClassName(layout, size);
+    const rootClasses = [
+        rootStyles.base
+    ];
+    if (!isOverflowItem) {
+        rootClasses.push(rootStyles.nonOverflowItem);
+        rootClasses.push(groupChildClassName);
+        rootClasses.push(sizeStyles[size]);
+        if (layout === 'pie') {
+            rootClasses.push(pieStyles.base);
+            if (size < 56) {
+                rootClasses.push(pieStyles.thick);
+            } else if (size < 72) {
+                rootClasses.push(pieStyles.thicker);
+            } else {
+                rootClasses.push(pieStyles.thickest);
+            }
+            rootClasses.push(pieStyles.slices);
+            if (dir === 'rtl') {
+                rootClasses.push(pieStyles.rtlSlices);
+            }
+        }
+    } else {
+        rootClasses.push(rootStyles.overflowItem);
+    }
+    state.root.className = (0, _react.mergeClasses)(avatarGroupItemClassNames.root, ...rootClasses, state.root.className);
+    state.avatar.className = (0, _react.mergeClasses)(avatarGroupItemClassNames.avatar, !isOverflowItem && avatarStyles.nonOverflowItem, layout === 'pie' && avatarStyles.pie, state.avatar.className);
+    if (state.overflowLabel) {
+        state.overflowLabel.className = (0, _react.mergeClasses)(avatarGroupItemClassNames.overflowLabel, overflowLabelStyles.base, state.overflowLabel.className);
+    }
+    return state;
+};
+const useGroupChildClassName = (layout, size)=>{
+    const stackStyles = useStackStyles();
+    const spreadStyles = useSpreadStyles();
+    const layoutClasses = [];
+    if (size) {
+        if (layout === 'stack') {
+            if (size < 56) {
+                layoutClasses.push(stackStyles.thick);
+            } else if (size < 72) {
+                layoutClasses.push(stackStyles.thicker);
+            } else {
+                layoutClasses.push(stackStyles.thickest);
+            }
+            if (size < 24) {
+                layoutClasses.push(stackStyles.xxs);
+            } else if (size < 48) {
+                layoutClasses.push(stackStyles.xs);
+            } else if (size < 96) {
+                layoutClasses.push(stackStyles.s);
+            } else {
+                layoutClasses.push(stackStyles.l);
+            }
+        } else if (layout === 'spread') {
+            if (size < 20) {
+                layoutClasses.push(spreadStyles.s);
+            } else if (size < 32) {
+                layoutClasses.push(spreadStyles.mNudge);
+            } else if (size < 64) {
+                layoutClasses.push(spreadStyles.l);
+            } else {
+                layoutClasses.push(spreadStyles.xl);
+            }
+        }
+    }
+    return (0, _react.mergeClasses)(...layoutClasses);
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "AvatarGroupPopover", {
+    enumerable: true,
+    get: function() {
+        return AvatarGroupPopover;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _renderAvatarGroupPopover = require("./renderAvatarGroupPopover");
+const _useAvatarGroupPopoverContextValues = require("./useAvatarGroupPopoverContextValues");
+const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
+const _useAvatarGroupPopover = require("./useAvatarGroupPopover");
+const _useAvatarGroupPopoverStylesstyles = require("./useAvatarGroupPopoverStyles.styles");
+const AvatarGroupPopover = (props)=>{
+    const state = (0, _useAvatarGroupPopover.useAvatarGroupPopover_unstable)(props);
+    const contextValues = (0, _useAvatarGroupPopoverContextValues.useAvatarGroupPopoverContextValues_unstable)(state);
+    (0, _useAvatarGroupPopoverStylesstyles.useAvatarGroupPopoverStyles_unstable)(state);
+    (0, _reactsharedcontexts.useCustomStyleHook_unstable)('useAvatarGroupPopoverStyles_unstable')(state);
+    return (0, _renderAvatarGroupPopover.renderAvatarGroupPopover_unstable)(state, contextValues);
+};
+AvatarGroupPopover.displayName = 'AvatarGroupPopover';

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupPopover/AvatarGroupPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupPopover_unstable } from './renderAvatarGroupPopover';\nimport { useAvatarGroupPopoverContextValues_unstable } from './useAvatarGroupPopoverContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupPopover_unstable } from './useAvatarGroupPopover';\nimport { useAvatarGroupPopoverStyles_unstable } from './useAvatarGroupPopoverStyles.styles';\nimport type { AvatarGroupPopoverProps } from './AvatarGroupPopover.types';\n\n/**\n * The AvatarGroupPopover component provides a button with a Popover containing the children provided.\n */\nexport const AvatarGroupPopover: React.FC<AvatarGroupPopoverProps> = props => {\n  const state = useAvatarGroupPopover_unstable(props);\n  const contextValues = useAvatarGroupPopoverContextValues_unstable(state);\n\n  useAvatarGroupPopoverStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupPopoverStyles_unstable')(state);\n\n  return renderAvatarGroupPopover_unstable(state, contextValues);\n};\n\nAvatarGroupPopover.displayName = 'AvatarGroupPopover';\n"],"names":["AvatarGroupPopover","props","state","useAvatarGroupPopover_unstable","contextValues","useAvatarGroupPopoverContextValues_unstable","useAvatarGroupPopoverStyles_unstable","useCustomStyleHook_unstable","renderAvatarGroupPopover_unstable","displayName"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAWaA;;;eAAAA;;;;iEAXU;0CAC2B;oDACU;qCAChB;uCACG;mDACM;AAM9C,MAAMA,qBAAwDC,CAAAA;IACnE,MAAMC,QAAQC,IAAAA,qDAAAA,EAA+BF;IAC7C,MAAMG,gBAAgBC,IAAAA,+EAAAA,EAA4CH;IAElEI,IAAAA,uEAAAA,EAAqCJ;IAErCK,IAAAA,gDAAAA,EAA4B,wCAAwCL;IAEpE,OAAOM,IAAAA,2DAAAA,EAAkCN,OAAOE;AAClD;AAEAJ,mBAAmBS,WAAW,GAAG"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.types.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/AvatarGroupPopover.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupPopover/AvatarGroupPopover.types.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AvatarSize } from '../Avatar/Avatar.types';\nimport type { AvatarGroupProps } from '../AvatarGroup/AvatarGroup.types';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { PopoverProps, PopoverSurface } from '@fluentui/react-popover';\nimport type { TooltipProps } from '@fluentui/react-tooltip';\n\nexport type AvatarGroupPopoverSlots = {\n  root: NonNullable<Slot<PopoverProps>>;\n\n  /**\n   * Button that triggers the Popover.\n   */\n  triggerButton: NonNullable<Slot<'button'>>;\n\n  /**\n   * List that contains the overflowed AvatarGroupItems.\n   */\n  content: NonNullable<Slot<'ul'>>;\n\n  /**\n   * PopoverSurface that contains the content.\n   */\n  popoverSurface: NonNullable<Slot<typeof PopoverSurface>>;\n\n  /**\n   * Tooltip shown when triggerButton is hovered.\n   */\n  tooltip: NonNullable<Slot<TooltipProps>>;\n};\n\n/**\n * AvatarGroupPopover Props\n */\nexport type AvatarGroupPopoverProps = Omit<ComponentProps<Partial<AvatarGroupPopoverSlots>>, 'children'> & {\n  /**\n   * Whether the triggerButton should render an icon instead of the number of overflowed AvatarGroupItems.\n   * Note: The indicator will default to `icon` when the size is less than 24.\n   * @default count\n   */\n  indicator?: 'count' | 'icon';\n\n  /**\n   * Number of AvatarGroupItems that will be rendered.\n   *\n   * Note: AvatarGroupPopover handles counting the number of children, but when using a react fragment to wrap the\n   * children, this is not possible and therefore it has do be added manually.\n   */\n  count?: number;\n\n  children: React.ReactNode;\n};\n\n/**\n * State used in rendering AvatarGroupPopover\n */\nexport type AvatarGroupPopoverState = ComponentState<AvatarGroupPopoverSlots> &\n  Required<Pick<AvatarGroupPopoverProps, 'count' | 'indicator'>> & {\n    popoverOpen: boolean;\n    layout: AvatarGroupProps['layout'];\n    size: AvatarSize;\n  };\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;iEAAuB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/index.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    AvatarGroupPopover: function() {
+        return _AvatarGroupPopover.AvatarGroupPopover;
+    },
+    avatarGroupPopoverClassNames: function() {
+        return _useAvatarGroupPopoverStylesstyles.avatarGroupPopoverClassNames;
+    },
+    renderAvatarGroupPopover_unstable: function() {
+        return _renderAvatarGroupPopover.renderAvatarGroupPopover_unstable;
+    },
+    useAvatarGroupPopoverContextValues_unstable: function() {
+        return _useAvatarGroupPopoverContextValues.useAvatarGroupPopoverContextValues_unstable;
+    },
+    useAvatarGroupPopoverStyles_unstable: function() {
+        return _useAvatarGroupPopoverStylesstyles.useAvatarGroupPopoverStyles_unstable;
+    },
+    useAvatarGroupPopover_unstable: function() {
+        return _useAvatarGroupPopover.useAvatarGroupPopover_unstable;
+    }
+});
+const _AvatarGroupPopover = require("./AvatarGroupPopover");
+const _renderAvatarGroupPopover = require("./renderAvatarGroupPopover");
+const _useAvatarGroupPopover = require("./useAvatarGroupPopover");
+const _useAvatarGroupPopoverStylesstyles = require("./useAvatarGroupPopoverStyles.styles");
+const _useAvatarGroupPopoverContextValues = require("./useAvatarGroupPopoverContextValues");

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupPopover/index.ts"],"sourcesContent":["export { AvatarGroupPopover } from './AvatarGroupPopover';\nexport type {\n  AvatarGroupPopoverProps,\n  AvatarGroupPopoverSlots,\n  AvatarGroupPopoverState,\n} from './AvatarGroupPopover.types';\nexport { renderAvatarGroupPopover_unstable } from './renderAvatarGroupPopover';\nexport { useAvatarGroupPopover_unstable } from './useAvatarGroupPopover';\nexport {\n  avatarGroupPopoverClassNames,\n  useAvatarGroupPopoverStyles_unstable,\n} from './useAvatarGroupPopoverStyles.styles';\nexport { useAvatarGroupPopoverContextValues_unstable } from './useAvatarGroupPopoverContextValues';\n"],"names":["AvatarGroupPopover","avatarGroupPopoverClassNames","renderAvatarGroupPopover_unstable","useAvatarGroupPopoverContextValues_unstable","useAvatarGroupPopoverStyles_unstable","useAvatarGroupPopover_unstable"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,kBAAkB;eAAlBA,sCAAkB;;IASzBC,4BAA4B;eAA5BA,+DAA4B;;IAHrBC,iCAAiC;eAAjCA,2DAAiC;;IAMjCC,2CAA2C;eAA3CA,+EAA2C;;IAFlDC,oCAAoC;eAApCA,uEAAoC;;IAH7BC,8BAA8B;eAA9BA,qDAA8B;;;oCAPJ;0CAMe;uCACH;mDAIxC;oDACqD"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js

@@ -0,0 +1,33 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "renderAvatarGroupPopover_unstable", {
+    enumerable: true,
+    get: function() {
+        return renderAvatarGroupPopover_unstable;
+    }
+});
+const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
+const _AvatarGroupContext = require("../../contexts/AvatarGroupContext");
+const _reactutilities = require("@fluentui/react-utilities");
+const _reactpopover = require("@fluentui/react-popover");
+const renderAvatarGroupPopover_unstable = (state, contextValues)=>{
+    (0, _reactutilities.assertSlots)(state);
+    return /*#__PURE__*/ (0, _jsxruntime.jsxs)(state.root, {
+        children: [
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(_reactpopover.PopoverTrigger, {
+                disableButtonEnhancement: true,
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.tooltip, {
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.triggerButton, {})
+                })
+            }),
+            /*#__PURE__*/ (0, _jsxruntime.jsx)(state.popoverSurface, {
+                children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_AvatarGroupContext.AvatarGroupProvider, {
+                    value: contextValues.avatarGroup,
+                    children: /*#__PURE__*/ (0, _jsxruntime.jsx)(state.content, {})
+                })
+            })
+        ]
+    });
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport { AvatarGroupContextValues } from '../AvatarGroup/AvatarGroup.types';\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport { PopoverTrigger } from '@fluentui/react-popover';\nimport type { AvatarGroupPopoverState, AvatarGroupPopoverSlots } from './AvatarGroupPopover.types';\n\n/**\n * Render the final JSX of AvatarGroupPopover\n */\nexport const renderAvatarGroupPopover_unstable = (\n  state: AvatarGroupPopoverState,\n  contextValues: AvatarGroupContextValues,\n) => {\n  assertSlots<AvatarGroupPopoverSlots>(state);\n\n  return (\n    <state.root>\n      <PopoverTrigger disableButtonEnhancement>\n        <state.tooltip>\n          <state.triggerButton />\n        </state.tooltip>\n      </PopoverTrigger>\n      <state.popoverSurface>\n        <AvatarGroupProvider value={contextValues.avatarGroup}>\n          <state.content />\n        </AvatarGroupProvider>\n      </state.popoverSurface>\n    </state.root>\n  );\n};\n"],"names":["renderAvatarGroupPopover_unstable","state","contextValues","assertSlots","_jsxs","root","_jsx","PopoverTrigger","disableButtonEnhancement","tooltip","triggerButton","popoverSurface","AvatarGroupProvider","value","avatarGroup","content"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAYaA;;;eAAAA;;;4BAXb;oCACoC;gCAGR;8BACG;AAMxB,MAAMA,oCAAoC,CAC/CC,OACAC;IAEAC,IAAAA,2BAAAA,EAAqCF;IAErC,OAAA,WAAA,GACEG,IAAAA,gBAAA,EAACH,MAAMI,IAAI,EAAA;;0BACTC,IAAAA,eAAA,EAACC,4BAAAA,EAAAA;gBAAeC,0BAAwB;0BACtC,WAAA,GAAAF,IAAAA,eAAA,EAACL,MAAMQ,OAAO,EAAA;8BACZ,WAAA,GAAAH,IAAAA,eAAA,EAACL,MAAMS,aAAa,EAAA,CAAA;;;0BAGxBJ,IAAAA,eAAA,EAACL,MAAMU,cAAc,EAAA;0BACnB,WAAA,GAAAL,IAAAA,eAAA,EAACM,uCAAAA,EAAAA;oBAAoBC,OAAOX,cAAcY,WAAW;8BACnD,WAAA,GAAAR,IAAAA,eAAA,EAACL,MAAMc,OAAO,EAAA,CAAA;;;;;AAKxB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopover.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAvatarGroupPopover_unstable", {
+    enumerable: true,
+    get: function() {
+        return useAvatarGroupPopover_unstable;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+const _AvatarGroupContext = require("../../contexts/AvatarGroupContext");
+const _useAvatarGroup = require("../AvatarGroup/useAvatarGroup");
+const _reactutilities = require("@fluentui/react-utilities");
+const _reacticons = require("@fluentui/react-icons");
+const _reactpopover = require("@fluentui/react-popover");
+const _reacttooltip = require("@fluentui/react-tooltip");
+const useAvatarGroupPopover_unstable = (props)=>{
+    var _useAvatarGroupContext_unstable;
+    const size = (_useAvatarGroupContext_unstable = (0, _AvatarGroupContext.useAvatarGroupContext_unstable)((ctx)=>ctx.size)) !== null && _useAvatarGroupContext_unstable !== void 0 ? _useAvatarGroupContext_unstable : _useAvatarGroup.defaultAvatarGroupSize;
+    const layout = (0, _AvatarGroupContext.useAvatarGroupContext_unstable)((ctx)=>ctx.layout);
+    const { indicator = size < 24 ? 'icon' : 'count', count = _react.Children.count(props.children), children, ...restOfProps } = props;
+    const [popoverOpen, setPopoverOpen] = (0, _reactutilities.useControllableState)({
+        state: props.open,
+        defaultState: props.defaultOpen,
+        initialState: false
+    });
+    const handleOnPopoverChange = (e, data)=>{
+        var _restOfProps_onOpenChange;
+        (_restOfProps_onOpenChange = restOfProps.onOpenChange) === null || _restOfProps_onOpenChange === void 0 ? void 0 : _restOfProps_onOpenChange.call(restOfProps, e, data);
+        setPopoverOpen(data.open);
+    };
+    let triggerButtonChildren;
+    if (layout === 'pie') {
+        triggerButtonChildren = null;
+    } else if (indicator === 'icon') {
+        triggerButtonChildren = /*#__PURE__*/ _react.createElement(_reacticons.MoreHorizontalRegular, null);
+    } else {
+        triggerButtonChildren = count > 99 ? '99+' : `+${count}`;
+    }
+    return {
+        count,
+        indicator,
+        layout,
+        popoverOpen,
+        size,
+        components: {
+            root: _reactpopover.Popover,
+            triggerButton: 'button',
+            content: 'ul',
+            popoverSurface: _reactpopover.PopoverSurface,
+            tooltip: _reacttooltip.Tooltip
+        },
+        root: _reactutilities.slot.always({
+            // Popover expects a child for its children. The children are added in the renderAvatarGroupPopover.
+            children: /*#__PURE__*/ _react.createElement(_react.Fragment, null),
+            size: 'small',
+            trapFocus: true,
+            ...restOfProps,
+            open: popoverOpen,
+            onOpenChange: handleOnPopoverChange
+        }, {
+            elementType: _reactpopover.Popover
+        }),
+        triggerButton: _reactutilities.slot.always(props.triggerButton, {
+            defaultProps: {
+                children: triggerButtonChildren,
+                type: 'button'
+            },
+            elementType: 'button'
+        }),
+        content: _reactutilities.slot.always(props.content, {
+            defaultProps: {
+                children,
+                role: 'list'
+            },
+            elementType: 'ul'
+        }),
+        popoverSurface: _reactutilities.slot.always(props.popoverSurface, {
+            defaultProps: {
+                'aria-label': 'Overflow',
+                tabIndex: 0
+            },
+            elementType: _reactpopover.PopoverSurface
+        }),
+        tooltip: _reactutilities.slot.always(props.tooltip, {
+            defaultProps: {
+                content: 'View more people.',
+                relationship: 'label'
+            },
+            elementType: _reacttooltip.Tooltip
+        })
+    };
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "useAvatarGroupPopoverContextValues_unstable", {
+    enumerable: true,
+    get: function() {
+        return useAvatarGroupPopoverContextValues_unstable;
+    }
+});
+const useAvatarGroupPopoverContextValues_unstable = (state)=>{
+    const avatarGroup = {
+        isOverflow: true,
+        size: 24
+    };
+    return {
+        avatarGroup
+    };
+};

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/AvatarGroupPopover/useAvatarGroupPopoverContextValues.ts"],"sourcesContent":["import { AvatarGroupContextValue, AvatarGroupContextValues } from '../AvatarGroup/AvatarGroup.types';\nimport { AvatarGroupPopoverState } from './AvatarGroupPopover.types';\n\nexport const useAvatarGroupPopoverContextValues_unstable = (\n  state: AvatarGroupPopoverState,\n): AvatarGroupContextValues => {\n  const avatarGroup: AvatarGroupContextValue = {\n    isOverflow: true,\n    size: 24,\n  };\n\n  return { avatarGroup };\n};\n"],"names":["useAvatarGroupPopoverContextValues_unstable","state","avatarGroup","isOverflow","size"],"rangeMappings":";;;;;;;;;;;;;;;;;;","mappings":";;;;+BAGaA;;;eAAAA;;;AAAN,MAAMA,8CAA8C,CACzDC;IAEA,MAAMC,cAAuC;QAC3CC,YAAY;QACZC,MAAM;IACR;IAEA,OAAO;QAAEF;IAAY;AACvB"}

node_modules/@fluentui/react-avatar/lib-commonjs/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.js

@@ -0,0 +1,508 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    avatarGroupPopoverClassNames: function() {
+        return avatarGroupPopoverClassNames;
+    },
+    useAvatarGroupPopoverStyles_unstable: function() {
+        return useAvatarGroupPopoverStyles_unstable;
+    }
+});
+const _react = require("@griffel/react");
+const _useAvatarGroupItemStylesstyles = require("../AvatarGroupItem/useAvatarGroupItemStyles.styles");
+const _useAvatarStylesstyles = require("../Avatar/useAvatarStyles.styles");
+const avatarGroupPopoverClassNames = {
+    root: 'fui-AvatarGroupPopover',
+    content: 'fui-AvatarGroupPopover__content',
+    popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',
+    tooltip: 'fui-AvatarGroupPopover__tooltip',
+    triggerButton: 'fui-AvatarGroupPopover__triggerButton'
+};
+/**
+ * Styles for the content slot.
+ */ const useContentStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        dclx09: "ftrb29c",
+        jrapky: 0,
+        Frg6f3: 0,
+        t21cq0: 0,
+        B6of3ja: 0,
+        B74szlk: "f1s184ao",
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f1mk8lai",
+        mc9l5x: "f22iagw",
+        Beiy3e4: "f1vx9l62"
+    }
+}, {
+    d: [
+        ".ftrb29c{list-style-type:none;}",
+        [
+            ".f1s184ao{margin:0;}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1mk8lai{padding:0;}",
+            {
+                p: -1
+            }
+        ],
+        ".f22iagw{display:flex;}",
+        ".f1vx9l62{flex-direction:column;}"
+    ]
+});
+/**
+ * Styles for the popoverSurface slot.
+ */ const usePopoverSurfaceStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        Bxyxcbc: "fopcw2o",
+        sshi5w: "f1n5o1gx",
+        B68tc82: 0,
+        Bmxbyg5: 0,
+        Bpg54ce: "f19r5mr9",
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f1f5q0n8",
+        a9b677: "f13dwy2t"
+    }
+}, {
+    d: [
+        ".fopcw2o{max-height:220px;}",
+        ".f1n5o1gx{min-height:80px;}",
+        [
+            ".f19r5mr9{overflow:hidden scroll;}",
+            {
+                p: -1
+            }
+        ],
+        [
+            ".f1f5q0n8{padding:var(--spacingVerticalS) var(--spacingHorizontalS);}",
+            {
+                p: -1
+            }
+        ],
+        ".f13dwy2t{width:220px;}"
+    ]
+});
+/**
+ * Styles for the triggerButton slot.
+ */ const useTriggerButtonStyles = /*#__PURE__*/ (0, _react.__styles)({
+    base: {
+        mc9l5x: "ftuwxu6",
+        qhf8xq: "f10pi13n",
+        Bnnss6s: "fi64zpg",
+        Brf1p80: "f4d9j23",
+        Bt984gj: "f122n59",
+        sj55zd: "f19n0e5",
+        De3pzq: "fxugw4r",
+        g2u3we: "fj3muxo",
+        h3c5rm: [
+            "f1akhkt",
+            "f1lxtadh"
+        ],
+        B9xav0g: "f1aperda",
+        zhjwy3: [
+            "f1lxtadh",
+            "f1akhkt"
+        ],
+        Beyfa6y: 0,
+        Bbmb7ep: 0,
+        Btl43ni: 0,
+        B7oj6ja: 0,
+        Dimara: "f44lkw9",
+        icvyot: "fzkkow9",
+        vrafjx: [
+            "fcdblym",
+            "fjik90z"
+        ],
+        oivjwe: "fg706s2",
+        wvpqe5: [
+            "fjik90z",
+            "fcdblym"
+        ],
+        Byoj8tv: 0,
+        uwmqm3: 0,
+        z189sj: 0,
+        z8tnut: 0,
+        B0ocmuz: "f1mk8lai",
+        Bjwas2f: "fw33nwi",
+        Bn1d65q: [
+            "f1ptkjjm",
+            "fmzzjfk"
+        ],
+        Bxeuatn: "f15j0dln",
+        n51gp8: [
+            "fmzzjfk",
+            "f1ptkjjm"
+        ]
+    },
+    pie: {
+        De3pzq: "f1c21dwh",
+        g2u3we: "fghlq4f",
+        h3c5rm: [
+            "f1gn591s",
+            "fjscplz"
+        ],
+        B9xav0g: "fb073pr",
+        zhjwy3: [
+            "fjscplz",
+            "f1gn591s"
+        ],
+        sj55zd: "f44pa96"
+    },
+    focusIndicator: {
+        Byu6kyc: 0,
+        n8qw10: 0,
+        Bbjhlyh: 0,
+        i2cumq: 0,
+        Bunx835: 0,
+        Bdrgwmp: 0,
+        mqozju: 0,
+        lbo84a: 0,
+        Bksnhdo: 0,
+        Bci5o5g: 0,
+        u5e7qz: 0,
+        Bn40d3w: 0,
+        B7b6zxw: 0,
+        B8q5s1w: 0,
+        B5gfjzb: 0,
+        Bbcte9g: 0,
+        Bqz3imu: "f1j9b7x8",
+        g9k6zt: "f1nev41a"
+    },
+    states: {
+        Bi91k9c: "feu1g3u",
+        Jwef8y: "f1knas48",
+        Bgoe8wy: "fvcxoqz",
+        Bwzppfd: [
+            "f1ub3y4t",
+            "f1m52nbi"
+        ],
+        oetu4i: "f1xlaoq0",
+        gg5e9n: [
+            "f1m52nbi",
+            "f1ub3y4t"
+        ],
+        lj723h: "f1g4hkjv",
+        ecr2s2: "fb40n2d",
+        B6oc9vd: "fvs00aa",
+        ak43y8: [
+            "f1assf6x",
+            "f4ruux4"
+        ],
+        wmxk5l: "fumykes",
+        B50zh58: [
+            "f4ruux4",
+            "f1assf6x"
+        ]
+    },
+    selected: {
+        sj55zd: "f14nttnl",
+        De3pzq: "f1nfm20t",
+        g2u3we: "f1ly1fcm",
+        h3c5rm: [
+            "fi8bssc",
+            "fj6btzu"
+        ],
+        B9xav0g: "f1s9tnsa",
+        zhjwy3: [
+            "fj6btzu",
+            "fi8bssc"
+        ]
+    },
+    icon12: {
+        Be2twd7: "f1ugzwwg"
+    },
+    icon16: {
+        Be2twd7: "f4ybsrx"
+    },
+    icon20: {
+        Be2twd7: "fe5j1ua"
+    },
+    icon24: {
+        Be2twd7: "f1rt2boy"
+    },
+    icon28: {
+        Be2twd7: "f24l1pt"
+    },
+    icon32: {
+        Be2twd7: "ffl51b"
+    },
+    icon48: {
+        Be2twd7: "f18m8u13"
+    },
+    caption2Strong: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "f13mqy1h",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "fcpl73t"
+    },
+    caption1Strong: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fy9rknc",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "fwrc4pm"
+    },
+    body1Strong: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fkhj508",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "f1i3iumi"
+    },
+    subtitle2: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "fod5ikn",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "faaz57k"
+    },
+    subtitle1: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "f1pp30po",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "f106mvju"
+    },
+    title3: {
+        Bahqtrf: "fk6fouc",
+        Be2twd7: "f1x0m3f5",
+        Bhrd7zp: "fl43uef",
+        Bg96gwp: "fb86gi6"
+    },
+    borderThin: {
+        B4j52fo: "f192inf7",
+        Bekrc4i: [
+            "f5tn483",
+            "f1ojsxk5"
+        ],
+        Bn0qgzm: "f1vxd6vx",
+        ibv6hh: [
+            "f1ojsxk5",
+            "f5tn483"
+        ]
+    },
+    borderThick: {
+        B4j52fo: "f18zi460",
+        Bekrc4i: [
+            "f1wpluaz",
+            "fsfsuhs"
+        ],
+        Bn0qgzm: "fmklw6v",
+        ibv6hh: [
+            "fsfsuhs",
+            "f1wpluaz"
+        ]
+    },
+    borderThicker: {
+        B4j52fo: "fgx37oo",
+        Bekrc4i: [
+            "f130t4y6",
+            "f1efpmoh"
+        ],
+        Bn0qgzm: "fv51ejd",
+        ibv6hh: [
+            "f1efpmoh",
+            "f130t4y6"
+        ]
+    },
+    borderThickest: {
+        B4j52fo: "fwn6jck",
+        Bekrc4i: [
+            "figl7jc",
+            "f1g0iy8l"
+        ],
+        Bn0qgzm: "f1b8shu7",
+        ibv6hh: [
+            "f1g0iy8l",
+            "figl7jc"
+        ]
+    }
+}, {
+    d: [
+        ".ftuwxu6{display:inline-flex;}",
+        ".f10pi13n{position:relative;}",
+        ".fi64zpg{flex-shrink:0;}",
+        ".f4d9j23{justify-content:center;}",
+        ".f122n59{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);}",
+        [
+            ".f44lkw9{border-radius:var(--borderRadiusCircular);}",
+            {
+                p: -1
+            }
+        ],
+        ".fzkkow9{border-top-style:solid;}",
+        ".fcdblym{border-right-style:solid;}",
+        ".fjik90z{border-left-style:solid;}",
+        ".fg706s2{border-bottom-style:solid;}",
+        [
+            ".f1mk8lai{padding:0;}",
+            {
+                p: -1
+            }
+        ],
+        ".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;}",
+        [
+            ".f1j9b7x8[data-fui-focus-visible]{border:var(--strokeWidthThick) solid var(--colorStrokeFocus2);}",
+            {
+                p: -2
+            }
+        ],
+        ".f1nev41a[data-fui-focus-visible]{outline-style:none;}",
+        ".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);}"
+    ],
+    m: [
+        [
+            "@media (forced-colors: active){.fw33nwi{border-top-color:CanvasText;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ],
+        [
+            "@media (forced-colors: active){.f1ptkjjm{border-right-color:CanvasText;}.fmzzjfk{border-left-color:CanvasText;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ],
+        [
+            "@media (forced-colors: active){.f15j0dln{border-bottom-color:CanvasText;}}",
+            {
+                m: "(forced-colors: active)"
+            }
+        ]
+    ],
+    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);}"
+    ],
+    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);}"
+    ]
+});
+const useAvatarGroupPopoverStyles_unstable = (state)=>{
+    'use no memo';
+    const { indicator, size, layout, popoverOpen } = state;
+    const sizeStyles = (0, _useAvatarStylesstyles.useSizeStyles)();
+    const triggerButtonStyles = useTriggerButtonStyles();
+    const contentStyles = useContentStyles();
+    const popoverSurfaceStyles = usePopoverSurfaceStyles();
+    const groupChildClassName = (0, _useAvatarGroupItemStylesstyles.useGroupChildClassName)(layout, size);
+    const triggerButtonClasses = [];
+    if (size < 36) {
+        triggerButtonClasses.push(triggerButtonStyles.borderThin);
+    } else if (size < 56) {
+        triggerButtonClasses.push(triggerButtonStyles.borderThick);
+    } else if (size < 72) {
+        triggerButtonClasses.push(triggerButtonStyles.borderThicker);
+    } else {
+        triggerButtonClasses.push(triggerButtonStyles.borderThickest);
+    }
+    if (indicator === 'count') {
+        if (size <= 24) {
+            triggerButtonClasses.push(triggerButtonStyles.caption2Strong);
+        } else if (size <= 28) {
+            triggerButtonClasses.push(triggerButtonStyles.caption1Strong);
+        } else if (size <= 40) {
+            triggerButtonClasses.push(triggerButtonStyles.body1Strong);
+        } else if (size <= 56) {
+            triggerButtonClasses.push(triggerButtonStyles.subtitle2);
+        } else if (size <= 96) {
+            triggerButtonClasses.push(triggerButtonStyles.subtitle1);
+        } else {
+            triggerButtonClasses.push(triggerButtonStyles.title3);
+        }
+    } else {
+        if (size <= 16) {
+            triggerButtonClasses.push(triggerButtonStyles.icon12);
+        } else if (size <= 24) {
+            triggerButtonClasses.push(triggerButtonStyles.icon16);
+        } else if (size <= 40) {
+            triggerButtonClasses.push(triggerButtonStyles.icon20);
+        } else if (size <= 48) {
+            triggerButtonClasses.push(triggerButtonStyles.icon24);
+        } else if (size <= 56) {
+            triggerButtonClasses.push(triggerButtonStyles.icon28);
+        } else if (size <= 72) {
+            triggerButtonClasses.push(triggerButtonStyles.icon32);
+        } else {
+            triggerButtonClasses.push(triggerButtonStyles.icon48);
+        }
+    }
+    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);
+    state.content.className = (0, _react.mergeClasses)(avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);
+    state.popoverSurface.className = (0, _react.mergeClasses)(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);
+    return state;
+};