@fluentui/react-avatar 9.11.1 → 9.11.3

package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["createCustomFocusIndicatorStyle","__styles","mergeClasses","shorthands","tokens","typographyStyles","useGroupChildClassName","useSizeStyles","avatarGroupPopoverClassNames","root","content","popoverSurface","tooltip","triggerButton","useContentStyles","base","dclx09","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","Beiy3e4","d","p","usePopoverSurfaceStyles","Bxyxcbc","sshi5w","B68tc82","Bmxbyg5","Bpg54ce","a9b677","useTriggerButtonStyles","qhf8xq","Bnnss6s","Brf1p80","Bt984gj","sj55zd","De3pzq","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","icvyot","vrafjx","oivjwe","wvpqe5","Bcq6wej","Jcjdmf","sc4o1m","Bosien3","pie","focusIndicator","Byu6kyc","n8qw10","Bbjhlyh","i2cumq","Bunx835","Bdrgwmp","mqozju","lbo84a","Bksnhdo","Bci5o5g","u5e7qz","Bn40d3w","B7b6zxw","B8q5s1w","B5gfjzb","Bbcte9g","Bqz3imu","g9k6zt","states","Bi91k9c","Jwef8y","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","lj723h","ecr2s2","B6oc9vd","ak43y8","wmxk5l","B50zh58","selected","icon12","Be2twd7","icon16","icon20","icon24","icon28","icon32","icon48","caption2Strong","Bahqtrf","Bhrd7zp","Bg96gwp","caption1Strong","body1Strong","subtitle2","subtitle1","title3","borderThin","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","borderThick","borderThicker","borderThickest","m","h","a","useAvatarGroupPopoverStyles_unstable","state","indicator","size","layout","popoverOpen","sizeStyles","triggerButtonStyles","contentStyles","popoverSurfaceStyles","groupChildClassName","triggerButtonClasses","push","className"],"sources":["useAvatarGroupPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles.styles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nexport const avatarGroupPopoverClassNames = {\n    root: 'fui-AvatarGroupPopover',\n    content: 'fui-AvatarGroupPopover__content',\n    popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',\n    tooltip: 'fui-AvatarGroupPopover__tooltip',\n    triggerButton: 'fui-AvatarGroupPopover__triggerButton'\n};\n/**\n * Styles for the content slot.\n */ const useContentStyles = makeStyles({\n    base: {\n        listStyleType: 'none',\n        margin: '0',\n        padding: '0',\n        display: 'flex',\n        flexDirection: 'column'\n    }\n});\n/**\n * Styles for the popoverSurface slot.\n */ const usePopoverSurfaceStyles = makeStyles({\n    base: {\n        maxHeight: '220px',\n        minHeight: '80px',\n        overflow: 'hidden scroll',\n        padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n        width: '220px'\n    }\n});\n/**\n * Styles for the triggerButton slot.\n */ const useTriggerButtonStyles = makeStyles({\n    base: {\n        display: 'inline-flex',\n        position: 'relative',\n        flexShrink: 0,\n        justifyContent: 'center',\n        alignItems: 'center',\n        color: tokens.colorNeutralForeground1,\n        backgroundColor: tokens.colorNeutralBackground1,\n        ...shorthands.borderColor(tokens.colorNeutralStroke1),\n        borderRadius: tokens.borderRadiusCircular,\n        ...shorthands.borderStyle('solid'),\n        padding: '0',\n        // Match color to Avatar's outline color.\n        '@media (forced-colors: active)': {\n            ...shorthands.borderColor('CanvasText')\n        }\n    },\n    pie: {\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderColor(tokens.colorTransparentStroke),\n        color: 'transparent'\n    },\n    focusIndicator: createCustomFocusIndicatorStyle({\n        border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n        outlineStyle: 'none'\n    }),\n    states: {\n        '&:hover': {\n            color: tokens.colorNeutralForeground1Hover,\n            backgroundColor: tokens.colorNeutralBackground1Hover,\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Hover)\n        },\n        '&:active': {\n            color: tokens.colorNeutralForeground1Pressed,\n            backgroundColor: tokens.colorNeutralBackground1Pressed,\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed)\n        }\n    },\n    selected: {\n        color: tokens.colorNeutralForeground1Selected,\n        backgroundColor: tokens.colorNeutralBackground1Selected,\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n    },\n    icon12: {\n        fontSize: '12px'\n    },\n    icon16: {\n        fontSize: '16px'\n    },\n    icon20: {\n        fontSize: '20px'\n    },\n    icon24: {\n        fontSize: '24px'\n    },\n    icon28: {\n        fontSize: '28px'\n    },\n    icon32: {\n        fontSize: '32px'\n    },\n    icon48: {\n        fontSize: '48px'\n    },\n    caption2Strong: {\n        ...typographyStyles.caption2Strong\n    },\n    caption1Strong: {\n        ...typographyStyles.caption1Strong\n    },\n    body1Strong: {\n        ...typographyStyles.body1Strong\n    },\n    subtitle2: {\n        ...typographyStyles.subtitle2\n    },\n    subtitle1: {\n        ...typographyStyles.subtitle1\n    },\n    title3: {\n        ...typographyStyles.title3\n    },\n    borderThin: {\n        ...shorthands.borderWidth(tokens.strokeWidthThin)\n    },\n    borderThick: {\n        ...shorthands.borderWidth(tokens.strokeWidthThick)\n    },\n    borderThicker: {\n        ...shorthands.borderWidth(tokens.strokeWidthThicker)\n    },\n    borderThickest: {\n        ...shorthands.borderWidth(tokens.strokeWidthThickest)\n    }\n});\n/**\n * Apply styling to the AvatarGroupPopover slots based on the state\n */ export const useAvatarGroupPopoverStyles_unstable = (state)=>{\n    'use no memo';\n    const { indicator, size, layout, popoverOpen } = state;\n    const sizeStyles = useSizeStyles();\n    const triggerButtonStyles = useTriggerButtonStyles();\n    const contentStyles = useContentStyles();\n    const popoverSurfaceStyles = usePopoverSurfaceStyles();\n    const groupChildClassName = useGroupChildClassName(layout, size);\n    const triggerButtonClasses = [];\n    if (size < 36) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThin);\n    } else if (size < 56) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThick);\n    } else if (size < 72) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThicker);\n    } else {\n        triggerButtonClasses.push(triggerButtonStyles.borderThickest);\n    }\n    if (indicator === 'count') {\n        if (size <= 24) {\n            triggerButtonClasses.push(triggerButtonStyles.caption2Strong);\n        } else if (size <= 28) {\n            triggerButtonClasses.push(triggerButtonStyles.caption1Strong);\n        } else if (size <= 40) {\n            triggerButtonClasses.push(triggerButtonStyles.body1Strong);\n        } else if (size <= 56) {\n            triggerButtonClasses.push(triggerButtonStyles.subtitle2);\n        } else if (size <= 96) {\n            triggerButtonClasses.push(triggerButtonStyles.subtitle1);\n        } else {\n            triggerButtonClasses.push(triggerButtonStyles.title3);\n        }\n    } else {\n        if (size <= 16) {\n            triggerButtonClasses.push(triggerButtonStyles.icon12);\n        } else if (size <= 24) {\n            triggerButtonClasses.push(triggerButtonStyles.icon16);\n        } else if (size <= 40) {\n            triggerButtonClasses.push(triggerButtonStyles.icon20);\n        } else if (size <= 48) {\n            triggerButtonClasses.push(triggerButtonStyles.icon24);\n        } else if (size <= 56) {\n            triggerButtonClasses.push(triggerButtonStyles.icon28);\n        } else if (size <= 72) {\n            triggerButtonClasses.push(triggerButtonStyles.icon32);\n        } else {\n            triggerButtonClasses.push(triggerButtonStyles.icon48);\n        }\n    }\n    state.triggerButton.className = 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);\n    state.content.className = mergeClasses(avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);\n    state.popoverSurface.className = mergeClasses(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["createCustomFocusIndicatorStyle","__styles","mergeClasses","shorthands","tokens","typographyStyles","useGroupChildClassName","useSizeStyles","avatarGroupPopoverClassNames","root","content","popoverSurface","tooltip","triggerButton","useContentStyles","base","dclx09","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","mc9l5x","Beiy3e4","d","p","usePopoverSurfaceStyles","Bxyxcbc","sshi5w","B68tc82","Bmxbyg5","Bpg54ce","a9b677","useTriggerButtonStyles","qhf8xq","Bnnss6s","Brf1p80","Bt984gj","sj55zd","De3pzq","g2u3we","h3c5rm","B9xav0g","zhjwy3","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","icvyot","vrafjx","oivjwe","wvpqe5","Bcq6wej","Jcjdmf","sc4o1m","Bosien3","pie","focusIndicator","Byu6kyc","n8qw10","Bbjhlyh","i2cumq","Bunx835","Bdrgwmp","mqozju","lbo84a","Bksnhdo","Bci5o5g","u5e7qz","Bn40d3w","B7b6zxw","B8q5s1w","B5gfjzb","Bbcte9g","Bqz3imu","g9k6zt","states","Bi91k9c","Jwef8y","Bgoe8wy","Bwzppfd","oetu4i","gg5e9n","lj723h","ecr2s2","B6oc9vd","ak43y8","wmxk5l","B50zh58","selected","icon12","Be2twd7","icon16","icon20","icon24","icon28","icon32","icon48","caption2Strong","Bahqtrf","Bhrd7zp","Bg96gwp","caption1Strong","body1Strong","subtitle2","subtitle1","title3","borderThin","B4j52fo","Bekrc4i","Bn0qgzm","ibv6hh","borderThick","borderThicker","borderThickest","m","h","a","useAvatarGroupPopoverStyles_unstable","state","indicator","size","layout","popoverOpen","sizeStyles","triggerButtonStyles","contentStyles","popoverSurfaceStyles","groupChildClassName","triggerButtonClasses","push","className"],"sources":["useAvatarGroupPopoverStyles.styles.js"],"sourcesContent":["'use client';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles.styles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nexport const avatarGroupPopoverClassNames = {\n    root: 'fui-AvatarGroupPopover',\n    content: 'fui-AvatarGroupPopover__content',\n    popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',\n    tooltip: 'fui-AvatarGroupPopover__tooltip',\n    triggerButton: 'fui-AvatarGroupPopover__triggerButton'\n};\n/**\n * Styles for the content slot.\n */ const useContentStyles = makeStyles({\n    base: {\n        listStyleType: 'none',\n        margin: '0',\n        padding: '0',\n        display: 'flex',\n        flexDirection: 'column'\n    }\n});\n/**\n * Styles for the popoverSurface slot.\n */ const usePopoverSurfaceStyles = makeStyles({\n    base: {\n        maxHeight: '220px',\n        minHeight: '80px',\n        overflow: 'hidden scroll',\n        padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n        width: '220px'\n    }\n});\n/**\n * Styles for the triggerButton slot.\n */ const useTriggerButtonStyles = makeStyles({\n    base: {\n        display: 'inline-flex',\n        position: 'relative',\n        flexShrink: 0,\n        justifyContent: 'center',\n        alignItems: 'center',\n        color: tokens.colorNeutralForeground1,\n        backgroundColor: tokens.colorNeutralBackground1,\n        ...shorthands.borderColor(tokens.colorNeutralStroke1),\n        borderRadius: tokens.borderRadiusCircular,\n        ...shorthands.borderStyle('solid'),\n        padding: '0',\n        // Match color to Avatar's outline color.\n        '@media (forced-colors: active)': {\n            ...shorthands.borderColor('CanvasText')\n        }\n    },\n    pie: {\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderColor(tokens.colorTransparentStroke),\n        color: 'transparent'\n    },\n    focusIndicator: createCustomFocusIndicatorStyle({\n        border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n        outlineStyle: 'none'\n    }),\n    states: {\n        '&:hover': {\n            color: tokens.colorNeutralForeground1Hover,\n            backgroundColor: tokens.colorNeutralBackground1Hover,\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Hover)\n        },\n        '&:active': {\n            color: tokens.colorNeutralForeground1Pressed,\n            backgroundColor: tokens.colorNeutralBackground1Pressed,\n            ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed)\n        }\n    },\n    selected: {\n        color: tokens.colorNeutralForeground1Selected,\n        backgroundColor: tokens.colorNeutralBackground1Selected,\n        ...shorthands.borderColor(tokens.colorNeutralStroke1Selected)\n    },\n    icon12: {\n        fontSize: '12px'\n    },\n    icon16: {\n        fontSize: '16px'\n    },\n    icon20: {\n        fontSize: '20px'\n    },\n    icon24: {\n        fontSize: '24px'\n    },\n    icon28: {\n        fontSize: '28px'\n    },\n    icon32: {\n        fontSize: '32px'\n    },\n    icon48: {\n        fontSize: '48px'\n    },\n    caption2Strong: {\n        ...typographyStyles.caption2Strong\n    },\n    caption1Strong: {\n        ...typographyStyles.caption1Strong\n    },\n    body1Strong: {\n        ...typographyStyles.body1Strong\n    },\n    subtitle2: {\n        ...typographyStyles.subtitle2\n    },\n    subtitle1: {\n        ...typographyStyles.subtitle1\n    },\n    title3: {\n        ...typographyStyles.title3\n    },\n    borderThin: {\n        ...shorthands.borderWidth(tokens.strokeWidthThin)\n    },\n    borderThick: {\n        ...shorthands.borderWidth(tokens.strokeWidthThick)\n    },\n    borderThicker: {\n        ...shorthands.borderWidth(tokens.strokeWidthThicker)\n    },\n    borderThickest: {\n        ...shorthands.borderWidth(tokens.strokeWidthThickest)\n    }\n});\n/**\n * Apply styling to the AvatarGroupPopover slots based on the state\n */ export const useAvatarGroupPopoverStyles_unstable = (state)=>{\n    const { indicator, size, layout, popoverOpen } = state;\n    const sizeStyles = useSizeStyles();\n    const triggerButtonStyles = useTriggerButtonStyles();\n    const contentStyles = useContentStyles();\n    const popoverSurfaceStyles = usePopoverSurfaceStyles();\n    const groupChildClassName = useGroupChildClassName(layout, size);\n    const triggerButtonClasses = [];\n    if (size < 36) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThin);\n    } else if (size < 56) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThick);\n    } else if (size < 72) {\n        triggerButtonClasses.push(triggerButtonStyles.borderThicker);\n    } else {\n        triggerButtonClasses.push(triggerButtonStyles.borderThickest);\n    }\n    if (indicator === 'count') {\n        if (size <= 24) {\n            triggerButtonClasses.push(triggerButtonStyles.caption2Strong);\n        } else if (size <= 28) {\n            triggerButtonClasses.push(triggerButtonStyles.caption1Strong);\n        } else if (size <= 40) {\n            triggerButtonClasses.push(triggerButtonStyles.body1Strong);\n        } else if (size <= 56) {\n            triggerButtonClasses.push(triggerButtonStyles.subtitle2);\n        } else if (size <= 96) {\n            triggerButtonClasses.push(triggerButtonStyles.subtitle1);\n        } else {\n            triggerButtonClasses.push(triggerButtonStyles.title3);\n        }\n    } else {\n        if (size <= 16) {\n            triggerButtonClasses.push(triggerButtonStyles.icon12);\n        } else if (size <= 24) {\n            triggerButtonClasses.push(triggerButtonStyles.icon16);\n        } else if (size <= 40) {\n            triggerButtonClasses.push(triggerButtonStyles.icon20);\n        } else if (size <= 48) {\n            triggerButtonClasses.push(triggerButtonStyles.icon24);\n        } else if (size <= 56) {\n            triggerButtonClasses.push(triggerButtonStyles.icon28);\n        } else if (size <= 72) {\n            triggerButtonClasses.push(triggerButtonStyles.icon32);\n        } else {\n            triggerButtonClasses.push(triggerButtonStyles.icon48);\n        }\n    }\n    // eslint-disable-next-line react-hooks/immutability\n    state.triggerButton.className = 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);\n    // eslint-disable-next-line react-hooks/immutability\n    state.content.className = mergeClasses(avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);\n    // eslint-disable-next-line react-hooks/immutability\n    state.popoverSurface.className = mergeClasses(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);\n    return state;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js

