@fluentui/react-avatar 9.74.7-experimental.cli-api.20261006-ccaa611d58.0 → 9.75.0-experimental.css-modules.20261031-810ab07afb.0

package/lib/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    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: { ...state.badge, size: getBadgeSize(size) },\n    elementType: PresenceBadge,\n  });\n\n  return {\n    ...state,\n    size,\n    shape,\n    activeAppearance,\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, badge, active = 'unset', ...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  const badgeSlot: AvatarBaseState['badge'] = slot.optional(badge, {\n    defaultProps: { id: root.id + '__badge' },\n    elementType: 'div',\n  });\n\n  let activeAriaLabelElement: AvatarBaseState['activeAriaLabelElement'];\n\n  // Resolve aria-label and/or aria-labelledby, including the badge, if not provided by the user\n  const userProvidedAriaLabel = props['aria-label'] !== undefined;\n  const userProvidedAriaLabelledby = props['aria-labelledby'] !== undefined;\n  if (!userProvidedAriaLabel && !userProvidedAriaLabelledby) {\n    if (name) {\n      root['aria-label'] = name;\n      if (badgeSlot) {\n        root['aria-labelledby'] = root.id + ' ' + badgeSlot.id;\n      }\n    } else if (initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      root['aria-labelledby'] = initials.id + (badgeSlot ? ' ' + badgeSlot.id : '');\n    }\n\n    if (active === 'active' || active === 'inactive') {\n      const activeText = DEFAULT_STRINGS[active];\n      if (root['aria-labelledby']) {\n        const activeId = root.id + '__active';\n        root['aria-labelledby'] += ' ' + activeId;\n        activeAriaLabelElement = (\n          <span hidden id={activeId}>\n            {activeText}\n          </span>\n        );\n      } else if (root['aria-label']) {\n        root['aria-label'] += ' ' + activeText;\n      }\n    }\n  }\n\n  return {\n    active,\n    activeAriaLabelElement,\n    components: { root: 'span', initials: 'span', icon: 'span', image: 'img', badge: 'div' },\n    root,\n    initials,\n    icon,\n    image,\n    badge: badgeSlot,\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","components","image","imageProp","initialsProp","baseId","root","always","role","imageHidden","setImageHidden","useState","undefined","alt","hidden","src","onError","onLoad","badgeSlot","activeAriaLabelElement","userProvidedAriaLabel","userProvidedAriaLabelledby","activeText","activeId","span","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    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: { ...state.badge, size: getBadgeSize(size) },\n    elementType: PresenceBadge,\n  });\n\n  return {\n    ...state,\n    size,\n    shape,\n    activeAppearance,\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, badge, active = 'unset', ...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  const badgeSlot: AvatarBaseState['badge'] = slot.optional(badge, {\n    defaultProps: { id: root.id + '__badge' },\n    elementType: 'div',\n  });\n\n  let activeAriaLabelElement: AvatarBaseState['activeAriaLabelElement'];\n\n  // Resolve aria-label and/or aria-labelledby, including the badge, if not provided by the user\n  const userProvidedAriaLabel = props['aria-label'] !== undefined;\n  const userProvidedAriaLabelledby = props['aria-labelledby'] !== undefined;\n  if (!userProvidedAriaLabel && !userProvidedAriaLabelledby) {\n    if (name) {\n      root['aria-label'] = name;\n      if (badgeSlot) {\n        root['aria-labelledby'] = root.id + ' ' + badgeSlot.id;\n      }\n    } else if (initials) {\n      // root's aria-label should be the name, but fall back to being labelledby the initials if name is missing\n      root['aria-labelledby'] = initials.id + (badgeSlot ? ' ' + badgeSlot.id : '');\n    }\n\n    if (active === 'active' || active === 'inactive') {\n      const activeText = DEFAULT_STRINGS[active];\n      if (root['aria-labelledby']) {\n        const activeId = root.id + '__active';\n        root['aria-labelledby'] += ' ' + activeId;\n        activeAriaLabelElement = (\n          <span hidden id={activeId}>\n            {activeText}\n          </span>\n        );\n      } else if (root['aria-label']) {\n        root['aria-label'] += ' ' + activeText;\n      }\n    }\n  }\n\n  return {\n    active,\n    activeAriaLabelElement,\n    components: { root: 'span', initials: 'span', icon: 'span', image: 'img', badge: 'div' },\n    root,\n    initials,\n    icon,\n    image,\n    badge: badgeSlot,\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","idForColor","dir","shape","contextShape","size","contextSize","activeAppearance","color","propColor","rest","state","useAvatarBase_unstable","avatarColors","getHashCode","name","length","initials","optional","renderByDefault","defaultProps","children","firstInitialOnly","id","elementType","icon","hasOwnProperty","badge","getBadgeSize","components","image","imageProp","initialsProp","baseId","root","always","role","imageHidden","setImageHidden","useState","undefined","alt","hidden","src","onError","onLoad","badgeSlot","activeAriaLabelElement","userProvidedAriaLabel","userProvidedAriaLabelledby","activeText","activeId","span","str","hashCode","len","ch","charCodeAt","shift"],"mappings":"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"}

package/lib/components/Avatar/useAvatarStyles.styles.css.js

@@ -0,0 +1,56 @@
+'use client';
+import { clsx } from "clsx";
+import styles from "./Avatar.module.css";
+export const avatarClassNames = {
+    root: 'fui-Avatar',
+    image: 'fui-Avatar__image',
+    initials: 'fui-Avatar__initials',
+    icon: 'fui-Avatar__icon',
+    badge: 'fui-Avatar__badge'
+};
+const avatarSizeClasses = {
+    16: styles.size16,
+    20: styles.size20,
+    24: styles.size24,
+    28: styles.size28,
+    32: styles.size32,
+    36: styles.size36,
+    40: styles.size40,
+    48: styles.size48,
+    56: styles.size56,
+    64: styles.size64,
+    72: styles.size72,
+    96: styles.size96,
+    120: styles.size120,
+    128: styles.size128
+};
+export const useAvatarSizes = ()=>avatarSizeClasses;
+export const useSizeStyles = useAvatarSizes;
+export const useAvatarStyles_unstable = (state)=>{
+    var _state_badge_size;
+    const { size, shape, color, active, activeAppearance } = state;
+    const avatarSizes = useAvatarSizes();
+    const hasBadge = !!state.badge;
+    const hasRing = active !== 'unset' && (activeAppearance === 'ring' || activeAppearance === 'ring-shadow');
+    const hasShadow = active !== 'unset' && (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow');
+    // eslint-disable-next-line react-hooks/immutability
+    state.root.className = clsx(avatarClassNames.root, styles.root, styles[color], avatarSizes[size], shape === 'square' && styles.square, hasBadge && styles.badgeAlign, state.badge && styles[(_state_badge_size = state.badge.size) !== null && _state_badge_size !== void 0 ? _state_badge_size : 'medium'], active !== 'unset' && styles.activeOrInactive, hasRing && styles.ring, hasBadge && hasRing && styles.ringBadgeCutout, hasShadow && styles.shadow, active === 'inactive' && styles.inactive, state.root.className);
+    if (state.image) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.image.className = clsx(avatarClassNames.image, styles.image, hasBadge && styles.badgeCutout, state.image.className);
+    }
+    if (state.initials) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.initials.className = clsx(avatarClassNames.initials, styles.iconInitials, hasBadge && styles.badgeCutout, state.initials.className);
+    }
+    if (state.icon) {
+        // Icon font-size is driven by `.sizeXX :global(.fui-Avatar__icon)` rules in CSS.
+        // eslint-disable-next-line react-hooks/immutability
+        state.icon.className = clsx(avatarClassNames.icon, styles.iconInitials, hasBadge && styles.badgeCutout, state.icon.className);
+    }
+    if (state.badge) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.badge.className = clsx(avatarClassNames.badge, styles.badge, state.badge.className);
+    }
+    return state;
+};

