@fluentui/react-avatar 9.4.3 → 9.4.5

package/.swcrc

@@ -0,0 +1,30 @@
+{
+  "$schema": "https://json.schemastore.org/swcrc",
+  "exclude": [
+    "/testing",
+    "/**/*.cy.ts",
+    "/**/*.cy.tsx",
+    "/**/*.spec.ts",
+    "/**/*.spec.tsx",
+    "/**/*.test.ts",
+    "/**/*.test.tsx"
+  ],
+  "jsc": {
+    "parser": {
+      "syntax": "typescript",
+      "tsx": true,
+      "decorators": false,
+      "dynamicImport": false
+    },
+    "externalHelpers": true,
+    "transform": {
+      "react": {
+        "runtime": "classic",
+        "useSpread": true
+      }
+    },
+    "target": "es2019"
+  },
+  "minify": false,
+  "sourceMaps": true
+}

package/CHANGELOG.json

@@ -2,7 +2,133 @@
   "name": "@fluentui/react-avatar",
   "entries": [
     {
-      "date": "Wed, 15 Mar 2023 10:17:05 GMT",
+      "date": "Tue, 21 Mar 2023 21:18:36 GMT",
+      "tag": "@fluentui/react-avatar_v9.4.5",
+      "version": "9.4.5",
+      "comments": {
+        "patch": [
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui/react-avatar",
+            "commit": "ead1c6d4c2ac3f3596b62b8cbc07b0a03041f11f",
+            "comment": "fix: add node field to package.json exports map."
+          },
+          {
+            "author": "tristan.watanabe@gmail.com",
+            "package": "@fluentui/react-avatar",
+            "commit": "2fac1a139149bd13b76b1306207bc988dca9c72c",
+            "comment": "chore: migrate to swc transpilation approach."
+          },
+          {
+            "author": "makotom@microsoft.com",
+            "package": "@fluentui/react-avatar",
+            "commit": "7fde5c94869ff9841b142b7ff1d0a3df0ab58f74",
+            "comment": "chore: Bumping version of @fluentui/react-icons to ^2.0.196."
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-badge to v9.1.5",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.15",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-popover to v9.5.5",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-shared-contexts to v9.3.2",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-tabster to v9.6.1",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-theme to v9.1.7",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-tooltip to v9.2.5",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-utilities to v9.7.2",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20",
+            "commit": "b7a26f6263c80e3253c6b8338c33b73bae33e2b5"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Thu, 16 Mar 2023 14:36:59 GMT",
+      "tag": "@fluentui/react-avatar_v9.4.4",
+      "version": "9.4.4",
+      "comments": {
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-badge to v9.1.4",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-context-selector to v9.1.14",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-popover to v9.5.4",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-tabster to v9.6.0",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-tooltip to v9.2.4",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-avatar",
+            "comment": "Bump @fluentui/react-utilities to v9.7.1",
+            "commit": "e7dcadf7cabae6bc6811ca04a630e7d850388f81"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Wed, 15 Mar 2023 10:19:53 GMT",
       "tag": "@fluentui/react-avatar_v9.4.3",
       "version": "9.4.3",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,46 @@
 # Change Log - @fluentui/react-avatar
 
-This log was last generated on Wed, 15 Mar 2023 10:17:05 GMT and should not be manually modified.
+This log was last generated on Tue, 21 Mar 2023 21:18:36 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.4.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-avatar_v9.4.5)
+
+Tue, 21 Mar 2023 21:18:36 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-avatar_v9.4.4..@fluentui/react-avatar_v9.4.5)
+
+### Patches
+
+- fix: add node field to package.json exports map. ([PR #27154](https://github.com/microsoft/fluentui/pull/27154) by tristan.watanabe@gmail.com)
+- chore: migrate to swc transpilation approach. ([PR #27250](https://github.com/microsoft/fluentui/pull/27250) by tristan.watanabe@gmail.com)
+- chore: Bumping version of @fluentui/react-icons to ^2.0.196. ([PR #27100](https://github.com/microsoft/fluentui/pull/27100) by makotom@microsoft.com)
+- Bump @fluentui/react-badge to v9.1.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.15 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-popover to v9.5.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.3.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-tabster to v9.6.1 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-theme to v9.1.7 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-tooltip to v9.2.5 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-utilities to v9.7.2 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+- Bump @fluentui/react-conformance-griffel to v9.0.0-beta.20 ([PR #27271](https://github.com/microsoft/fluentui/pull/27271) by beachball)
+
+## [9.4.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-avatar_v9.4.4)
+
+Thu, 16 Mar 2023 14:36:59 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-avatar_v9.4.3..@fluentui/react-avatar_v9.4.4)
+
+### Patches
+
+- Bump @fluentui/react-badge to v9.1.4 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+- Bump @fluentui/react-context-selector to v9.1.14 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+- Bump @fluentui/react-popover to v9.5.4 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+- Bump @fluentui/react-tabster to v9.6.0 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+- Bump @fluentui/react-tooltip to v9.2.4 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+- Bump @fluentui/react-utilities to v9.7.1 ([PR #27229](https://github.com/microsoft/fluentui/pull/27229) by beachball)
+
 ## [9.4.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-avatar_v9.4.3)
 
-Wed, 15 Mar 2023 10:17:05 GMT 
+Wed, 15 Mar 2023 10:19:53 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-avatar_v9.4.2..@fluentui/react-avatar_v9.4.3)
 
 ### Patches

package/lib/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Avatar.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/Avatar.ts"],"names":[],"mappings":"AAAA,cAAc,2BAA2B,CAAC","sourcesContent":["export * from './components/Avatar/index';\n"]}
+{"version":3,"names":[],"sources":["../src/Avatar.ts"],"sourcesContent":["export * from './components/Avatar/index';\n"],"mappings":"AAAA,cAAc"}

package/lib/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/AvatarGroup.ts"],"names":[],"mappings":"AAAA,cAAc,gCAAgC,CAAC","sourcesContent":["export * from './components/AvatarGroup/index';\n"]}
+{"version":3,"names":[],"sources":["../src/AvatarGroup.ts"],"sourcesContent":["export * from './components/AvatarGroup/index';\n"],"mappings":"AAAA,cAAc"}

package/lib/AvatarGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupItem.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/AvatarGroupItem.ts"],"names":[],"mappings":"AAAA,cAAc,oCAAoC,CAAC","sourcesContent":["export * from './components/AvatarGroupItem/index';\n"]}
+{"version":3,"names":[],"sources":["../src/AvatarGroupItem.ts"],"sourcesContent":["export * from './components/AvatarGroupItem/index';\n"],"mappings":"AAAA,cAAc"}

package/lib/AvatarGroupPopover.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroupPopover.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/AvatarGroupPopover.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAC","sourcesContent":["export * from './components/AvatarGroupPopover/index';\n"]}
+{"version":3,"names":[],"sources":["../src/AvatarGroupPopover.ts"],"sourcesContent":["export * from './components/AvatarGroupPopover/index';\n"],"mappings":"AAAA,cAAc"}

package/lib/components/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","renderAvatar_unstable","useAvatar_unstable","useCustomStyleHooks_unstable","useAvatarStyles_unstable","Avatar","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-avatar/src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatar_unstable } from './renderAvatar';\nimport { useAvatar_unstable } from './useAvatar';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarStyles_unstable } from './useAvatarStyles';\nimport type { AvatarProps } from './Avatar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nexport const Avatar: ForwardRefComponent<AvatarProps> = React.forwardRef((props, ref) => {\n  const state = useAvatar_unstable(props, ref);\n\n  useAvatarStyles_unstable(state);\n\n  const { useAvatarStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatar_unstable(state);\n});\n\nAvatar.displayName = 'Avatar';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,4BAA4B,QAAQ,iCAAiC;AAC9E,SAASC,wBAAwB,QAAQ,mBAAmB;AAI5D,OAAO,MAAMC,MAAM,gBAAqCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGP,kBAAkB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE5CJ,wBAAwB,CAACK,KAAK,CAAC;EAE/B,MAAM;IAAEL,wBAAwB,EAAEM;EAAe,CAAE,GAAGP,4BAA4B,EAAE;EACpFO,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,qBAAqB,CAACQ,KAAK,CAAC;AACrC,CAAC,CAAC;AAEFJ,MAAM,CAACM,WAAW,GAAG,QAAQ"}
+{"version":3,"names":["React","renderAvatar_unstable","useAvatar_unstable","useCustomStyleHooks_unstable","useAvatarStyles_unstable","Avatar","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/Avatar/Avatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatar_unstable } from './renderAvatar';\nimport { useAvatar_unstable } from './useAvatar';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarStyles_unstable } from './useAvatarStyles';\nimport type { AvatarProps } from './Avatar.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\nexport const Avatar: ForwardRefComponent<AvatarProps> = React.forwardRef((props, ref) => {\n  const state = useAvatar_unstable(props, ref);\n\n  useAvatarStyles_unstable(state);\n\n  const { useAvatarStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatar_unstable(state);\n});\n\nAvatar.displayName = 'Avatar';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,QAAQ;AACtC,SAASC,kBAAkB,QAAQ;AACnC,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,wBAAwB,QAAQ;AAIzC,OAAO,MAAMC,MAAA,gBAA2CL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACvF,MAAMC,KAAA,GAAQP,kBAAA,CAAmBK,KAAA,EAAOC,GAAA;EAExCJ,wBAAA,CAAyBK,KAAA;EAEzB,MAAM;IAAEL,wBAAA,EAA0BM;EAAe,CAAE,GAAGP,4BAAA;EACtDO,eAAA,CAAgBD,KAAA;EAEhB,OAAOR,qBAAA,CAAsBQ,KAAA;AAC/B;AAEAJ,MAAA,CAAOM,WAAW,GAAG"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/components/Avatar/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,mBAAmB,CAAC","sourcesContent":["export * from './Avatar.types';\nexport * from './Avatar';\nexport * from './renderAvatar';\nexport * from './useAvatar';\nexport * from './useAvatarStyles';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/Avatar/index.ts"],"sourcesContent":["export * from './Avatar.types';\nexport * from './Avatar';\nexport * from './renderAvatar';\nexport * from './useAvatar';\nexport * from './useAvatarStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/Avatar/renderAvatar.js

@@ -5,16 +5,6 @@ export const renderAvatar_unstable = state => {
     slots,
     slotProps
   } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }, slots.initials && /*#__PURE__*/React.createElement(slots.initials, {
-    ...slotProps.initials
-  }), slots.icon && /*#__PURE__*/React.createElement(slots.icon, {
-    ...slotProps.icon
-  }), slots.image && /*#__PURE__*/React.createElement(slots.image, {
-    ...slotProps.image
-  }), slots.badge && /*#__PURE__*/React.createElement(slots.badge, {
-    ...slotProps.badge
-  }), state.activeAriaLabelElement);
+  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, slots.initials && /*#__PURE__*/React.createElement(slots.initials, slotProps.initials), slots.icon && /*#__PURE__*/React.createElement(slots.icon, slotProps.icon), slots.image && /*#__PURE__*/React.createElement(slots.image, slotProps.image), slots.badge && /*#__PURE__*/React.createElement(slots.badge, slotProps.badge), state.activeAriaLabelElement);
 };
 //# sourceMappingURL=renderAvatar.js.map

package/lib/components/Avatar/renderAvatar.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderAvatar_unstable","state","slots","slotProps","createElement","root","initials","icon","image","badge","activeAriaLabelElement"],"sources":["../src/packages/react-components/react-avatar/src/components/Avatar/renderAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const renderAvatar_unstable = (state: AvatarState) => {\n  const { slots, slotProps } = getSlots<AvatarSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.initials && <slots.initials {...slotProps.initials} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.image && <slots.image {...slotProps.image} />}\n      {slots.badge && <slots.badge {...slotProps.badge} />}\n      {state.activeAriaLabelElement}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AAGpD,OAAO,MAAMC,qBAAqB,GAAIC,KAAkB,IAAI;EAC1D,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGJ,QAAQ,CAAcE,KAAK,CAAC;EAEzD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACG,IAAI;IAAA,GAAKF,SAAS,CAACE;EAAI,GAC3BH,KAAK,CAACI,QAAQ,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACI,QAAQ;IAAA,GAAKH,SAAS,CAACG;EAAQ,EAAI,EAC5DJ,KAAK,CAACK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,EAChDL,KAAK,CAACM,KAAK,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACM,KAAK;IAAA,GAAKL,SAAS,CAACK;EAAK,EAAI,EACnDN,KAAK,CAACO,KAAK,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAK,CAACO,KAAK;IAAA,GAAKN,SAAS,CAACM;EAAK,EAAI,EACnDR,KAAK,CAACS,sBAAsB,CAClB;AAEjB,CAAC"}
+{"version":3,"names":["React","getSlots","renderAvatar_unstable","state","slots","slotProps","createElement","root","initials","icon","image","badge","activeAriaLabelElement"],"sources":["../../../src/components/Avatar/renderAvatar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\n\nexport const renderAvatar_unstable = (state: AvatarState) => {\n  const { slots, slotProps } = getSlots<AvatarSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.initials && <slots.initials {...slotProps.initials} />}\n      {slots.icon && <slots.icon {...slotProps.icon} />}\n      {slots.image && <slots.image {...slotProps.image} />}\n      {slots.badge && <slots.badge {...slotProps.badge} />}\n      {state.activeAriaLabelElement}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB,OAAO,MAAMC,qBAAA,GAAyBC,KAAA,IAAuB;EAC3D,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAAsBE,KAAA;EAEnD,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,EAC3BH,KAAA,CAAMI,QAAQ,iBAAIR,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,QAAQ,EAAKH,SAAA,CAAUG,QAAQ,GACxDJ,KAAA,CAAMK,IAAI,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI,GAC5CL,KAAA,CAAMM,KAAK,iBAAIV,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,KAAK,EAAKL,SAAA,CAAUK,KAAK,GAC/CN,KAAA,CAAMO,KAAK,iBAAIX,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMO,KAAK,EAAKN,SAAA,CAAUM,KAAK,GAC/CR,KAAA,CAAMS,sBAAsB;AAGnC"}

package/lib/components/Avatar/useAvatar.js

@@ -10,7 +10,6 @@ export const DEFAULT_STRINGS = {
   inactive: 'inactive'
 };
 export const useAvatar_unstable = (props, ref) => {
-  var _a;
   const {
     dir
   } = useFluent();
@@ -30,7 +29,8 @@ export const useAvatar_unstable = (props, ref) => {
   } = props;
   // Resolve 'colorful' to a specific color name
   if (color === 'colorful') {
-    color = avatarColors[getHashCode((_a = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _a !== void 0 ? _a : '') % avatarColors.length];
+    var _ref;
+    color = avatarColors[getHashCode((_ref = idForColor !== null && idForColor !== void 0 ? idForColor : name) !== null && _ref !== void 0 ? _ref : '') % avatarColors.length];
   }
   const baseId = useId('avatar-');
   const root = getNativeElementProps('span', {

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

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

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

@@ -1 +1 @@
-{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","avatarClassNames","root","image","initials","icon","badge","animations","fastOutSlowInMax","curveDecelerateMax","fastOutSlowInMid","curveDecelerateMid","fastOutSlowInMin","curveDecelerateMin","slowOutFastInMax","curveAccelerateMax","slowOutFastInMid","curveAccelerateMid","slowOutFastInMin","curveAccelerateMin","fastEase","curveEasyEaseMax","normalEase","curveEasyEase","nullEasing","curveLinear","useRootClassName","useImageClassName","useIconInitialsClassName","useStyles","textCaption2Strong","Be2twd7","textCaption1Strong","textSubtitle2","textSubtitle1","textTitle3","squareSmall","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","squareMedium","squareLarge","squareXLarge","activeOrInactive","Bz10aip","Bmy1vo4","B3o57yi","Cwk7ip","Hwfdqs","Ftih45","Brfgrao","Bciustq","Fbdkly","lawp4y","mdwyqc","Budzafs","r59vdv","n07z76","ck0cow","B8bqphf","h7gv66","Bvy8d8o","B1pumaf","B17wnbm","ring","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","ringThick","qehafq","Bicfajf","susq4k","Biibvgv","B0qfbqy","B4f6apu","y0oebl","uvfttm","ringThicker","ringThickest","shadow4","h8m2vh","shadow8","shadow16","shadow28","inactive","abs64n","Bwz0kr7","vz82u","qhf8xq","B5kzvoi","j35jbq","E5pizo","badgeLarge","icon12","icon16","icon20","icon24","icon28","icon32","icon48","d","m","useSizeStyles","a9b677","Bqenvij","useColorStyles","neutral","sj55zd","De3pzq","Bic5iru","brand","cranberry","red","pumpkin","peach","marigold","gold","brass","brown","forest","seafoam","teal","steel","blue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","color","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","rootClasses","push","className","iconSizeClass"],"sources":["../src/packages/react-components/react-avatar/src/components/Avatar/useAvatarStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\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 animations = {\n  fastOutSlowInMax: tokens.curveDecelerateMax,\n  fastOutSlowInMid: tokens.curveDecelerateMid,\n  fastOutSlowInMin: tokens.curveDecelerateMin,\n  slowOutFastInMax: tokens.curveAccelerateMax,\n  slowOutFastInMid: tokens.curveAccelerateMid,\n  slowOutFastInMin: tokens.curveAccelerateMin,\n  fastEase: tokens.curveEasyEaseMax,\n  normalEase: tokens.curveEasyEase,\n  nullEasing: tokens.curveLinear,\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\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\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: {\n    ...shorthands.borderRadius(tokens.borderRadiusSmall),\n  },\n  squareMedium: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n  },\n  squareLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusLarge),\n  },\n  squareXLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n  },\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    transitionDelay: `${animations.fastEase}, ${animations.nullEasing}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n\n    '::before': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      bottom: 0,\n      right: 0,\n\n      ...shorthands.borderRadius('inherit'),\n      transitionProperty: 'margin, opacity',\n      transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n      transitionDelay: `${animations.fastEase}, ${animations.nullEasing}`,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n        transitionDelay: '0.01ms',\n      },\n    },\n  },\n\n  ring: {\n    '::before': {\n      ...shorthands.borderStyle('solid'),\n    },\n  },\n  ringThick: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThick})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThick),\n    },\n  },\n  ringThicker: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThicker})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThicker),\n    },\n  },\n  ringThickest: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThickest})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThickest),\n    },\n  },\n\n  shadow4: { '::before': { boxShadow: tokens.shadow4 } },\n  shadow8: { '::before': { boxShadow: tokens.shadow8 } },\n  shadow16: { '::before': { boxShadow: tokens.shadow16 } },\n  shadow28: { '::before': { boxShadow: tokens.shadow28 } },\n\n  inactive: {\n    opacity: '0.8',\n    transform: 'scale(0.875)',\n\n    transitionProperty: 'transform, opacity',\n    transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n    transitionDelay: `${animations.fastOutSlowInMin}, ${animations.nullEasing}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n\n    '::before': {\n      ...shorthands.margin(0),\n      opacity: 0,\n\n      transitionProperty: 'margin, opacity',\n      transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n      transitionDelay: `${animations.fastOutSlowInMin}, ${animations.nullEasing}`,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n        transitionDelay: '0.01ms',\n      },\n    },\n  },\n\n  badge: {\n    position: 'absolute',\n    bottom: 0,\n    right: 0,\n    boxShadow: `0 0 0 ${tokens.strokeWidthThin} ${tokens.colorNeutralBackground1}`,\n  },\n\n  badgeLarge: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralBackground1}`,\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    // The ::before element is the ring when active\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  brand: {\n    color: tokens.colorNeutralForegroundStaticInverted,\n    backgroundColor: tokens.colorBrandBackgroundStatic,\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  'dark-red': {\n    color: tokens.colorPaletteDarkRedForeground2,\n    backgroundColor: tokens.colorPaletteDarkRedBackground2,\n    '::before': { color: tokens.colorPaletteDarkRedBorderActive },\n  },\n  cranberry: {\n    color: tokens.colorPaletteCranberryForeground2,\n    backgroundColor: tokens.colorPaletteCranberryBackground2,\n    '::before': { color: tokens.colorPaletteCranberryBorderActive },\n  },\n  red: {\n    color: tokens.colorPaletteRedForeground2,\n    backgroundColor: tokens.colorPaletteRedBackground2,\n    '::before': { color: tokens.colorPaletteRedBorderActive },\n  },\n  pumpkin: {\n    color: tokens.colorPalettePumpkinForeground2,\n    backgroundColor: tokens.colorPalettePumpkinBackground2,\n    '::before': { color: tokens.colorPalettePumpkinBorderActive },\n  },\n  peach: {\n    color: tokens.colorPalettePeachForeground2,\n    backgroundColor: tokens.colorPalettePeachBackground2,\n    '::before': { color: tokens.colorPalettePeachBorderActive },\n  },\n  marigold: {\n    color: tokens.colorPaletteMarigoldForeground2,\n    backgroundColor: tokens.colorPaletteMarigoldBackground2,\n    '::before': { color: tokens.colorPaletteMarigoldBorderActive },\n  },\n  gold: {\n    color: tokens.colorPaletteGoldForeground2,\n    backgroundColor: tokens.colorPaletteGoldBackground2,\n    '::before': { color: tokens.colorPaletteGoldBorderActive },\n  },\n  brass: {\n    color: tokens.colorPaletteBrassForeground2,\n    backgroundColor: tokens.colorPaletteBrassBackground2,\n    '::before': { color: tokens.colorPaletteBrassBorderActive },\n  },\n  brown: {\n    color: tokens.colorPaletteBrownForeground2,\n    backgroundColor: tokens.colorPaletteBrownBackground2,\n    '::before': { color: tokens.colorPaletteBrownBorderActive },\n  },\n  forest: {\n    color: tokens.colorPaletteForestForeground2,\n    backgroundColor: tokens.colorPaletteForestBackground2,\n    '::before': { color: tokens.colorPaletteForestBorderActive },\n  },\n  seafoam: {\n    color: tokens.colorPaletteSeafoamForeground2,\n    backgroundColor: tokens.colorPaletteSeafoamBackground2,\n    '::before': { color: tokens.colorPaletteSeafoamBorderActive },\n  },\n  'dark-green': {\n    color: tokens.colorPaletteDarkGreenForeground2,\n    backgroundColor: tokens.colorPaletteDarkGreenBackground2,\n    '::before': { color: tokens.colorPaletteDarkGreenBorderActive },\n  },\n  'light-teal': {\n    color: tokens.colorPaletteLightTealForeground2,\n    backgroundColor: tokens.colorPaletteLightTealBackground2,\n    '::before': { color: tokens.colorPaletteLightTealBorderActive },\n  },\n  teal: {\n    color: tokens.colorPaletteTealForeground2,\n    backgroundColor: tokens.colorPaletteTealBackground2,\n    '::before': { color: tokens.colorPaletteTealBorderActive },\n  },\n  steel: {\n    color: tokens.colorPaletteSteelForeground2,\n    backgroundColor: tokens.colorPaletteSteelBackground2,\n    '::before': { color: tokens.colorPaletteSteelBorderActive },\n  },\n  blue: {\n    color: tokens.colorPaletteBlueForeground2,\n    backgroundColor: tokens.colorPaletteBlueBackground2,\n    '::before': { color: tokens.colorPaletteBlueBorderActive },\n  },\n  'royal-blue': {\n    color: tokens.colorPaletteRoyalBlueForeground2,\n    backgroundColor: tokens.colorPaletteRoyalBlueBackground2,\n    '::before': { color: tokens.colorPaletteRoyalBlueBorderActive },\n  },\n  cornflower: {\n    color: tokens.colorPaletteCornflowerForeground2,\n    backgroundColor: tokens.colorPaletteCornflowerBackground2,\n    '::before': { color: tokens.colorPaletteCornflowerBorderActive },\n  },\n  navy: {\n    color: tokens.colorPaletteNavyForeground2,\n    backgroundColor: tokens.colorPaletteNavyBackground2,\n    '::before': { color: tokens.colorPaletteNavyBorderActive },\n  },\n  lavender: {\n    color: tokens.colorPaletteLavenderForeground2,\n    backgroundColor: tokens.colorPaletteLavenderBackground2,\n    '::before': { color: tokens.colorPaletteLavenderBorderActive },\n  },\n  purple: {\n    color: tokens.colorPalettePurpleForeground2,\n    backgroundColor: tokens.colorPalettePurpleBackground2,\n    '::before': { color: tokens.colorPalettePurpleBorderActive },\n  },\n  grape: {\n    color: tokens.colorPaletteGrapeForeground2,\n    backgroundColor: tokens.colorPaletteGrapeBackground2,\n    '::before': { color: tokens.colorPaletteGrapeBorderActive },\n  },\n  lilac: {\n    color: tokens.colorPaletteLilacForeground2,\n    backgroundColor: tokens.colorPaletteLilacBackground2,\n    '::before': { color: tokens.colorPaletteLilacBorderActive },\n  },\n  pink: {\n    color: tokens.colorPalettePinkForeground2,\n    backgroundColor: tokens.colorPalettePinkBackground2,\n    '::before': { color: tokens.colorPalettePinkBorderActive },\n  },\n  magenta: {\n    color: tokens.colorPaletteMagentaForeground2,\n    backgroundColor: tokens.colorPaletteMagentaBackground2,\n    '::before': { color: tokens.colorPaletteMagentaBorderActive },\n  },\n  plum: {\n    color: tokens.colorPalettePlumForeground2,\n    backgroundColor: tokens.colorPalettePlumBackground2,\n    '::before': { color: tokens.colorPalettePlumBorderActive },\n  },\n  beige: {\n    color: tokens.colorPaletteBeigeForeground2,\n    backgroundColor: tokens.colorPaletteBeigeBackground2,\n    '::before': { color: tokens.colorPaletteBeigeBorderActive },\n  },\n  mink: {\n    color: tokens.colorPaletteMinkForeground2,\n    backgroundColor: tokens.colorPaletteMinkBackground2,\n    '::before': { color: tokens.colorPaletteMinkBorderActive },\n  },\n  platinum: {\n    color: tokens.colorPalettePlatinumForeground2,\n    backgroundColor: tokens.colorPalettePlatinumBackground2,\n    '::before': { color: tokens.colorPalettePlatinumBorderActive },\n  },\n  anchor: {\n    color: tokens.colorPaletteAnchorForeground2,\n    backgroundColor: tokens.colorPaletteAnchorBackground2,\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\n  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size], colorStyles[color]];\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);\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      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  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n\n  if (state.badge) {\n    state.badge.className = mergeClasses(\n      avatarClassNames.badge,\n      styles.badge,\n      size >= 64 && styles.badgeLarge,\n      state.badge.className,\n    );\n  }\n\n  if (state.image) {\n    state.image.className = mergeClasses(avatarClassNames.image, imageClassName, state.image.className);\n  }\n\n  if (state.initials) {\n    state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, state.initials.className);\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    state.icon.className = mergeClasses(\n      avatarClassNames.icon,\n      iconInitialsClassName,\n      iconSizeClass,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["__resetStyles","__styles","mergeClasses","shorthands","tokens","avatarClassNames","root","image","initials","icon","badge","animations","fastOutSlowInMax","curveDecelerateMax","fastOutSlowInMid","curveDecelerateMid","fastOutSlowInMin","curveDecelerateMin","slowOutFastInMax","curveAccelerateMax","slowOutFastInMid","curveAccelerateMid","slowOutFastInMin","curveAccelerateMin","fastEase","curveEasyEaseMax","normalEase","curveEasyEase","nullEasing","curveLinear","useRootClassName","useImageClassName","useIconInitialsClassName","useStyles","textCaption2Strong","Be2twd7","textCaption1Strong","textSubtitle2","textSubtitle1","textTitle3","squareSmall","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","squareMedium","squareLarge","squareXLarge","activeOrInactive","Bz10aip","Bmy1vo4","B3o57yi","Cwk7ip","Hwfdqs","Ftih45","Brfgrao","Bciustq","Fbdkly","lawp4y","mdwyqc","Budzafs","r59vdv","n07z76","ck0cow","B8bqphf","h7gv66","Bvy8d8o","B1pumaf","B17wnbm","ring","Bdkvgpv","m598lv","qa3bma","Bbv0w2i","ringThick","qehafq","Bicfajf","susq4k","Biibvgv","B0qfbqy","B4f6apu","y0oebl","uvfttm","ringThicker","ringThickest","shadow4","h8m2vh","shadow8","shadow16","shadow28","inactive","abs64n","Bwz0kr7","vz82u","qhf8xq","B5kzvoi","j35jbq","E5pizo","badgeLarge","icon12","icon16","icon20","icon24","icon28","icon32","icon48","d","m","useSizeStyles","a9b677","Bqenvij","useColorStyles","neutral","sj55zd","De3pzq","Bic5iru","brand","cranberry","red","pumpkin","peach","marigold","gold","brass","brown","forest","seafoam","teal","steel","blue","cornflower","navy","lavender","purple","grape","lilac","pink","magenta","plum","beige","mink","platinum","anchor","useAvatarStyles_unstable","state","size","shape","active","activeAppearance","color","rootClassName","imageClassName","iconInitialsClassName","styles","sizeStyles","colorStyles","rootClasses","push","className","iconSizeClass"],"sources":["../../../src/components/Avatar/useAvatarStyles.ts"],"sourcesContent":["import { makeResetStyles, makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { AvatarSlots, AvatarState } from './Avatar.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\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 animations = {\n  fastOutSlowInMax: tokens.curveDecelerateMax,\n  fastOutSlowInMid: tokens.curveDecelerateMid,\n  fastOutSlowInMin: tokens.curveDecelerateMin,\n  slowOutFastInMax: tokens.curveAccelerateMax,\n  slowOutFastInMid: tokens.curveAccelerateMid,\n  slowOutFastInMin: tokens.curveAccelerateMin,\n  fastEase: tokens.curveEasyEaseMax,\n  normalEase: tokens.curveEasyEase,\n  nullEasing: tokens.curveLinear,\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\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\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: {\n    ...shorthands.borderRadius(tokens.borderRadiusSmall),\n  },\n  squareMedium: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n  },\n  squareLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusLarge),\n  },\n  squareXLarge: {\n    ...shorthands.borderRadius(tokens.borderRadiusXLarge),\n  },\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    transitionDelay: `${animations.fastEase}, ${animations.nullEasing}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n    },\n\n    '::before': {\n      content: '\"\"',\n      position: 'absolute',\n      top: 0,\n      left: 0,\n      bottom: 0,\n      right: 0,\n\n      ...shorthands.borderRadius('inherit'),\n      transitionProperty: 'margin, opacity',\n      transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n      transitionDelay: `${animations.fastEase}, ${animations.nullEasing}`,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n        transitionDelay: '0.01ms',\n      },\n    },\n  },\n\n  ring: {\n    '::before': {\n      ...shorthands.borderStyle('solid'),\n    },\n  },\n  ringThick: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThick})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThick),\n    },\n  },\n  ringThicker: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThicker})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThicker),\n    },\n  },\n  ringThickest: {\n    '::before': {\n      ...shorthands.margin(`calc(-2 * ${tokens.strokeWidthThickest})`),\n      ...shorthands.borderWidth(tokens.strokeWidthThickest),\n    },\n  },\n\n  shadow4: { '::before': { boxShadow: tokens.shadow4 } },\n  shadow8: { '::before': { boxShadow: tokens.shadow8 } },\n  shadow16: { '::before': { boxShadow: tokens.shadow16 } },\n  shadow28: { '::before': { boxShadow: tokens.shadow28 } },\n\n  inactive: {\n    opacity: '0.8',\n    transform: 'scale(0.875)',\n\n    transitionProperty: 'transform, opacity',\n    transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationFaster}`,\n    transitionDelay: `${animations.fastOutSlowInMin}, ${animations.nullEasing}`,\n\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      transitionDuration: '0.01ms',\n      transitionDelay: '0.01ms',\n    },\n\n    '::before': {\n      ...shorthands.margin(0),\n      opacity: 0,\n\n      transitionProperty: 'margin, opacity',\n      transitionDuration: `${tokens.durationUltraSlow}, ${tokens.durationSlower}`,\n      transitionDelay: `${animations.fastOutSlowInMin}, ${animations.nullEasing}`,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        transitionDuration: '0.01ms',\n        transitionDelay: '0.01ms',\n      },\n    },\n  },\n\n  badge: {\n    position: 'absolute',\n    bottom: 0,\n    right: 0,\n    boxShadow: `0 0 0 ${tokens.strokeWidthThin} ${tokens.colorNeutralBackground1}`,\n  },\n\n  badgeLarge: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralBackground1}`,\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    // The ::before element is the ring when active\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  brand: {\n    color: tokens.colorNeutralForegroundStaticInverted,\n    backgroundColor: tokens.colorBrandBackgroundStatic,\n    '::before': { color: tokens.colorBrandStroke1 },\n  },\n  'dark-red': {\n    color: tokens.colorPaletteDarkRedForeground2,\n    backgroundColor: tokens.colorPaletteDarkRedBackground2,\n    '::before': { color: tokens.colorPaletteDarkRedBorderActive },\n  },\n  cranberry: {\n    color: tokens.colorPaletteCranberryForeground2,\n    backgroundColor: tokens.colorPaletteCranberryBackground2,\n    '::before': { color: tokens.colorPaletteCranberryBorderActive },\n  },\n  red: {\n    color: tokens.colorPaletteRedForeground2,\n    backgroundColor: tokens.colorPaletteRedBackground2,\n    '::before': { color: tokens.colorPaletteRedBorderActive },\n  },\n  pumpkin: {\n    color: tokens.colorPalettePumpkinForeground2,\n    backgroundColor: tokens.colorPalettePumpkinBackground2,\n    '::before': { color: tokens.colorPalettePumpkinBorderActive },\n  },\n  peach: {\n    color: tokens.colorPalettePeachForeground2,\n    backgroundColor: tokens.colorPalettePeachBackground2,\n    '::before': { color: tokens.colorPalettePeachBorderActive },\n  },\n  marigold: {\n    color: tokens.colorPaletteMarigoldForeground2,\n    backgroundColor: tokens.colorPaletteMarigoldBackground2,\n    '::before': { color: tokens.colorPaletteMarigoldBorderActive },\n  },\n  gold: {\n    color: tokens.colorPaletteGoldForeground2,\n    backgroundColor: tokens.colorPaletteGoldBackground2,\n    '::before': { color: tokens.colorPaletteGoldBorderActive },\n  },\n  brass: {\n    color: tokens.colorPaletteBrassForeground2,\n    backgroundColor: tokens.colorPaletteBrassBackground2,\n    '::before': { color: tokens.colorPaletteBrassBorderActive },\n  },\n  brown: {\n    color: tokens.colorPaletteBrownForeground2,\n    backgroundColor: tokens.colorPaletteBrownBackground2,\n    '::before': { color: tokens.colorPaletteBrownBorderActive },\n  },\n  forest: {\n    color: tokens.colorPaletteForestForeground2,\n    backgroundColor: tokens.colorPaletteForestBackground2,\n    '::before': { color: tokens.colorPaletteForestBorderActive },\n  },\n  seafoam: {\n    color: tokens.colorPaletteSeafoamForeground2,\n    backgroundColor: tokens.colorPaletteSeafoamBackground2,\n    '::before': { color: tokens.colorPaletteSeafoamBorderActive },\n  },\n  'dark-green': {\n    color: tokens.colorPaletteDarkGreenForeground2,\n    backgroundColor: tokens.colorPaletteDarkGreenBackground2,\n    '::before': { color: tokens.colorPaletteDarkGreenBorderActive },\n  },\n  'light-teal': {\n    color: tokens.colorPaletteLightTealForeground2,\n    backgroundColor: tokens.colorPaletteLightTealBackground2,\n    '::before': { color: tokens.colorPaletteLightTealBorderActive },\n  },\n  teal: {\n    color: tokens.colorPaletteTealForeground2,\n    backgroundColor: tokens.colorPaletteTealBackground2,\n    '::before': { color: tokens.colorPaletteTealBorderActive },\n  },\n  steel: {\n    color: tokens.colorPaletteSteelForeground2,\n    backgroundColor: tokens.colorPaletteSteelBackground2,\n    '::before': { color: tokens.colorPaletteSteelBorderActive },\n  },\n  blue: {\n    color: tokens.colorPaletteBlueForeground2,\n    backgroundColor: tokens.colorPaletteBlueBackground2,\n    '::before': { color: tokens.colorPaletteBlueBorderActive },\n  },\n  'royal-blue': {\n    color: tokens.colorPaletteRoyalBlueForeground2,\n    backgroundColor: tokens.colorPaletteRoyalBlueBackground2,\n    '::before': { color: tokens.colorPaletteRoyalBlueBorderActive },\n  },\n  cornflower: {\n    color: tokens.colorPaletteCornflowerForeground2,\n    backgroundColor: tokens.colorPaletteCornflowerBackground2,\n    '::before': { color: tokens.colorPaletteCornflowerBorderActive },\n  },\n  navy: {\n    color: tokens.colorPaletteNavyForeground2,\n    backgroundColor: tokens.colorPaletteNavyBackground2,\n    '::before': { color: tokens.colorPaletteNavyBorderActive },\n  },\n  lavender: {\n    color: tokens.colorPaletteLavenderForeground2,\n    backgroundColor: tokens.colorPaletteLavenderBackground2,\n    '::before': { color: tokens.colorPaletteLavenderBorderActive },\n  },\n  purple: {\n    color: tokens.colorPalettePurpleForeground2,\n    backgroundColor: tokens.colorPalettePurpleBackground2,\n    '::before': { color: tokens.colorPalettePurpleBorderActive },\n  },\n  grape: {\n    color: tokens.colorPaletteGrapeForeground2,\n    backgroundColor: tokens.colorPaletteGrapeBackground2,\n    '::before': { color: tokens.colorPaletteGrapeBorderActive },\n  },\n  lilac: {\n    color: tokens.colorPaletteLilacForeground2,\n    backgroundColor: tokens.colorPaletteLilacBackground2,\n    '::before': { color: tokens.colorPaletteLilacBorderActive },\n  },\n  pink: {\n    color: tokens.colorPalettePinkForeground2,\n    backgroundColor: tokens.colorPalettePinkBackground2,\n    '::before': { color: tokens.colorPalettePinkBorderActive },\n  },\n  magenta: {\n    color: tokens.colorPaletteMagentaForeground2,\n    backgroundColor: tokens.colorPaletteMagentaBackground2,\n    '::before': { color: tokens.colorPaletteMagentaBorderActive },\n  },\n  plum: {\n    color: tokens.colorPalettePlumForeground2,\n    backgroundColor: tokens.colorPalettePlumBackground2,\n    '::before': { color: tokens.colorPalettePlumBorderActive },\n  },\n  beige: {\n    color: tokens.colorPaletteBeigeForeground2,\n    backgroundColor: tokens.colorPaletteBeigeBackground2,\n    '::before': { color: tokens.colorPaletteBeigeBorderActive },\n  },\n  mink: {\n    color: tokens.colorPaletteMinkForeground2,\n    backgroundColor: tokens.colorPaletteMinkBackground2,\n    '::before': { color: tokens.colorPaletteMinkBorderActive },\n  },\n  platinum: {\n    color: tokens.colorPalettePlatinumForeground2,\n    backgroundColor: tokens.colorPalettePlatinumBackground2,\n    '::before': { color: tokens.colorPalettePlatinumBorderActive },\n  },\n  anchor: {\n    color: tokens.colorPaletteAnchorForeground2,\n    backgroundColor: tokens.colorPaletteAnchorBackground2,\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\n  const rootClasses = [rootClassName, size !== 32 && sizeStyles[size], colorStyles[color]];\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);\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      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  state.root.className = mergeClasses(avatarClassNames.root, ...rootClasses, state.root.className);\n\n  if (state.badge) {\n    state.badge.className = mergeClasses(\n      avatarClassNames.badge,\n      styles.badge,\n      size >= 64 && styles.badgeLarge,\n      state.badge.className,\n    );\n  }\n\n  if (state.image) {\n    state.image.className = mergeClasses(avatarClassNames.image, imageClassName, state.image.className);\n  }\n\n  if (state.initials) {\n    state.initials.className = mergeClasses(avatarClassNames.initials, iconInitialsClassName, state.initials.className);\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    state.icon.className = mergeClasses(\n      avatarClassNames.icon,\n      iconInitialsClassName,\n      iconSizeClass,\n      state.icon.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}

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

