@fluentui/react-avatar 9.4.9 → 9.5.0

package/lib/components/AvatarGroup/AvatarGroup.js

@@ -2,8 +2,8 @@ import * as React from 'react';
 import { renderAvatarGroup_unstable } from './renderAvatarGroup';
 import { useAvatarGroup_unstable } from './useAvatarGroup';
 import { useAvatarGroupContextValues } from './useAvatarGroupContextValues';
-import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
-import { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles';
+import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import { useAvatarGroupStyles_unstable } from './useAvatarGroupStyles.styles';
 /**
  * The AvatarGroup component represents a group of multiple people or entities by taking care of the arrangement
  * of individual Avatars in a spread, stack, or pie layout.
@@ -12,10 +12,7 @@ export const AvatarGroup = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useAvatarGroup_unstable(props, ref);
   const contextValues = useAvatarGroupContextValues(state);
   useAvatarGroupStyles_unstable(state);
-  const {
-    useAvatarGroupStyles_unstable: useCustomStyles
-  } = useCustomStyleHooks_unstable();
-  useCustomStyles(state);
+  useCustomStyleHook_unstable('useAvatarGroupStyles_unstable')(state);
   return renderAvatarGroup_unstable(state, contextValues);
 });
 AvatarGroup.displayName = 'AvatarGroup';

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/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"}
+{"version":3,"names":["React","renderAvatarGroup_unstable","useAvatarGroup_unstable","useAvatarGroupContextValues","useCustomStyleHook_unstable","useAvatarGroupStyles_unstable","AvatarGroup","forwardRef","props","ref","state","contextValues","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 { 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"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,0BAA0B,QAAQ;AAC3C,SAASC,uBAAuB,QAAQ;AACxC,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,2BAA2B,QAAQ;AAC5C,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;EAE9BN,2BAAA,CAA4B,iCAAiCM,KAAA;EAE7D,OAAOT,0BAAA,CAA2BS,KAAA,EAAOC,aAAA;AAC3C;AAEAL,WAAA,CAAYM,WAAW,GAAG"}

package/lib/components/AvatarGroup/index.js

@@ -2,6 +2,6 @@ export * from './AvatarGroup';
 export * from './AvatarGroup.types';
 export * from './renderAvatarGroup';
 export * from './useAvatarGroup';
-export * from './useAvatarGroupStyles';
+export * from './useAvatarGroupStyles.styles';
 export * from './useAvatarGroupContextValues';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"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"}
+{"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.styles';\nexport * from './useAvatarGroupContextValues';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/AvatarGroup/renderAvatarGroup.js

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { getSlots } from '@fluentui/react-utilities';
+/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+import { getSlotsNext } from '@fluentui/react-utilities';
 import { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';
 /**
  * Render the final JSX of AvatarGroup
@@ -8,9 +8,9 @@ export const renderAvatarGroup_unstable = (state, contextValues) => {
   const {
     slots,
     slotProps
-  } = getSlots(state);
-  return /*#__PURE__*/React.createElement(AvatarGroupProvider, {
+  } = getSlotsNext(state);
+  return /*#__PURE__*/createElement(AvatarGroupProvider, {
     value: contextValues.avatarGroup
-  }, /*#__PURE__*/React.createElement(slots.root, slotProps.root));
+  }, /*#__PURE__*/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/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"}
+{"version":3,"names":["createElement","getSlotsNext","AvatarGroupProvider","renderAvatarGroup_unstable","state","contextValues","slots","slotProps","value","avatarGroup","root"],"sources":["../../../src/components/AvatarGroup/renderAvatarGroup.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } 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 } = getSlotsNext<AvatarGroupSlots>(state);\n\n  return (\n    <AvatarGroupProvider value={contextValues.avatarGroup}>\n      <slots.root {...slotProps.root} />\n    </AvatarGroupProvider>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAC7B,SAASC,mBAAmB,QAAQ;AAGpC;;;AAGA,OAAO,MAAMC,0BAAA,GAA6BA,CAACC,KAAA,EAAyBC,aAAA,KAA4C;EAC9G,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAA+BG,KAAA;EAE5D,oBACEJ,aAfJ,CAeKE,mBAAA;IAAoBM,KAAA,EAAOH,aAAA,CAAcI;kBACxCT,aAhBN,CAgBOM,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI;AAGpC"}

package/lib/components/AvatarGroup/{useAvatarGroupStyles.js → useAvatarGroupStyles.styles.js}

@@ -1,6 +1,6 @@
 import { __styles, mergeClasses } from '@griffel/react';
 import { tokens } from '@fluentui/react-theme';
-import { useSizeStyles } from '../Avatar/useAvatarStyles';
+import { useSizeStyles } from '../Avatar/useAvatarStyles.styles';
 export const avatarGroupClassNames = {
   root: 'fui-AvatarGroup'
 };
@@ -36,4 +36,4 @@ export const useAvatarGroupStyles_unstable = state => {
   state.root.className = mergeClasses(avatarGroupClassNames.root, styles.base, layout === 'pie' && sizeStyles[size], layout === 'pie' && styles.pie, state.root.className);
   return state;
 };
-//# sourceMappingURL=useAvatarGroupStyles.js.map
+//# sourceMappingURL=useAvatarGroupStyles.styles.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","tokens","useSizeStyles","avatarGroupClassNames","root","useStyles","base","mc9l5x","qhf8xq","pie","Bgl5zvf","De3pzq","Bsw6fvg","d","m","useAvatarGroupStyles_unstable","state","layout","size","styles","sizeStyles","className"],"sources":["../../../src/components/AvatarGroup/useAvatarGroupStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useSizeStyles } from '../Avatar/useAvatarStyles.styles';\nimport type { AvatarGroupSlots, AvatarGroupState } from './AvatarGroup.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupClassNames: SlotClassNames<AvatarGroupSlots> = {\n  root: 'fui-AvatarGroup',\n};\n\n/**\n * Styles for the root slot.\n */\nconst useStyles = makeStyles({\n  base: {\n    display: 'inline-flex',\n    position: 'relative',\n  },\n  pie: {\n    clipPath: 'circle(50%)',\n    backgroundColor: tokens.colorTransparentStroke,\n    '@media (forced-colors: active)': {\n      backgroundColor: 'CanvasText',\n    },\n  },\n});\n\n/**\n * Apply styling to the AvatarGroup slots based on the state\n */\nexport const useAvatarGroupStyles_unstable = (state: AvatarGroupState): AvatarGroupState => {\n  const { layout, size } = state;\n  const styles = useStyles();\n  const sizeStyles = useSizeStyles();\n\n  state.root.className = mergeClasses(\n    avatarGroupClassNames.root,\n    styles.base,\n    layout === 'pie' && sizeStyles[size],\n    layout === 'pie' && styles.pie,\n    state.root.className,\n  );\n\n  return state;\n};\n"],"mappings":"AAAA,SAAAA,QAAA,EAAqBC,YAAY,QAAQ;AACzC,SAASC,MAAM,QAAQ;AACvB,SAASC,aAAa,QAAQ;AAI9B,OAAO,MAAMC,qBAAA,GAA0D;EACrEC,IAAA,EAAM;AACR;AAEA;;;AAGA,MAAMC,SAAA,gBAAYN,QAAA;EAAAO,IAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,GAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAAC,CAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;AAAA,EAYlB;AAEA;;;AAGA,OAAO,MAAMC,6BAAA,GAAiCC,KAAA,IAA8C;EAC1F,MAAM;IAAEC,MAAA;IAAQC;EAAI,CAAE,GAAGF,KAAA;EACzB,MAAMG,MAAA,GAASd,SAAA;EACf,MAAMe,UAAA,GAAalB,aAAA;EAEnBc,KAAA,CAAMZ,IAAI,CAACiB,SAAS,GAAGrB,YAAA,CACrBG,qBAAA,CAAsBC,IAAI,EAC1Be,MAAA,CAAOb,IAAI,EACXW,MAAA,KAAW,SAASG,UAAU,CAACF,IAAA,CAAK,EACpCD,MAAA,KAAW,SAASE,MAAA,CAAOV,GAAG,EAC9BO,KAAA,CAAMZ,IAAI,CAACiB,SAAS;EAGtB,OAAOL,KAAA;AACT"}

package/lib/components/AvatarGroupItem/AvatarGroupItem.js

@@ -1,8 +1,8 @@
 import * as React from 'react';
 import { renderAvatarGroupItem_unstable } from './renderAvatarGroupItem';
 import { useAvatarGroupItem_unstable } from './useAvatarGroupItem';
-import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
-import { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles';
+import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles.styles';
 /**
  * The AvatarGroupItem component represents a single person or entity.
  * AvatarGroupItem should only be used in an AvatarGroup component.
@@ -10,10 +10,7 @@ import { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles';
 export const AvatarGroupItem = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useAvatarGroupItem_unstable(props, ref);
   useAvatarGroupItemStyles_unstable(state);
-  const {
-    useAvatarGroupItemStyles_unstable: useCustomStyles
-  } = useCustomStyleHooks_unstable();
-  useCustomStyles(state);
+  useCustomStyleHook_unstable('useAvatarGroupItemStyles_unstable')(state);
   return renderAvatarGroupItem_unstable(state);
 });
 AvatarGroupItem.displayName = 'AvatarGroupItem';

package/lib/components/AvatarGroupItem/AvatarGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","renderAvatarGroupItem_unstable","useAvatarGroupItem_unstable","useCustomStyleHooks_unstable","useAvatarGroupItemStyles_unstable","AvatarGroupItem","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../src/components/AvatarGroupItem/AvatarGroupItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupItem_unstable } from './renderAvatarGroupItem';\nimport { useAvatarGroupItem_unstable } from './useAvatarGroupItem';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles';\nimport type { AvatarGroupItemProps } from './AvatarGroupItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroupItem component represents a single person or entity.\n * AvatarGroupItem should only be used in an AvatarGroup component.\n */\nexport const AvatarGroupItem: ForwardRefComponent<AvatarGroupItemProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroupItem_unstable(props, ref);\n\n  useAvatarGroupItemStyles_unstable(state);\n\n  const { useAvatarGroupItemStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatarGroupItem_unstable(state);\n});\n\nAvatarGroupItem.displayName = 'AvatarGroupItem';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,8BAA8B,QAAQ;AAC/C,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,iCAAiC,QAAQ;AAIlD;;;;AAIA,OAAO,MAAMC,eAAA,gBAA6DL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACzG,MAAMC,KAAA,GAAQP,2BAAA,CAA4BK,KAAA,EAAOC,GAAA;EAEjDJ,iCAAA,CAAkCK,KAAA;EAElC,MAAM;IAAEL,iCAAA,EAAmCM;EAAe,CAAE,GAAGP,4BAAA;EAC/DO,eAAA,CAAgBD,KAAA;EAEhB,OAAOR,8BAAA,CAA+BQ,KAAA;AACxC;AAEAJ,eAAA,CAAgBM,WAAW,GAAG"}
+{"version":3,"names":["React","renderAvatarGroupItem_unstable","useAvatarGroupItem_unstable","useCustomStyleHook_unstable","useAvatarGroupItemStyles_unstable","AvatarGroupItem","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/AvatarGroupItem/AvatarGroupItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupItem_unstable } from './renderAvatarGroupItem';\nimport { useAvatarGroupItem_unstable } from './useAvatarGroupItem';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupItemStyles_unstable } from './useAvatarGroupItemStyles.styles';\nimport type { AvatarGroupItemProps } from './AvatarGroupItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * The AvatarGroupItem component represents a single person or entity.\n * AvatarGroupItem should only be used in an AvatarGroup component.\n */\nexport const AvatarGroupItem: ForwardRefComponent<AvatarGroupItemProps> = React.forwardRef((props, ref) => {\n  const state = useAvatarGroupItem_unstable(props, ref);\n\n  useAvatarGroupItemStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupItemStyles_unstable')(state);\n\n  return renderAvatarGroupItem_unstable(state);\n});\n\nAvatarGroupItem.displayName = 'AvatarGroupItem';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,8BAA8B,QAAQ;AAC/C,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,iCAAiC,QAAQ;AAIlD;;;;AAIA,OAAO,MAAMC,eAAA,gBAA6DL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACzG,MAAMC,KAAA,GAAQP,2BAAA,CAA4BK,KAAA,EAAOC,GAAA;EAEjDJ,iCAAA,CAAkCK,KAAA;EAElCN,2BAAA,CAA4B,qCAAqCM,KAAA;EAEjE,OAAOR,8BAAA,CAA+BQ,KAAA;AACxC;AAEAJ,eAAA,CAAgBK,WAAW,GAAG"}

package/lib/components/AvatarGroupItem/index.js

@@ -2,5 +2,5 @@ export * from './AvatarGroupItem';
 export * from './AvatarGroupItem.types';
 export * from './renderAvatarGroupItem';
 export * from './useAvatarGroupItem';
-export * from './useAvatarGroupItemStyles';
+export * from './useAvatarGroupItemStyles.styles';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/AvatarGroupItem/index.ts"],"sourcesContent":["export * from './AvatarGroupItem';\nexport * from './AvatarGroupItem.types';\nexport * from './renderAvatarGroupItem';\nexport * from './useAvatarGroupItem';\nexport * from './useAvatarGroupItemStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"names":[],"sources":["../../../src/components/AvatarGroupItem/index.ts"],"sourcesContent":["export * from './AvatarGroupItem';\nexport * from './AvatarGroupItem.types';\nexport * from './renderAvatarGroupItem';\nexport * from './useAvatarGroupItem';\nexport * from './useAvatarGroupItemStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/AvatarGroupItem/renderAvatarGroupItem.js

@@ -1,5 +1,5 @@
-import * as React from 'react';
-import { getSlots } from '@fluentui/react-utilities';
+/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+import { getSlotsNext } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of AvatarGroupItem
  */
@@ -7,7 +7,7 @@ export const renderAvatarGroupItem_unstable = state => {
   const {
     slots,
     slotProps
-  } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, /*#__PURE__*/React.createElement(slots.avatar, slotProps.avatar), state.isOverflowItem && /*#__PURE__*/React.createElement(slots.overflowLabel, slotProps.overflowLabel));
+  } = getSlotsNext(state);
+  return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(slots.avatar, slotProps.avatar), state.isOverflowItem && /*#__PURE__*/createElement(slots.overflowLabel, slotProps.overflowLabel));
 };
 //# sourceMappingURL=renderAvatarGroupItem.js.map