package/lib/components/Avatar/useAvatarStyles.styles.css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Avatar/useAvatarStyles.styles.css.ts"],"sourcesContent":["'use client';\n\nimport { clsx } from 'clsx';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport styles from './Avatar.module.css';\nimport type { AvatarSize, AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const avatarClassNames: SlotClassNames<AvatarSlots> = {\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\nconst avatarSizeClasses: Record<AvatarSize, string> = {\n  16: styles.size16,\n  20: styles.size20,\n  24: styles.size24,\n  28: styles.size28,\n  32: styles.size32,\n  36: styles.size36,\n  40: styles.size40,\n  48: styles.size48,\n  56: styles.size56,\n  64: styles.size64,\n  72: styles.size72,\n  96: styles.size96,\n  120: styles.size120,\n  128: styles.size128,\n};\n\nexport const useAvatarSizes = (): Record<AvatarSize, string> => avatarSizeClasses;\nexport const useSizeStyles = useAvatarSizes;\n\nexport const useAvatarStyles_unstable = (state: AvatarState): AvatarState => {\n  const { size, shape, color, active, activeAppearance } = state;\n  const avatarSizes = useAvatarSizes();\n  const hasBadge = !!state.badge;\n  const hasRing = active !== 'unset' && (activeAppearance === 'ring' || activeAppearance === 'ring-shadow');\n  const hasShadow = active !== 'unset' && (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow');\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = clsx(\n    avatarClassNames.root,\n    styles.root,\n    styles[color],\n    avatarSizes[size],\n    shape === 'square' && styles.square,\n    hasBadge && styles.badgeAlign,\n    state.badge && styles[state.badge.size ?? 'medium'],\n    active !== 'unset' && styles.activeOrInactive,\n    hasRing && styles.ring,\n    hasBadge && hasRing && styles.ringBadgeCutout,\n    hasShadow && styles.shadow,\n    active === 'inactive' && styles.inactive,\n    state.root.className,\n  );\n\n  if (state.image) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.image.className = clsx(\n      avatarClassNames.image,\n      styles.image,\n      hasBadge && styles.badgeCutout,\n      state.image.className,\n    );\n  }\n\n  if (state.initials) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.initials.className = clsx(\n      avatarClassNames.initials,\n      styles.iconInitials,\n      hasBadge && styles.badgeCutout,\n      state.initials.className,\n    );\n  }\n\n  if (state.icon) {\n    // Icon font-size is driven by `.sizeXX :global(.fui-Avatar__icon)` rules in CSS.\n    // eslint-disable-next-line react-hooks/immutability\n    state.icon.className = clsx(\n      avatarClassNames.icon,\n      styles.iconInitials,\n      hasBadge && styles.badgeCutout,\n      state.icon.className,\n    );\n  }\n\n  if (state.badge) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.badge.className = clsx(avatarClassNames.badge, styles.badge, state.badge.className);\n  }\n\n  return state;\n};\n"],"names":["clsx","styles","avatarClassNames","root","image","initials","icon","badge","avatarSizeClasses","size16","size20","size24","size28","size32","size36","size40","size48","size56","size64","size72","size96","size120","size128","useAvatarSizes","useSizeStyles","useAvatarStyles_unstable","state","size","shape","color","active","activeAppearance","avatarSizes","hasBadge","hasRing","hasShadow","className","square","badgeAlign","activeOrInactive","ring","ringBadgeCutout","shadow","inactive","badgeCutout","iconInitials"],"mappings":"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"}

package/lib/components/Avatar/useAvatarStyles.styles.raw.css.js

@@ -0,0 +1,56 @@
+'use client';
+import { clsx } from "clsx";
+import styles from "./Avatar.module.css";
+export const avatarClassNames = {
+    root: 'fui-Avatar',
+    image: 'fui-Avatar__image',
+    initials: 'fui-Avatar__initials',
+    icon: 'fui-Avatar__icon',
+    badge: 'fui-Avatar__badge'
+};
+const avatarSizeClasses = {
+    16: styles.size16,
+    20: styles.size20,
+    24: styles.size24,
+    28: styles.size28,
+    32: styles.size32,
+    36: styles.size36,
+    40: styles.size40,
+    48: styles.size48,
+    56: styles.size56,
+    64: styles.size64,
+    72: styles.size72,
+    96: styles.size96,
+    120: styles.size120,
+    128: styles.size128
+};
+export const useAvatarSizes = ()=>avatarSizeClasses;
+export const useSizeStyles = useAvatarSizes;
+export const useAvatarStyles_unstable = (state)=>{
+    var _state_badge_size;
+    const { size, shape, color, active, activeAppearance } = state;
+    const avatarSizes = useAvatarSizes();
+    const hasBadge = !!state.badge;
+    const hasRing = active !== 'unset' && (activeAppearance === 'ring' || activeAppearance === 'ring-shadow');
+    const hasShadow = active !== 'unset' && (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow');
+    // eslint-disable-next-line react-hooks/immutability
+    state.root.className = clsx(avatarClassNames.root, styles.root, styles[color], avatarSizes[size], shape === 'square' && styles.square, hasBadge && styles.badgeAlign, state.badge && styles[(_state_badge_size = state.badge.size) !== null && _state_badge_size !== void 0 ? _state_badge_size : 'medium'], active !== 'unset' && styles.activeOrInactive, hasRing && styles.ring, hasBadge && hasRing && styles.ringBadgeCutout, hasShadow && styles.shadow, active === 'inactive' && styles.inactive, state.root.className);
+    if (state.image) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.image.className = clsx(avatarClassNames.image, styles.image, hasBadge && styles.badgeCutout, state.image.className);
+    }
+    if (state.initials) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.initials.className = clsx(avatarClassNames.initials, styles.iconInitials, hasBadge && styles.badgeCutout, state.initials.className);
+    }
+    if (state.icon) {
+        // Icon font-size is driven by `.sizeXX :global(.fui-Avatar__icon)` rules in CSS.
+        // eslint-disable-next-line react-hooks/immutability
+        state.icon.className = clsx(avatarClassNames.icon, styles.iconInitials, hasBadge && styles.badgeCutout, state.icon.className);
+    }
+    if (state.badge) {
+        // eslint-disable-next-line react-hooks/immutability
+        state.badge.className = clsx(avatarClassNames.badge, styles.badge, state.badge.className);
+    }
+    return state;
+};

package/lib/components/Avatar/useAvatarStyles.styles.raw.css.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/Avatar/useAvatarStyles.styles.css.ts"],"sourcesContent":["'use client';\n\nimport { clsx } from 'clsx';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport styles from './Avatar.module.css';\nimport type { AvatarSize, AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const avatarClassNames: SlotClassNames<AvatarSlots> = {\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\nconst avatarSizeClasses: Record<AvatarSize, string> = {\n  16: styles.size16,\n  20: styles.size20,\n  24: styles.size24,\n  28: styles.size28,\n  32: styles.size32,\n  36: styles.size36,\n  40: styles.size40,\n  48: styles.size48,\n  56: styles.size56,\n  64: styles.size64,\n  72: styles.size72,\n  96: styles.size96,\n  120: styles.size120,\n  128: styles.size128,\n};\n\nexport const useAvatarSizes = (): Record<AvatarSize, string> => avatarSizeClasses;\nexport const useSizeStyles = useAvatarSizes;\n\nexport const useAvatarStyles_unstable = (state: AvatarState): AvatarState => {\n  const { size, shape, color, active, activeAppearance } = state;\n  const avatarSizes = useAvatarSizes();\n  const hasBadge = !!state.badge;\n  const hasRing = active !== 'unset' && (activeAppearance === 'ring' || activeAppearance === 'ring-shadow');\n  const hasShadow = active !== 'unset' && (activeAppearance === 'shadow' || activeAppearance === 'ring-shadow');\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = clsx(\n    avatarClassNames.root,\n    styles.root,\n    styles[color],\n    avatarSizes[size],\n    shape === 'square' && styles.square,\n    hasBadge && styles.badgeAlign,\n    state.badge && styles[state.badge.size ?? 'medium'],\n    active !== 'unset' && styles.activeOrInactive,\n    hasRing && styles.ring,\n    hasBadge && hasRing && styles.ringBadgeCutout,\n    hasShadow && styles.shadow,\n    active === 'inactive' && styles.inactive,\n    state.root.className,\n  );\n\n  if (state.image) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.image.className = clsx(\n      avatarClassNames.image,\n      styles.image,\n      hasBadge && styles.badgeCutout,\n      state.image.className,\n    );\n  }\n\n  if (state.initials) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.initials.className = clsx(\n      avatarClassNames.initials,\n      styles.iconInitials,\n      hasBadge && styles.badgeCutout,\n      state.initials.className,\n    );\n  }\n\n  if (state.icon) {\n    // Icon font-size is driven by `.sizeXX :global(.fui-Avatar__icon)` rules in CSS.\n    // eslint-disable-next-line react-hooks/immutability\n    state.icon.className = clsx(\n      avatarClassNames.icon,\n      styles.iconInitials,\n      hasBadge && styles.badgeCutout,\n      state.icon.className,\n    );\n  }\n\n  if (state.badge) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.badge.className = clsx(avatarClassNames.badge, styles.badge, state.badge.className);\n  }\n\n  return state;\n};\n"],"names":["clsx","styles","avatarClassNames","root","image","initials","icon","badge","avatarSizeClasses","size16","size20","size24","size28","size32","size36","size40","size48","size56","size64","size72","size96","size120","size128","useAvatarSizes","useSizeStyles","useAvatarStyles_unstable","state","size","shape","color","active","activeAppearance","avatarSizes","hasBadge","hasRing","hasShadow","className","square","badgeAlign","activeOrInactive","ring","ringBadgeCutout","shadow","inactive","badgeCutout","iconInitials"],"mappings":"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"}

package/lib/components/Avatar/useAvatarStyles.styles.raw.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Avatar/useAvatarStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const avatarClassNames: SlotClassNames<AvatarSlots> = {\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\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};\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\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});\n\nconst useImageClassName = makeResetStyles({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n\n  borderRadius: 'inherit',\n  objectFit: 'cover',\n  verticalAlign: 'top',\n});\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\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  verticalAlign: 'center',\n  textAlign: 'center',\n  userSelect: 'none',\n  borderRadius: 'inherit',\n});\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 */\nconst badgeMask = (margin?: string) => {\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\n  return (\n    `radial-gradient(circle at bottom ${centerOffset} var(${vars.badgeAlign}) ${centerOffset}, ` +\n    `transparent ${innerRadius}, white ${outerRadius})`\n  );\n};\n\nconst useStyles = makeStyles({\n  textCaption2Strong: { fontSize: tokens.fontSizeBase100 },\n  textCaption1Strong: { fontSize: tokens.fontSizeBase200 },\n  textSubtitle2: { fontSize: tokens.fontSizeBase400 },\n  textSubtitle1: { fontSize: tokens.fontSizeBase500 },\n  textTitle3: { fontSize: tokens.fontSizeBase600 },\n\n  squareSmall: { borderRadius: tokens.borderRadiusSmall },\n  squareMedium: { borderRadius: tokens.borderRadiusMedium },\n  squareLarge: { borderRadius: tokens.borderRadiusLarge },\n  squareXLarge: { borderRadius: tokens.borderRadiusXLarge },\n\n  activeOrInactive: {\n    transform: 'perspective(1px)', // Work-around for text pixel snapping at the end of the animation\n    transitionProperty: 'transform, opacity',\n    transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n    transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n  },\n\n  ring: {\n    // Show the ::before pseudo-element, which is the ring\n    '::before': { content: '\"\"' },\n  },\n  ringBadgeCutout: {\n    '::before': { maskImage: badgeMask(/*margin =*/ `2 * var(${vars.ringWidth})`) },\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\n  shadow: {\n    // Show the ::after pseudo-element, which is the shadow\n    '::after': { content: '\"\"' },\n  },\n  shadow4: {\n    '::after': { boxShadow: tokens.shadow4 },\n  },\n  shadow8: {\n    '::after': { boxShadow: tokens.shadow8 },\n  },\n  shadow16: {\n    '::after': { boxShadow: tokens.shadow16 },\n  },\n  shadow28: {\n    '::after': { boxShadow: tokens.shadow28 },\n  },\n\n  inactive: {\n    opacity: '0.8',\n    transform: 'scale(0.875)',\n    transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n\n    '::before,::after': {\n      margin: 0,\n      opacity: 0,\n      transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n    },\n  },\n\n  // Applied to the badge slot\n  badge: {\n    position: 'absolute',\n    bottom: 0,\n    right: 0,\n  },\n\n  // Applied to the image, initials, or icon slot when there is a badge\n  badgeCutout: {\n    maskImage: badgeMask(),\n  },\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\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\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});\n\nexport const useSizeStyles = makeStyles({\n  16: { width: '16px', height: '16px' },\n  20: { width: '20px', height: '20px' },\n  24: { width: '24px', height: '24px' },\n  28: { width: '28px', height: '28px' },\n  32: { width: '32px', height: '32px' },\n  36: { width: '36px', height: '36px' },\n  40: { width: '40px', height: '40px' },\n  48: { width: '48px', height: '48px' },\n  56: { width: '56px', height: '56px' },\n  64: { width: '64px', height: '64px' },\n  72: { width: '72px', height: '72px' },\n  96: { width: '96px', height: '96px' },\n  120: { width: '120px', height: '120px' },\n  128: { width: '128px', 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});\n\nconst useRingColorStyles = makeStyles({\n  neutral: {\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  brand: {\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  'dark-red': {\n    '::before': { color: tokens.colorPaletteDarkRedBorderActive },\n  },\n  cranberry: {\n    '::before': { color: tokens.colorPaletteCranberryBorderActive },\n  },\n  red: {\n    '::before': { color: tokens.colorPaletteRedBorderActive },\n  },\n  pumpkin: {\n    '::before': { color: tokens.colorPalettePumpkinBorderActive },\n  },\n  peach: {\n    '::before': { color: tokens.colorPalettePeachBorderActive },\n  },\n  marigold: {\n    '::before': { color: tokens.colorPaletteMarigoldBorderActive },\n  },\n  gold: {\n    '::before': { color: tokens.colorPaletteGoldBorderActive },\n  },\n  brass: {\n    '::before': { color: tokens.colorPaletteBrassBorderActive },\n  },\n  brown: {\n    '::before': { color: tokens.colorPaletteBrownBorderActive },\n  },\n  forest: {\n    '::before': { color: tokens.colorPaletteForestBorderActive },\n  },\n  seafoam: {\n    '::before': { color: tokens.colorPaletteSeafoamBorderActive },\n  },\n  'dark-green': {\n    '::before': { color: tokens.colorPaletteDarkGreenBorderActive },\n  },\n  'light-teal': {\n    '::before': { color: tokens.colorPaletteLightTealBorderActive },\n  },\n  teal: {\n    '::before': { color: tokens.colorPaletteTealBorderActive },\n  },\n  steel: {\n    '::before': { color: tokens.colorPaletteSteelBorderActive },\n  },\n  blue: {\n    '::before': { color: tokens.colorPaletteBlueBorderActive },\n  },\n  'royal-blue': {\n    '::before': { color: tokens.colorPaletteRoyalBlueBorderActive },\n  },\n  cornflower: {\n    '::before': { color: tokens.colorPaletteCornflowerBorderActive },\n  },\n  navy: {\n    '::before': { color: tokens.colorPaletteNavyBorderActive },\n  },\n  lavender: {\n    '::before': { color: tokens.colorPaletteLavenderBorderActive },\n  },\n  purple: {\n    '::before': { color: tokens.colorPalettePurpleBorderActive },\n  },\n  grape: {\n    '::before': { color: tokens.colorPaletteGrapeBorderActive },\n  },\n  lilac: {\n    '::before': { color: tokens.colorPaletteLilacBorderActive },\n  },\n  pink: {\n    '::before': { color: tokens.colorPalettePinkBorderActive },\n  },\n  magenta: {\n    '::before': { color: tokens.colorPaletteMagentaBorderActive },\n  },\n  plum: {\n    '::before': { color: tokens.colorPalettePlumBorderActive },\n  },\n  beige: {\n    '::before': { color: tokens.colorPaletteBeigeBorderActive },\n  },\n  mink: {\n    '::before': { color: tokens.colorPaletteMinkBorderActive },\n  },\n  platinum: {\n    '::before': { color: tokens.colorPalettePlatinumBorderActive },\n  },\n  anchor: {\n    '::before': { color: tokens.colorPaletteAnchorBorderActive },\n  },\n});\n\nexport const useAvatarStyles_unstable = (state: AvatarState): AvatarState => {\n  const { size, shape, active, activeAppearance, color } = state;\n\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\n  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size]];\n\n  if (state.badge) {\n    rootClasses.push(styles.badgeAlign, styles[state.badge.size || 'medium']);\n  }\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\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\n  if (active === 'active' || active === 'inactive') {\n    rootClasses.push(styles.activeOrInactive);\n\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\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\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\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\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n\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\n  if (state.image) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.image.className = mergeClasses(\n      avatarClassNames.image,\n      imageClassName,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.image.className,\n    );\n  }\n\n  if (state.initials) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.initials.className = mergeClasses(\n      avatarClassNames.initials,\n      iconInitialsClassName,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.initials.className,\n    );\n  }\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\n    // eslint-disable-next-line react-hooks/immutability\n    state.icon.className = mergeClasses(\n      avatarClassNames.icon,\n      iconInitialsClassName,\n      iconSizeClass,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["tokens","makeResetStyles","makeStyles","mergeClasses","avatarClassNames","root","image","initials","icon","badge","vars","badgeRadius","badgeGap","badgeAlign","ringWidth","useRootClassName","display","flexShrink","position","verticalAlign","borderRadius","borderRadiusCircular","fontFamily","fontFamilyBase","fontWeight","fontWeightSemibold","fontSize","fontSizeBase300","width","height","top","left","bottom","right","zIndex","margin","transitionProperty","transitionTimingFunction","curveEasyEaseMax","curveLinear","transitionDuration","durationUltraSlow","durationSlower","borderStyle","borderWidth","useImageClassName","objectFit","useIconInitialsClassName","boxSizing","lineHeight","border","strokeWidthThin","colorTransparentStroke","alignItems","justifyContent","textAlign","userSelect","badgeMask","centerOffset","innerRadius","outerRadius","useStyles","textCaption2Strong","fontSizeBase100","textCaption1Strong","fontSizeBase200","textSubtitle2","fontSizeBase400","textSubtitle1","fontSizeBase500","textTitle3","fontSizeBase600","squareSmall","borderRadiusSmall","squareMedium","borderRadiusMedium","squareLarge","borderRadiusLarge","squareXLarge","borderRadiusXLarge","activeOrInactive","transform","durationFaster","ring","content","ringBadgeCutout","maskImage","ringThick","strokeWidthThick","ringThicker","strokeWidthThicker","ringThickest","strokeWidthThickest","shadow","shadow4","boxShadow","shadow8","shadow16","shadow28","inactive","opacity","curveDecelerateMin","badgeCutout","tiny","small","medium","large","icon12","icon16","icon20","icon24","icon28","icon32","icon48","useSizeStyles","useColorStyles","neutral","color","colorNeutralForeground3","backgroundColor","colorNeutralBackground6","brand","colorNeutralForegroundStaticInverted","colorBrandBackgroundStatic","colorPaletteDarkRedForeground2","colorPaletteDarkRedBackground2","cranberry","colorPaletteCranberryForeground2","colorPaletteCranberryBackground2","red","colorPaletteRedForeground2","colorPaletteRedBackground2","pumpkin","colorPalettePumpkinForeground2","colorPalettePumpkinBackground2","peach","colorPalettePeachForeground2","colorPalettePeachBackground2","marigold","colorPaletteMarigoldForeground2","colorPaletteMarigoldBackground2","gold","colorPaletteGoldForeground2","colorPaletteGoldBackground2","brass","colorPaletteBrassForeground2","colorPaletteBrassBackground2","brown","colorPaletteBrownForeground2","colorPaletteBrownBackground2","forest","colorPaletteForestForeground2","colorPaletteForestBackground2","seafoam","colorPaletteSeafoamForeground2","colorPaletteSeafoamBackground2","colorPaletteDarkGreenForeground2","colorPaletteDarkGreenBackground2","colorPaletteLightTealForeground2","colorPaletteLightTealBackground2","teal","colorPaletteTealForeground2","colorPaletteTealBackground2","steel","colorPaletteSteelForeground2","colorPaletteSteelBackground2","blue","colorPaletteBlueForeground2","colorPaletteBlueBackground2","colorPaletteRoyalBlueForeground2","colorPaletteRoyalBlueBackground2","cornflower","colorPaletteCornflowerForeground2","colorPaletteCornflowerBackground2","navy","colorPaletteNavyForeground2","colorPaletteNavyBackground2","lavender","colorPaletteLavenderForeground2","colorPaletteLavenderBackground2","purple","colorPalettePurpleForeground2","colorPalettePurpleBackground2","grape","colorPaletteGrapeForeground2","colorPaletteGrapeBackground2","lilac","colorPaletteLilacForeground2","colorPaletteLilacBackground2","pink","colorPalettePinkForeground2","colorPalettePinkBackground2","magenta","colorPaletteMagentaForeground2","colorPaletteMagentaBackground2","plum","colorPalettePlumForeground2","colorPalettePlumBackground2","beige","colorPaletteBeigeForeground2","colorPaletteBeigeBackground2","mink","colorPaletteMinkForeground2","colorPaletteMinkBackground2","platinum","colorPalettePlatinumForeground2","colorPalettePlatinumBackground2","anchor","colorPaletteAnchorForeground2","colorPaletteAnchorBackground2","useRingColorStyles","colorBrandStroke1","colorPaletteDarkRedBorderActive","colorPaletteCranberryBorderActive","colorPaletteRedBorderActive","colorPalettePumpkinBorderActive","colorPalettePeachBorderActive","colorPaletteMarigoldBorderActive","colorPaletteGoldBorderActive","colorPaletteBrassBorderActive","colorPaletteBrownBorderActive","colorPaletteForestBorderActive","colorPaletteSeafoamBorderActive","colorPaletteDarkGreenBorderActive","colorPaletteLightTealBorderActive","colorPaletteTealBorderActive","colorPaletteSteelBorderActive","colorPaletteBlueBorderActive","colorPaletteRoyalBlueBorderActive","colorPaletteCornflowerBorderActive","colorPaletteNavyBorderActive","colorPaletteLavenderBorderActive","colorPalettePurpleBorderActive","colorPaletteGrapeBorderActive","colorPaletteLilacBorderActive","colorPalettePinkBorderActive","colorPaletteMagentaBorderActive","colorPalettePlumBorderActive","colorPaletteBeigeBorderActive","colorPaletteMinkBorderActive","colorPalettePlatinumBorderActive","colorPaletteAnchorBorderActive","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","ringColorStyles","rootClasses","push","className","iconSizeClass"],"mappings":"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"}
+{"version":3,"sources":["../../../src/components/Avatar/useAvatarStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { makeResetStyles, makeStyles, mergeClasses } from '@griffel/react';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const avatarClassNames: SlotClassNames<AvatarSlots> = {\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\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};\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\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});\n\nconst useImageClassName = makeResetStyles({\n  position: 'absolute',\n  top: 0,\n  left: 0,\n  width: '100%',\n  height: '100%',\n\n  borderRadius: 'inherit',\n  objectFit: 'cover',\n  verticalAlign: 'top',\n});\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\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  verticalAlign: 'center',\n  textAlign: 'center',\n  userSelect: 'none',\n  borderRadius: 'inherit',\n});\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 */\nconst badgeMask = (margin?: string) => {\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\n  return (\n    `radial-gradient(circle at bottom ${centerOffset} var(${vars.badgeAlign}) ${centerOffset}, ` +\n    `transparent ${innerRadius}, white ${outerRadius})`\n  );\n};\n\nconst useStyles = makeStyles({\n  textCaption2Strong: { fontSize: tokens.fontSizeBase100 },\n  textCaption1Strong: { fontSize: tokens.fontSizeBase200 },\n  textSubtitle2: { fontSize: tokens.fontSizeBase400 },\n  textSubtitle1: { fontSize: tokens.fontSizeBase500 },\n  textTitle3: { fontSize: tokens.fontSizeBase600 },\n\n  squareSmall: { borderRadius: tokens.borderRadiusSmall },\n  squareMedium: { borderRadius: tokens.borderRadiusMedium },\n  squareLarge: { borderRadius: tokens.borderRadiusLarge },\n  squareXLarge: { borderRadius: tokens.borderRadiusXLarge },\n\n  activeOrInactive: {\n    transform: 'perspective(1px)', // Work-around for text pixel snapping at the end of the animation\n    transitionProperty: 'transform, opacity',\n    transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n    transitionTimingFunction: `${tokens.curveEasyEaseMax}, ${tokens.curveLinear}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n  },\n\n  ring: {\n    // Show the ::before pseudo-element, which is the ring\n    '::before': { content: '\"\"' },\n  },\n  ringBadgeCutout: {\n    '::before': { maskImage: badgeMask(/*margin =*/ `2 * var(${vars.ringWidth})`) },\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\n  shadow: {\n    // Show the ::after pseudo-element, which is the shadow\n    '::after': { content: '\"\"' },\n  },\n  shadow4: {\n    '::after': { boxShadow: tokens.shadow4 },\n  },\n  shadow8: {\n    '::after': { boxShadow: tokens.shadow8 },\n  },\n  shadow16: {\n    '::after': { boxShadow: tokens.shadow16 },\n  },\n  shadow28: {\n    '::after': { boxShadow: tokens.shadow28 },\n  },\n\n  inactive: {\n    opacity: '0.8',\n    transform: 'scale(0.875)',\n    transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n\n    '::before,::after': {\n      margin: 0,\n      opacity: 0,\n      transitionTimingFunction: `${tokens.curveDecelerateMin}, ${tokens.curveLinear}`,\n    },\n  },\n\n  // Applied to the badge slot\n  badge: {\n    position: 'absolute',\n    bottom: 0,\n    right: 0,\n  },\n\n  // Applied to the image, initials, or icon slot when there is a badge\n  badgeCutout: {\n    maskImage: badgeMask(),\n  },\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\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\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});\n\nexport const useSizeStyles = makeStyles({\n  16: { width: '16px', height: '16px' },\n  20: { width: '20px', height: '20px' },\n  24: { width: '24px', height: '24px' },\n  28: { width: '28px', height: '28px' },\n  32: { width: '32px', height: '32px' },\n  36: { width: '36px', height: '36px' },\n  40: { width: '40px', height: '40px' },\n  48: { width: '48px', height: '48px' },\n  56: { width: '56px', height: '56px' },\n  64: { width: '64px', height: '64px' },\n  72: { width: '72px', height: '72px' },\n  96: { width: '96px', height: '96px' },\n  120: { width: '120px', height: '120px' },\n  128: { width: '128px', 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});\n\nconst useRingColorStyles = makeStyles({\n  neutral: {\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  brand: {\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  'dark-red': {\n    '::before': { color: tokens.colorPaletteDarkRedBorderActive },\n  },\n  cranberry: {\n    '::before': { color: tokens.colorPaletteCranberryBorderActive },\n  },\n  red: {\n    '::before': { color: tokens.colorPaletteRedBorderActive },\n  },\n  pumpkin: {\n    '::before': { color: tokens.colorPalettePumpkinBorderActive },\n  },\n  peach: {\n    '::before': { color: tokens.colorPalettePeachBorderActive },\n  },\n  marigold: {\n    '::before': { color: tokens.colorPaletteMarigoldBorderActive },\n  },\n  gold: {\n    '::before': { color: tokens.colorPaletteGoldBorderActive },\n  },\n  brass: {\n    '::before': { color: tokens.colorPaletteBrassBorderActive },\n  },\n  brown: {\n    '::before': { color: tokens.colorPaletteBrownBorderActive },\n  },\n  forest: {\n    '::before': { color: tokens.colorPaletteForestBorderActive },\n  },\n  seafoam: {\n    '::before': { color: tokens.colorPaletteSeafoamBorderActive },\n  },\n  'dark-green': {\n    '::before': { color: tokens.colorPaletteDarkGreenBorderActive },\n  },\n  'light-teal': {\n    '::before': { color: tokens.colorPaletteLightTealBorderActive },\n  },\n  teal: {\n    '::before': { color: tokens.colorPaletteTealBorderActive },\n  },\n  steel: {\n    '::before': { color: tokens.colorPaletteSteelBorderActive },\n  },\n  blue: {\n    '::before': { color: tokens.colorPaletteBlueBorderActive },\n  },\n  'royal-blue': {\n    '::before': { color: tokens.colorPaletteRoyalBlueBorderActive },\n  },\n  cornflower: {\n    '::before': { color: tokens.colorPaletteCornflowerBorderActive },\n  },\n  navy: {\n    '::before': { color: tokens.colorPaletteNavyBorderActive },\n  },\n  lavender: {\n    '::before': { color: tokens.colorPaletteLavenderBorderActive },\n  },\n  purple: {\n    '::before': { color: tokens.colorPalettePurpleBorderActive },\n  },\n  grape: {\n    '::before': { color: tokens.colorPaletteGrapeBorderActive },\n  },\n  lilac: {\n    '::before': { color: tokens.colorPaletteLilacBorderActive },\n  },\n  pink: {\n    '::before': { color: tokens.colorPalettePinkBorderActive },\n  },\n  magenta: {\n    '::before': { color: tokens.colorPaletteMagentaBorderActive },\n  },\n  plum: {\n    '::before': { color: tokens.colorPalettePlumBorderActive },\n  },\n  beige: {\n    '::before': { color: tokens.colorPaletteBeigeBorderActive },\n  },\n  mink: {\n    '::before': { color: tokens.colorPaletteMinkBorderActive },\n  },\n  platinum: {\n    '::before': { color: tokens.colorPalettePlatinumBorderActive },\n  },\n  anchor: {\n    '::before': { color: tokens.colorPaletteAnchorBorderActive },\n  },\n});\n\nexport const useAvatarStyles_unstable = (state: AvatarState): AvatarState => {\n  const { size, shape, active, activeAppearance, color } = state;\n\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\n  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size]];\n\n  if (state.badge) {\n    rootClasses.push(styles.badgeAlign, styles[state.badge.size || 'medium']);\n  }\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\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\n  if (active === 'active' || active === 'inactive') {\n    rootClasses.push(styles.activeOrInactive);\n\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\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\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\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\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n\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\n  if (state.image) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.image.className = mergeClasses(\n      avatarClassNames.image,\n      imageClassName,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.image.className,\n    );\n  }\n\n  if (state.initials) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.initials.className = mergeClasses(\n      avatarClassNames.initials,\n      iconInitialsClassName,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.initials.className,\n    );\n  }\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\n    // eslint-disable-next-line react-hooks/immutability\n    state.icon.className = mergeClasses(\n      avatarClassNames.icon,\n      iconInitialsClassName,\n      iconSizeClass,\n      colorStyles[color],\n      state.badge && styles.badgeCutout,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"names":["tokens","makeResetStyles","makeStyles","mergeClasses","avatarClassNames","root","image","initials","icon","badge","vars","badgeRadius","badgeGap","badgeAlign","ringWidth","useRootClassName","display","flexShrink","position","verticalAlign","borderRadius","borderRadiusCircular","fontFamily","fontFamilyBase","fontWeight","fontWeightSemibold","fontSize","fontSizeBase300","width","height","top","left","bottom","right","zIndex","margin","transitionProperty","transitionTimingFunction","curveEasyEaseMax","curveLinear","transitionDuration","durationUltraSlow","durationSlower","borderStyle","borderWidth","useImageClassName","objectFit","useIconInitialsClassName","boxSizing","lineHeight","border","strokeWidthThin","colorTransparentStroke","alignItems","justifyContent","textAlign","userSelect","badgeMask","centerOffset","innerRadius","outerRadius","useStyles","textCaption2Strong","fontSizeBase100","textCaption1Strong","fontSizeBase200","textSubtitle2","fontSizeBase400","textSubtitle1","fontSizeBase500","textTitle3","fontSizeBase600","squareSmall","borderRadiusSmall","squareMedium","borderRadiusMedium","squareLarge","borderRadiusLarge","squareXLarge","borderRadiusXLarge","activeOrInactive","transform","durationFaster","ring","content","ringBadgeCutout","maskImage","ringThick","strokeWidthThick","ringThicker","strokeWidthThicker","ringThickest","strokeWidthThickest","shadow","shadow4","boxShadow","shadow8","shadow16","shadow28","inactive","opacity","curveDecelerateMin","badgeCutout","tiny","small","medium","large","icon12","icon16","icon20","icon24","icon28","icon32","icon48","useSizeStyles","useColorStyles","neutral","color","colorNeutralForeground3","backgroundColor","colorNeutralBackground6","brand","colorNeutralForegroundStaticInverted","colorBrandBackgroundStatic","colorPaletteDarkRedForeground2","colorPaletteDarkRedBackground2","cranberry","colorPaletteCranberryForeground2","colorPaletteCranberryBackground2","red","colorPaletteRedForeground2","colorPaletteRedBackground2","pumpkin","colorPalettePumpkinForeground2","colorPalettePumpkinBackground2","peach","colorPalettePeachForeground2","colorPalettePeachBackground2","marigold","colorPaletteMarigoldForeground2","colorPaletteMarigoldBackground2","gold","colorPaletteGoldForeground2","colorPaletteGoldBackground2","brass","colorPaletteBrassForeground2","colorPaletteBrassBackground2","brown","colorPaletteBrownForeground2","colorPaletteBrownBackground2","forest","colorPaletteForestForeground2","colorPaletteForestBackground2","seafoam","colorPaletteSeafoamForeground2","colorPaletteSeafoamBackground2","colorPaletteDarkGreenForeground2","colorPaletteDarkGreenBackground2","colorPaletteLightTealForeground2","colorPaletteLightTealBackground2","teal","colorPaletteTealForeground2","colorPaletteTealBackground2","steel","colorPaletteSteelForeground2","colorPaletteSteelBackground2","blue","colorPaletteBlueForeground2","colorPaletteBlueBackground2","colorPaletteRoyalBlueForeground2","colorPaletteRoyalBlueBackground2","cornflower","colorPaletteCornflowerForeground2","colorPaletteCornflowerBackground2","navy","colorPaletteNavyForeground2","colorPaletteNavyBackground2","lavender","colorPaletteLavenderForeground2","colorPaletteLavenderBackground2","purple","colorPalettePurpleForeground2","colorPalettePurpleBackground2","grape","colorPaletteGrapeForeground2","colorPaletteGrapeBackground2","lilac","colorPaletteLilacForeground2","colorPaletteLilacBackground2","pink","colorPalettePinkForeground2","colorPalettePinkBackground2","magenta","colorPaletteMagentaForeground2","colorPaletteMagentaBackground2","plum","colorPalettePlumForeground2","colorPalettePlumBackground2","beige","colorPaletteBeigeForeground2","colorPaletteBeigeBackground2","mink","colorPaletteMinkForeground2","colorPaletteMinkBackground2","platinum","colorPalettePlatinumForeground2","colorPalettePlatinumBackground2","anchor","colorPaletteAnchorForeground2","colorPaletteAnchorBackground2","useRingColorStyles","colorBrandStroke1","colorPaletteDarkRedBorderActive","colorPaletteCranberryBorderActive","colorPaletteRedBorderActive","colorPalettePumpkinBorderActive","colorPalettePeachBorderActive","colorPaletteMarigoldBorderActive","colorPaletteGoldBorderActive","colorPaletteBrassBorderActive","colorPaletteBrownBorderActive","colorPaletteForestBorderActive","colorPaletteSeafoamBorderActive","colorPaletteDarkGreenBorderActive","colorPaletteLightTealBorderActive","colorPaletteTealBorderActive","colorPaletteSteelBorderActive","colorPaletteBlueBorderActive","colorPaletteRoyalBlueBorderActive","colorPaletteCornflowerBorderActive","colorPaletteNavyBorderActive","colorPaletteLavenderBorderActive","colorPalettePurpleBorderActive","colorPaletteGrapeBorderActive","colorPaletteLilacBorderActive","colorPalettePinkBorderActive","colorPaletteMagentaBorderActive","colorPalettePlumBorderActive","colorPaletteBeigeBorderActive","colorPaletteMinkBorderActive","colorPalettePlatinumBorderActive","colorPaletteAnchorBorderActive","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","ringColorStyles","rootClasses","push","className","iconSizeClass"],"mappings":"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"}

package/lib/components/AvatarGroup/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nimport { useAvatarGroup_unstable } from './useAvatarGroup';\nimport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nimport type { AvatarGroupProps } from './AvatarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroup component represents a group of multiple people or entities by taking care of the arrangement\n * of individual Avatars in a spread, stack, or pie layout.\n */\nexport const AvatarGroup: ForwardRefComponent<AvatarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroup_unstable(props, ref);\n  const contextValues = useAvatarGroupContextValues(state);\n\n  useAvatarGroupStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupStyles_unstable')(state);\n\n  return renderAvatarGroup_unstable(state, contextValues);\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\n"],"names":["React","renderAvatarGroup_unstable","useAvatarGroup_unstable","useAvatarGroupContextValues","useCustomStyleHook_unstable","useAvatarGroupStyles_unstable","AvatarGroup","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,uBAAuB,QAAQ,sBAAmB;AAC3D,SAASC,2BAA2B,QAAQ,mCAAgC;AAC5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,6BAA6B,QAAQ,mCAAgC;AAI9E;;;CAGC,GACD,OAAO,MAAMC,4BAAqDN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAC7C,MAAME,gBAAgBR,4BAA4BO;IAElDL,8BAA8BK;IAE9BN,4BAA4B,iCAAiCM;IAE7D,OAAOT,2BAA2BS,OAAOC;AAC3C,GAAG;AAEHL,YAAYM,WAAW,GAAG"}
+{"version":3,"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nimport { useAvatarGroup_unstable } from './useAvatarGroup';\nimport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nimport type { AvatarGroupProps } from './AvatarGroup.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroup component represents a group of multiple people or entities by taking care of the arrangement\n * of individual Avatars in a spread, stack, or pie layout.\n */\nexport const AvatarGroup: ForwardRefComponent<AvatarGroupProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroup_unstable(props, ref);\n  const contextValues = useAvatarGroupContextValues(state);\n\n  useAvatarGroupStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupStyles_unstable')(state);\n\n  return renderAvatarGroup_unstable(state, contextValues);\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\n"],"names":["React","renderAvatarGroup_unstable","useAvatarGroup_unstable","useAvatarGroupContextValues","useCustomStyleHook_unstable","useAvatarGroupStyles_unstable","AvatarGroup","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,uBAAuB,QAAQ,sBAAmB;AAC3D,SAASC,2BAA2B,QAAQ,mCAAgC;AAC5E,SAASC,2BAA2B,QAAQ,kCAAkC;AAC9E,SAASC,6BAA6B,QAAQ,mCAAgC;AAI9E;;;CAGC,GACD,OAAO,MAAMC,4BAAqDN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACzF,MAAMC,QAAQR,wBAAwBM,OAAOC;IAC7C,MAAME,gBAAgBR,4BAA4BO;IAElDL,8BAA8BK;IAE9BN,4BAA4B,iCAAiCM;IAE7D,OAAOT,2BAA2BS,OAAOC;AAC3C,GAAG;AAEHL,YAAYM,WAAW,GAAG"}

package/lib/components/AvatarGroup/AvatarGroup.module.css

@@ -0,0 +1,143 @@
+@layer fluentui {
+  .root {
+    display: inline-flex;
+    position: relative;
+  }
+
+  .pie {
+    clip-path: circle(50%);
+    background-color: var(--colorTransparentStroke);
+    @media (forced-colors: active) {
+      background-color: CanvasText;
+    }
+  }
+
+  /* Shared dimensions and layout metrics for group items and the overflow trigger. */
+  .size16 {
+    --fui-AvatarGroup-size: var(--spacingHorizontalL);
+  }
+  .size20 {
+    --fui-AvatarGroup-size: var(--spacingHorizontalXL);
+  }
+  .size24 {
+    --fui-AvatarGroup-size: var(--spacingHorizontalXXL);
+  }
+  .size28 {
+    --fui-AvatarGroup-size: calc(7 * var(--spacingHorizontalXS));
+  }
+  .size32 {
+    --fui-AvatarGroup-size: var(--spacingHorizontalXXXL);
+  }
+  .size36 {
+    --fui-AvatarGroup-size: calc(9 * var(--spacingHorizontalXS));
+  }
+  .size40 {
+    --fui-AvatarGroup-size: calc(10 * var(--spacingHorizontalXS));
+  }
+  .size48 {
+    --fui-AvatarGroup-size: calc(12 * var(--spacingHorizontalXS));
+  }
+  .size56 {
+    --fui-AvatarGroup-size: calc(14 * var(--spacingHorizontalXS));
+  }
+  .size64 {
+    --fui-AvatarGroup-size: calc(16 * var(--spacingHorizontalXS));
+  }
+  .size72 {
+    --fui-AvatarGroup-size: calc(18 * var(--spacingHorizontalXS));
+  }
+  .size96 {
+    --fui-AvatarGroup-size: calc(24 * var(--spacingHorizontalXS));
+  }
+  .size120 {
+    --fui-AvatarGroup-size: calc(30 * var(--spacingHorizontalXS));
+  }
+  .size128 {
+    --fui-AvatarGroup-size: calc(32 * var(--spacingHorizontalXS));
+  }
+
+  .size16,
+  .size20,
+  .size24,
+  .size28,
+  .size32,
+  .size36,
+  .size40,
+  .size48,
+  .size56,
+  .size64,
+  .size72,
+  .size96,
+  .size120,
+  .size128 {
+    width: var(--fui-AvatarGroup-size);
+    height: var(--fui-AvatarGroup-size);
+  }
+
+  .size16,
+  .size20,
+  .size24,
+  .size28,
+  .size32,
+  .size36,
+  .size40,
+  .size48 {
+    --fui-AvatarGroup-divider: var(--strokeWidthThick);
+  }
+  .size56,
+  .size64 {
+    --fui-AvatarGroup-divider: var(--strokeWidthThicker);
+  }
+  .size72,
+  .size96,
+  .size120,
+  .size128 {
+    --fui-AvatarGroup-divider: var(--strokeWidthThickest);
+  }
+
+  .size16,
+  .size20 {
+    --fui-AvatarGroup-stackSpacing: var(--spacingHorizontalXXS);
+  }
+  .size24,
+  .size28,
+  .size32,
+  .size36,
+  .size40 {
+    --fui-AvatarGroup-stackSpacing: var(--spacingHorizontalXS);
+  }
+  .size48,
+  .size56,
+  .size64,
+  .size72 {
+    --fui-AvatarGroup-stackSpacing: var(--spacingHorizontalS);
+  }
+  .size96,
+  .size120,
+  .size128 {
+    --fui-AvatarGroup-stackSpacing: var(--spacingHorizontalL);
+  }
+
+  .size16 {
+    --fui-AvatarGroup-spreadSpacing: var(--spacingHorizontalS);
+  }
+  .size20,
+  .size24,
+  .size28 {
+    --fui-AvatarGroup-spreadSpacing: var(--spacingHorizontalMNudge);
+  }
+  .size32,
+  .size36,
+  .size40,
+  .size48,
+  .size56 {
+    --fui-AvatarGroup-spreadSpacing: var(--spacingHorizontalL);
+  }
+  .size64,
+  .size72,
+  .size96,
+  .size120,
+  .size128 {
+    --fui-AvatarGroup-spreadSpacing: var(--spacingHorizontalXL);
+  }
+}

package/lib/components/AvatarGroup/AvatarGroup.types.js.map

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

package/lib/components/AvatarGroup/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AvatarGroup/index.ts"],"sourcesContent":["export { AvatarGroup } from './AvatarGroup';\nexport type {\n  AvatarGroupContextValue,\n  AvatarGroupContextValues,\n  AvatarGroupProps,\n  AvatarGroupSlots,\n  AvatarGroupState,\n  AvatarGroupBaseProps,\n  AvatarGroupBaseState,\n} from './AvatarGroup.types';\nexport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nexport { defaultAvatarGroupSize, useAvatarGroup_unstable, useAvatarGroupBase_unstable } from './useAvatarGroup';\nexport { avatarGroupClassNames, useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nexport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\n"],"names":["AvatarGroup","renderAvatarGroup_unstable","defaultAvatarGroupSize","useAvatarGroup_unstable","useAvatarGroupBase_unstable","avatarGroupClassNames","useAvatarGroupStyles_unstable","useAvatarGroupContextValues"],"mappings":"AAAA,SAASA,WAAW,QAAQ,mBAAgB;AAU5C,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,sBAAsB,EAAEC,uBAAuB,EAAEC,2BAA2B,QAAQ,sBAAmB;AAChH,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,mCAAgC;AACrG,SAASC,2BAA2B,QAAQ,mCAAgC"}
+{"version":3,"sources":["../../../src/components/AvatarGroup/index.ts"],"sourcesContent":["export { AvatarGroup } from './AvatarGroup';\nexport type {\n  AvatarGroupContextValue,\n  AvatarGroupContextValues,\n  AvatarGroupProps,\n  AvatarGroupSlots,\n  AvatarGroupState,\n  AvatarGroupBaseProps,\n  AvatarGroupBaseState,\n} from './AvatarGroup.types';\nexport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nexport { defaultAvatarGroupSize, useAvatarGroup_unstable, useAvatarGroupBase_unstable } from './useAvatarGroup';\nexport { avatarGroupClassNames, useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';\nexport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\n"],"names":["AvatarGroup","renderAvatarGroup_unstable","defaultAvatarGroupSize","useAvatarGroup_unstable","useAvatarGroupBase_unstable","avatarGroupClassNames","useAvatarGroupStyles_unstable","useAvatarGroupContextValues"],"mappings":"AAAA,SAASA,WAAW,QAAQ,mBAAgB;AAU5C,SAASC,0BAA0B,QAAQ,yBAAsB;AACjE,SAASC,sBAAsB,EAAEC,uBAAuB,EAAEC,2BAA2B,QAAQ,sBAAmB;AAChH,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,mCAAgC;AACrG,SAASC,2BAA2B,QAAQ,mCAAgC"}

package/lib/components/AvatarGroup/renderAvatarGroup.js

@@ -1,5 +1,5 @@
-  import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from "@fluentui/react-utilities";
+import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
+  import { assertSlots } from "@fluentui/react-utilities";
 import { AvatarGroupProvider } from "../../contexts/AvatarGroupContext.js";
 /**
  * Render the final JSX of AvatarGroup

package/lib/components/AvatarGroup/renderAvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport type { AvatarGroupSlots, AvatarGroupContextValues, AvatarGroupBaseState } from './AvatarGroup.types';\n\n/**\n * Render the final JSX of AvatarGroup\n */\nexport const renderAvatarGroup_unstable = (\n  state: AvatarGroupBaseState,\n  contextValues: AvatarGroupContextValues,\n): JSXElement => {\n  assertSlots<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <state.root />\n    </AvatarGroupProvider>\n  );\n};\n"],"names":["assertSlots","AvatarGroupProvider","renderAvatarGroup_unstable","state","contextValues","value","avatarGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,mBAAmB,QAAQ,uCAAoC;AAGxE;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEAJ,YAA8BG;IAE9B,qBACE,KAACF;QAAoBI,OAAOD,cAAcE,WAAW;kBACnD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
+{"version":3,"sources":["../../../src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\n\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport type { AvatarGroupSlots, AvatarGroupContextValues, AvatarGroupBaseState } from './AvatarGroup.types';\n\n/**\n * Render the final JSX of AvatarGroup\n */\nexport const renderAvatarGroup_unstable = (\n  state: AvatarGroupBaseState,\n  contextValues: AvatarGroupContextValues,\n): JSXElement => {\n  assertSlots<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <state.root />\n    </AvatarGroupProvider>\n  );\n};\n"],"names":["assertSlots","AvatarGroupProvider","renderAvatarGroup_unstable","state","contextValues","value","avatarGroup","root"],"mappings":";AAAA,0BAA0B,GAC1B,iDAAiD,GAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD,SAASC,mBAAmB,QAAQ,uCAAoC;AAGxE;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEAJ,YAA8BG;IAE9B,qBACE,KAACF;QAAoBI,OAAOD,cAAcE,WAAW;kBACnD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}