@@ -134,7 +134,6 @@ export const avatarGroupPopoverClassNames = {
 /**
  * Apply styling to the AvatarGroupPopover slots based on the state
  */ export const useAvatarGroupPopoverStyles_unstable = (state)=>{
-    'use no memo';
     const { indicator, size, layout, popoverOpen } = state;
     const sizeStyles = useSizeStyles();
     const triggerButtonStyles = useTriggerButtonStyles();
@@ -182,8 +181,11 @@ export const avatarGroupPopoverClassNames = {
             triggerButtonClasses.push(triggerButtonStyles.icon48);
         }
     }
+    // eslint-disable-next-line react-hooks/immutability
     state.triggerButton.className = 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);
+    // eslint-disable-next-line react-hooks/immutability
     state.content.className = mergeClasses(avatarGroupPopoverClassNames.content, contentStyles.base, state.content.className);
+    // eslint-disable-next-line react-hooks/immutability
     state.popoverSurface.className = mergeClasses(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);
     return state;
 };

package/lib/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles.styles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nimport type { AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupPopoverClassNames: SlotClassNames<AvatarGroupPopoverSlots> = {\n  root: 'fui-AvatarGroupPopover',\n  content: 'fui-AvatarGroupPopover__content',\n  popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',\n  tooltip: 'fui-AvatarGroupPopover__tooltip',\n  triggerButton: 'fui-AvatarGroupPopover__triggerButton',\n};\n\n/**\n * Styles for the content slot.\n */\nconst useContentStyles = makeStyles({\n  base: {\n    listStyleType: 'none',\n    margin: '0',\n    padding: '0',\n    display: 'flex',\n    flexDirection: 'column',\n  },\n});\n\n/**\n * Styles for the popoverSurface slot.\n */\nconst usePopoverSurfaceStyles = makeStyles({\n  base: {\n    maxHeight: '220px',\n    minHeight: '80px',\n    overflow: 'hidden scroll',\n    padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n    width: '220px',\n  },\n});\n\n/**\n * Styles for the triggerButton slot.\n */\nconst useTriggerButtonStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    position: 'relative',\n    flexShrink: 0,\n    justifyContent: 'center',\n    alignItems: 'center',\n    color: tokens.colorNeutralForeground1,\n    backgroundColor: tokens.colorNeutralBackground1,\n    ...shorthands.borderColor(tokens.colorNeutralStroke1),\n    borderRadius: tokens.borderRadiusCircular,\n    ...shorthands.borderStyle('solid'),\n    padding: '0',\n\n    // Match color to Avatar's outline color.\n    '@media (forced-colors: active)': {\n      ...shorthands.borderColor('CanvasText'),\n    },\n  },\n\n  pie: {\n    backgroundColor: tokens.colorTransparentBackground,\n    ...shorthands.borderColor(tokens.colorTransparentStroke),\n    color: 'transparent',\n  },\n\n  focusIndicator: createCustomFocusIndicatorStyle({\n    border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n    outlineStyle: 'none',\n  }),\n\n  states: {\n    '&:hover': {\n      color: tokens.colorNeutralForeground1Hover,\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n    },\n    '&:active': {\n      color: tokens.colorNeutralForeground1Pressed,\n      backgroundColor: tokens.colorNeutralBackground1Pressed,\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n    },\n  },\n\n  selected: {\n    color: tokens.colorNeutralForeground1Selected,\n    backgroundColor: tokens.colorNeutralBackground1Selected,\n    ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n  },\n\n  icon12: { fontSize: '12px' },\n  icon16: { fontSize: '16px' },\n  icon20: { fontSize: '20px' },\n  icon24: { fontSize: '24px' },\n  icon28: { fontSize: '28px' },\n  icon32: { fontSize: '32px' },\n  icon48: { fontSize: '48px' },\n  caption2Strong: { ...typographyStyles.caption2Strong },\n  caption1Strong: { ...typographyStyles.caption1Strong },\n  body1Strong: { ...typographyStyles.body1Strong },\n  subtitle2: { ...typographyStyles.subtitle2 },\n  subtitle1: { ...typographyStyles.subtitle1 },\n  title3: { ...typographyStyles.title3 },\n  borderThin: { ...shorthands.borderWidth(tokens.strokeWidthThin) },\n  borderThick: { ...shorthands.borderWidth(tokens.strokeWidthThick) },\n  borderThicker: { ...shorthands.borderWidth(tokens.strokeWidthThicker) },\n  borderThickest: { ...shorthands.borderWidth(tokens.strokeWidthThickest) },\n});\n\n/**\n * Apply styling to the AvatarGroupPopover slots based on the state\n */\nexport const useAvatarGroupPopoverStyles_unstable = (state: AvatarGroupPopoverState): AvatarGroupPopoverState => {\n  'use no memo';\n\n  const { indicator, size, layout, popoverOpen } = state;\n  const sizeStyles = useSizeStyles();\n  const triggerButtonStyles = useTriggerButtonStyles();\n  const contentStyles = useContentStyles();\n  const popoverSurfaceStyles = usePopoverSurfaceStyles();\n  const groupChildClassName = useGroupChildClassName(layout, size);\n\n  const triggerButtonClasses = [];\n\n  if (size < 36) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThin);\n  } else if (size < 56) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThick);\n  } else if (size < 72) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThicker);\n  } else {\n    triggerButtonClasses.push(triggerButtonStyles.borderThickest);\n  }\n\n  if (indicator === 'count') {\n    if (size <= 24) {\n      triggerButtonClasses.push(triggerButtonStyles.caption2Strong);\n    } else if (size <= 28) {\n      triggerButtonClasses.push(triggerButtonStyles.caption1Strong);\n    } else if (size <= 40) {\n      triggerButtonClasses.push(triggerButtonStyles.body1Strong);\n    } else if (size <= 56) {\n      triggerButtonClasses.push(triggerButtonStyles.subtitle2);\n    } else if (size <= 96) {\n      triggerButtonClasses.push(triggerButtonStyles.subtitle1);\n    } else {\n      triggerButtonClasses.push(triggerButtonStyles.title3);\n    }\n  } else {\n    if (size <= 16) {\n      triggerButtonClasses.push(triggerButtonStyles.icon12);\n    } else if (size <= 24) {\n      triggerButtonClasses.push(triggerButtonStyles.icon16);\n    } else if (size <= 40) {\n      triggerButtonClasses.push(triggerButtonStyles.icon20);\n    } else if (size <= 48) {\n      triggerButtonClasses.push(triggerButtonStyles.icon24);\n    } else if (size <= 56) {\n      triggerButtonClasses.push(triggerButtonStyles.icon28);\n    } else if (size <= 72) {\n      triggerButtonClasses.push(triggerButtonStyles.icon32);\n    } else {\n      triggerButtonClasses.push(triggerButtonStyles.icon48);\n    }\n  }\n\n  state.triggerButton.className = mergeClasses(\n    avatarGroupPopoverClassNames.triggerButton,\n    groupChildClassName,\n    sizeStyles[size],\n    triggerButtonStyles.base,\n    layout === 'pie' && triggerButtonStyles.pie,\n    triggerButtonStyles.focusIndicator,\n    layout !== 'pie' && triggerButtonStyles.states,\n    layout !== 'pie' && popoverOpen && triggerButtonStyles.selected,\n    ...triggerButtonClasses,\n    state.triggerButton.className,\n  );\n\n  state.content.className = mergeClasses(\n    avatarGroupPopoverClassNames.content,\n    contentStyles.base,\n    state.content.className,\n  );\n\n  state.popoverSurface.className = mergeClasses(\n    avatarGroupPopoverClassNames.popoverSurface,\n    popoverSurfaceStyles.base,\n    state.popoverSurface.className,\n  );\n\n  return state;\n};\n"],"names":["createCustomFocusIndicatorStyle","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","useGroupChildClassName","useSizeStyles","avatarGroupPopoverClassNames","root","content","popoverSurface","tooltip","triggerButton","useContentStyles","base","listStyleType","margin","padding","display","flexDirection","usePopoverSurfaceStyles","maxHeight","minHeight","overflow","spacingVerticalS","spacingHorizontalS","width","useTriggerButtonStyles","position","flexShrink","justifyContent","alignItems","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderColor","colorNeutralStroke1","borderRadius","borderRadiusCircular","borderStyle","pie","colorTransparentBackground","colorTransparentStroke","focusIndicator","border","strokeWidthThick","colorStrokeFocus2","outlineStyle","states","colorNeutralForeground1Hover","colorNeutralBackground1Hover","colorNeutralStroke1Hover","colorNeutralForeground1Pressed","colorNeutralBackground1Pressed","colorNeutralStroke1Pressed","selected","colorNeutralForeground1Selected","colorNeutralBackground1Selected","colorNeutralStroke1Selected","icon12","fontSize","icon16","icon20","icon24","icon28","icon32","icon48","caption2Strong","caption1Strong","body1Strong","subtitle2","subtitle1","title3","borderThin","borderWidth","strokeWidthThin","borderThick","borderThicker","strokeWidthThicker","borderThickest","strokeWidthThickest","useAvatarGroupPopoverStyles_unstable","state","indicator","size","layout","popoverOpen","sizeStyles","triggerButtonStyles","contentStyles","popoverSurfaceStyles","groupChildClassName","triggerButtonClasses","push","className"],"mappings":"AAAA;AAEA,SAASA,+BAA+B,QAAQ,0BAA0B;AAC1E,SAASC,UAAU,EAAEC,YAAY,EAAEC,UAAU,QAAQ,iBAAiB;AACtE,SAASC,MAAM,EAAEC,gBAAgB,QAAQ,wBAAwB;AACjE,SAASC,sBAAsB,QAAQ,qDAAqD;AAC5F,SAASC,aAAa,QAAQ,mCAAmC;AAIjE,OAAO,MAAMC,+BAAwE;IACnFC,MAAM;IACNC,SAAS;IACTC,gBAAgB;IAChBC,SAAS;IACTC,eAAe;AACjB,EAAE;AAEF;;CAEC,GACD,MAAMC,mBAAmBb,WAAW;IAClCc,MAAM;QACJC,eAAe;QACfC,QAAQ;QACRC,SAAS;QACTC,SAAS;QACTC,eAAe;IACjB;AACF;AAEA;;CAEC,GACD,MAAMC,0BAA0BpB,WAAW;IACzCc,MAAM;QACJO,WAAW;QACXC,WAAW;QACXC,UAAU;QACVN,SAAS,GAAGd,OAAOqB,gBAAgB,CAAC,CAAC,EAAErB,OAAOsB,kBAAkB,EAAE;QAClEC,OAAO;IACT;AACF;AAEA;;CAEC,GACD,MAAMC,yBAAyB3B,WAAW;IACxCc,MAAM;QACJI,SAAS;QACTU,UAAU;QACVC,YAAY;QACZC,gBAAgB;QAChBC,YAAY;QACZC,OAAO7B,OAAO8B,uBAAuB;QACrCC,iBAAiB/B,OAAOgC,uBAAuB;QAC/C,GAAGjC,WAAWkC,WAAW,CAACjC,OAAOkC,mBAAmB,CAAC;QACrDC,cAAcnC,OAAOoC,oBAAoB;QACzC,GAAGrC,WAAWsC,WAAW,CAAC,QAAQ;QAClCvB,SAAS;QAET,yCAAyC;QACzC,kCAAkC;YAChC,GAAGf,WAAWkC,WAAW,CAAC,aAAa;QACzC;IACF;IAEAK,KAAK;QACHP,iBAAiB/B,OAAOuC,0BAA0B;QAClD,GAAGxC,WAAWkC,WAAW,CAACjC,OAAOwC,sBAAsB,CAAC;QACxDX,OAAO;IACT;IAEAY,gBAAgB7C,gCAAgC;QAC9C8C,QAAQ,GAAG1C,OAAO2C,gBAAgB,CAAC,OAAO,EAAE3C,OAAO4C,iBAAiB,EAAE;QACtEC,cAAc;IAChB;IAEAC,QAAQ;QACN,WAAW;YACTjB,OAAO7B,OAAO+C,4BAA4B;YAC1ChB,iBAAiB/B,OAAOgD,4BAA4B;YACpD,GAAGjD,WAAWkC,WAAW,CAACjC,OAAOiD,wBAAwB,CAAC;QAC5D;QACA,YAAY;YACVpB,OAAO7B,OAAOkD,8BAA8B;YAC5CnB,iBAAiB/B,OAAOmD,8BAA8B;YACtD,GAAGpD,WAAWkC,WAAW,CAACjC,OAAOoD,0BAA0B,CAAC;QAC9D;IACF;IAEAC,UAAU;QACRxB,OAAO7B,OAAOsD,+BAA+B;QAC7CvB,iBAAiB/B,OAAOuD,+BAA+B;QACvD,GAAGxD,WAAWkC,WAAW,CAACjC,OAAOwD,2BAA2B,CAAC;IAC/D;IAEAC,QAAQ;QAAEC,UAAU;IAAO;IAC3BC,QAAQ;QAAED,UAAU;IAAO;IAC3BE,QAAQ;QAAEF,UAAU;IAAO;IAC3BG,QAAQ;QAAEH,UAAU;IAAO;IAC3BI,QAAQ;QAAEJ,UAAU;IAAO;IAC3BK,QAAQ;QAAEL,UAAU;IAAO;IAC3BM,QAAQ;QAAEN,UAAU;IAAO;IAC3BO,gBAAgB;QAAE,GAAGhE,iBAAiBgE,cAAc;IAAC;IACrDC,gBAAgB;QAAE,GAAGjE,iBAAiBiE,cAAc;IAAC;IACrDC,aAAa;QAAE,GAAGlE,iBAAiBkE,WAAW;IAAC;IAC/CC,WAAW;QAAE,GAAGnE,iBAAiBmE,SAAS;IAAC;IAC3CC,WAAW;QAAE,GAAGpE,iBAAiBoE,SAAS;IAAC;IAC3CC,QAAQ;QAAE,GAAGrE,iBAAiBqE,MAAM;IAAC;IACrCC,YAAY;QAAE,GAAGxE,WAAWyE,WAAW,CAACxE,OAAOyE,eAAe,CAAC;IAAC;IAChEC,aAAa;QAAE,GAAG3E,WAAWyE,WAAW,CAACxE,OAAO2C,gBAAgB,CAAC;IAAC;IAClEgC,eAAe;QAAE,GAAG5E,WAAWyE,WAAW,CAACxE,OAAO4E,kBAAkB,CAAC;IAAC;IACtEC,gBAAgB;QAAE,GAAG9E,WAAWyE,WAAW,CAACxE,OAAO8E,mBAAmB,CAAC;IAAC;AAC1E;AAEA;;CAEC,GACD,OAAO,MAAMC,uCAAuC,CAACC;IACnD;IAEA,MAAM,EAAEC,SAAS,EAAEC,IAAI,EAAEC,MAAM,EAAEC,WAAW,EAAE,GAAGJ;IACjD,MAAMK,aAAalF;IACnB,MAAMmF,sBAAsB9D;IAC5B,MAAM+D,gBAAgB7E;IACtB,MAAM8E,uBAAuBvE;IAC7B,MAAMwE,sBAAsBvF,uBAAuBiF,QAAQD;IAE3D,MAAMQ,uBAAuB,EAAE;IAE/B,IAAIR,OAAO,IAAI;QACbQ,qBAAqBC,IAAI,CAACL,oBAAoBf,UAAU;IAC1D,OAAO,IAAIW,OAAO,IAAI;QACpBQ,qBAAqBC,IAAI,CAACL,oBAAoBZ,WAAW;IAC3D,OAAO,IAAIQ,OAAO,IAAI;QACpBQ,qBAAqBC,IAAI,CAACL,oBAAoBX,aAAa;IAC7D,OAAO;QACLe,qBAAqBC,IAAI,CAACL,oBAAoBT,cAAc;IAC9D;IAEA,IAAII,cAAc,SAAS;QACzB,IAAIC,QAAQ,IAAI;YACdQ,qBAAqBC,IAAI,CAACL,oBAAoBrB,cAAc;QAC9D,OAAO,IAAIiB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBpB,cAAc;QAC9D,OAAO,IAAIgB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBnB,WAAW;QAC3D,OAAO,IAAIe,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBlB,SAAS;QACzD,OAAO,IAAIc,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBjB,SAAS;QACzD,OAAO;YACLqB,qBAAqBC,IAAI,CAACL,oBAAoBhB,MAAM;QACtD;IACF,OAAO;QACL,IAAIY,QAAQ,IAAI;YACdQ,qBAAqBC,IAAI,CAACL,oBAAoB7B,MAAM;QACtD,OAAO,IAAIyB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoB3B,MAAM;QACtD,OAAO,IAAIuB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoB1B,MAAM;QACtD,OAAO,IAAIsB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBzB,MAAM;QACtD,OAAO,IAAIqB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBxB,MAAM;QACtD,OAAO,IAAIoB,QAAQ,IAAI;YACrBQ,qBAAqBC,IAAI,CAACL,oBAAoBvB,MAAM;QACtD,OAAO;YACL2B,qBAAqBC,IAAI,CAACL,oBAAoBtB,MAAM;QACtD;IACF;IAEAgB,MAAMvE,aAAa,CAACmF,SAAS,GAAG9F,aAC9BM,6BAA6BK,aAAa,EAC1CgF,qBACAJ,UAAU,CAACH,KAAK,EAChBI,oBAAoB3E,IAAI,EACxBwE,WAAW,SAASG,oBAAoBhD,GAAG,EAC3CgD,oBAAoB7C,cAAc,EAClC0C,WAAW,SAASG,oBAAoBxC,MAAM,EAC9CqC,WAAW,SAASC,eAAeE,oBAAoBjC,QAAQ,KAC5DqC,sBACHV,MAAMvE,aAAa,CAACmF,SAAS;IAG/BZ,MAAM1E,OAAO,CAACsF,SAAS,GAAG9F,aACxBM,6BAA6BE,OAAO,EACpCiF,cAAc5E,IAAI,EAClBqE,MAAM1E,OAAO,CAACsF,SAAS;IAGzBZ,MAAMzE,cAAc,CAACqF,SAAS,GAAG9F,aAC/BM,6BAA6BG,cAAc,EAC3CiF,qBAAqB7E,IAAI,EACzBqE,MAAMzE,cAAc,CAACqF,SAAS;IAGhC,OAAOZ;AACT,EAAE"}
+{"version":3,"sources":["../src/components/AvatarGroupPopover/useAvatarGroupPopoverStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles.styles';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nimport type { AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupPopoverClassNames: SlotClassNames<AvatarGroupPopoverSlots> = {\n  root: 'fui-AvatarGroupPopover',\n  content: 'fui-AvatarGroupPopover__content',\n  popoverSurface: 'fui-AvatarGroupPopover__popoverSurface',\n  tooltip: 'fui-AvatarGroupPopover__tooltip',\n  triggerButton: 'fui-AvatarGroupPopover__triggerButton',\n};\n\n/**\n * Styles for the content slot.\n */\nconst useContentStyles = makeStyles({\n  base: {\n    listStyleType: 'none',\n    margin: '0',\n    padding: '0',\n    display: 'flex',\n    flexDirection: 'column',\n  },\n});\n\n/**\n * Styles for the popoverSurface slot.\n */\nconst usePopoverSurfaceStyles = makeStyles({\n  base: {\n    maxHeight: '220px',\n    minHeight: '80px',\n    overflow: 'hidden scroll',\n    padding: `${tokens.spacingVerticalS} ${tokens.spacingHorizontalS}`,\n    width: '220px',\n  },\n});\n\n/**\n * Styles for the triggerButton slot.\n */\nconst useTriggerButtonStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    position: 'relative',\n    flexShrink: 0,\n    justifyContent: 'center',\n    alignItems: 'center',\n    color: tokens.colorNeutralForeground1,\n    backgroundColor: tokens.colorNeutralBackground1,\n    ...shorthands.borderColor(tokens.colorNeutralStroke1),\n    borderRadius: tokens.borderRadiusCircular,\n    ...shorthands.borderStyle('solid'),\n    padding: '0',\n\n    // Match color to Avatar's outline color.\n    '@media (forced-colors: active)': {\n      ...shorthands.borderColor('CanvasText'),\n    },\n  },\n\n  pie: {\n    backgroundColor: tokens.colorTransparentBackground,\n    ...shorthands.borderColor(tokens.colorTransparentStroke),\n    color: 'transparent',\n  },\n\n  focusIndicator: createCustomFocusIndicatorStyle({\n    border: `${tokens.strokeWidthThick} solid ${tokens.colorStrokeFocus2}`,\n    outlineStyle: 'none',\n  }),\n\n  states: {\n    '&:hover': {\n      color: tokens.colorNeutralForeground1Hover,\n      backgroundColor: tokens.colorNeutralBackground1Hover,\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n    },\n    '&:active': {\n      color: tokens.colorNeutralForeground1Pressed,\n      backgroundColor: tokens.colorNeutralBackground1Pressed,\n      ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n    },\n  },\n\n  selected: {\n    color: tokens.colorNeutralForeground1Selected,\n    backgroundColor: tokens.colorNeutralBackground1Selected,\n    ...shorthands.borderColor(tokens.colorNeutralStroke1Selected),\n  },\n\n  icon12: { fontSize: '12px' },\n  icon16: { fontSize: '16px' },\n  icon20: { fontSize: '20px' },\n  icon24: { fontSize: '24px' },\n  icon28: { fontSize: '28px' },\n  icon32: { fontSize: '32px' },\n  icon48: { fontSize: '48px' },\n  caption2Strong: { ...typographyStyles.caption2Strong },\n  caption1Strong: { ...typographyStyles.caption1Strong },\n  body1Strong: { ...typographyStyles.body1Strong },\n  subtitle2: { ...typographyStyles.subtitle2 },\n  subtitle1: { ...typographyStyles.subtitle1 },\n  title3: { ...typographyStyles.title3 },\n  borderThin: { ...shorthands.borderWidth(tokens.strokeWidthThin) },\n  borderThick: { ...shorthands.borderWidth(tokens.strokeWidthThick) },\n  borderThicker: { ...shorthands.borderWidth(tokens.strokeWidthThicker) },\n  borderThickest: { ...shorthands.borderWidth(tokens.strokeWidthThickest) },\n});\n\n/**\n * Apply styling to the AvatarGroupPopover slots based on the state\n */\nexport const useAvatarGroupPopoverStyles_unstable = (state: AvatarGroupPopoverState): AvatarGroupPopoverState => {\n  const { indicator, size, layout, popoverOpen } = state;\n  const sizeStyles = useSizeStyles();\n  const triggerButtonStyles = useTriggerButtonStyles();\n  const contentStyles = useContentStyles();\n  const popoverSurfaceStyles = usePopoverSurfaceStyles();\n  const groupChildClassName = useGroupChildClassName(layout, size);\n\n  const triggerButtonClasses = [];\n\n  if (size < 36) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThin);\n  } else if (size < 56) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThick);\n  } else if (size < 72) {\n    triggerButtonClasses.push(triggerButtonStyles.borderThicker);\n  } else {\n    triggerButtonClasses.push(triggerButtonStyles.borderThickest);\n  }\n\n  if (indicator === 'count') {\n    if (size <= 24) {\n      triggerButtonClasses.push(triggerButtonStyles.caption2Strong);\n    } else if (size <= 28) {\n      triggerButtonClasses.push(triggerButtonStyles.caption1Strong);\n    } else if (size <= 40) {\n      triggerButtonClasses.push(triggerButtonStyles.body1Strong);\n    } else if (size <= 56) {\n      triggerButtonClasses.push(triggerButtonStyles.subtitle2);\n    } else if (size <= 96) {\n      triggerButtonClasses.push(triggerButtonStyles.subtitle1);\n    } else {\n      triggerButtonClasses.push(triggerButtonStyles.title3);\n    }\n  } else {\n    if (size <= 16) {\n      triggerButtonClasses.push(triggerButtonStyles.icon12);\n    } else if (size <= 24) {\n      triggerButtonClasses.push(triggerButtonStyles.icon16);\n    } else if (size <= 40) {\n      triggerButtonClasses.push(triggerButtonStyles.icon20);\n    } else if (size <= 48) {\n      triggerButtonClasses.push(triggerButtonStyles.icon24);\n    } else if (size <= 56) {\n      triggerButtonClasses.push(triggerButtonStyles.icon28);\n    } else if (size <= 72) {\n      triggerButtonClasses.push(triggerButtonStyles.icon32);\n    } else {\n      triggerButtonClasses.push(triggerButtonStyles.icon48);\n    }\n  }\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.triggerButton.className = mergeClasses(\n    avatarGroupPopoverClassNames.triggerButton,\n    groupChildClassName,\n    sizeStyles[size],\n    triggerButtonStyles.base,\n    layout === 'pie' && triggerButtonStyles.pie,\n    triggerButtonStyles.focusIndicator,\n    layout !== 'pie' && triggerButtonStyles.states,\n    layout !== 'pie' && popoverOpen && triggerButtonStyles.selected,\n    ...triggerButtonClasses,\n    state.triggerButton.className,\n  );\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.content.className = mergeClasses(\n    avatarGroupPopoverClassNames.content,\n    contentStyles.base,\n    state.content.className,\n  );\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.popoverSurface.className = mergeClasses(\n    avatarGroupPopoverClassNames.popoverSurface,\n    popoverSurfaceStyles.base,\n    state.popoverSurface.className,\n  );\n\n  return state;\n};\n"],"names":["createCustomFocusIndicatorStyle","makeStyles","mergeClasses","shorthands","tokens","typographyStyles","useGroupChildClassName","useSizeStyles","avatarGroupPopoverClassNames","root","content","popoverSurface","tooltip","triggerButton","useContentStyles","base","listStyleType","margin","padding","display","flexDirection","usePopoverSurfaceStyles","maxHeight","minHeight","overflow","spacingVerticalS","spacingHorizontalS","width","useTriggerButtonStyles","position","flexShrink","justifyContent","alignItems","color","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","borderColor","colorNeutralStroke1","borderRadius","borderRadiusCircular","borderStyle","pie","colorTransparentBackground","colorTransparentStroke","focusIndicator","border","strokeWidthThick","colorStrokeFocus2","outlineStyle","states","colorNeutralForeground1Hover","colorNeutralBackground1Hover","colorNeutralStroke1Hover","colorNeutralForeground1Pressed","colorNeutralBackground1Pressed","colorNeutralStroke1Pressed","selected","colorNeutralForeground1Selected","colorNeutralBackground1Selected","colorNeutralStroke1Selected","icon12","fontSize","icon16","icon20","icon24","icon28","icon32","icon48","caption2Strong","caption1Strong","body1Strong","subtitle2","subtitle1","title3","borderThin","borderWidth","strokeWidthThin","borderThick","borderThicker","strokeWidthThicker","borderThickest","strokeWidthThickest","useAvatarGroupPopoverStyles_unstable","state","indicator","size","layout","popoverOpen","sizeStyles","triggerButtonStyles","contentStyles","popoverSurfaceStyles","groupChildClassName","triggerButtonClasses","push","className"],"mappings":"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"}