package/lib/components/AvatarGroupItem/renderAvatarGroupItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getSlots","renderAvatarGroupItem_unstable","state","slots","slotProps","createElement","root","avatar","isOverflowItem","overflowLabel"],"sources":["../../../src/components/AvatarGroupItem/renderAvatarGroupItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { AvatarGroupItemState, AvatarGroupItemSlots } from './AvatarGroupItem.types';\n\n/**\n * Render the final JSX of AvatarGroupItem\n */\nexport const renderAvatarGroupItem_unstable = (state: AvatarGroupItemState) => {\n  const { slots, slotProps } = getSlots<AvatarGroupItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.avatar {...slotProps.avatar} />\n      {state.isOverflowItem && <slots.overflowLabel {...slotProps.overflowLabel} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,QAAQ,QAAQ;AAGzB;;;AAGA,OAAO,MAAMC,8BAAA,GAAkCC,KAAA,IAAgC;EAC7E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,QAAA,CAA+BE,KAAA;EAE5D,oBACEH,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAKF,SAAA,CAAUE,IAAI,eAC5BP,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMI,MAAM,EAAKH,SAAA,CAAUG,MAAM,GACjCL,KAAA,CAAMM,cAAc,iBAAIT,KAAA,CAAAM,aAAA,CAACF,KAAA,CAAMM,aAAa,EAAKL,SAAA,CAAUK,aAAa;AAG/E"}
+{"version":3,"names":["createElement","getSlotsNext","renderAvatarGroupItem_unstable","state","slots","slotProps","root","avatar","isOverflowItem","overflowLabel"],"sources":["../../../src/components/AvatarGroupItem/renderAvatarGroupItem.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { AvatarGroupItemState, AvatarGroupItemSlots } from './AvatarGroupItem.types';\n\n/**\n * Render the final JSX of AvatarGroupItem\n */\nexport const renderAvatarGroupItem_unstable = (state: AvatarGroupItemState) => {\n  const { slots, slotProps } = getSlotsNext<AvatarGroupItemSlots>(state);\n\n  return (\n    <slots.root {...slotProps.root}>\n      <slots.avatar {...slotProps.avatar} />\n      {state.isOverflowItem && <slots.overflowLabel {...slotProps.overflowLabel} />}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAG7B;;;AAGA,OAAO,MAAMC,8BAAA,GAAkCC,KAAA,IAAgC;EAC7E,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,YAAA,CAAmCE,KAAA;EAEhE,oBACEH,aAdJ,CAcKI,KAAA,CAAME,IAAI,EAAKD,SAAA,CAAUC,IAAI,eAC5BN,aAfN,CAeOI,KAAA,CAAMG,MAAM,EAAKF,SAAA,CAAUE,MAAM,GACjCJ,KAAA,CAAMK,cAAc,iBAAIR,aAhB/B,CAgBgCI,KAAA,CAAMK,aAAa,EAAKJ,SAAA,CAAUI,aAAa;AAG/E"}

package/lib/components/AvatarGroupItem/{useAvatarGroupItemStyles.js → useAvatarGroupItemStyles.styles.js}

@@ -246,4 +246,4 @@ export const useGroupChildClassName = (layout, size) => {
   }
   return mergeClasses(...layoutClasses);
 };
-//# sourceMappingURL=useAvatarGroupItemStyles.js.map
+//# sourceMappingURL=useAvatarGroupItemStyles.styles.js.map

package/lib/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","useSizeStyles","useFluent_unstable","useFluent","avatarGroupItemClassNames","root","avatar","overflowLabel","avatarGroupItemDividerWidthVar","useRootStyles","base","Bt984gj","mc9l5x","Bnnss6s","qhf8xq","overflowItem","z8tnut","z189sj","Byoj8tv","uwmqm3","nonOverflowItem","Bbmb7ep","Beyfa6y","B7oj6ja","Btl43ni","d","useAvatarStyles","pie","useOverflowLabelStyles","Frg6f3","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","useStackStyles","thick","E5pizo","thicker","thickest","xxs","jhia2w","xs","s","l","useSpreadStyles","mNudge","m","xl","usePieStyles","slices","B3gf25r","Be2twx7","Bvaow4n","Gpecfs","bhabj1","B7rc6i7","Bwrfys5","Bwuzm9m","fflka","do7bja","Be8zqhl","Bij0kh0","Bwexnyt","Bhe5x6o","B3kv7bh","rtlSlices","uiicq7","useAvatarGroupItemStyles_unstable","state","isOverflowItem","layout","size","dir","avatarStyles","overflowLabelStyles","pieStyles","rootStyles","sizeStyles","groupChildClassName","useGroupChildClassName","rootClasses","push","className","stackStyles","spreadStyles","layoutClasses"],"sources":["../../../src/components/AvatarGroupItem/useAvatarGroupItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport { useSizeStyles } from '../../Avatar';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport type { AvatarGroupItemSlots, AvatarGroupItemState } from './AvatarGroupItem.types';\nimport type { AvatarGroupProps } from '../../AvatarGroup';\nimport type { AvatarSize } from '../../Avatar';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const avatarGroupItemClassNames: SlotClassNames<AvatarGroupItemSlots> = {\n  root: 'fui-AvatarGroupItem',\n  avatar: 'fui-AvatarGroupItem__avatar',\n  overflowLabel: 'fui-AvatarGroupItem__overflowLabel',\n};\n\nconst avatarGroupItemDividerWidthVar = '--fuiAvatarGroupItem__divider--width';\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  base: {\n    alignItems: 'center',\n    display: 'inline-flex',\n    flexShrink: 0,\n    position: 'relative',\n  },\n  overflowItem: {\n    ...shorthands.padding(tokens.spacingVerticalXS, tokens.spacingHorizontalXS),\n  },\n  nonOverflowItem: {\n    ...shorthands.borderRadius(tokens.borderRadiusCircular),\n  },\n});\n\n/**\n * Styles for the avatar slot\n */\nconst useAvatarStyles = makeStyles({\n  nonOverflowItem: {\n    position: 'absolute',\n  },\n  pie: {\n    ...shorthands.borderRadius(0),\n  },\n});\n\n/**\n * Styles for the label slot\n */\nconst useOverflowLabelStyles = makeStyles({\n  base: {\n    marginLeft: tokens.spacingHorizontalS,\n    color: tokens.colorNeutralForeground1,\n    ...typographyStyles.body1,\n  },\n});\n\n/**\n * Styles for the stack layout\n */\nconst useStackStyles = makeStyles({\n  thick: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThick} ${tokens.colorNeutralBackground2}`,\n  },\n  thicker: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThicker} ${tokens.colorNeutralBackground2}`,\n  },\n  thickest: {\n    boxShadow: `0 0 0 ${tokens.strokeWidthThickest} ${tokens.colorNeutralBackground2}`,\n  },\n  xxs: { '&:not(:first-child)': { marginLeft: `calc(-1 * ${tokens.spacingHorizontalXXS})` } },\n  xs: { '&:not(:first-child)': { marginLeft: `calc(-1 * ${tokens.spacingHorizontalXS})` } },\n  s: { '&:not(:first-child)': { marginLeft: `calc(-1 * ${tokens.spacingHorizontalS})` } },\n  l: { '&:not(:first-child)': { marginLeft: `calc(-1 * ${tokens.spacingHorizontalL})` } },\n});\n\n/**\n * Styles for the spread layout\n */\nconst useSpreadStyles = makeStyles({\n  s: { '&:not(:first-child)': { marginLeft: tokens.spacingHorizontalS } },\n  mNudge: { '&:not(:first-child)': { marginLeft: tokens.spacingHorizontalMNudge } },\n  m: { '&:not(:first-child)': { marginLeft: tokens.spacingHorizontalM } },\n  l: { '&:not(:first-child)': { marginLeft: tokens.spacingHorizontalL } },\n  xl: { '&:not(:first-child)': { marginLeft: tokens.spacingHorizontalXL } },\n});\n\n/**\n * Styles for the pie layout\n */\nconst usePieStyles = makeStyles({\n  base: {\n    position: 'absolute',\n  },\n  slices: {\n    // Two slices\n    // 1st of 2 items\n    '&:nth-of-type(1):nth-last-of-type(2)': {\n      clipPath: `inset(0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)) 0 25%)`,\n      left: '-25%',\n    },\n    // 2nd of 2 items\n    '&:nth-of-type(2):nth-last-of-type(1)': {\n      clipPath: `inset(0 25% 0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)))`,\n      left: '25%',\n    },\n\n    // Three slices\n    // 1st of 3 items\n    '&:nth-of-type(1):nth-last-of-type(3)': {\n      clipPath: `inset(0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)) 0 25%)`,\n      left: '-25%',\n    },\n    // 2nd of 3 items\n    '&:nth-of-type(2):nth-last-of-type(2)': {\n      // Since the two AvatarGroupItems on the right are scaled by 0.5, the divider width should not be halved.\n      clipPath: `inset(0 0 var(${avatarGroupItemDividerWidthVar}) var(${avatarGroupItemDividerWidthVar}))`,\n      left: '50%',\n      transform: 'scale(0.5)',\n      transformOrigin: '0 0',\n    },\n    // 3rd of 3 items\n    '&:nth-of-type(3):nth-last-of-type(1)': {\n      clipPath: `inset(var(${avatarGroupItemDividerWidthVar}) 0 0 var(${avatarGroupItemDividerWidthVar}))`,\n      left: '50%',\n      top: '50%',\n      transform: 'scale(0.5)',\n      transformOrigin: '0 0',\n    },\n  },\n  rtlSlices: {\n    // Two slices\n    // 1st of 2 items\n    '&:nth-of-type(1):nth-last-of-type(2)': {\n      clipPath: `inset(0 25% 0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)))`,\n    },\n    // 2nd of 2 items\n    '&:nth-of-type(2):nth-last-of-type(1)': {\n      clipPath: `inset(0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)) 0 25%)`,\n    },\n\n    // Three slices\n    // 1st of 3 items\n    '&:nth-of-type(1):nth-last-of-type(3)': {\n      clipPath: `inset(0 25% 0 calc(25% + (var(${avatarGroupItemDividerWidthVar}) / 2)))`,\n    },\n    // 2nd of 3 items\n    '&:nth-of-type(2):nth-last-of-type(2)': {\n      clipPath: `inset(0 var(${avatarGroupItemDividerWidthVar}) var(${avatarGroupItemDividerWidthVar}) 0)`,\n      left: '0',\n    },\n    // 3rd of 3 items\n    '&:nth-of-type(3):nth-last-of-type(1)': {\n      clipPath: `inset(var(${avatarGroupItemDividerWidthVar}) var(${avatarGroupItemDividerWidthVar}) 0 0)`,\n      left: '0',\n    },\n  },\n  thick: { [avatarGroupItemDividerWidthVar]: tokens.strokeWidthThick },\n  thicker: { [avatarGroupItemDividerWidthVar]: tokens.strokeWidthThicker },\n  thickest: { [avatarGroupItemDividerWidthVar]: tokens.strokeWidthThickest },\n});\n\n/**\n * Apply styling to the AvatarGroupItem slots based on the state\n */\nexport const useAvatarGroupItemStyles_unstable = (state: AvatarGroupItemState): AvatarGroupItemState => {\n  const { isOverflowItem, layout, size } = state;\n  const { dir } = useFluent();\n\n  const avatarStyles = useAvatarStyles();\n  const overflowLabelStyles = useOverflowLabelStyles();\n  const pieStyles = usePieStyles();\n  const rootStyles = useRootStyles();\n  const sizeStyles = useSizeStyles();\n\n  const groupChildClassName = useGroupChildClassName(layout, size);\n\n  const rootClasses = [rootStyles.base];\n\n  if (!isOverflowItem) {\n    rootClasses.push(rootStyles.nonOverflowItem);\n    rootClasses.push(groupChildClassName);\n    rootClasses.push(sizeStyles[size]);\n\n    if (layout === 'pie') {\n      rootClasses.push(pieStyles.base);\n\n      if (size < 56) {\n        rootClasses.push(pieStyles.thick);\n      } else if (size < 72) {\n        rootClasses.push(pieStyles.thicker);\n      } else {\n        rootClasses.push(pieStyles.thickest);\n      }\n\n      rootClasses.push(pieStyles.slices);\n\n      if (dir === 'rtl') {\n        rootClasses.push(pieStyles.rtlSlices);\n      }\n    }\n  } else {\n    rootClasses.push(rootStyles.overflowItem);\n  }\n\n  state.root.className = mergeClasses(avatarGroupItemClassNames.root, ...rootClasses, state.root.className);\n\n  state.avatar.className = mergeClasses(\n    avatarGroupItemClassNames.avatar,\n    !isOverflowItem && avatarStyles.nonOverflowItem,\n    layout === 'pie' && avatarStyles.pie,\n    state.avatar.className,\n  );\n\n  if (state.overflowLabel) {\n    state.overflowLabel.className = mergeClasses(\n      avatarGroupItemClassNames.overflowLabel,\n      overflowLabelStyles.base,\n      state.overflowLabel.className,\n    );\n  }\n\n  return state;\n};\n\n/**\n * Hook for getting the className for the children of AvatarGroup. This hook will provide the spacing and outlines\n * needed for each layout.\n */\nexport const useGroupChildClassName = (layout: AvatarGroupProps['layout'], size: AvatarSize): string => {\n  const stackStyles = useStackStyles();\n  const spreadStyles = useSpreadStyles();\n  const layoutClasses = [];\n\n  if (size) {\n    if (layout === 'stack') {\n      if (size < 56) {\n        layoutClasses.push(stackStyles.thick);\n      } else if (size < 72) {\n        layoutClasses.push(stackStyles.thicker);\n      } else {\n        layoutClasses.push(stackStyles.thickest);\n      }\n\n      if (size < 24) {\n        layoutClasses.push(stackStyles.xxs);\n      } else if (size < 48) {\n        layoutClasses.push(stackStyles.xs);\n      } else if (size < 96) {\n        layoutClasses.push(stackStyles.s);\n      } else {\n        layoutClasses.push(stackStyles.l);\n      }\n    } else if (layout === 'spread') {\n      if (size < 20) {\n        layoutClasses.push(spreadStyles.s);\n      } else if (size < 32) {\n        layoutClasses.push(spreadStyles.mNudge);\n      } else if (size < 64) {\n        layoutClasses.push(spreadStyles.l);\n      } else {\n        layoutClasses.push(spreadStyles.xl);\n      }\n    }\n  }\n\n  return mergeClasses(...layoutClasses);\n};\n"],"mappings":"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"}

package/lib/components/AvatarGroupPopover/AvatarGroupPopover.js

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { renderAvatarGroupPopover_unstable } from './renderAvatarGroupPopover';
 import { useAvatarGroupPopoverContextValues } from './useAvatarGroupPopoverContextValues';
-import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
+import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
 import { useAvatarGroupPopover_unstable } from './useAvatarGroupPopover';
-import { useAvatarGroupPopoverStyles_unstable } from './useAvatarGroupPopoverStyles';
+import { useAvatarGroupPopoverStyles_unstable } from './useAvatarGroupPopoverStyles.styles';
 /**
  * The AvatarGroupPopover component provides a button with a Popover containing the children provided.
  */
@@ -11,10 +11,7 @@ export const AvatarGroupPopover = props => {
   const state = useAvatarGroupPopover_unstable(props);
   const contextValues = useAvatarGroupPopoverContextValues(state);
   useAvatarGroupPopoverStyles_unstable(state);
-  const {
-    useAvatarGroupPopoverStyles_unstable: useCustomStyles
-  } = useCustomStyleHooks_unstable();
-  useCustomStyles(state);
+  useCustomStyleHook_unstable('useAvatarGroupPopoverStyles_unstable')(state);
   return renderAvatarGroupPopover_unstable(state, contextValues);
 };
 AvatarGroupPopover.displayName = 'AvatarGroupPopover';

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

@@ -1 +1 @@
-{"version":3,"names":["React","renderAvatarGroupPopover_unstable","useAvatarGroupPopoverContextValues","useCustomStyleHooks_unstable","useAvatarGroupPopover_unstable","useAvatarGroupPopoverStyles_unstable","AvatarGroupPopover","props","state","contextValues","useCustomStyles","displayName"],"sources":["../../../src/components/AvatarGroupPopover/AvatarGroupPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupPopover_unstable } from './renderAvatarGroupPopover';\nimport { useAvatarGroupPopoverContextValues } from './useAvatarGroupPopoverContextValues';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupPopover_unstable } from './useAvatarGroupPopover';\nimport { useAvatarGroupPopoverStyles_unstable } from './useAvatarGroupPopoverStyles';\nimport type { AvatarGroupPopoverProps } from './AvatarGroupPopover.types';\n\n/**\n * The AvatarGroupPopover component provides a button with a Popover containing the children provided.\n */\nexport const AvatarGroupPopover: React.FC<AvatarGroupPopoverProps> = props => {\n  const state = useAvatarGroupPopover_unstable(props);\n  const contextValues = useAvatarGroupPopoverContextValues(state);\n\n  useAvatarGroupPopoverStyles_unstable(state);\n\n  const { useAvatarGroupPopoverStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n\n  return renderAvatarGroupPopover_unstable(state, contextValues);\n};\n\nAvatarGroupPopover.displayName = 'AvatarGroupPopover';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,iCAAiC,QAAQ;AAClD,SAASC,kCAAkC,QAAQ;AACnD,SAASC,4BAA4B,QAAQ;AAC7C,SAASC,8BAA8B,QAAQ;AAC/C,SAASC,oCAAoC,QAAQ;AAGrD;;;AAGA,OAAO,MAAMC,kBAAA,GAAwDC,KAAA,IAAS;EAC5E,MAAMC,KAAA,GAAQJ,8BAAA,CAA+BG,KAAA;EAC7C,MAAME,aAAA,GAAgBP,kCAAA,CAAmCM,KAAA;EAEzDH,oCAAA,CAAqCG,KAAA;EAErC,MAAM;IAAEH,oCAAA,EAAsCK;EAAe,CAAE,GAAGP,4BAAA;EAClEO,eAAA,CAAgBF,KAAA;EAEhB,OAAOP,iCAAA,CAAkCO,KAAA,EAAOC,aAAA;AAClD;AAEAH,kBAAA,CAAmBK,WAAW,GAAG"}
+{"version":3,"names":["React","renderAvatarGroupPopover_unstable","useAvatarGroupPopoverContextValues","useCustomStyleHook_unstable","useAvatarGroupPopover_unstable","useAvatarGroupPopoverStyles_unstable","AvatarGroupPopover","props","state","contextValues","displayName"],"sources":["../../../src/components/AvatarGroupPopover/AvatarGroupPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatarGroupPopover_unstable } from './renderAvatarGroupPopover';\nimport { useAvatarGroupPopoverContextValues } from './useAvatarGroupPopoverContextValues';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarGroupPopover_unstable } from './useAvatarGroupPopover';\nimport { useAvatarGroupPopoverStyles_unstable } from './useAvatarGroupPopoverStyles.styles';\nimport type { AvatarGroupPopoverProps } from './AvatarGroupPopover.types';\n\n/**\n * The AvatarGroupPopover component provides a button with a Popover containing the children provided.\n */\nexport const AvatarGroupPopover: React.FC<AvatarGroupPopoverProps> = props => {\n  const state = useAvatarGroupPopover_unstable(props);\n  const contextValues = useAvatarGroupPopoverContextValues(state);\n\n  useAvatarGroupPopoverStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useAvatarGroupPopoverStyles_unstable')(state);\n\n  return renderAvatarGroupPopover_unstable(state, contextValues);\n};\n\nAvatarGroupPopover.displayName = 'AvatarGroupPopover';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,iCAAiC,QAAQ;AAClD,SAASC,kCAAkC,QAAQ;AACnD,SAASC,2BAA2B,QAAQ;AAC5C,SAASC,8BAA8B,QAAQ;AAC/C,SAASC,oCAAoC,QAAQ;AAGrD;;;AAGA,OAAO,MAAMC,kBAAA,GAAwDC,KAAA,IAAS;EAC5E,MAAMC,KAAA,GAAQJ,8BAAA,CAA+BG,KAAA;EAC7C,MAAME,aAAA,GAAgBP,kCAAA,CAAmCM,KAAA;EAEzDH,oCAAA,CAAqCG,KAAA;EAErCL,2BAAA,CAA4B,wCAAwCK,KAAA;EAEpE,OAAOP,iCAAA,CAAkCO,KAAA,EAAOC,aAAA;AAClD;AAEAH,kBAAA,CAAmBI,WAAW,GAAG"}

package/lib/components/AvatarGroupPopover/index.js

@@ -2,5 +2,5 @@ export * from './AvatarGroupPopover';
 export * from './AvatarGroupPopover.types';
 export * from './renderAvatarGroupPopover';
 export * from './useAvatarGroupPopover';
-export * from './useAvatarGroupPopoverStyles';
+export * from './useAvatarGroupPopoverStyles.styles';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/AvatarGroupPopover/index.ts"],"sourcesContent":["export * from './AvatarGroupPopover';\nexport * from './AvatarGroupPopover.types';\nexport * from './renderAvatarGroupPopover';\nexport * from './useAvatarGroupPopover';\nexport * from './useAvatarGroupPopoverStyles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"names":[],"sources":["../../../src/components/AvatarGroupPopover/index.ts"],"sourcesContent":["export * from './AvatarGroupPopover';\nexport * from './AvatarGroupPopover.types';\nexport * from './renderAvatarGroupPopover';\nexport * from './useAvatarGroupPopover';\nexport * from './useAvatarGroupPopoverStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}

package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js

@@ -1,6 +1,6 @@
-import * as React from 'react';
+/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
 import { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';
-import { getSlots } from '@fluentui/react-utilities';
+import { getSlotsNext } from '@fluentui/react-utilities';
 import { PopoverTrigger } from '@fluentui/react-popover';
 /**
  * Render the final JSX of AvatarGroupPopover
@@ -9,11 +9,11 @@ export const renderAvatarGroupPopover_unstable = (state, contextValues) => {
   const {
     slots,
     slotProps
-  } = getSlots(state);
-  return /*#__PURE__*/React.createElement(slots.root, slotProps.root, /*#__PURE__*/React.createElement(PopoverTrigger, {
+  } = getSlotsNext(state);
+  return /*#__PURE__*/createElement(slots.root, slotProps.root, /*#__PURE__*/createElement(PopoverTrigger, {
     disableButtonEnhancement: true
-  }, /*#__PURE__*/React.createElement(slots.tooltip, slotProps.tooltip, /*#__PURE__*/React.createElement(slots.triggerButton, slotProps.triggerButton))), /*#__PURE__*/React.createElement(slots.popoverSurface, slotProps.popoverSurface, /*#__PURE__*/React.createElement(AvatarGroupProvider, {
+  }, /*#__PURE__*/createElement(slots.tooltip, slotProps.tooltip, /*#__PURE__*/createElement(slots.triggerButton, slotProps.triggerButton))), /*#__PURE__*/createElement(slots.popoverSurface, slotProps.popoverSurface, /*#__PURE__*/createElement(AvatarGroupProvider, {
     value: contextValues.avatarGroup
-  }, /*#__PURE__*/React.createElement(slots.content, slotProps.content))));
+  }, /*#__PURE__*/createElement(slots.content, slotProps.content))));
 };
 //# sourceMappingURL=renderAvatarGroupPopover.js.map

package/lib/components/AvatarGroupPopover/renderAvatarGroupPopover.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","AvatarGroupProvider","getSlots","PopoverTrigger","renderAvatarGroupPopover_unstable","state","contextValues","slots","slotProps","createElement","root","disableButtonEnhancement","tooltip","triggerButton","popoverSurface","value","avatarGroup","content"],"sources":["../../../src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx"],"sourcesContent":["import * as React from 'react';\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport { AvatarGroupContextValues } from '../AvatarGroup/AvatarGroup.types';\nimport { getSlots } from '@fluentui/react-utilities';\nimport { PopoverProps, PopoverTrigger } from '@fluentui/react-popover';\nimport { TooltipProps } from '@fluentui/react-tooltip';\nimport type { AvatarGroupPopoverState, AvatarGroupPopoverSlots } from './AvatarGroupPopover.types';\n\n/**\n * Render the final JSX of AvatarGroupPopover\n */\nexport const renderAvatarGroupPopover_unstable = (\n  state: AvatarGroupPopoverState,\n  contextValues: AvatarGroupContextValues,\n) => {\n  const { slots, slotProps } = getSlots<AvatarGroupPopoverSlots>(state);\n\n  return (\n    <slots.root {...(slotProps.root as PopoverProps)}>\n      <PopoverTrigger disableButtonEnhancement>\n        <slots.tooltip {...(slotProps.tooltip as TooltipProps)}>\n          <slots.triggerButton {...slotProps.triggerButton} />\n        </slots.tooltip>\n      </PopoverTrigger>\n      <slots.popoverSurface {...slotProps.popoverSurface}>\n        <AvatarGroupProvider value={contextValues.avatarGroup}>\n          <slots.content {...slotProps.content} />\n        </AvatarGroupProvider>\n      </slots.popoverSurface>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,mBAAmB,QAAQ;AAEpC,SAASC,QAAQ,QAAQ;AACzB,SAAuBC,cAAc,QAAQ;AAI7C;;;AAGA,OAAO,MAAMC,iCAAA,GAAoCA,CAC/CC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,QAAA,CAAkCG,KAAA;EAE/D,oBACEL,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMG,IAAI,EAAMF,SAAA,CAAUE,IAAI,eAC7BV,KAAA,CAAAS,aAAA,CAACN,cAAA;IAAeQ,wBAAA;kBACdX,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMK,OAAO,EAAMJ,SAAA,CAAUI,OAAO,eACnCZ,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMM,aAAa,EAAKL,SAAA,CAAUK,aAAa,kBAGpDb,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMO,cAAc,EAAKN,SAAA,CAAUM,cAAc,eAChDd,KAAA,CAAAS,aAAA,CAACR,mBAAA;IAAoBc,KAAA,EAAOT,aAAA,CAAcU;kBACxChB,KAAA,CAAAS,aAAA,CAACF,KAAA,CAAMU,OAAO,EAAKT,SAAA,CAAUS,OAAO;AAK9C"}
+{"version":3,"names":["createElement","AvatarGroupProvider","getSlotsNext","PopoverTrigger","renderAvatarGroupPopover_unstable","state","contextValues","slots","slotProps","root","disableButtonEnhancement","tooltip","triggerButton","popoverSurface","value","avatarGroup","content"],"sources":["../../../src/components/AvatarGroupPopover/renderAvatarGroupPopover.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\nimport { AvatarGroupProvider } from '../../contexts/AvatarGroupContext';\nimport { AvatarGroupContextValues } from '../AvatarGroup/AvatarGroup.types';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport { PopoverProps, PopoverTrigger } from '@fluentui/react-popover';\nimport { TooltipProps } from '@fluentui/react-tooltip';\nimport type { AvatarGroupPopoverState, AvatarGroupPopoverSlots } from './AvatarGroupPopover.types';\n\n/**\n * Render the final JSX of AvatarGroupPopover\n */\nexport const renderAvatarGroupPopover_unstable = (\n  state: AvatarGroupPopoverState,\n  contextValues: AvatarGroupContextValues,\n) => {\n  const { slots, slotProps } = getSlotsNext<AvatarGroupPopoverSlots>(state);\n\n  return (\n    <slots.root {...(slotProps.root as PopoverProps)}>\n      <PopoverTrigger disableButtonEnhancement>\n        <slots.tooltip {...(slotProps.tooltip as TooltipProps)}>\n          <slots.triggerButton {...slotProps.triggerButton} />\n        </slots.tooltip>\n      </PopoverTrigger>\n      <slots.popoverSurface {...slotProps.popoverSurface}>\n        <AvatarGroupProvider value={contextValues.avatarGroup}>\n          <slots.content {...slotProps.content} />\n        </AvatarGroupProvider>\n      </slots.popoverSurface>\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAC9B,SAASC,mBAAmB,QAAQ;AAGpC,SAASC,YAAY,QAAQ;AAC7B,SAAuBC,cAAc,QAAQ;AAI7C;;;AAGA,OAAO,MAAMC,iCAAA,GAAoCA,CAC/CC,KAAA,EACAC,aAAA,KACG;EACH,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGN,YAAA,CAAsCG,KAAA;EAEnE,oBACEL,aArBJ,CAqBKO,KAAA,CAAME,IAAI,EAAMD,SAAA,CAAUC,IAAI,eAC7BT,aAtBN,CAsBOG,cAAA;IAAeO,wBAAA;kBACdV,aAvBR,CAuBSO,KAAA,CAAMI,OAAO,EAAMH,SAAA,CAAUG,OAAO,eACnCX,aAxBV,CAwBWO,KAAA,CAAMK,aAAa,EAAKJ,SAAA,CAAUI,aAAa,kBAGpDZ,aA3BN,CA2BOO,KAAA,CAAMM,cAAc,EAAKL,SAAA,CAAUK,cAAc,eAChDb,aA5BR,CA4BSC,mBAAA;IAAoBa,KAAA,EAAOR,aAAA,CAAcS;kBACxCf,aA7BV,CA6BWO,KAAA,CAAMS,OAAO,EAAKR,SAAA,CAAUQ,OAAO;AAK9C"}

package/lib/components/AvatarGroupPopover/{useAvatarGroupPopoverStyles.js → useAvatarGroupPopoverStyles.styles.js}

@@ -1,8 +1,8 @@
 import { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';
 import { __styles, mergeClasses, shorthands } from '@griffel/react';
 import { tokens, typographyStyles } from '@fluentui/react-theme';
-import { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles';
-import { useSizeStyles } from '../Avatar/useAvatarStyles';
+import { useGroupChildClassName } from '../AvatarGroupItem/useAvatarGroupItemStyles.styles';
+import { useSizeStyles } from '../Avatar/useAvatarStyles.styles';
 export const avatarGroupPopoverClassNames = {
   root: 'fui-AvatarGroupPopover',
   content: 'fui-AvatarGroupPopover__content',
@@ -23,10 +23,12 @@ const useContentStyles = /*#__PURE__*/__styles({
     z8tnut: "f1g0x7ka",
     z189sj: ["fhxju0i", "f1cnd47f"],
     Byoj8tv: "f1qch9an",
-    uwmqm3: ["f1cnd47f", "fhxju0i"]
+    uwmqm3: ["f1cnd47f", "fhxju0i"],
+    mc9l5x: "f22iagw",
+    Beiy3e4: "f1vx9l62"
   }
 }, {
-  d: [".ftrb29c{list-style-type:none;}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}"]
+  d: [".ftrb29c{list-style-type:none;}", ".f1hu3pq6{margin-top:0;}", ".f11qmguv{margin-right:0;}", ".f1tyq0we{margin-left:0;}", ".f19f4twv{margin-bottom:0;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f22iagw{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;}", ".f1vx9l62{-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;}"]
 });
 /**
  * Styles for the popoverSurface slot.
@@ -88,8 +90,6 @@ const useTriggerButtonStyles = /*#__PURE__*/__styles({
     sj55zd: "f44pa96"
   },
   focusIndicator: {
-    Brovlpu: "ftqa4ok",
-    B486eqv: "f2hkw1w",
     Bbcte9g: "fhqs6ru",
     Bn40d3w: ["f14qhy8p", "f12lscv2"],
     i2cumq: "f1p9w1qi",
@@ -101,7 +101,8 @@ const useTriggerButtonStyles = /*#__PURE__*/__styles({
     B8q5s1w: "f17t0x8g",
     Bci5o5g: ["f194v5ow", "fk7jm04"],
     n8qw10: "f1qgg65p",
-    Bdrgwmp: ["fk7jm04", "f194v5ow"]
+    Bdrgwmp: ["fk7jm04", "f194v5ow"],
+    g9k6zt: "f1nev41a"
   },
   states: {
     Bi91k9c: "feu1g3u",
@@ -207,7 +208,7 @@ const useTriggerButtonStyles = /*#__PURE__*/__styles({
     ibv6hh: ["f1g0iy8l", "figl7jc"]
   }
 }, {
-  d: [".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f10pi13n{position:relative;}", ".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}", ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}", ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}", ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}", ".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f44pa96{color:transparent;}", ".fhqs6ru[data-fui-focus-visible]{border-top-width:var(--strokeWidthThick);}", ".f14qhy8p[data-fui-focus-visible]{border-right-width:var(--strokeWidthThick);}", ".f12lscv2[data-fui-focus-visible]{border-left-width:var(--strokeWidthThick);}", ".f1p9w1qi[data-fui-focus-visible]{border-bottom-width:var(--strokeWidthThick);}", ".ff4w5z6[data-fui-focus-visible]{border-top-style:solid;}", ".f1slf1ze[data-fui-focus-visible]{border-right-style:solid;}", ".f33ndkz[data-fui-focus-visible]{border-left-style:solid;}", ".fsap1ud[data-fui-focus-visible]{border-bottom-style:solid;}", ".f17t0x8g[data-fui-focus-visible]{border-top-color:var(--colorStrokeFocus2);}", ".f194v5ow[data-fui-focus-visible]{border-right-color:var(--colorStrokeFocus2);}", ".fk7jm04[data-fui-focus-visible]{border-left-color:var(--colorStrokeFocus2);}", ".f1qgg65p[data-fui-focus-visible]{border-bottom-color:var(--colorStrokeFocus2);}", ".f14nttnl{color:var(--colorNeutralForeground1Selected);}", ".f1nfm20t{background-color:var(--colorNeutralBackground1Selected);}", ".f1ly1fcm{border-top-color:var(--colorNeutralStroke1Selected);}", ".fi8bssc{border-right-color:var(--colorNeutralStroke1Selected);}", ".fj6btzu{border-left-color:var(--colorNeutralStroke1Selected);}", ".f1s9tnsa{border-bottom-color:var(--colorNeutralStroke1Selected);}", ".f1ugzwwg{font-size:12px;}", ".f4ybsrx{font-size:16px;}", ".fe5j1ua{font-size:20px;}", ".f1rt2boy{font-size:24px;}", ".f24l1pt{font-size:28px;}", ".ffl51b{font-size:32px;}", ".f18m8u13{font-size:48px;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f106mvju{line-height:var(--lineHeightBase500);}", ".f1x0m3f5{font-size:var(--fontSizeBase600);}", ".fb86gi6{line-height:var(--lineHeightBase600);}", ".f192inf7{border-top-width:var(--strokeWidthThin);}", ".f5tn483{border-right-width:var(--strokeWidthThin);}", ".f1ojsxk5{border-left-width:var(--strokeWidthThin);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".f18zi460{border-top-width:var(--strokeWidthThick);}", ".f1wpluaz{border-right-width:var(--strokeWidthThick);}", ".fsfsuhs{border-left-width:var(--strokeWidthThick);}", ".fmklw6v{border-bottom-width:var(--strokeWidthThick);}", ".fgx37oo{border-top-width:var(--strokeWidthThicker);}", ".f130t4y6{border-right-width:var(--strokeWidthThicker);}", ".f1efpmoh{border-left-width:var(--strokeWidthThicker);}", ".fv51ejd{border-bottom-width:var(--strokeWidthThicker);}", ".fwn6jck{border-top-width:var(--strokeWidthThickest);}", ".figl7jc{border-right-width:var(--strokeWidthThickest);}", ".f1g0iy8l{border-left-width:var(--strokeWidthThickest);}", ".f1b8shu7{border-bottom-width:var(--strokeWidthThickest);}"],
+  d: [".ftuwxu6{display:-webkit-inline-box;display:-webkit-inline-flex;display:-ms-inline-flexbox;display:inline-flex;}", ".f10pi13n{position:relative;}", ".fi64zpg{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;}", ".f4d9j23{-webkit-box-pack:center;-ms-flex-pack:center;-webkit-justify-content:center;justify-content:center;}", ".f122n59{-webkit-align-items:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;}", ".f19n0e5{color:var(--colorNeutralForeground1);}", ".fxugw4r{background-color:var(--colorNeutralBackground1);}", ".fj3muxo{border-top-color:var(--colorNeutralStroke1);}", ".f1akhkt{border-right-color:var(--colorNeutralStroke1);}", ".f1lxtadh{border-left-color:var(--colorNeutralStroke1);}", ".f1aperda{border-bottom-color:var(--colorNeutralStroke1);}", ".f8fbkgy{border-bottom-right-radius:var(--borderRadiusCircular);}", ".f1nfllo7{border-bottom-left-radius:var(--borderRadiusCircular);}", ".f1djnp8u{border-top-right-radius:var(--borderRadiusCircular);}", ".f1s8kh49{border-top-left-radius:var(--borderRadiusCircular);}", ".fzkkow9{border-top-style:solid;}", ".fcdblym{border-right-style:solid;}", ".fjik90z{border-left-style:solid;}", ".fg706s2{border-bottom-style:solid;}", ".f1g0x7ka{padding-top:0;}", ".fhxju0i{padding-right:0;}", ".f1cnd47f{padding-left:0;}", ".f1qch9an{padding-bottom:0;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".fghlq4f{border-top-color:var(--colorTransparentStroke);}", ".f1gn591s{border-right-color:var(--colorTransparentStroke);}", ".fjscplz{border-left-color:var(--colorTransparentStroke);}", ".fb073pr{border-bottom-color:var(--colorTransparentStroke);}", ".f44pa96{color:transparent;}", ".fhqs6ru[data-fui-focus-visible]{border-top-width:var(--strokeWidthThick);}", ".f14qhy8p[data-fui-focus-visible]{border-right-width:var(--strokeWidthThick);}", ".f12lscv2[data-fui-focus-visible]{border-left-width:var(--strokeWidthThick);}", ".f1p9w1qi[data-fui-focus-visible]{border-bottom-width:var(--strokeWidthThick);}", ".ff4w5z6[data-fui-focus-visible]{border-top-style:solid;}", ".f1slf1ze[data-fui-focus-visible]{border-right-style:solid;}", ".f33ndkz[data-fui-focus-visible]{border-left-style:solid;}", ".fsap1ud[data-fui-focus-visible]{border-bottom-style:solid;}", ".f17t0x8g[data-fui-focus-visible]{border-top-color:var(--colorStrokeFocus2);}", ".f194v5ow[data-fui-focus-visible]{border-right-color:var(--colorStrokeFocus2);}", ".fk7jm04[data-fui-focus-visible]{border-left-color:var(--colorStrokeFocus2);}", ".f1qgg65p[data-fui-focus-visible]{border-bottom-color:var(--colorStrokeFocus2);}", ".f1nev41a[data-fui-focus-visible]{outline-style:none;}", ".f14nttnl{color:var(--colorNeutralForeground1Selected);}", ".f1nfm20t{background-color:var(--colorNeutralBackground1Selected);}", ".f1ly1fcm{border-top-color:var(--colorNeutralStroke1Selected);}", ".fi8bssc{border-right-color:var(--colorNeutralStroke1Selected);}", ".fj6btzu{border-left-color:var(--colorNeutralStroke1Selected);}", ".f1s9tnsa{border-bottom-color:var(--colorNeutralStroke1Selected);}", ".f1ugzwwg{font-size:12px;}", ".f4ybsrx{font-size:16px;}", ".fe5j1ua{font-size:20px;}", ".f1rt2boy{font-size:24px;}", ".f24l1pt{font-size:28px;}", ".ffl51b{font-size:32px;}", ".f18m8u13{font-size:48px;}", ".fk6fouc{font-family:var(--fontFamilyBase);}", ".f13mqy1h{font-size:var(--fontSizeBase100);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".fcpl73t{line-height:var(--lineHeightBase100);}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fwrc4pm{line-height:var(--lineHeightBase200);}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".f1i3iumi{line-height:var(--lineHeightBase300);}", ".fod5ikn{font-size:var(--fontSizeBase400);}", ".faaz57k{line-height:var(--lineHeightBase400);}", ".f1pp30po{font-size:var(--fontSizeBase500);}", ".f106mvju{line-height:var(--lineHeightBase500);}", ".f1x0m3f5{font-size:var(--fontSizeBase600);}", ".fb86gi6{line-height:var(--lineHeightBase600);}", ".f192inf7{border-top-width:var(--strokeWidthThin);}", ".f5tn483{border-right-width:var(--strokeWidthThin);}", ".f1ojsxk5{border-left-width:var(--strokeWidthThin);}", ".f1vxd6vx{border-bottom-width:var(--strokeWidthThin);}", ".f18zi460{border-top-width:var(--strokeWidthThick);}", ".f1wpluaz{border-right-width:var(--strokeWidthThick);}", ".fsfsuhs{border-left-width:var(--strokeWidthThick);}", ".fmklw6v{border-bottom-width:var(--strokeWidthThick);}", ".fgx37oo{border-top-width:var(--strokeWidthThicker);}", ".f130t4y6{border-right-width:var(--strokeWidthThicker);}", ".f1efpmoh{border-left-width:var(--strokeWidthThicker);}", ".fv51ejd{border-bottom-width:var(--strokeWidthThicker);}", ".fwn6jck{border-top-width:var(--strokeWidthThickest);}", ".figl7jc{border-right-width:var(--strokeWidthThickest);}", ".f1g0iy8l{border-left-width:var(--strokeWidthThickest);}", ".f1b8shu7{border-bottom-width:var(--strokeWidthThickest);}"],
   m: [["@media (forced-colors: active){.fw33nwi{border-top-color:CanvasText;}}", {
     m: "(forced-colors: active)"
   }], ["@media (forced-colors: active){.f1ptkjjm{border-right-color:CanvasText;}.fmzzjfk{border-left-color:CanvasText;}}", {
@@ -217,8 +218,6 @@ const useTriggerButtonStyles = /*#__PURE__*/__styles({
   }], ["@media (forced-colors: active){.fmzzjfk{border-left-color:CanvasText;}.f1ptkjjm{border-right-color:CanvasText;}}", {
     m: "(forced-colors: active)"
   }]],
-  f: [".ftqa4ok:focus{outline-style:none;}"],
-  i: [".f2hkw1w:focus-visible{outline-style:none;}"],
   h: [".feu1g3u:hover{color:var(--colorNeutralForeground1Hover);}", ".f1knas48:hover{background-color:var(--colorNeutralBackground1Hover);}", ".fvcxoqz:hover{border-top-color:var(--colorNeutralStroke1Hover);}", ".f1ub3y4t:hover{border-right-color:var(--colorNeutralStroke1Hover);}", ".f1m52nbi:hover{border-left-color:var(--colorNeutralStroke1Hover);}", ".f1xlaoq0:hover{border-bottom-color:var(--colorNeutralStroke1Hover);}"],
   a: [".f1g4hkjv:active{color:var(--colorNeutralForeground1Pressed);}", ".fb40n2d:active{background-color:var(--colorNeutralBackground1Pressed);}", ".fvs00aa:active{border-top-color:var(--colorNeutralStroke1Pressed);}", ".f1assf6x:active{border-right-color:var(--colorNeutralStroke1Pressed);}", ".f4ruux4:active{border-left-color:var(--colorNeutralStroke1Pressed);}", ".fumykes:active{border-bottom-color:var(--colorNeutralStroke1Pressed);}"]
 });
@@ -283,4 +282,4 @@ export const useAvatarGroupPopoverStyles_unstable = state => {
   state.popoverSurface.className = mergeClasses(avatarGroupPopoverClassNames.popoverSurface, popoverSurfaceStyles.base, state.popoverSurface.className);
   return state;
 };
-//# sourceMappingURL=useAvatarGroupPopoverStyles.js.map
+//# sourceMappingURL=useAvatarGroupPopoverStyles.styles.js.map

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

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

package/lib/contexts/AvatarContext.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","avatarContext","createContext","undefined","avatarContextDefaultValue","AvatarContextProvider","Provider","_React_useContext","useAvatarContext","useContext"],"sources":["../../src/contexts/AvatarContext.ts"],"sourcesContent":["import * as React from 'react';\nimport { AvatarSize } from '../components/Avatar/Avatar.types';\n\nconst avatarContext = React.createContext<AvatarContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport interface AvatarContextValue {\n  size?: AvatarSize;\n}\n\nconst avatarContextDefaultValue: AvatarContextValue = {};\n\n/**\n * @internal\n */\nexport const AvatarContextProvider = avatarContext.Provider;\n\n/**\n * @internal\n */\nexport const useAvatarContext = () => React.useContext(avatarContext) ?? avatarContextDefaultValue;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAGvB,MAAMC,aAAA,gBAAgBD,KAAA,CAAME,aAAa,CAAiCC,SAAA;AAS1E,MAAMC,yBAAA,GAAgD,CAAC;AAEvD;;;AAGA,OAAO,MAAMC,qBAAA,GAAwBJ,aAAA,CAAcK,QAAQ;IAKrBC,iBAAA;AAHtC;;;AAGA,OAAO,MAAMC,gBAAA,GAAmBA,CAAA,KAAM,CAAAD,iBAAA,GAAAP,KAAA,CAAMS,UAAU,CAACR,aAAA,eAAjBM,iBAAA,cAAAA,iBAAA,GAAmCH,yBAAyB"}
+{"version":3,"names":["React","avatarContext","createContext","undefined","avatarContextDefaultValue","AvatarContextProvider","Provider","_React_useContext","useAvatarContext","useContext"],"sources":["../../src/contexts/AvatarContext.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AvatarShape, AvatarSize } from '../components/Avatar/Avatar.types';\n\nconst avatarContext = React.createContext<AvatarContextValue | undefined>(undefined);\n\n/**\n * @internal\n */\nexport interface AvatarContextValue {\n  shape?: AvatarShape;\n  size?: AvatarSize;\n}\n\nconst avatarContextDefaultValue: AvatarContextValue = {};\n\n/**\n * @internal\n */\nexport const AvatarContextProvider = avatarContext.Provider;\n\n/**\n * @internal\n */\nexport const useAvatarContext = () => React.useContext(avatarContext) ?? avatarContextDefaultValue;\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAGvB,MAAMC,aAAA,gBAAgBD,KAAA,CAAME,aAAa,CAAiCC,SAAA;AAU1E,MAAMC,yBAAA,GAAgD,CAAC;AAEvD;;;AAGA,OAAO,MAAMC,qBAAA,GAAwBJ,aAAA,CAAcK,QAAQ;IAKrBC,iBAAA;AAHtC;;;AAGA,OAAO,MAAMC,gBAAA,GAAmBA,CAAA,KAAM,CAAAD,iBAAA,GAAAP,KAAA,CAAMS,UAAU,CAACR,aAAA,eAAjBM,iBAAA,cAAAA,iBAAA,GAAmCH,yBAAyB"}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Avatar","avatarClassNames","renderAvatar_unstable","useAvatarStyles_unstable","useAvatar_unstable","getInitials","partitionAvatarGroupItems","AvatarGroup","avatarGroupClassNames","renderAvatarGroup_unstable","useAvatarGroupContextValues","useAvatarGroupStyles_unstable","useAvatarGroup_unstable","AvatarGroupItem","avatarGroupItemClassNames","renderAvatarGroupItem_unstable","useAvatarGroupItemStyles_unstable","useAvatarGroupItem_unstable","AvatarGroupPopover","avatarGroupPopoverClassNames","renderAvatarGroupPopover_unstable","useAvatarGroupPopoverStyles_unstable","useAvatarGroupPopover_unstable","AvatarContextProvider","AvatarGroupProvider","useAvatarContext","useAvatarGroupContext_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export {\n  Avatar,\n  avatarClassNames,\n  renderAvatar_unstable,\n  useAvatarStyles_unstable,\n  useAvatar_unstable,\n} from './Avatar';\n// eslint-disable-next-line deprecation/deprecation\nexport type { AvatarNamedColor, AvatarProps, AvatarSlots, AvatarState, AvatarSizes, AvatarSize } from './Avatar';\nexport { getInitials, partitionAvatarGroupItems } from './utils/index';\nexport type { PartitionAvatarGroupItems, PartitionAvatarGroupItemsOptions } from './utils/index';\nexport {\n  AvatarGroup,\n  avatarGroupClassNames,\n  renderAvatarGroup_unstable,\n  useAvatarGroupContextValues,\n  useAvatarGroupStyles_unstable,\n  useAvatarGroup_unstable,\n} from './AvatarGroup';\nexport type {\n  AvatarGroupProps,\n  AvatarGroupSlots,\n  AvatarGroupState,\n  AvatarGroupContextValue,\n  AvatarGroupContextValues,\n} from './AvatarGroup';\nexport {\n  AvatarGroupItem,\n  avatarGroupItemClassNames,\n  renderAvatarGroupItem_unstable,\n  useAvatarGroupItemStyles_unstable,\n  useAvatarGroupItem_unstable,\n} from './AvatarGroupItem';\nexport type { AvatarGroupItemProps, AvatarGroupItemSlots, AvatarGroupItemState } from './AvatarGroupItem';\nexport {\n  AvatarGroupPopover,\n  avatarGroupPopoverClassNames,\n  renderAvatarGroupPopover_unstable,\n  useAvatarGroupPopoverStyles_unstable,\n  useAvatarGroupPopover_unstable,\n} from './AvatarGroupPopover';\nexport type { AvatarGroupPopoverProps, AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover';\nexport {\n  AvatarContextProvider,\n  AvatarGroupProvider,\n  useAvatarContext,\n  useAvatarGroupContext_unstable,\n} from './contexts/index';\nexport type { AvatarContextValue } from './contexts/index';\n"],"mappings":"AAAA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb;AAGP,SAASC,WAAW,EAAEC,yBAAyB,QAAQ;AAEvD,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,uBAAuB,QAClB;AAQP,SACEC,eAAe,EACfC,yBAAyB,EACzBC,8BAA8B,EAC9BC,iCAAiC,EACjCC,2BAA2B,QACtB;AAEP,SACEC,kBAAkB,EAClBC,4BAA4B,EAC5BC,iCAAiC,EACjCC,oCAAoC,EACpCC,8BAA8B,QACzB;AAEP,SACEC,qBAAqB,EACrBC,mBAAmB,EACnBC,gBAAgB,EAChBC,8BAA8B,QACzB"}
+{"version":3,"names":["Avatar","avatarClassNames","renderAvatar_unstable","useAvatarStyles_unstable","useAvatar_unstable","getInitials","partitionAvatarGroupItems","AvatarGroup","avatarGroupClassNames","renderAvatarGroup_unstable","useAvatarGroupContextValues","useAvatarGroupStyles_unstable","useAvatarGroup_unstable","AvatarGroupItem","avatarGroupItemClassNames","renderAvatarGroupItem_unstable","useAvatarGroupItemStyles_unstable","useAvatarGroupItem_unstable","AvatarGroupPopover","avatarGroupPopoverClassNames","renderAvatarGroupPopover_unstable","useAvatarGroupPopoverStyles_unstable","useAvatarGroupPopover_unstable","AvatarContextProvider","AvatarGroupProvider","useAvatarContext","useAvatarGroupContext_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export {\n  Avatar,\n  avatarClassNames,\n  renderAvatar_unstable,\n  useAvatarStyles_unstable,\n  useAvatar_unstable,\n} from './Avatar';\nexport type {\n  AvatarNamedColor,\n  AvatarProps,\n  AvatarSlots,\n  AvatarState,\n  AvatarShape,\n  // eslint-disable-next-line deprecation/deprecation\n  AvatarSizes,\n  AvatarSize,\n} from './Avatar';\nexport { getInitials, partitionAvatarGroupItems } from './utils/index';\nexport type { PartitionAvatarGroupItems, PartitionAvatarGroupItemsOptions } from './utils/index';\nexport {\n  AvatarGroup,\n  avatarGroupClassNames,\n  renderAvatarGroup_unstable,\n  useAvatarGroupContextValues,\n  useAvatarGroupStyles_unstable,\n  useAvatarGroup_unstable,\n} from './AvatarGroup';\nexport type {\n  AvatarGroupProps,\n  AvatarGroupSlots,\n  AvatarGroupState,\n  AvatarGroupContextValue,\n  AvatarGroupContextValues,\n} from './AvatarGroup';\nexport {\n  AvatarGroupItem,\n  avatarGroupItemClassNames,\n  renderAvatarGroupItem_unstable,\n  useAvatarGroupItemStyles_unstable,\n  useAvatarGroupItem_unstable,\n} from './AvatarGroupItem';\nexport type { AvatarGroupItemProps, AvatarGroupItemSlots, AvatarGroupItemState } from './AvatarGroupItem';\nexport {\n  AvatarGroupPopover,\n  avatarGroupPopoverClassNames,\n  renderAvatarGroupPopover_unstable,\n  useAvatarGroupPopoverStyles_unstable,\n  useAvatarGroupPopover_unstable,\n} from './AvatarGroupPopover';\nexport type { AvatarGroupPopoverProps, AvatarGroupPopoverSlots, AvatarGroupPopoverState } from './AvatarGroupPopover';\nexport {\n  AvatarContextProvider,\n  AvatarGroupProvider,\n  useAvatarContext,\n  useAvatarGroupContext_unstable,\n} from './contexts/index';\nexport type { AvatarContextValue } from './contexts/index';\n"],"mappings":"AAAA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb;AAWP,SAASC,WAAW,EAAEC,yBAAyB,QAAQ;AAEvD,SACEC,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,2BAA2B,EAC3BC,6BAA6B,EAC7BC,uBAAuB,QAClB;AAQP,SACEC,eAAe,EACfC,yBAAyB,EACzBC,8BAA8B,EAC9BC,iCAAiC,EACjCC,2BAA2B,QACtB;AAEP,SACEC,kBAAkB,EAClBC,4BAA4B,EAC5BC,iCAAiC,EACjCC,oCAAoC,EACpCC,8BAA8B,QACzB;AAEP,SACEC,qBAAqB,EACrBC,mBAAmB,EACnBC,gBAAgB,EAChBC,8BAA8B,QACzB"}

package/lib/utils/getInitials.js

@@ -23,7 +23,7 @@ const MULTIPLE_WHITESPACES_REGEX = /\s+/g;
  * Japanese: Hiragana, Katakana.
  * CJK:      CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs,
  *             CJK Unified Ideographs Extension B
- */ // eslint-disable-next-line @fluentui/max-len
+ */
 const UNSUPPORTED_TEXT_REGEX = /[\u0600-\u06FF\u0750-\u077F\u08A0-\u08FF\u1100-\u11FF\u3130-\u318F\uA960-\uA97F\uAC00-\uD7AF\uD7B0-\uD7FF\u3040-\u309F\u30A0-\u30FF\u3400-\u4DBF\u4E00-\u9FFF\uF900-\uFAFF]|[\uD840-\uD869][\uDC00-\uDED6]/;
 function getInitialsLatin(displayName, isRtl, firstInitialOnly) {
   let initials = '';

package/lib/utils/getInitials.js.map

@@ -1 +1 @@
-{"version":3,"names":["UNWANTED_ENCLOSURES_REGEX","UNWANTED_CHARS_REGEX","PHONENUMBER_REGEX","MULTIPLE_WHITESPACES_REGEX","UNSUPPORTED_TEXT_REGEX","getInitialsLatin","displayName","isRtl","firstInitialOnly","initials","splits","split","length","charAt","toUpperCase","cleanupDisplayName","replace","trim","getInitials","options","test","allowPhoneInitials"],"sources":["../../src/utils/getInitials.ts"],"sourcesContent":["/**\n * Regular expressions matching characters to ignore when calculating the initials.\n */\n\n/**\n * Regular expression matching characters within various types of enclosures, including the enclosures themselves\n *  so for example, (xyz) [xyz] {xyz} all would be ignored\n */\nconst UNWANTED_ENCLOSURES_REGEX: RegExp = /[\\(\\[\\{][^\\)\\]\\}]*[\\)\\]\\}]/g;\n\n/**\n * Regular expression matching special ASCII characters except space, plus some unicode special characters.\n * Applies after unwanted enclosures have been removed\n */\nconst UNWANTED_CHARS_REGEX: RegExp = /[\\0-\\u001F\\!-/:-@\\[-`\\{-\\u00BF\\u0250-\\u036F\\uD800-\\uFFFF]/g;\n\n/**\n * Regular expression matching phone numbers. Applied after chars matching UNWANTED_CHARS_REGEX have been removed\n * and number has been trimmed for whitespaces\n */\nconst PHONENUMBER_REGEX: RegExp = /^\\d+[\\d\\s]*(:?ext|x|)\\s*\\d+$/i;\n\n/** Regular expression matching one or more spaces. */\nconst MULTIPLE_WHITESPACES_REGEX: RegExp = /\\s+/g;\n\n/**\n * Regular expression matching languages for which we currently don't support initials.\n * Arabic:   Arabic, Arabic Supplement, Arabic Extended-A.\n * Korean:   Hangul Jamo, Hangul Compatibility Jamo, Hangul Jamo Extended-A, Hangul Syllables, Hangul Jamo Extended-B.\n * Japanese: Hiragana, Katakana.\n * CJK:      CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs,\n *             CJK Unified Ideographs Extension B\n */\n// eslint-disable-next-line @fluentui/max-len\nconst UNSUPPORTED_TEXT_REGEX: RegExp =\n  /[\\u0600-\\u06FF\\u0750-\\u077F\\u08A0-\\u08FF\\u1100-\\u11FF\\u3130-\\u318F\\uA960-\\uA97F\\uAC00-\\uD7AF\\uD7B0-\\uD7FF\\u3040-\\u309F\\u30A0-\\u30FF\\u3400-\\u4DBF\\u4E00-\\u9FFF\\uF900-\\uFAFF]|[\\uD840-\\uD869][\\uDC00-\\uDED6]/;\n\nfunction getInitialsLatin(displayName: string, isRtl: boolean, firstInitialOnly?: boolean): string {\n  let initials = '';\n\n  const splits: string[] = displayName.split(' ');\n  if (splits.length !== 0) {\n    initials += splits[0].charAt(0).toUpperCase();\n  }\n\n  if (!firstInitialOnly) {\n    if (splits.length === 2) {\n      initials += splits[1].charAt(0).toUpperCase();\n    } else if (splits.length === 3) {\n      initials += splits[2].charAt(0).toUpperCase();\n    }\n  }\n\n  if (isRtl && initials.length > 1) {\n    return initials.charAt(1) + initials.charAt(0);\n  }\n\n  return initials;\n}\n\nfunction cleanupDisplayName(displayName: string): string {\n  displayName = displayName.replace(UNWANTED_ENCLOSURES_REGEX, '');\n  displayName = displayName.replace(UNWANTED_CHARS_REGEX, '');\n  displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX, ' ');\n  displayName = displayName.trim();\n\n  return displayName;\n}\n\n/**\n * Get (up to 2 characters) initials based on display name of the persona.\n *\n * @param displayName - The full name of the person or entity\n * @param isRtl - Whether the display is in RTL\n * @param options - Extra options to control the behavior of getInitials\n *\n * @returns The 1 or 2 character initials based on the name. Or an empty string if no initials\n * could be derived from the name.\n *\n * @internal\n */\nexport function getInitials(\n  displayName: string | undefined | null,\n  isRtl: boolean,\n  options?: {\n    /** Should initials be generated from phone numbers (default false) */\n    allowPhoneInitials?: boolean;\n\n    /** Returns only the first initial */\n    firstInitialOnly?: boolean;\n  },\n): string {\n  if (!displayName) {\n    return '';\n  }\n\n  displayName = cleanupDisplayName(displayName);\n\n  // For names containing CJK characters, and phone numbers, we don't display initials\n  if (\n    UNSUPPORTED_TEXT_REGEX.test(displayName) ||\n    (!options?.allowPhoneInitials && PHONENUMBER_REGEX.test(displayName))\n  ) {\n    return '';\n  }\n\n  return getInitialsLatin(displayName, isRtl, options?.firstInitialOnly);\n}\n"],"mappings":"AAAA;;GAAA,CAIA;;;MAIA,MAAMA,yBAAA,GAAoC;AAE1C;;;;AAIA,MAAMC,oBAAA,GAA+B;AAErC;;;;AAIA,MAAMC,iBAAA,GAA4B;AAElC;AACA,MAAMC,0BAAA,GAAqC;AAE3C;;;;;;;GAAA,CAQA;AACA,MAAMC,sBAAA,GACJ;AAEF,SAASC,iBAAiBC,WAAmB,EAAEC,KAAc,EAAEC,gBAA0B,EAAU;EACjG,IAAIC,QAAA,GAAW;EAEf,MAAMC,MAAA,GAAmBJ,WAAA,CAAYK,KAAK,CAAC;EAC3C,IAAID,MAAA,CAAOE,MAAM,KAAK,GAAG;IACvBH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;EAC7C;EAEA,IAAI,CAACN,gBAAA,EAAkB;IACrB,IAAIE,MAAA,CAAOE,MAAM,KAAK,GAAG;MACvBH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;IAC7C,OAAO,IAAIJ,MAAA,CAAOE,MAAM,KAAK,GAAG;MAC9BH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;IAC7C;EACF;EAEA,IAAIP,KAAA,IAASE,QAAA,CAASG,MAAM,GAAG,GAAG;IAChC,OAAOH,QAAA,CAASI,MAAM,CAAC,KAAKJ,QAAA,CAASI,MAAM,CAAC;EAC9C;EAEA,OAAOJ,QAAA;AACT;AAEA,SAASM,mBAAmBT,WAAmB,EAAU;EACvDA,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAAChB,yBAAA,EAA2B;EAC7DM,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAACf,oBAAA,EAAsB;EACxDK,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAACb,0BAAA,EAA4B;EAC9DG,WAAA,GAAcA,WAAA,CAAYW,IAAI;EAE9B,OAAOX,WAAA;AACT;AAEA;;;;;;;;;;;;AAYA,OAAO,SAASY,YACdZ,WAAsC,EACtCC,KAAc,EACdY,OAMC,EACO;EACR,IAAI,CAACb,WAAA,EAAa;IAChB,OAAO;EACT;EAEAA,WAAA,GAAcS,kBAAA,CAAmBT,WAAA;EAEjC;EACA,IACEF,sBAAA,CAAuBgB,IAAI,CAACd,WAAA,KAC3B,EAACa,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASE,kBAAkB,CAAD,IAAKnB,iBAAA,CAAkBkB,IAAI,CAACd,WAAA,GACxD;IACA,OAAO;EACT;EAEA,OAAOD,gBAAA,CAAiBC,WAAA,EAAaC,KAAA,EAAOY,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASX,gBAAgB;AACvE"}
+{"version":3,"names":["UNWANTED_ENCLOSURES_REGEX","UNWANTED_CHARS_REGEX","PHONENUMBER_REGEX","MULTIPLE_WHITESPACES_REGEX","UNSUPPORTED_TEXT_REGEX","getInitialsLatin","displayName","isRtl","firstInitialOnly","initials","splits","split","length","charAt","toUpperCase","cleanupDisplayName","replace","trim","getInitials","options","test","allowPhoneInitials"],"sources":["../../src/utils/getInitials.ts"],"sourcesContent":["/**\n * Regular expressions matching characters to ignore when calculating the initials.\n */\n\n/**\n * Regular expression matching characters within various types of enclosures, including the enclosures themselves\n *  so for example, (xyz) [xyz] {xyz} all would be ignored\n */\nconst UNWANTED_ENCLOSURES_REGEX: RegExp = /[\\(\\[\\{][^\\)\\]\\}]*[\\)\\]\\}]/g;\n\n/**\n * Regular expression matching special ASCII characters except space, plus some unicode special characters.\n * Applies after unwanted enclosures have been removed\n */\nconst UNWANTED_CHARS_REGEX: RegExp = /[\\0-\\u001F\\!-/:-@\\[-`\\{-\\u00BF\\u0250-\\u036F\\uD800-\\uFFFF]/g;\n\n/**\n * Regular expression matching phone numbers. Applied after chars matching UNWANTED_CHARS_REGEX have been removed\n * and number has been trimmed for whitespaces\n */\nconst PHONENUMBER_REGEX: RegExp = /^\\d+[\\d\\s]*(:?ext|x|)\\s*\\d+$/i;\n\n/** Regular expression matching one or more spaces. */\nconst MULTIPLE_WHITESPACES_REGEX: RegExp = /\\s+/g;\n\n/**\n * Regular expression matching languages for which we currently don't support initials.\n * Arabic:   Arabic, Arabic Supplement, Arabic Extended-A.\n * Korean:   Hangul Jamo, Hangul Compatibility Jamo, Hangul Jamo Extended-A, Hangul Syllables, Hangul Jamo Extended-B.\n * Japanese: Hiragana, Katakana.\n * CJK:      CJK Unified Ideographs Extension A, CJK Unified Ideographs, CJK Compatibility Ideographs,\n *             CJK Unified Ideographs Extension B\n */\nconst UNSUPPORTED_TEXT_REGEX: RegExp =\n  /[\\u0600-\\u06FF\\u0750-\\u077F\\u08A0-\\u08FF\\u1100-\\u11FF\\u3130-\\u318F\\uA960-\\uA97F\\uAC00-\\uD7AF\\uD7B0-\\uD7FF\\u3040-\\u309F\\u30A0-\\u30FF\\u3400-\\u4DBF\\u4E00-\\u9FFF\\uF900-\\uFAFF]|[\\uD840-\\uD869][\\uDC00-\\uDED6]/;\n\nfunction getInitialsLatin(displayName: string, isRtl: boolean, firstInitialOnly?: boolean): string {\n  let initials = '';\n\n  const splits: string[] = displayName.split(' ');\n  if (splits.length !== 0) {\n    initials += splits[0].charAt(0).toUpperCase();\n  }\n\n  if (!firstInitialOnly) {\n    if (splits.length === 2) {\n      initials += splits[1].charAt(0).toUpperCase();\n    } else if (splits.length === 3) {\n      initials += splits[2].charAt(0).toUpperCase();\n    }\n  }\n\n  if (isRtl && initials.length > 1) {\n    return initials.charAt(1) + initials.charAt(0);\n  }\n\n  return initials;\n}\n\nfunction cleanupDisplayName(displayName: string): string {\n  displayName = displayName.replace(UNWANTED_ENCLOSURES_REGEX, '');\n  displayName = displayName.replace(UNWANTED_CHARS_REGEX, '');\n  displayName = displayName.replace(MULTIPLE_WHITESPACES_REGEX, ' ');\n  displayName = displayName.trim();\n\n  return displayName;\n}\n\n/**\n * Get (up to 2 characters) initials based on display name of the persona.\n *\n * @param displayName - The full name of the person or entity\n * @param isRtl - Whether the display is in RTL\n * @param options - Extra options to control the behavior of getInitials\n *\n * @returns The 1 or 2 character initials based on the name. Or an empty string if no initials\n * could be derived from the name.\n *\n * @internal\n */\nexport function getInitials(\n  displayName: string | undefined | null,\n  isRtl: boolean,\n  options?: {\n    /** Should initials be generated from phone numbers (default false) */\n    allowPhoneInitials?: boolean;\n\n    /** Returns only the first initial */\n    firstInitialOnly?: boolean;\n  },\n): string {\n  if (!displayName) {\n    return '';\n  }\n\n  displayName = cleanupDisplayName(displayName);\n\n  // For names containing CJK characters, and phone numbers, we don't display initials\n  if (\n    UNSUPPORTED_TEXT_REGEX.test(displayName) ||\n    (!options?.allowPhoneInitials && PHONENUMBER_REGEX.test(displayName))\n  ) {\n    return '';\n  }\n\n  return getInitialsLatin(displayName, isRtl, options?.firstInitialOnly);\n}\n"],"mappings":"AAAA;;GAAA,CAIA;;;MAIA,MAAMA,yBAAA,GAAoC;AAE1C;;;;AAIA,MAAMC,oBAAA,GAA+B;AAErC;;;;AAIA,MAAMC,iBAAA,GAA4B;AAElC;AACA,MAAMC,0BAAA,GAAqC;AAE3C;;;;;;;;AAQA,MAAMC,sBAAA,GACJ;AAEF,SAASC,iBAAiBC,WAAmB,EAAEC,KAAc,EAAEC,gBAA0B,EAAU;EACjG,IAAIC,QAAA,GAAW;EAEf,MAAMC,MAAA,GAAmBJ,WAAA,CAAYK,KAAK,CAAC;EAC3C,IAAID,MAAA,CAAOE,MAAM,KAAK,GAAG;IACvBH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;EAC7C;EAEA,IAAI,CAACN,gBAAA,EAAkB;IACrB,IAAIE,MAAA,CAAOE,MAAM,KAAK,GAAG;MACvBH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;IAC7C,OAAO,IAAIJ,MAAA,CAAOE,MAAM,KAAK,GAAG;MAC9BH,QAAA,IAAYC,MAAM,CAAC,EAAE,CAACG,MAAM,CAAC,GAAGC,WAAW;IAC7C;EACF;EAEA,IAAIP,KAAA,IAASE,QAAA,CAASG,MAAM,GAAG,GAAG;IAChC,OAAOH,QAAA,CAASI,MAAM,CAAC,KAAKJ,QAAA,CAASI,MAAM,CAAC;EAC9C;EAEA,OAAOJ,QAAA;AACT;AAEA,SAASM,mBAAmBT,WAAmB,EAAU;EACvDA,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAAChB,yBAAA,EAA2B;EAC7DM,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAACf,oBAAA,EAAsB;EACxDK,WAAA,GAAcA,WAAA,CAAYU,OAAO,CAACb,0BAAA,EAA4B;EAC9DG,WAAA,GAAcA,WAAA,CAAYW,IAAI;EAE9B,OAAOX,WAAA;AACT;AAEA;;;;;;;;;;;;AAYA,OAAO,SAASY,YACdZ,WAAsC,EACtCC,KAAc,EACdY,OAMC,EACO;EACR,IAAI,CAACb,WAAA,EAAa;IAChB,OAAO;EACT;EAEAA,WAAA,GAAcS,kBAAA,CAAmBT,WAAA;EAEjC;EACA,IACEF,sBAAA,CAAuBgB,IAAI,CAACd,WAAA,KAC3B,EAACa,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASE,kBAAkB,CAAD,IAAKnB,iBAAA,CAAkBkB,IAAI,CAACd,WAAA,GACxD;IACA,OAAO;EACT;EAEA,OAAOD,gBAAA,CAAiBC,WAAA,EAAaC,KAAA,EAAOY,OAAA,aAAAA,OAAA,uBAAAA,OAAA,CAASX,gBAAgB;AACvE"}

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

@@ -11,12 +11,11 @@ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
 const _renderAvatar = require("./renderAvatar");
 const _useAvatar = require("./useAvatar");
 const _reactSharedContexts = require("@fluentui/react-shared-contexts");
-const _useAvatarStyles = require("./useAvatarStyles");
+const _useAvatarStylesStyles = require("./useAvatarStyles.styles");
 const Avatar = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useAvatar.useAvatar_unstable)(props, ref);
-    (0, _useAvatarStyles.useAvatarStyles_unstable)(state);
-    const { useAvatarStyles_unstable: useCustomStyles  } = (0, _reactSharedContexts.useCustomStyleHooks_unstable)();
-    useCustomStyles(state);
+    (0, _useAvatarStylesStyles.useAvatarStyles_unstable)(state);
+    (0, _reactSharedContexts.useCustomStyleHook_unstable)('useAvatarStyles_unstable')(state);
     return (0, _renderAvatar.renderAvatar_unstable)(state);
 });
 Avatar.displayName = 'Avatar'; //# sourceMappingURL=Avatar.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Avatar/Avatar.js"],"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';\nexport const Avatar = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useAvatar_unstable(props, ref);\n  useAvatarStyles_unstable(state);\n  const {\n    useAvatarStyles_unstable: useCustomStyles\n  } = useCustomStyleHooks_unstable();\n  useCustomStyles(state);\n  return renderAvatar_unstable(state);\n});\nAvatar.displayName = 'Avatar';\n//# sourceMappingURL=Avatar.js.map"],"names":["Avatar","React","forwardRef","props","ref","state","useAvatar_unstable","useAvatarStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderAvatar_unstable","displayName"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;8BACe;2BACH;qCACU;iCACJ;AAClC,MAAMA,SAAS,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAClE,MAAMC,QAAQC,IAAAA,6BAAkB,EAACH,OAAOC;IACxCG,IAAAA,yCAAwB,EAACF;IACzB,MAAM,EACJE,0BAA0BC,gBAAe,EAC1C,GAAGC,IAAAA,iDAA4B;IAChCD,gBAAgBH;IAChB,OAAOK,IAAAA,mCAAqB,EAACL;AAC/B;AACAL,OAAOW,WAAW,GAAG,UACrB,kCAAkC"}
+{"version":3,"sources":["../../../lib/components/Avatar/Avatar.js"],"sourcesContent":["import * as React from 'react';\nimport { renderAvatar_unstable } from './renderAvatar';\nimport { useAvatar_unstable } from './useAvatar';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\nimport { useAvatarStyles_unstable } from './useAvatarStyles.styles';\nexport const Avatar = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useAvatar_unstable(props, ref);\n  useAvatarStyles_unstable(state);\n  useCustomStyleHook_unstable('useAvatarStyles_unstable')(state);\n  return renderAvatar_unstable(state);\n});\nAvatar.displayName = 'Avatar';\n//# sourceMappingURL=Avatar.js.map"],"names":["Avatar","React","forwardRef","props","ref","state","useAvatar_unstable","useAvatarStyles_unstable","useCustomStyleHook_unstable","renderAvatar_unstable","displayName"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;8BACe;2BACH;qCACS;uCACH;AAClC,MAAMA,SAAS,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IAClE,MAAMC,QAAQC,IAAAA,6BAAkB,EAACH,OAAOC;IACxCG,IAAAA,+CAAwB,EAACF;IACzBG,IAAAA,gDAA2B,EAAC,4BAA4BH;IACxD,OAAOI,IAAAA,mCAAqB,EAACJ;AAC/B;AACAL,OAAOU,WAAW,GAAG,UACrB,kCAAkC"}

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

@@ -7,7 +7,7 @@ _exportStar(require("./Avatar.types"), exports);
 _exportStar(require("./Avatar"), exports);
 _exportStar(require("./renderAvatar"), exports);
 _exportStar(require("./useAvatar"), exports);
-_exportStar(require("./useAvatarStyles"), exports);
+_exportStar(require("./useAvatarStyles.styles"), exports);
  //# sourceMappingURL=index.js.map
 
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Avatar/index.js"],"sourcesContent":["export * from './Avatar.types';\nexport * from './Avatar';\nexport * from './renderAvatar';\nexport * from './useAvatar';\nexport * from './useAvatarStyles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
+{"version":3,"sources":["../../../lib/components/Avatar/index.js"],"sourcesContent":["export * from './Avatar.types';\nexport * from './Avatar';\nexport * from './renderAvatar';\nexport * from './useAvatar';\nexport * from './useAvatarStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}