@@ -1 +1 @@
-{"version":3,"names":["React","renderAvatarGroup_unstable","useAvatarGroup_unstable","useAvatarGroupContextValues","useCustomStyleHooks_unstable","useAvatarGroupStyles_unstable","AvatarGroup","forwardRef","props","ref","state","contextValues","useCustomStyles","displayName"],"sources":["../src/packages/react-components/react-avatar/src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nimport { useAvatarGroup_unstable } from './useAvatarGroup';\nimport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles';\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  const { useAvatarGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatarGroup_unstable(state, contextValues);\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,2BAA2B,QAAQ,+BAA+B;AAC3E,SAASC,4BAA4B,QAAQ,iCAAiC;AAC9E,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGR,uBAAuB,CAACM,KAAK,EAAEC,GAAG,CAAC;EACjD,MAAME,aAAa,GAAGR,2BAA2B,CAACO,KAAK,CAAC;EAExDL,6BAA6B,CAACK,KAAK,CAAC;EAEpC,MAAM;IAAEL,6BAA6B,EAAEO;EAAe,CAAE,GAAGR,4BAA4B,EAAE;EACzFQ,eAAe,CAACF,KAAK,CAAC;EAEtB,OAAOT,0BAA0B,CAACS,KAAK,EAAEC,aAAa,CAAC;AACzD,CAAC,CAAC;AAEFL,WAAW,CAACO,WAAW,GAAG,aAAa"}
+{"version":3,"names":["React","renderAvatarGroup_unstable","useAvatarGroup_unstable","useAvatarGroupContextValues","useCustomStyleHooks_unstable","useAvatarGroupStyles_unstable","AvatarGroup","forwardRef","props","ref","state","contextValues","useCustomStyles","displayName"],"sources":["../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroup_unstable } from './renderAvatarGroup';\nimport { useAvatarGroup_unstable } from './useAvatarGroup';\nimport { useAvatarGroupContextValues } from './useAvatarGroupContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles';\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  const { useAvatarGroupStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatarGroup_unstable(state, contextValues);\n});\n\nAvatarGroup.displayName = 'AvatarGroup';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,0BAA0B,QAAQ;AAC3C,SAASC,uBAAuB,QAAQ;AACxC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,6BAA6B,QAAQ;AAI9C;;;;AAIA,OAAO,MAAMC,WAAA,gBAAqDN,KAAA,CAAMO,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACjG,MAAMC,KAAA,GAAQR,uBAAA,CAAwBM,KAAA,EAAOC,GAAA;EAC7C,MAAME,aAAA,GAAgBR,2BAAA,CAA4BO,KAAA;EAElDL,6BAAA,CAA8BK,KAAA;EAE9B,MAAM;IAAEL,6BAAA,EAA+BO;EAAe,CAAE,GAAGR,4BAAA;EAC3DQ,eAAA,CAAgBF,KAAA;EAEhB,OAAOT,0BAAA,CAA2BS,KAAA,EAAOC,aAAA;AAC3C;AAEAL,WAAA,CAAYO,WAAW,GAAG"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-avatar/src/components/AvatarGroup/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,qBAAqB,CAAC;AACpC,cAAc,qBAAqB,CAAC;AACpC,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,+BAA+B,CAAC","sourcesContent":["export * from './AvatarGroup';\nexport * from './AvatarGroup.types';\nexport * from './renderAvatarGroup';\nexport * from './useAvatarGroup';\nexport * from './useAvatarGroupStyles';\nexport * from './useAvatarGroupContextValues';\n"]}
+{"version":3,"names":[],"sources":["../../../src/components/AvatarGroup/index.ts"],"sourcesContent":["export * from './AvatarGroup';\nexport * from './AvatarGroup.types';\nexport * from './renderAvatarGroup';\nexport * from './useAvatarGroup';\nexport * from './useAvatarGroupStyles';\nexport * from './useAvatarGroupContextValues';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/AvatarGroup/renderAvatarGroup.js

@@ -11,8 +11,6 @@ export const renderAvatarGroup_unstable = (state, contextValues) => {
   } = getSlots(state);
   return /*#__PURE__*/React.createElement(AvatarGroupProvider, {
     value: contextValues.avatarGroup
-  }, /*#__PURE__*/React.createElement(slots.root, {
-    ...slotProps.root
-  }));
+  }, /*#__PURE__*/React.createElement(slots.root, slotProps.root));
 };
 //# sourceMappingURL=renderAvatarGroup.js.map

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

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","AvatarGroupProvider","renderAvatarGroup_unstable","state","contextValues","slots","slotProps","createElement","value","avatarGroup","root"],"sources":["../src/packages/react-components/react-avatar/src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport type { AvatarGroupState, AvatarGroupSlots, AvatarGroupContextValues } from './AvatarGroup.types';\n\n/**\n * Render the final JSX of AvatarGroup\n */\nexport const renderAvatarGroup_unstable = (state: AvatarGroupState, contextValues: AvatarGroupContextValues) => {\n  const { slots, slotProps } = getSlots<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <slots.root {...slotProps.root} />\n    </AvatarGroupProvider>\n  );\n};\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,QAAQ,QAAQ,2BAA2B;AACpD,SAASC,mBAAmB,QAAQ,mCAAmC;AAGvE;;;AAGA,OAAO,MAAMC,0BAA0B,GAAGA,CAACC,KAAuB,EAAEC,aAAuC,KAAI;EAC7G,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAE,GAAGN,QAAQ,CAAmBG,KAAK,CAAC;EAE9D,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,mBAAmB;IAACO,KAAK,EAAEJ,aAAa,CAACK;EAAW,gBACnDV,KAAA,CAAAQ,aAAA,CAACF,KAAK,CAACK,IAAI;IAAA,GAAKJ,SAAS,CAACI;EAAI,EAAI,CACd;AAE1B,CAAC"}
+{"version":3,"names":["React","getSlots","AvatarGroupProvider","renderAvatarGroup_unstable","state","contextValues","slots","slotProps","createElement","value","avatarGroup","root"],"sources":["../../../src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport type { AvatarGroupState, AvatarGroupSlots, AvatarGroupContextValues } from './AvatarGroup.types';\n\n/**\n * Render the final JSX of AvatarGroup\n */\nexport const renderAvatarGroup_unstable = (state: AvatarGroupState, contextValues: AvatarGroupContextValues) => {\n  const { slots, slotProps } = getSlots<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <slots.root {...slotProps.root} />\n    </AvatarGroupProvider>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AACzB,SAASC,mBAAmB,QAAQ;AAGpC;;;AAGA,OAAO,MAAMC,0BAAA,GAA6BA,CAACC,KAAA,EAAyBC,aAAA,KAA4C;EAC9G,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAA2BG,KAAA;EAExD,oBACEJ,KAAA,CAAAQ,aAAA,CAACN,mBAAA;IAAoBO,KAAA,EAAOJ,aAAA,CAAcK;kBACxCV,KAAA,CAAAQ,aAAA,CAACF,KAAA,CAAMK,IAAI,EAAKJ,SAAA,CAAUI,IAAI;AAGpC"}

package/lib/components/AvatarGroup/useAvatarGroup.js

@@ -1,3 +1,4 @@
+import * as React from 'react';
 import { getNativeElementProps } from '@fluentui/react-utilities';
 /**
  * Create the state required to render AvatarGroup.