package/lib-commonjs/components/Avatar/useAvatar.js

@@ -42,6 +42,7 @@ const useAvatar_unstable = (props, ref)=>{
     const color = propColor === 'colorful' ? avatarColors[getHashCode((_ref = idForColor !== null && idForColor !== void 0 ? idForColor : props.name) !== null && _ref !== void 0 ? _ref : '') % avatarColors.length] : propColor;
     if (state.initials) {
         var _state_initials;
+        // eslint-disable-next-line react-hooks/immutability
         state.initials = _reactutilities.slot.optional(props.initials, {
             renderByDefault: true,
             defaultProps: {
@@ -54,6 +55,7 @@ const useAvatar_unstable = (props, ref)=>{
         });
     }
     if (state.icon && !state.icon.hasOwnProperty('children')) {
+        // eslint-disable-next-line react-hooks/immutability
         state.icon.children = /*#__PURE__*/ _react.createElement(_reacticons.PersonRegular, null);
     }
     const badge = _reactutilities.slot.optional(props.badge, {
@@ -71,11 +73,14 @@ const useAvatar_unstable = (props, ref)=>{
     if (!userProvidedAriaLabel && !userProvidedAriaLabelledby) {
         if (props.name) {
             if (badge) {
+                // eslint-disable-next-line react-hooks/immutability
                 state.root['aria-labelledby'] = state.root.id + ' ' + badge.id;
             }
         } else if (state.initials) {
             // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing
+            // eslint-disable-next-line react-hooks/immutability
             state.root['aria-labelledby'] = state.initials.id + (badge ? ' ' + badge.id : '');
+            // eslint-disable-next-line react-hooks/immutability
             delete state.root['aria-label'];
         }
         // Add the active state to the aria label
@@ -84,6 +89,7 @@ const useAvatar_unstable = (props, ref)=>{
             if (state.root['aria-labelledby']) {
                 // If using aria-labelledby, render a hidden span and append it to the labelledby
                 const activeId = state.root.id + '__active';
+                // eslint-disable-next-line react-hooks/immutability
                 state.root['aria-labelledby'] += ' ' + activeId;
                 activeAriaLabelElement = /*#__PURE__*/ _react.createElement("span", {
                     hidden: true,
@@ -91,6 +97,7 @@ const useAvatar_unstable = (props, ref)=>{
                 }, activeText);
             } else if (state.root['aria-label']) {
                 // Otherwise, just append it to the aria-label
+                // eslint-disable-next-line react-hooks/immutability
                 state.root['aria-label'] += ' ' + activeText;
             }
         }

package/lib-commonjs/components/Avatar/useAvatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Avatar/useAvatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\nimport { getInitials } from '../../utils/index';\nimport type { AvatarBaseProps, AvatarBaseState, AvatarNamedColor, AvatarProps, AvatarState } from './Avatar.types';\nimport { PersonRegular } from '@fluentui/react-icons';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useAvatarContext } from '../../contexts/AvatarContext';\n\nexport const DEFAULT_STRINGS = {\n  active: 'active',\n  inactive: 'inactive',\n};\n\nexport const useAvatar_unstable = (props: AvatarProps, ref: React.Ref<HTMLElement>): AvatarState => {\n  const { dir } = useFluent();\n  const { shape: contextShape, size: contextSize } = useAvatarContext();\n  const {\n    size = contextSize ?? (32 as const),\n    shape = contextShape ?? 'circular',\n    active = 'unset',\n    activeAppearance = 'ring',\n    idForColor,\n    color: propColor = 'neutral',\n    ...rest\n  } = props;\n\n  const state = useAvatarBase_unstable(rest, ref);\n\n  // Resolve 'colorful' to a specific color name\n  const color: AvatarState['color'] =\n    propColor === 'colorful'\n      ? avatarColors[getHashCode(idForColor ?? props.name ?? '') % avatarColors.length]\n      : propColor;\n\n  if (state.initials) {\n    state.initials = slot.optional(props.initials, {\n      renderByDefault: true,\n      defaultProps: {\n        children: getInitials(props.name, dir === 'rtl', { firstInitialOnly: size <= 16 }),\n        id: state.initials?.id,\n      },\n      elementType: 'span',\n    });\n  }\n\n  if (state.icon && !state.icon.hasOwnProperty('children')) {\n    state.icon.children = <PersonRegular />;\n  }\n\n  const badge: AvatarState['badge'] = slot.optional(props.badge, {\n    defaultProps: { size: getBadgeSize(size), id: state.root.id + '__badge' },\n    elementType: PresenceBadge,\n  });\n\n  let activeAriaLabelElement: AvatarState['activeAriaLabelElement'] = state.activeAriaLabelElement;\n\n  // Enhance aria-label and/or aria-labelledby to include badge and active state\n  // Only process if aria attributes were not explicitly provided by the user\n  const userProvidedAriaLabel = props['aria-label'] !== undefined;\n  const userProvidedAriaLabelledby = props['aria-labelledby'] !== undefined;\n\n  if (!userProvidedAriaLabel && !userProvidedAriaLabelledby) {\n    if (props.name) {\n      if (badge) {\n        state.root['aria-labelledby'] = state.root.id + ' ' + badge.id;\n      }\n    } else if (state.initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      state.root['aria-labelledby'] = state.initials.id + (badge ? ' ' + badge.id : '');\n      delete state.root['aria-label'];\n    }\n    // Add the active state to the aria label\n    if (active === 'active' || active === 'inactive') {\n      const activeText = DEFAULT_STRINGS[active];\n      if (state.root['aria-labelledby']) {\n        // If using aria-labelledby, render a hidden span and append it to the labelledby\n        const activeId = state.root.id + '__active';\n        state.root['aria-labelledby'] += ' ' + activeId;\n        activeAriaLabelElement = (\n          <span hidden id={activeId}>\n            {activeText}\n          </span>\n        );\n      } else if (state.root['aria-label']) {\n        // Otherwise, just append it to the aria-label\n        state.root['aria-label'] += ' ' + activeText;\n      }\n    }\n  }\n\n  return {\n    ...state,\n    size,\n    shape,\n    active,\n    activeAppearance,\n    activeAriaLabelElement,\n    color,\n    badge,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, badge: PresenceBadge },\n  };\n};\n\n/**\n * Base hook for Avatar component, manages state and structure common to all variants of Avatar\n */\nexport const useAvatarBase_unstable = (props: AvatarBaseProps, ref?: React.Ref<HTMLElement>): AvatarBaseState => {\n  const { dir } = useFluent();\n  const { name, image: imageProp, initials: initialsProp, ...rest } = props;\n\n  const baseId = useId('avatar-');\n\n  const root: AvatarBaseState['root'] = slot.always(\n    {\n      role: 'img',\n      id: baseId,\n      ref,\n      ...rest,\n    },\n    { elementType: 'span' },\n  );\n\n  const [imageHidden, setImageHidden] = React.useState<true | undefined>(undefined);\n\n  let image: AvatarBaseState['image'] = slot.optional(imageProp, {\n    defaultProps: { alt: '', role: 'presentation', 'aria-hidden': true, hidden: imageHidden },\n    elementType: 'img',\n  });\n\n  // Image shouldn't be rendered if its src is not set\n  if (!image?.src) {\n    image = undefined;\n  }\n\n  // Hide the image if it fails to load and restore it on a successful load\n  if (image) {\n    image.onError = mergeCallbacks(image.onError, () => setImageHidden(true));\n    image.onLoad = mergeCallbacks(image.onLoad, () => setImageHidden(undefined));\n  }\n\n  // Resolve the initials slot, defaulted to getInitials\n  let initials: AvatarBaseState['initials'] = slot.optional(initialsProp, {\n    renderByDefault: true,\n    defaultProps: {\n      children: getInitials(name, dir === 'rtl'),\n      id: baseId + '__initials',\n    },\n    elementType: 'span',\n  });\n\n  // Don't render the initials slot if it's empty\n  if (!initials?.children) {\n    initials = undefined;\n  }\n\n  // Render the icon slot *only if* there aren't any initials or image to display\n  let icon: AvatarBaseState['icon'] = undefined;\n  if (!initials && (!image || imageHidden)) {\n    icon = slot.optional(props.icon, {\n      renderByDefault: true,\n      defaultProps: {\n        'aria-hidden': true,\n      },\n      elementType: 'span',\n    });\n  }\n\n  let activeAriaLabelElement: AvatarBaseState['activeAriaLabelElement'];\n\n  // Resolve aria-label and/or aria-labelledby if not provided by the user\n  if (!root['aria-label'] && !root['aria-labelledby']) {\n    if (name) {\n      root['aria-label'] = name;\n    } else if (initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      root['aria-labelledby'] = initials.id;\n    }\n  }\n\n  return {\n    activeAriaLabelElement,\n    components: { root: 'span', initials: 'span', icon: 'span', image: 'img' },\n    root,\n    initials,\n    icon,\n    image,\n  };\n};\n\nconst getBadgeSize = (size: AvatarState['size']) => {\n  if (size >= 96) {\n    return 'extra-large';\n  } else if (size >= 64) {\n    return 'large';\n  } else if (size >= 56) {\n    return 'medium';\n  } else if (size >= 40) {\n    return 'small';\n  } else if (size >= 28) {\n    return 'extra-small';\n  } else {\n    return 'tiny';\n  }\n};\n\nconst avatarColors: AvatarNamedColor[] = [\n  'dark-red',\n  'cranberry',\n  'red',\n  'pumpkin',\n  'peach',\n  'marigold',\n  'gold',\n  'brass',\n  'brown',\n  'forest',\n  'seafoam',\n  'dark-green',\n  'light-teal',\n  'teal',\n  'steel',\n  'blue',\n  'royal-blue',\n  'cornflower',\n  'navy',\n  'lavender',\n  'purple',\n  'grape',\n  'lilac',\n  'pink',\n  'magenta',\n  'plum',\n  'beige',\n  'mink',\n  'platinum',\n  'anchor',\n];\n\nconst getHashCode = (str: string): number => {\n  let hashCode = 0;\n  for (let len: number = str.length - 1; len >= 0; len--) {\n    const ch = str.charCodeAt(len);\n    const shift = len % 8;\n    hashCode ^= (ch << shift) + (ch >> (8 - shift)); // eslint-disable-line no-bitwise\n  }\n\n  return hashCode;\n};\n"],"names":["React","mergeCallbacks","useId","slot","getInitials","PersonRegular","PresenceBadge","useFluent_unstable","useFluent","useAvatarContext","DEFAULT_STRINGS","active","inactive","useAvatar_unstable","props","ref","dir","shape","contextShape","size","contextSize","activeAppearance","idForColor","color","propColor","rest","state","useAvatarBase_unstable","avatarColors","getHashCode","name","length","initials","optional","renderByDefault","defaultProps","children","firstInitialOnly","id","elementType","icon","hasOwnProperty","badge","getBadgeSize","root","activeAriaLabelElement","userProvidedAriaLabel","undefined","userProvidedAriaLabelledby","activeText","activeId","span","hidden","components","image","imageProp","initialsProp","baseId","always","role","imageHidden","setImageHidden","useState","alt","src","onError","onLoad","str","hashCode","len","ch","charCodeAt","shift"],"mappings":"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"}
+{"version":3,"sources":["../src/components/Avatar/useAvatar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { mergeCallbacks, useId, slot } from '@fluentui/react-utilities';\nimport { getInitials } from '../../utils/index';\nimport type { AvatarBaseProps, AvatarBaseState, AvatarNamedColor, AvatarProps, AvatarState } from './Avatar.types';\nimport { PersonRegular } from '@fluentui/react-icons';\nimport { PresenceBadge } from '@fluentui/react-badge';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useAvatarContext } from '../../contexts/AvatarContext';\n\nexport const DEFAULT_STRINGS = {\n  active: 'active',\n  inactive: 'inactive',\n};\n\nexport const useAvatar_unstable = (props: AvatarProps, ref: React.Ref<HTMLElement>): AvatarState => {\n  const { dir } = useFluent();\n  const { shape: contextShape, size: contextSize } = useAvatarContext();\n  const {\n    size = contextSize ?? (32 as const),\n    shape = contextShape ?? 'circular',\n    active = 'unset',\n    activeAppearance = 'ring',\n    idForColor,\n    color: propColor = 'neutral',\n    ...rest\n  } = props;\n\n  const state = useAvatarBase_unstable(rest, ref);\n\n  // Resolve 'colorful' to a specific color name\n  const color: AvatarState['color'] =\n    propColor === 'colorful'\n      ? avatarColors[getHashCode(idForColor ?? props.name ?? '') % avatarColors.length]\n      : propColor;\n\n  if (state.initials) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.initials = slot.optional(props.initials, {\n      renderByDefault: true,\n      defaultProps: {\n        children: getInitials(props.name, dir === 'rtl', { firstInitialOnly: size <= 16 }),\n        id: state.initials?.id,\n      },\n      elementType: 'span',\n    });\n  }\n\n  if (state.icon && !state.icon.hasOwnProperty('children')) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.icon.children = <PersonRegular />;\n  }\n\n  const badge: AvatarState['badge'] = slot.optional(props.badge, {\n    defaultProps: { size: getBadgeSize(size), id: state.root.id + '__badge' },\n    elementType: PresenceBadge,\n  });\n\n  let activeAriaLabelElement: AvatarState['activeAriaLabelElement'] = state.activeAriaLabelElement;\n\n  // Enhance aria-label and/or aria-labelledby to include badge and active state\n  // Only process if aria attributes were not explicitly provided by the user\n  const userProvidedAriaLabel = props['aria-label'] !== undefined;\n  const userProvidedAriaLabelledby = props['aria-labelledby'] !== undefined;\n\n  if (!userProvidedAriaLabel && !userProvidedAriaLabelledby) {\n    if (props.name) {\n      if (badge) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.root['aria-labelledby'] = state.root.id + ' ' + badge.id;\n      }\n    } else if (state.initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      // eslint-disable-next-line react-hooks/immutability\n      state.root['aria-labelledby'] = state.initials.id + (badge ? ' ' + badge.id : '');\n      // eslint-disable-next-line react-hooks/immutability\n      delete state.root['aria-label'];\n    }\n    // Add the active state to the aria label\n    if (active === 'active' || active === 'inactive') {\n      const activeText = DEFAULT_STRINGS[active];\n      if (state.root['aria-labelledby']) {\n        // If using aria-labelledby, render a hidden span and append it to the labelledby\n        const activeId = state.root.id + '__active';\n        // eslint-disable-next-line react-hooks/immutability\n        state.root['aria-labelledby'] += ' ' + activeId;\n        activeAriaLabelElement = (\n          <span hidden id={activeId}>\n            {activeText}\n          </span>\n        );\n      } else if (state.root['aria-label']) {\n        // Otherwise, just append it to the aria-label\n        // eslint-disable-next-line react-hooks/immutability\n        state.root['aria-label'] += ' ' + activeText;\n      }\n    }\n  }\n\n  return {\n    ...state,\n    size,\n    shape,\n    active,\n    activeAppearance,\n    activeAriaLabelElement,\n    color,\n    badge,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n    components: { ...state.components, badge: PresenceBadge },\n  };\n};\n\n/**\n * Base hook for Avatar component, manages state and structure common to all variants of Avatar\n */\nexport const useAvatarBase_unstable = (props: AvatarBaseProps, ref?: React.Ref<HTMLElement>): AvatarBaseState => {\n  const { dir } = useFluent();\n  const { name, image: imageProp, initials: initialsProp, ...rest } = props;\n\n  const baseId = useId('avatar-');\n\n  const root: AvatarBaseState['root'] = slot.always(\n    {\n      role: 'img',\n      id: baseId,\n      ref,\n      ...rest,\n    },\n    { elementType: 'span' },\n  );\n\n  const [imageHidden, setImageHidden] = React.useState<true | undefined>(undefined);\n\n  let image: AvatarBaseState['image'] = slot.optional(imageProp, {\n    defaultProps: { alt: '', role: 'presentation', 'aria-hidden': true, hidden: imageHidden },\n    elementType: 'img',\n  });\n\n  // Image shouldn't be rendered if its src is not set\n  if (!image?.src) {\n    image = undefined;\n  }\n\n  // Hide the image if it fails to load and restore it on a successful load\n  if (image) {\n    image.onError = mergeCallbacks(image.onError, () => setImageHidden(true));\n    image.onLoad = mergeCallbacks(image.onLoad, () => setImageHidden(undefined));\n  }\n\n  // Resolve the initials slot, defaulted to getInitials\n  let initials: AvatarBaseState['initials'] = slot.optional(initialsProp, {\n    renderByDefault: true,\n    defaultProps: {\n      children: getInitials(name, dir === 'rtl'),\n      id: baseId + '__initials',\n    },\n    elementType: 'span',\n  });\n\n  // Don't render the initials slot if it's empty\n  if (!initials?.children) {\n    initials = undefined;\n  }\n\n  // Render the icon slot *only if* there aren't any initials or image to display\n  let icon: AvatarBaseState['icon'] = undefined;\n  if (!initials && (!image || imageHidden)) {\n    icon = slot.optional(props.icon, {\n      renderByDefault: true,\n      defaultProps: {\n        'aria-hidden': true,\n      },\n      elementType: 'span',\n    });\n  }\n\n  let activeAriaLabelElement: AvatarBaseState['activeAriaLabelElement'];\n\n  // Resolve aria-label and/or aria-labelledby if not provided by the user\n  if (!root['aria-label'] && !root['aria-labelledby']) {\n    if (name) {\n      root['aria-label'] = name;\n    } else if (initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      root['aria-labelledby'] = initials.id;\n    }\n  }\n\n  return {\n    activeAriaLabelElement,\n    components: { root: 'span', initials: 'span', icon: 'span', image: 'img' },\n    root,\n    initials,\n    icon,\n    image,\n  };\n};\n\nconst getBadgeSize = (size: AvatarState['size']) => {\n  if (size >= 96) {\n    return 'extra-large';\n  } else if (size >= 64) {\n    return 'large';\n  } else if (size >= 56) {\n    return 'medium';\n  } else if (size >= 40) {\n    return 'small';\n  } else if (size >= 28) {\n    return 'extra-small';\n  } else {\n    return 'tiny';\n  }\n};\n\nconst avatarColors: AvatarNamedColor[] = [\n  'dark-red',\n  'cranberry',\n  'red',\n  'pumpkin',\n  'peach',\n  'marigold',\n  'gold',\n  'brass',\n  'brown',\n  'forest',\n  'seafoam',\n  'dark-green',\n  'light-teal',\n  'teal',\n  'steel',\n  'blue',\n  'royal-blue',\n  'cornflower',\n  'navy',\n  'lavender',\n  'purple',\n  'grape',\n  'lilac',\n  'pink',\n  'magenta',\n  'plum',\n  'beige',\n  'mink',\n  'platinum',\n  'anchor',\n];\n\nconst getHashCode = (str: string): number => {\n  let hashCode = 0;\n  for (let len: number = str.length - 1; len >= 0; len--) {\n    const ch = str.charCodeAt(len);\n    const shift = len % 8;\n    hashCode ^= (ch << shift) + (ch >> (8 - shift)); // eslint-disable-line no-bitwise\n  }\n\n  return hashCode;\n};\n"],"names":["React","mergeCallbacks","useId","slot","getInitials","PersonRegular","PresenceBadge","useFluent_unstable","useFluent","useAvatarContext","DEFAULT_STRINGS","active","inactive","useAvatar_unstable","props","ref","dir","shape","contextShape","size","contextSize","activeAppearance","idForColor","color","propColor","rest","state","useAvatarBase_unstable","avatarColors","getHashCode","name","length","initials","optional","renderByDefault","defaultProps","children","firstInitialOnly","id","elementType","icon","hasOwnProperty","badge","getBadgeSize","root","activeAriaLabelElement","userProvidedAriaLabel","undefined","userProvidedAriaLabelledby","activeText","activeId","span","hidden","components","image","imageProp","initialsProp","baseId","always","role","imageHidden","setImageHidden","useState","alt","src","onError","onLoad","str","hashCode","len","ch","charCodeAt","shift"],"mappings":"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"}

package/lib-commonjs/components/Avatar/useAvatarStyles.styles.js

@@ -734,7 +734,6 @@ const useRingColorStyles = /*#__PURE__*/ (0, _react.__styles)({
     ]
 });
 const useAvatarStyles_unstable = (state)=>{
-    'use no memo';
     const { size, shape, active, activeAppearance, color } = state;
     const rootClassName = useRootClassName();
     const imageClassName = useImageClassName();
@@ -806,14 +805,18 @@ const useAvatarStyles_unstable = (state)=>{
             rootClasses.push(styles.inactive);
         }
     }
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(avatarClassNames.root, ...rootClasses, state.root.className);
     if (state.badge) {
+        // eslint-disable-next-line react-hooks/immutability
         state.badge.className = (0, _react.mergeClasses)(avatarClassNames.badge, styles.badge, state.badge.className);
     }
     if (state.image) {
+        // eslint-disable-next-line react-hooks/immutability
         state.image.className = (0, _react.mergeClasses)(avatarClassNames.image, imageClassName, colorStyles[color], state.badge && styles.badgeCutout, state.image.className);
     }
     if (state.initials) {
+        // eslint-disable-next-line react-hooks/immutability
         state.initials.className = (0, _react.mergeClasses)(avatarClassNames.initials, iconInitialsClassName, colorStyles[color], state.badge && styles.badgeCutout, state.initials.className);
     }
     if (state.icon) {
@@ -833,6 +836,7 @@ const useAvatarStyles_unstable = (state)=>{
         } else {
             iconSizeClass = styles.icon48;
         }
+        // eslint-disable-next-line react-hooks/immutability
         state.icon.className = (0, _react.mergeClasses)(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, colorStyles[color], state.badge && styles.badgeCutout, state.icon.className);
     }
     return state;

package/lib-commonjs/components/Avatar/useAvatarStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAvatarStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const avatarClassNames = {\n    root: 'fui-Avatar',\n    image: 'fui-Avatar__image',\n    initials: 'fui-Avatar__initials',\n    icon: 'fui-Avatar__icon',\n    badge: 'fui-Avatar__badge'\n};\n// CSS variables used internally in Avatar's styles\nconst vars = {\n    badgeRadius: '--fui-Avatar-badgeRadius',\n    badgeGap: '--fui-Avatar-badgeGap',\n    badgeAlign: '--fui-Avatar-badgeAlign',\n    ringWidth: '--fui-Avatar-ringWidth'\n};\nconst useRootClassName = makeResetStyles({\n    display: 'inline-block',\n    flexShrink: 0,\n    position: 'relative',\n    verticalAlign: 'middle',\n    borderRadius: tokens.borderRadiusCircular,\n    fontFamily: tokens.fontFamilyBase,\n    fontWeight: tokens.fontWeightSemibold,\n    fontSize: tokens.fontSizeBase300,\n    width: '32px',\n    height: '32px',\n    // ::before is the ring, and ::after is the shadow.\n    // These are not displayed by default; the ring and shadow clases set content: \"\" to display them when appropriate.\n    '::before,::after': {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        bottom: 0,\n        right: 0,\n        zIndex: -1,\n        margin: `calc(-2 * var(${vars.ringWidth}, 0px))`,\n        borderRadius: 'inherit',\n        transitionProperty: 'margin, opacity',\n        transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n        transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    },\n    '::before': {\n        borderStyle: 'solid',\n        borderWidth: `var(${vars.ringWidth})`\n    }\n});\nconst useImageClassName = makeResetStyles({\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    borderRadius: 'inherit',\n    objectFit: 'cover',\n    verticalAlign: 'top'\n});\nconst useIconInitialsClassName = makeResetStyles({\n    position: 'absolute',\n    boxSizing: 'border-box',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    lineHeight: '1',\n    border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    verticalAlign: 'center',\n    textAlign: 'center',\n    userSelect: 'none',\n    borderRadius: 'inherit'\n});\n/**\n * Helper to create a maskImage that punches out a circle larger than the badge by `badgeGap`.\n * This creates a transparent gap between the badge and Avatar.\n *\n * Used by the icon, initials, and image slots, as well as the ring ::before pseudo-element.\n */ const badgeMask = (margin)=>{\n    // Center the cutout at the badge's radius away from the edge.\n    // The ring (::before) also has a 2 * ringWidth margin that also needs to be offset.\n    const centerOffset = margin ? `calc(var(${vars.badgeRadius}) + ${margin})` : `var(${vars.badgeRadius})`;\n    // radial-gradient does not have anti-aliasing, so the transparent and opaque gradient stops are offset by +/- 0.25px\n    // to \"fade\" from transparent to opaque over a half-pixel and ease the transition.\n    const innerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) - 0.25px)`;\n    const outerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) + 0.25px)`;\n    return `radial-gradient(circle at bottom ${centerOffset} var(${vars.badgeAlign}) ${centerOffset}, ` + `transparent ${innerRadius}, white ${outerRadius})`;\n};\nconst useStyles = makeStyles({\n    textCaption2Strong: {\n        fontSize: tokens.fontSizeBase100\n    },\n    textCaption1Strong: {\n        fontSize: tokens.fontSizeBase200\n    },\n    textSubtitle2: {\n        fontSize: tokens.fontSizeBase400\n    },\n    textSubtitle1: {\n        fontSize: tokens.fontSizeBase500\n    },\n    textTitle3: {\n        fontSize: tokens.fontSizeBase600\n    },\n    squareSmall: {\n        borderRadius: tokens.borderRadiusSmall\n    },\n    squareMedium: {\n        borderRadius: tokens.borderRadiusMedium\n    },\n    squareLarge: {\n        borderRadius: tokens.borderRadiusLarge\n    },\n    squareXLarge: {\n        borderRadius: tokens.borderRadiusXLarge\n    },\n    activeOrInactive: {\n        transform: 'perspective(1px)',\n        transitionProperty: 'transform, opacity',\n        transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n        transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    },\n    ring: {\n        // Show the ::before pseudo-element, which is the ring\n        '::before': {\n            content: '\"\"'\n        }\n    },\n    ringBadgeCutout: {\n        '::before': {\n            maskImage: badgeMask(/*margin =*/ `2 * var(${vars.ringWidth})`)\n        }\n    },\n    ringThick: {\n        [vars.ringWidth]: tokens.strokeWidthThick\n    },\n    ringThicker: {\n        [vars.ringWidth]: tokens.strokeWidthThicker\n    },\n    ringThickest: {\n        [vars.ringWidth]: tokens.strokeWidthThickest\n    },\n    shadow: {\n        // Show the ::after pseudo-element, which is the shadow\n        '::after': {\n            content: '\"\"'\n        }\n    },\n    shadow4: {\n        '::after': {\n            boxShadow: tokens.shadow4\n        }\n    },\n    shadow8: {\n        '::after': {\n            boxShadow: tokens.shadow8\n        }\n    },\n    shadow16: {\n        '::after': {\n            boxShadow: tokens.shadow16\n        }\n    },\n    shadow28: {\n        '::after': {\n            boxShadow: tokens.shadow28\n        }\n    },\n    inactive: {\n        opacity: '0.8',\n        transform: 'scale(0.875)',\n        transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n        '::before,::after': {\n            margin: 0,\n            opacity: 0,\n            transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`\n        }\n    },\n    // Applied to the badge slot\n    badge: {\n        position: 'absolute',\n        bottom: 0,\n        right: 0\n    },\n    // Applied to the image, initials, or icon slot when there is a badge\n    badgeCutout: {\n        maskImage: badgeMask()\n    },\n    // Applied to the root when there is a badge\n    badgeAlign: {\n        // Griffel won't auto-flip the \"right\" alignment to \"left\" in RTL if it is inline in the maskImage,\n        // so split it out into a css variable that will auto-flip.\n        [vars.badgeAlign]: 'right'\n    },\n    // Badge size: applied to root when there is a badge\n    tiny: {\n        [vars.badgeRadius]: '3px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    'extra-small': {\n        [vars.badgeRadius]: '5px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    small: {\n        [vars.badgeRadius]: '6px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    medium: {\n        [vars.badgeRadius]: '8px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    large: {\n        [vars.badgeRadius]: '10px',\n        [vars.badgeGap]: tokens.strokeWidthThick\n    },\n    'extra-large': {\n        [vars.badgeRadius]: '14px',\n        [vars.badgeGap]: tokens.strokeWidthThick\n    },\n    icon12: {\n        fontSize: '12px'\n    },\n    icon16: {\n        fontSize: '16px'\n    },\n    icon20: {\n        fontSize: '20px'\n    },\n    icon24: {\n        fontSize: '24px'\n    },\n    icon28: {\n        fontSize: '28px'\n    },\n    icon32: {\n        fontSize: '32px'\n    },\n    icon48: {\n        fontSize: '48px'\n    }\n});\nexport const useSizeStyles = makeStyles({\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    24: {\n        width: '24px',\n        height: '24px'\n    },\n    28: {\n        width: '28px',\n        height: '28px'\n    },\n    32: {\n        width: '32px',\n        height: '32px'\n    },\n    36: {\n        width: '36px',\n        height: '36px'\n    },\n    40: {\n        width: '40px',\n        height: '40px'\n    },\n    48: {\n        width: '48px',\n        height: '48px'\n    },\n    56: {\n        width: '56px',\n        height: '56px'\n    },\n    64: {\n        width: '64px',\n        height: '64px'\n    },\n    72: {\n        width: '72px',\n        height: '72px'\n    },\n    96: {\n        width: '96px',\n        height: '96px'\n    },\n    120: {\n        width: '120px',\n        height: '120px'\n    },\n    128: {\n        width: '128px',\n        height: '128px'\n    }\n});\nconst useColorStyles = makeStyles({\n    neutral: {\n        color: tokens.colorNeutralForeground3,\n        backgroundColor: tokens.colorNeutralBackground6\n    },\n    brand: {\n        color: tokens.colorNeutralForegroundStaticInverted,\n        backgroundColor: tokens.colorBrandBackgroundStatic\n    },\n    'dark-red': {\n        color: tokens.colorPaletteDarkRedForeground2,\n        backgroundColor: tokens.colorPaletteDarkRedBackground2\n    },\n    cranberry: {\n        color: tokens.colorPaletteCranberryForeground2,\n        backgroundColor: tokens.colorPaletteCranberryBackground2\n    },\n    red: {\n        color: tokens.colorPaletteRedForeground2,\n        backgroundColor: tokens.colorPaletteRedBackground2\n    },\n    pumpkin: {\n        color: tokens.colorPalettePumpkinForeground2,\n        backgroundColor: tokens.colorPalettePumpkinBackground2\n    },\n    peach: {\n        color: tokens.colorPalettePeachForeground2,\n        backgroundColor: tokens.colorPalettePeachBackground2\n    },\n    marigold: {\n        color: tokens.colorPaletteMarigoldForeground2,\n        backgroundColor: tokens.colorPaletteMarigoldBackground2\n    },\n    gold: {\n        color: tokens.colorPaletteGoldForeground2,\n        backgroundColor: tokens.colorPaletteGoldBackground2\n    },\n    brass: {\n        color: tokens.colorPaletteBrassForeground2,\n        backgroundColor: tokens.colorPaletteBrassBackground2\n    },\n    brown: {\n        color: tokens.colorPaletteBrownForeground2,\n        backgroundColor: tokens.colorPaletteBrownBackground2\n    },\n    forest: {\n        color: tokens.colorPaletteForestForeground2,\n        backgroundColor: tokens.colorPaletteForestBackground2\n    },\n    seafoam: {\n        color: tokens.colorPaletteSeafoamForeground2,\n        backgroundColor: tokens.colorPaletteSeafoamBackground2\n    },\n    'dark-green': {\n        color: tokens.colorPaletteDarkGreenForeground2,\n        backgroundColor: tokens.colorPaletteDarkGreenBackground2\n    },\n    'light-teal': {\n        color: tokens.colorPaletteLightTealForeground2,\n        backgroundColor: tokens.colorPaletteLightTealBackground2\n    },\n    teal: {\n        color: tokens.colorPaletteTealForeground2,\n        backgroundColor: tokens.colorPaletteTealBackground2\n    },\n    steel: {\n        color: tokens.colorPaletteSteelForeground2,\n        backgroundColor: tokens.colorPaletteSteelBackground2\n    },\n    blue: {\n        color: tokens.colorPaletteBlueForeground2,\n        backgroundColor: tokens.colorPaletteBlueBackground2\n    },\n    'royal-blue': {\n        color: tokens.colorPaletteRoyalBlueForeground2,\n        backgroundColor: tokens.colorPaletteRoyalBlueBackground2\n    },\n    cornflower: {\n        color: tokens.colorPaletteCornflowerForeground2,\n        backgroundColor: tokens.colorPaletteCornflowerBackground2\n    },\n    navy: {\n        color: tokens.colorPaletteNavyForeground2,\n        backgroundColor: tokens.colorPaletteNavyBackground2\n    },\n    lavender: {\n        color: tokens.colorPaletteLavenderForeground2,\n        backgroundColor: tokens.colorPaletteLavenderBackground2\n    },\n    purple: {\n        color: tokens.colorPalettePurpleForeground2,\n        backgroundColor: tokens.colorPalettePurpleBackground2\n    },\n    grape: {\n        color: tokens.colorPaletteGrapeForeground2,\n        backgroundColor: tokens.colorPaletteGrapeBackground2\n    },\n    lilac: {\n        color: tokens.colorPaletteLilacForeground2,\n        backgroundColor: tokens.colorPaletteLilacBackground2\n    },\n    pink: {\n        color: tokens.colorPalettePinkForeground2,\n        backgroundColor: tokens.colorPalettePinkBackground2\n    },\n    magenta: {\n        color: tokens.colorPaletteMagentaForeground2,\n        backgroundColor: tokens.colorPaletteMagentaBackground2\n    },\n    plum: {\n        color: tokens.colorPalettePlumForeground2,\n        backgroundColor: tokens.colorPalettePlumBackground2\n    },\n    beige: {\n        color: tokens.colorPaletteBeigeForeground2,\n        backgroundColor: tokens.colorPaletteBeigeBackground2\n    },\n    mink: {\n        color: tokens.colorPaletteMinkForeground2,\n        backgroundColor: tokens.colorPaletteMinkBackground2\n    },\n    platinum: {\n        color: tokens.colorPalettePlatinumForeground2,\n        backgroundColor: tokens.colorPalettePlatinumBackground2\n    },\n    anchor: {\n        color: tokens.colorPaletteAnchorForeground2,\n        backgroundColor: tokens.colorPaletteAnchorBackground2\n    }\n});\nconst useRingColorStyles = makeStyles({\n    neutral: {\n        '::before': {\n            color: tokens.colorBrandStroke1\n        }\n    },\n    brand: {\n        '::before': {\n            color: tokens.colorBrandStroke1\n        }\n    },\n    'dark-red': {\n        '::before': {\n            color: tokens.colorPaletteDarkRedBorderActive\n        }\n    },\n    cranberry: {\n        '::before': {\n            color: tokens.colorPaletteCranberryBorderActive\n        }\n    },\n    red: {\n        '::before': {\n            color: tokens.colorPaletteRedBorderActive\n        }\n    },\n    pumpkin: {\n        '::before': {\n            color: tokens.colorPalettePumpkinBorderActive\n        }\n    },\n    peach: {\n        '::before': {\n            color: tokens.colorPalettePeachBorderActive\n        }\n    },\n    marigold: {\n        '::before': {\n            color: tokens.colorPaletteMarigoldBorderActive\n        }\n    },\n    gold: {\n        '::before': {\n            color: tokens.colorPaletteGoldBorderActive\n        }\n    },\n    brass: {\n        '::before': {\n            color: tokens.colorPaletteBrassBorderActive\n        }\n    },\n    brown: {\n        '::before': {\n            color: tokens.colorPaletteBrownBorderActive\n        }\n    },\n    forest: {\n        '::before': {\n            color: tokens.colorPaletteForestBorderActive\n        }\n    },\n    seafoam: {\n        '::before': {\n            color: tokens.colorPaletteSeafoamBorderActive\n        }\n    },\n    'dark-green': {\n        '::before': {\n            color: tokens.colorPaletteDarkGreenBorderActive\n        }\n    },\n    'light-teal': {\n        '::before': {\n            color: tokens.colorPaletteLightTealBorderActive\n        }\n    },\n    teal: {\n        '::before': {\n            color: tokens.colorPaletteTealBorderActive\n        }\n    },\n    steel: {\n        '::before': {\n            color: tokens.colorPaletteSteelBorderActive\n        }\n    },\n    blue: {\n        '::before': {\n            color: tokens.colorPaletteBlueBorderActive\n        }\n    },\n    'royal-blue': {\n        '::before': {\n            color: tokens.colorPaletteRoyalBlueBorderActive\n        }\n    },\n    cornflower: {\n        '::before': {\n            color: tokens.colorPaletteCornflowerBorderActive\n        }\n    },\n    navy: {\n        '::before': {\n            color: tokens.colorPaletteNavyBorderActive\n        }\n    },\n    lavender: {\n        '::before': {\n            color: tokens.colorPaletteLavenderBorderActive\n        }\n    },\n    purple: {\n        '::before': {\n            color: tokens.colorPalettePurpleBorderActive\n        }\n    },\n    grape: {\n        '::before': {\n            color: tokens.colorPaletteGrapeBorderActive\n        }\n    },\n    lilac: {\n        '::before': {\n            color: tokens.colorPaletteLilacBorderActive\n        }\n    },\n    pink: {\n        '::before': {\n            color: tokens.colorPalettePinkBorderActive\n        }\n    },\n    magenta: {\n        '::before': {\n            color: tokens.colorPaletteMagentaBorderActive\n        }\n    },\n    plum: {\n        '::before': {\n            color: tokens.colorPalettePlumBorderActive\n        }\n    },\n    beige: {\n        '::before': {\n            color: tokens.colorPaletteBeigeBorderActive\n        }\n    },\n    mink: {\n        '::before': {\n            color: tokens.colorPaletteMinkBorderActive\n        }\n    },\n    platinum: {\n        '::before': {\n            color: tokens.colorPalettePlatinumBorderActive\n        }\n    },\n    anchor: {\n        '::before': {\n            color: tokens.colorPaletteAnchorBorderActive\n        }\n    }\n});\nexport const useAvatarStyles_unstable = (state)=>{\n    'use no memo';\n    const { size, shape, active, activeAppearance, color } = state;\n    const rootClassName = useRootClassName();\n    const imageClassName = useImageClassName();\n    const iconInitialsClassName = useIconInitialsClassName();\n    const styles = useStyles();\n    const sizeStyles = useSizeStyles();\n    const colorStyles = useColorStyles();\n    const ringColorStyles = useRingColorStyles();\n    const rootClasses = [\n        rootClassName,\n        size !== 32 && sizeStyles[size]\n    ];\n    if (state.badge) {\n        rootClasses.push(styles.badgeAlign, styles[state.badge.size || 'medium']);\n    }\n    if (size <= 24) {\n        rootClasses.push(styles.textCaption2Strong);\n    } else if (size <= 28) {\n        rootClasses.push(styles.textCaption1Strong);\n    } else if (size <= 40) {\n    // Default text size included in useRootClassName\n    } else if (size <= 56) {\n        rootClasses.push(styles.textSubtitle2);\n    } else if (size <= 96) {\n        rootClasses.push(styles.textSubtitle1);\n    } else {\n        rootClasses.push(styles.textTitle3);\n    }\n    if (shape === 'square') {\n        if (size <= 24) {\n            rootClasses.push(styles.squareSmall);\n        } else if (size <= 48) {\n            rootClasses.push(styles.squareMedium);\n        } else if (size <= 72) {\n            rootClasses.push(styles.squareLarge);\n        } else {\n            rootClasses.push(styles.squareXLarge);\n        }\n    }\n    if (active === 'active' || active === 'inactive') {\n        rootClasses.push(styles.activeOrInactive);\n        if (activeAppearance === 'ring' || activeAppearance === 'ring-shadow') {\n            rootClasses.push(styles.ring, ringColorStyles[color]);\n            if (state.badge) {\n                rootClasses.push(styles.ringBadgeCutout);\n            }\n            if (size <= 48) {\n                rootClasses.push(styles.ringThick);\n            } else if (size <= 64) {\n                rootClasses.push(styles.ringThicker);\n            } else {\n                rootClasses.push(styles.ringThickest);\n            }\n        }\n        if (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow') {\n            rootClasses.push(styles.shadow);\n            if (size <= 28) {\n                rootClasses.push(styles.shadow4);\n            } else if (size <= 48) {\n                rootClasses.push(styles.shadow8);\n            } else if (size <= 64) {\n                rootClasses.push(styles.shadow16);\n            } else {\n                rootClasses.push(styles.shadow28);\n            }\n        }\n        // Note: The inactive style overrides some of the activeAppearance styles and must be applied after them\n        if (active === 'inactive') {\n            rootClasses.push(styles.inactive);\n        }\n    }\n    state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n    if (state.badge) {\n        state.badge.className = mergeClasses(avatarClassNames.badge, styles.badge, state.badge.className);\n    }\n    if (state.image) {\n        state.image.className = mergeClasses(avatarClassNames.image, imageClassName, colorStyles[color], state.badge && styles.badgeCutout, state.image.className);\n    }\n    if (state.initials) {\n        state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, colorStyles[color], state.badge && styles.badgeCutout, state.initials.className);\n    }\n    if (state.icon) {\n        let iconSizeClass;\n        if (size <= 16) {\n            iconSizeClass = styles.icon12;\n        } else if (size <= 24) {\n            iconSizeClass = styles.icon16;\n        } else if (size <= 40) {\n            iconSizeClass = styles.icon20;\n        } else if (size <= 48) {\n            iconSizeClass = styles.icon24;\n        } else if (size <= 56) {\n            iconSizeClass = styles.icon28;\n        } else if (size <= 72) {\n            iconSizeClass = styles.icon32;\n        } else {\n            iconSizeClass = styles.icon48;\n        }\n        state.icon.className = mergeClasses(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, colorStyles[color], state.badge && styles.badgeCutout, state.icon.className);\n    }\n    return state;\n};\n"],"names":["tokens","__resetStyles","__styles","mergeClasses","avatarClassNames","root","image","initials","icon","badge","vars","badgeRadius","badgeGap","badgeAlign","ringWidth","useRootClassName","r","s","useImageClassName","useIconInitialsClassName","badgeMask","margin","centerOffset","innerRadius","outerRadius","useStyles","textCaption2Strong","Be2twd7","textCaption1Strong","textSubtitle2","textSubtitle1","textTitle3","squareSmall","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","squareMedium","squareLarge","squareXLarge","activeOrInactive","Bz10aip","Bmy1vo4","B3o57yi","Bkqvd7p","Bg24rqe","ring","Ftih45","ringBadgeCutout","f4a502","ringThick","of393c","ringThicker","ringThickest","shadow","Bsft5z2","shadow4","Be6vj1x","shadow8","shadow16","shadow28","inactive","abs64n","Bfgortx","Bnvr3x9","b2tv09","Bucmhp4","iayac2","b6ubon","Bqinb2h","qhf8xq","B5kzvoi","j35jbq","badgeCutout","btxmck","Dnlfbu","tiny","Bdjeniz","niu6jh","small","medium","large","icon12","icon16","icon20","icon24","icon28","icon32","icon48","d","p","m","useSizeStyles","a9b677","Bqenvij","useColorStyles","neutral","sj55zd","De3pzq","brand","cranberry","red","pumpkin","peach","marigold","gold","brass","brown","forest","seafoam","teal","steel","blue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","useRingColorStyles","Bic5iru","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","color","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","ringColorStyles","rootClasses","push","className","iconSizeClass"],"mappings":"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"}
+{"version":3,"sources":["useAvatarStyles.styles.js"],"sourcesContent":["'use client';\nimport { tokens } from '@fluentui/react-theme';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nexport const avatarClassNames = {\n    root: 'fui-Avatar',\n    image: 'fui-Avatar__image',\n    initials: 'fui-Avatar__initials',\n    icon: 'fui-Avatar__icon',\n    badge: 'fui-Avatar__badge'\n};\n// CSS variables used internally in Avatar's styles\nconst vars = {\n    badgeRadius: '--fui-Avatar-badgeRadius',\n    badgeGap: '--fui-Avatar-badgeGap',\n    badgeAlign: '--fui-Avatar-badgeAlign',\n    ringWidth: '--fui-Avatar-ringWidth'\n};\nconst useRootClassName = makeResetStyles({\n    display: 'inline-block',\n    flexShrink: 0,\n    position: 'relative',\n    verticalAlign: 'middle',\n    borderRadius: tokens.borderRadiusCircular,\n    fontFamily: tokens.fontFamilyBase,\n    fontWeight: tokens.fontWeightSemibold,\n    fontSize: tokens.fontSizeBase300,\n    width: '32px',\n    height: '32px',\n    // ::before is the ring, and ::after is the shadow.\n    // These are not displayed by default; the ring and shadow clases set content: \"\" to display them when appropriate.\n    '::before,::after': {\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        bottom: 0,\n        right: 0,\n        zIndex: -1,\n        margin: `calc(-2 * var(${vars.ringWidth}, 0px))`,\n        borderRadius: 'inherit',\n        transitionProperty: 'margin, opacity',\n        transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n        transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    },\n    '::before': {\n        borderStyle: 'solid',\n        borderWidth: `var(${vars.ringWidth})`\n    }\n});\nconst useImageClassName = makeResetStyles({\n    position: 'absolute',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    borderRadius: 'inherit',\n    objectFit: 'cover',\n    verticalAlign: 'top'\n});\nconst useIconInitialsClassName = makeResetStyles({\n    position: 'absolute',\n    boxSizing: 'border-box',\n    top: 0,\n    left: 0,\n    width: '100%',\n    height: '100%',\n    lineHeight: '1',\n    border: `${tokens.strokeWidthThin} solid ${tokens.colorTransparentStroke}`,\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    verticalAlign: 'center',\n    textAlign: 'center',\n    userSelect: 'none',\n    borderRadius: 'inherit'\n});\n/**\n * Helper to create a maskImage that punches out a circle larger than the badge by `badgeGap`.\n * This creates a transparent gap between the badge and Avatar.\n *\n * Used by the icon, initials, and image slots, as well as the ring ::before pseudo-element.\n */ const badgeMask = (margin)=>{\n    // Center the cutout at the badge's radius away from the edge.\n    // The ring (::before) also has a 2 * ringWidth margin that also needs to be offset.\n    const centerOffset = margin ? `calc(var(${vars.badgeRadius}) + ${margin})` : `var(${vars.badgeRadius})`;\n    // radial-gradient does not have anti-aliasing, so the transparent and opaque gradient stops are offset by +/- 0.25px\n    // to \"fade\" from transparent to opaque over a half-pixel and ease the transition.\n    const innerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) - 0.25px)`;\n    const outerRadius = `calc(var(${vars.badgeRadius}) + var(${vars.badgeGap}) + 0.25px)`;\n    return `radial-gradient(circle at bottom ${centerOffset} var(${vars.badgeAlign}) ${centerOffset}, ` + `transparent ${innerRadius}, white ${outerRadius})`;\n};\nconst useStyles = makeStyles({\n    textCaption2Strong: {\n        fontSize: tokens.fontSizeBase100\n    },\n    textCaption1Strong: {\n        fontSize: tokens.fontSizeBase200\n    },\n    textSubtitle2: {\n        fontSize: tokens.fontSizeBase400\n    },\n    textSubtitle1: {\n        fontSize: tokens.fontSizeBase500\n    },\n    textTitle3: {\n        fontSize: tokens.fontSizeBase600\n    },\n    squareSmall: {\n        borderRadius: tokens.borderRadiusSmall\n    },\n    squareMedium: {\n        borderRadius: tokens.borderRadiusMedium\n    },\n    squareLarge: {\n        borderRadius: tokens.borderRadiusLarge\n    },\n    squareXLarge: {\n        borderRadius: tokens.borderRadiusXLarge\n    },\n    activeOrInactive: {\n        transform: 'perspective(1px)',\n        transitionProperty: 'transform, opacity',\n        transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n        transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            transitionDuration: '0.01ms'\n        }\n    },\n    ring: {\n        // Show the ::before pseudo-element, which is the ring\n        '::before': {\n            content: '\"\"'\n        }\n    },\n    ringBadgeCutout: {\n        '::before': {\n            maskImage: badgeMask(/*margin =*/ `2 * var(${vars.ringWidth})`)\n        }\n    },\n    ringThick: {\n        [vars.ringWidth]: tokens.strokeWidthThick\n    },\n    ringThicker: {\n        [vars.ringWidth]: tokens.strokeWidthThicker\n    },\n    ringThickest: {\n        [vars.ringWidth]: tokens.strokeWidthThickest\n    },\n    shadow: {\n        // Show the ::after pseudo-element, which is the shadow\n        '::after': {\n            content: '\"\"'\n        }\n    },\n    shadow4: {\n        '::after': {\n            boxShadow: tokens.shadow4\n        }\n    },\n    shadow8: {\n        '::after': {\n            boxShadow: tokens.shadow8\n        }\n    },\n    shadow16: {\n        '::after': {\n            boxShadow: tokens.shadow16\n        }\n    },\n    shadow28: {\n        '::after': {\n            boxShadow: tokens.shadow28\n        }\n    },\n    inactive: {\n        opacity: '0.8',\n        transform: 'scale(0.875)',\n        transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n        '::before,::after': {\n            margin: 0,\n            opacity: 0,\n            transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`\n        }\n    },\n    // Applied to the badge slot\n    badge: {\n        position: 'absolute',\n        bottom: 0,\n        right: 0\n    },\n    // Applied to the image, initials, or icon slot when there is a badge\n    badgeCutout: {\n        maskImage: badgeMask()\n    },\n    // Applied to the root when there is a badge\n    badgeAlign: {\n        // Griffel won't auto-flip the \"right\" alignment to \"left\" in RTL if it is inline in the maskImage,\n        // so split it out into a css variable that will auto-flip.\n        [vars.badgeAlign]: 'right'\n    },\n    // Badge size: applied to root when there is a badge\n    tiny: {\n        [vars.badgeRadius]: '3px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    'extra-small': {\n        [vars.badgeRadius]: '5px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    small: {\n        [vars.badgeRadius]: '6px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    medium: {\n        [vars.badgeRadius]: '8px',\n        [vars.badgeGap]: tokens.strokeWidthThin\n    },\n    large: {\n        [vars.badgeRadius]: '10px',\n        [vars.badgeGap]: tokens.strokeWidthThick\n    },\n    'extra-large': {\n        [vars.badgeRadius]: '14px',\n        [vars.badgeGap]: tokens.strokeWidthThick\n    },\n    icon12: {\n        fontSize: '12px'\n    },\n    icon16: {\n        fontSize: '16px'\n    },\n    icon20: {\n        fontSize: '20px'\n    },\n    icon24: {\n        fontSize: '24px'\n    },\n    icon28: {\n        fontSize: '28px'\n    },\n    icon32: {\n        fontSize: '32px'\n    },\n    icon48: {\n        fontSize: '48px'\n    }\n});\nexport const useSizeStyles = makeStyles({\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    24: {\n        width: '24px',\n        height: '24px'\n    },\n    28: {\n        width: '28px',\n        height: '28px'\n    },\n    32: {\n        width: '32px',\n        height: '32px'\n    },\n    36: {\n        width: '36px',\n        height: '36px'\n    },\n    40: {\n        width: '40px',\n        height: '40px'\n    },\n    48: {\n        width: '48px',\n        height: '48px'\n    },\n    56: {\n        width: '56px',\n        height: '56px'\n    },\n    64: {\n        width: '64px',\n        height: '64px'\n    },\n    72: {\n        width: '72px',\n        height: '72px'\n    },\n    96: {\n        width: '96px',\n        height: '96px'\n    },\n    120: {\n        width: '120px',\n        height: '120px'\n    },\n    128: {\n        width: '128px',\n        height: '128px'\n    }\n});\nconst useColorStyles = makeStyles({\n    neutral: {\n        color: tokens.colorNeutralForeground3,\n        backgroundColor: tokens.colorNeutralBackground6\n    },\n    brand: {\n        color: tokens.colorNeutralForegroundStaticInverted,\n        backgroundColor: tokens.colorBrandBackgroundStatic\n    },\n    'dark-red': {\n        color: tokens.colorPaletteDarkRedForeground2,\n        backgroundColor: tokens.colorPaletteDarkRedBackground2\n    },\n    cranberry: {\n        color: tokens.colorPaletteCranberryForeground2,\n        backgroundColor: tokens.colorPaletteCranberryBackground2\n    },\n    red: {\n        color: tokens.colorPaletteRedForeground2,\n        backgroundColor: tokens.colorPaletteRedBackground2\n    },\n    pumpkin: {\n        color: tokens.colorPalettePumpkinForeground2,\n        backgroundColor: tokens.colorPalettePumpkinBackground2\n    },\n    peach: {\n        color: tokens.colorPalettePeachForeground2,\n        backgroundColor: tokens.colorPalettePeachBackground2\n    },\n    marigold: {\n        color: tokens.colorPaletteMarigoldForeground2,\n        backgroundColor: tokens.colorPaletteMarigoldBackground2\n    },\n    gold: {\n        color: tokens.colorPaletteGoldForeground2,\n        backgroundColor: tokens.colorPaletteGoldBackground2\n    },\n    brass: {\n        color: tokens.colorPaletteBrassForeground2,\n        backgroundColor: tokens.colorPaletteBrassBackground2\n    },\n    brown: {\n        color: tokens.colorPaletteBrownForeground2,\n        backgroundColor: tokens.colorPaletteBrownBackground2\n    },\n    forest: {\n        color: tokens.colorPaletteForestForeground2,\n        backgroundColor: tokens.colorPaletteForestBackground2\n    },\n    seafoam: {\n        color: tokens.colorPaletteSeafoamForeground2,\n        backgroundColor: tokens.colorPaletteSeafoamBackground2\n    },\n    'dark-green': {\n        color: tokens.colorPaletteDarkGreenForeground2,\n        backgroundColor: tokens.colorPaletteDarkGreenBackground2\n    },\n    'light-teal': {\n        color: tokens.colorPaletteLightTealForeground2,\n        backgroundColor: tokens.colorPaletteLightTealBackground2\n    },\n    teal: {\n        color: tokens.colorPaletteTealForeground2,\n        backgroundColor: tokens.colorPaletteTealBackground2\n    },\n    steel: {\n        color: tokens.colorPaletteSteelForeground2,\n        backgroundColor: tokens.colorPaletteSteelBackground2\n    },\n    blue: {\n        color: tokens.colorPaletteBlueForeground2,\n        backgroundColor: tokens.colorPaletteBlueBackground2\n    },\n    'royal-blue': {\n        color: tokens.colorPaletteRoyalBlueForeground2,\n        backgroundColor: tokens.colorPaletteRoyalBlueBackground2\n    },\n    cornflower: {\n        color: tokens.colorPaletteCornflowerForeground2,\n        backgroundColor: tokens.colorPaletteCornflowerBackground2\n    },\n    navy: {\n        color: tokens.colorPaletteNavyForeground2,\n        backgroundColor: tokens.colorPaletteNavyBackground2\n    },\n    lavender: {\n        color: tokens.colorPaletteLavenderForeground2,\n        backgroundColor: tokens.colorPaletteLavenderBackground2\n    },\n    purple: {\n        color: tokens.colorPalettePurpleForeground2,\n        backgroundColor: tokens.colorPalettePurpleBackground2\n    },\n    grape: {\n        color: tokens.colorPaletteGrapeForeground2,\n        backgroundColor: tokens.colorPaletteGrapeBackground2\n    },\n    lilac: {\n        color: tokens.colorPaletteLilacForeground2,\n        backgroundColor: tokens.colorPaletteLilacBackground2\n    },\n    pink: {\n        color: tokens.colorPalettePinkForeground2,\n        backgroundColor: tokens.colorPalettePinkBackground2\n    },\n    magenta: {\n        color: tokens.colorPaletteMagentaForeground2,\n        backgroundColor: tokens.colorPaletteMagentaBackground2\n    },\n    plum: {\n        color: tokens.colorPalettePlumForeground2,\n        backgroundColor: tokens.colorPalettePlumBackground2\n    },\n    beige: {\n        color: tokens.colorPaletteBeigeForeground2,\n        backgroundColor: tokens.colorPaletteBeigeBackground2\n    },\n    mink: {\n        color: tokens.colorPaletteMinkForeground2,\n        backgroundColor: tokens.colorPaletteMinkBackground2\n    },\n    platinum: {\n        color: tokens.colorPalettePlatinumForeground2,\n        backgroundColor: tokens.colorPalettePlatinumBackground2\n    },\n    anchor: {\n        color: tokens.colorPaletteAnchorForeground2,\n        backgroundColor: tokens.colorPaletteAnchorBackground2\n    }\n});\nconst useRingColorStyles = makeStyles({\n    neutral: {\n        '::before': {\n            color: tokens.colorBrandStroke1\n        }\n    },\n    brand: {\n        '::before': {\n            color: tokens.colorBrandStroke1\n        }\n    },\n    'dark-red': {\n        '::before': {\n            color: tokens.colorPaletteDarkRedBorderActive\n        }\n    },\n    cranberry: {\n        '::before': {\n            color: tokens.colorPaletteCranberryBorderActive\n        }\n    },\n    red: {\n        '::before': {\n            color: tokens.colorPaletteRedBorderActive\n        }\n    },\n    pumpkin: {\n        '::before': {\n            color: tokens.colorPalettePumpkinBorderActive\n        }\n    },\n    peach: {\n        '::before': {\n            color: tokens.colorPalettePeachBorderActive\n        }\n    },\n    marigold: {\n        '::before': {\n            color: tokens.colorPaletteMarigoldBorderActive\n        }\n    },\n    gold: {\n        '::before': {\n            color: tokens.colorPaletteGoldBorderActive\n        }\n    },\n    brass: {\n        '::before': {\n            color: tokens.colorPaletteBrassBorderActive\n        }\n    },\n    brown: {\n        '::before': {\n            color: tokens.colorPaletteBrownBorderActive\n        }\n    },\n    forest: {\n        '::before': {\n            color: tokens.colorPaletteForestBorderActive\n        }\n    },\n    seafoam: {\n        '::before': {\n            color: tokens.colorPaletteSeafoamBorderActive\n        }\n    },\n    'dark-green': {\n        '::before': {\n            color: tokens.colorPaletteDarkGreenBorderActive\n        }\n    },\n    'light-teal': {\n        '::before': {\n            color: tokens.colorPaletteLightTealBorderActive\n        }\n    },\n    teal: {\n        '::before': {\n            color: tokens.colorPaletteTealBorderActive\n        }\n    },\n    steel: {\n        '::before': {\n            color: tokens.colorPaletteSteelBorderActive\n        }\n    },\n    blue: {\n        '::before': {\n            color: tokens.colorPaletteBlueBorderActive\n        }\n    },\n    'royal-blue': {\n        '::before': {\n            color: tokens.colorPaletteRoyalBlueBorderActive\n        }\n    },\n    cornflower: {\n        '::before': {\n            color: tokens.colorPaletteCornflowerBorderActive\n        }\n    },\n    navy: {\n        '::before': {\n            color: tokens.colorPaletteNavyBorderActive\n        }\n    },\n    lavender: {\n        '::before': {\n            color: tokens.colorPaletteLavenderBorderActive\n        }\n    },\n    purple: {\n        '::before': {\n            color: tokens.colorPalettePurpleBorderActive\n        }\n    },\n    grape: {\n        '::before': {\n            color: tokens.colorPaletteGrapeBorderActive\n        }\n    },\n    lilac: {\n        '::before': {\n            color: tokens.colorPaletteLilacBorderActive\n        }\n    },\n    pink: {\n        '::before': {\n            color: tokens.colorPalettePinkBorderActive\n        }\n    },\n    magenta: {\n        '::before': {\n            color: tokens.colorPaletteMagentaBorderActive\n        }\n    },\n    plum: {\n        '::before': {\n            color: tokens.colorPalettePlumBorderActive\n        }\n    },\n    beige: {\n        '::before': {\n            color: tokens.colorPaletteBeigeBorderActive\n        }\n    },\n    mink: {\n        '::before': {\n            color: tokens.colorPaletteMinkBorderActive\n        }\n    },\n    platinum: {\n        '::before': {\n            color: tokens.colorPalettePlatinumBorderActive\n        }\n    },\n    anchor: {\n        '::before': {\n            color: tokens.colorPaletteAnchorBorderActive\n        }\n    }\n});\nexport const useAvatarStyles_unstable = (state)=>{\n    const { size, shape, active, activeAppearance, color } = state;\n    const rootClassName = useRootClassName();\n    const imageClassName = useImageClassName();\n    const iconInitialsClassName = useIconInitialsClassName();\n    const styles = useStyles();\n    const sizeStyles = useSizeStyles();\n    const colorStyles = useColorStyles();\n    const ringColorStyles = useRingColorStyles();\n    const rootClasses = [\n        rootClassName,\n        size !== 32 && sizeStyles[size]\n    ];\n    if (state.badge) {\n        rootClasses.push(styles.badgeAlign, styles[state.badge.size || 'medium']);\n    }\n    if (size <= 24) {\n        rootClasses.push(styles.textCaption2Strong);\n    } else if (size <= 28) {\n        rootClasses.push(styles.textCaption1Strong);\n    } else if (size <= 40) {\n    // Default text size included in useRootClassName\n    } else if (size <= 56) {\n        rootClasses.push(styles.textSubtitle2);\n    } else if (size <= 96) {\n        rootClasses.push(styles.textSubtitle1);\n    } else {\n        rootClasses.push(styles.textTitle3);\n    }\n    if (shape === 'square') {\n        if (size <= 24) {\n            rootClasses.push(styles.squareSmall);\n        } else if (size <= 48) {\n            rootClasses.push(styles.squareMedium);\n        } else if (size <= 72) {\n            rootClasses.push(styles.squareLarge);\n        } else {\n            rootClasses.push(styles.squareXLarge);\n        }\n    }\n    if (active === 'active' || active === 'inactive') {\n        rootClasses.push(styles.activeOrInactive);\n        if (activeAppearance === 'ring' || activeAppearance === 'ring-shadow') {\n            rootClasses.push(styles.ring, ringColorStyles[color]);\n            if (state.badge) {\n                rootClasses.push(styles.ringBadgeCutout);\n            }\n            if (size <= 48) {\n                rootClasses.push(styles.ringThick);\n            } else if (size <= 64) {\n                rootClasses.push(styles.ringThicker);\n            } else {\n                rootClasses.push(styles.ringThickest);\n            }\n        }\n        if (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow') {\n            rootClasses.push(styles.shadow);\n            if (size <= 28) {\n                rootClasses.push(styles.shadow4);\n            } else if (size <= 48) {\n                rootClasses.push(styles.shadow8);\n            } else if (size <= 64) {\n                rootClasses.push(styles.shadow16);\n            } else {\n                rootClasses.push(styles.shadow28);\n            }\n        }\n        // Note: The inactive style overrides some of the activeAppearance styles and must be applied after them\n        if (active === 'inactive') {\n            rootClasses.push(styles.inactive);\n        }\n    }\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n    if (state.badge) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.badge.className = mergeClasses(avatarClassNames.badge, styles.badge, state.badge.className);\n    }\n    if (state.image) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.image.className = mergeClasses(avatarClassNames.image, imageClassName, colorStyles[color], state.badge && styles.badgeCutout, state.image.className);\n    }\n    if (state.initials) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, colorStyles[color], state.badge && styles.badgeCutout, state.initials.className);\n    }\n    if (state.icon) {\n        let iconSizeClass;\n        if (size <= 16) {\n            iconSizeClass = styles.icon12;\n        } else if (size <= 24) {\n            iconSizeClass = styles.icon16;\n        } else if (size <= 40) {\n            iconSizeClass = styles.icon20;\n        } else if (size <= 48) {\n            iconSizeClass = styles.icon24;\n        } else if (size <= 56) {\n            iconSizeClass = styles.icon28;\n        } else if (size <= 72) {\n            iconSizeClass = styles.icon32;\n        } else {\n            iconSizeClass = styles.icon48;\n        }\n        // eslint-disable-next-line react-hooks/immutability\n        state.icon.className = mergeClasses(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, colorStyles[color], state.badge && styles.badgeCutout, state.icon.className);\n    }\n    return state;\n};\n"],"names":["tokens","__resetStyles","__styles","mergeClasses","avatarClassNames","root","image","initials","icon","badge","vars","badgeRadius","badgeGap","badgeAlign","ringWidth","useRootClassName","r","s","useImageClassName","useIconInitialsClassName","badgeMask","margin","centerOffset","innerRadius","outerRadius","useStyles","textCaption2Strong","Be2twd7","textCaption1Strong","textSubtitle2","textSubtitle1","textTitle3","squareSmall","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","squareMedium","squareLarge","squareXLarge","activeOrInactive","Bz10aip","Bmy1vo4","B3o57yi","Bkqvd7p","Bg24rqe","ring","Ftih45","ringBadgeCutout","f4a502","ringThick","of393c","ringThicker","ringThickest","shadow","Bsft5z2","shadow4","Be6vj1x","shadow8","shadow16","shadow28","inactive","abs64n","Bfgortx","Bnvr3x9","b2tv09","Bucmhp4","iayac2","b6ubon","Bqinb2h","qhf8xq","B5kzvoi","j35jbq","badgeCutout","btxmck","Dnlfbu","tiny","Bdjeniz","niu6jh","small","medium","large","icon12","icon16","icon20","icon24","icon28","icon32","icon48","d","p","m","useSizeStyles","a9b677","Bqenvij","useColorStyles","neutral","sj55zd","De3pzq","brand","cranberry","red","pumpkin","peach","marigold","gold","brass","brown","forest","seafoam","teal","steel","blue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","useRingColorStyles","Bic5iru","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","color","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","ringColorStyles","rootClasses","push","className","iconSizeClass"],"mappings":"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"}

package/lib-commonjs/components/Avatar/useAvatarStyles.styles.raw.js

@@ -619,7 +619,6 @@ const useRingColorStyles = (0, _react.makeStyles)({
     }
 });
 const useAvatarStyles_unstable = (state)=>{
-    'use no memo';
     const { size, shape, active, activeAppearance, color } = state;
     const rootClassName = useRootClassName();
     const imageClassName = useImageClassName();
@@ -691,14 +690,18 @@ const useAvatarStyles_unstable = (state)=>{
             rootClasses.push(styles.inactive);
         }
     }
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(avatarClassNames.root, ...rootClasses, state.root.className);
     if (state.badge) {
+        // eslint-disable-next-line react-hooks/immutability
         state.badge.className = (0, _react.mergeClasses)(avatarClassNames.badge, styles.badge, state.badge.className);
     }
     if (state.image) {
+        // eslint-disable-next-line react-hooks/immutability
         state.image.className = (0, _react.mergeClasses)(avatarClassNames.image, imageClassName, colorStyles[color], state.badge && styles.badgeCutout, state.image.className);
     }
     if (state.initials) {
+        // eslint-disable-next-line react-hooks/immutability
         state.initials.className = (0, _react.mergeClasses)(avatarClassNames.initials, iconInitialsClassName, colorStyles[color], state.badge && styles.badgeCutout, state.initials.className);
     }
     if (state.icon) {
@@ -718,6 +721,7 @@ const useAvatarStyles_unstable = (state)=>{
         } else {
             iconSizeClass = styles.icon48;
         }
+        // eslint-disable-next-line react-hooks/immutability
         state.icon.className = (0, _react.mergeClasses)(avatarClassNames.icon, iconInitialsClassName, iconSizeClass, colorStyles[color], state.badge && styles.badgeCutout, state.icon.className);
     }
     return state;