@fluentui-copilot/react-attachments 0.9.3 → 0.9.5

package/lib/components/AttachmentList/useAttachmentList.js

@@ -1,7 +1,11 @@
 import * as React from 'react';
-import { getIntrinsicElementProps, slot, useArrowNavigationGroup, useEventCallback, useFocusFinders, useMergedRefs } from '@fluentui/react-components';
+import { getIntrinsicElementProps, mergeClasses, slot, useArrowNavigationGroup, useEventCallback, useFocusFinders, useMergedRefs } from '@fluentui/react-components';
 import { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';
-import { useOverflowContext } from '@fluentui/react-overflow';
+import { useTimeout } from '@fluentui/react-utilities';
+import { useOverflowStyles as useAttachmentOverflowStyles } from '../Attachment';
+import { AttachmentOverflowMenuButton } from '../AttachmentOverflowMenuButton';
+import { AttachmentOverflowMenuItem } from '../AttachmentOverflowMenuItem';
+import { attachmentOverflowMenuButtonClassNames } from '../AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles';
 /**
  * Create the state required to render AttachmentList.
  *
@@ -13,25 +17,28 @@ import { useOverflowContext } from '@fluentui/react-overflow';
  */
 export const useAttachmentList_unstable = (props, ref) => {
   const {
-    onAttachmentDismiss
+    children,
+    maxVisibleAttachments,
+    onAttachmentDismiss,
+    overflowMenuProps
   } = props;
-  const attachmentsVisibilityStatus = useOverflowContext(context => context.itemVisibility);
   const innerRef = React.useRef(null);
+  const [setTimeout] = useTimeout();
   const {
     targetDocument
   } = useFluent();
   const {
     findNextFocusable,
-    findPrevFocusable
+    findPrevFocusable,
+    findLastFocusable
   } = useFocusFinders();
+  const [attachments, setAttachments] = React.useState([]);
   const handleAttachmentDismiss = useEventCallback((e, data) => {
     var _innerRef_current;
     if (!onAttachmentDismiss) {
       return;
     }
     onAttachmentDismiss(e, data);
-    // Remove attachment from overflow context
-    attachmentsVisibilityStatus === null || attachmentsVisibilityStatus === void 0 ? true : delete attachmentsVisibilityStatus[data.id];
     // set focus after attachment dismiss
     const activeElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.activeElement;
     if ((_innerRef_current = innerRef.current) === null || _innerRef_current === void 0 ? void 0 : _innerRef_current.contains(activeElement)) {
@@ -40,34 +47,95 @@ export const useAttachmentList_unstable = (props, ref) => {
         container: innerRef.current
       });
       if (next) {
-        next.focus();
-        return;
+        // focus on the overflow button if the next focusable element is the overflow button.
+        // if overflow button is removed from the DOM, focus on the last focusable element in the attachment list.
+        if (next.classList.contains(attachmentOverflowMenuButtonClassNames.root)) {
+          setTimeout(() => {
+            var _findLastFocusable;
+            (_findLastFocusable = findLastFocusable(innerRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
+          }, 0);
+        } else {
+          next.focus();
+        }
       } else {
         const prev = findPrevFocusable(activeElement === null || activeElement === void 0 ? void 0 : activeElement.parentElement, {
           container: innerRef.current
         });
         prev === null || prev === void 0 ? void 0 : prev.focus();
       }
+    } else {
+      // Handles keyboard focus when attachment removed is in the overflow menu. Also handles focus when the overflow button is removed from the DOM.
+      setTimeout(() => {
+        var _findLastFocusable;
+        (_findLastFocusable = findLastFocusable(innerRef.current)) === null || _findLastFocusable === void 0 ? void 0 : _findLastFocusable.focus();
+      }, 0);
     }
   });
+  const attachmentOverflowClassName = useAttachmentOverflowStyles().overflow;
+  const resolvedChildren = React.useMemo(() => {
+    if (maxVisibleAttachments !== undefined) {
+      const results = [];
+      const childrenArray = React.Children.toArray(children);
+      for (let index = 0; index < childrenArray.length; index++) {
+        const child = childrenArray[index];
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        if (index >= maxVisibleAttachments && /*#__PURE__*/React.isValidElement(child)) {
+          results.push( /*#__PURE__*/React.cloneElement(child, {
+            ...child.props,
+            className: mergeClasses(child.props.className, attachmentOverflowClassName)
+          }));
+        } else {
+          results.push(child);
+        }
+      }
+      return results;
+    }
+    return children;
+  }, [attachmentOverflowClassName, children, maxVisibleAttachments]);
+  React.useEffect(() => {
+    if (resolvedChildren && Array.isArray(resolvedChildren)) {
+      setAttachments(resolvedChildren.map(child => child.props));
+    }
+  }, [resolvedChildren]);
   const arrowNavigationProps = useArrowNavigationGroup({
     circular: true,
     axis: 'both',
     memorizeCurrent: true
   });
+  const shouldUseOverflow = maxVisibleAttachments !== undefined;
   return {
+    attachments,
     onAttachmentDismiss: handleAttachmentDismiss,
+    shouldUseOverflow,
+    overflowMenuProps,
     components: {
-      root: 'div'
+      root: 'div',
+      overflowMenuButton: 'span',
+      overflowMenuItem: 'span'
     },
     root: slot.always(getIntrinsicElementProps('div', {
       'aria-label': 'Attachments',
       ref: useMergedRefs(ref, innerRef),
       role: 'toolbar',
       ...arrowNavigationProps,
-      ...props
+      ...props,
+      children: resolvedChildren
     }), {
       elementType: 'div'
+    }),
+    overflowMenuButton: slot.optional(props.overflowMenuButton, {
+      defaultProps: {
+        children: /*#__PURE__*/React.createElement(AttachmentOverflowMenuButton, null)
+      },
+      elementType: 'span',
+      renderByDefault: true
+    }),
+    overflowMenuItem: slot.optional(props.overflowMenuItem, {
+      defaultProps: {
+        children: /*#__PURE__*/React.createElement(AttachmentOverflowMenuItem, null)
+      },
+      elementType: 'span',
+      renderByDefault: true
     })
   };
 };

package/lib/components/AttachmentList/useAttachmentList.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAttachmentList.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  getIntrinsicElementProps,\n  slot,\n  useArrowNavigationGroup,\n  useEventCallback,\n  useFocusFinders,\n  useMergedRefs,\n} from '@fluentui/react-components';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useOverflowContext } from '@fluentui/react-overflow';\nimport type { AttachmentListProps, AttachmentListState } from './AttachmentList.types';\n\n/**\n * Create the state required to render AttachmentList.\n *\n * The returned state can be modified with hooks such as useAttachmentListStyles_unstable,\n * before being passed to renderAttachmentList_unstable.\n *\n * @param props - props from this instance of AttachmentList\n * @param ref - reference to root HTMLElement of AttachmentList\n */\nexport const useAttachmentList_unstable = (\n  props: AttachmentListProps,\n  ref: React.Ref<HTMLDivElement>,\n): AttachmentListState => {\n  const { onAttachmentDismiss } = props;\n\n  const attachmentsVisibilityStatus: Record<string, boolean> = useOverflowContext(context => context.itemVisibility);\n\n  const innerRef = React.useRef<HTMLDivElement>(null);\n  const { targetDocument } = useFluent();\n  const { findNextFocusable, findPrevFocusable } = useFocusFinders();\n\n  const handleAttachmentDismiss: AttachmentListState['onAttachmentDismiss'] = useEventCallback((e, data) => {\n    if (!onAttachmentDismiss) {\n      return;\n    }\n\n    onAttachmentDismiss(e, data);\n\n    // Remove attachment from overflow context\n    delete attachmentsVisibilityStatus?.[data.id];\n\n    // set focus after attachment dismiss\n    const activeElement = targetDocument?.activeElement;\n    if (innerRef.current?.contains(activeElement as HTMLElement)) {\n      // focus on next attachment only if the active element is within the current attachment list\n      const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n\n      if (next) {\n        next.focus();\n        return;\n      } else {\n        const prev = findPrevFocusable(activeElement?.parentElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    }\n  });\n\n  const arrowNavigationProps = useArrowNavigationGroup({\n    circular: true,\n    axis: 'both',\n    memorizeCurrent: true,\n  });\n\n  return {\n    onAttachmentDismiss: handleAttachmentDismiss,\n    components: {\n      root: 'div',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        'aria-label': 'Attachments',\n        ref: useMergedRefs(ref, innerRef),\n        role: 'toolbar',\n        ...arrowNavigationProps,\n        ...props,\n      }),\n      { elementType: 'div' },\n    ),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useArrowNavigationGroup","useEventCallback","useFocusFinders","useMergedRefs","useFluent_unstable","useFluent","useOverflowContext","useAttachmentList_unstable","props","ref","onAttachmentDismiss","attachmentsVisibilityStatus","context","itemVisibility","innerRef","useRef","targetDocument","findNextFocusable","findPrevFocusable","handleAttachmentDismiss","e","data","id","activeElement","current","contains","next","container","focus","prev","parentElement","arrowNavigationProps","circular","axis","memorizeCurrent","components","root","always","role","elementType"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,wBAAwB,EACxBC,IAAI,EACJC,uBAAuB,EACvBC,gBAAgB,EAChBC,eAAe,EACfC,aAAa,QACR,6BAA6B;AACpC,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,kBAAkB,QAAQ,2BAA2B;AAG9D;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,mBAAmB,EAAE,GAAGF;IAEhC,MAAMG,8BAAuDL,mBAAmBM,CAAAA,UAAWA,QAAQC,cAAc;IAEjH,MAAMC,WAAWjB,MAAMkB,MAAM,CAAiB;IAC9C,MAAM,EAAEC,cAAc,EAAE,GAAGX;IAC3B,MAAM,EAAEY,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGhB;IAEjD,MAAMiB,0BAAsElB,iBAAiB,CAACmB,GAAGC;YAY3FP;QAXJ,IAAI,CAACJ,qBAAqB;YACxB;QACF;QAEAA,oBAAoBU,GAAGC;QAEvB,0CAA0C;QACnCV,wCAAAA,uDAAAA,2BAA6B,CAACU,KAAKC,EAAE,CAAC;QAE7C,qCAAqC;QACrC,MAAMC,gBAAgBP,2BAAAA,qCAAAA,eAAgBO,aAAa;QACnD,KAAIT,oBAAAA,SAASU,OAAO,cAAhBV,wCAAAA,kBAAkBW,QAAQ,CAACF,gBAA+B;YAC5D,4FAA4F;YAC5F,MAAMG,OAAOT,kBAAkBM,eAA8B;gBAAEI,WAAWb,SAASU,OAAO;YAAC;YAE3F,IAAIE,MAAM;gBACRA,KAAKE,KAAK;gBACV;YACF,OAAO;gBACL,MAAMC,OAAOX,kBAAkBK,0BAAAA,oCAAAA,cAAeO,aAAa,EAAiB;oBAAEH,WAAWb,SAASU,OAAO;gBAAC;gBAC1GK,iBAAAA,2BAAAA,KAAMD,KAAK;YACb;QACF;IACF;IAEA,MAAMG,uBAAuB/B,wBAAwB;QACnDgC,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,OAAO;QACLxB,qBAAqBS;QACrBgB,YAAY;YACVC,MAAM;QACR;QACAA,MAAMrC,KAAKsC,MAAM,CACfvC,yBAAyB,OAAO;YAC9B,cAAc;YACdW,KAAKN,cAAcM,KAAKK;YACxBwB,MAAM;YACN,GAAGP,oBAAoB;YACvB,GAAGvB,KAAK;QACV,IACA;YAAE+B,aAAa;QAAM;IAEzB;AACF,EAAE"}
+{"version":3,"sources":["useAttachmentList.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  getIntrinsicElementProps,\n  mergeClasses,\n  slot,\n  useArrowNavigationGroup,\n  useEventCallback,\n  useFocusFinders,\n  useMergedRefs,\n} from '@fluentui/react-components';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport { useTimeout } from '@fluentui/react-utilities';\nimport { useOverflowStyles as useAttachmentOverflowStyles } from '../Attachment';\nimport { AttachmentOverflowMenuButton } from '../AttachmentOverflowMenuButton';\nimport { AttachmentOverflowMenuItem } from '../AttachmentOverflowMenuItem';\nimport { attachmentOverflowMenuButtonClassNames } from '../AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles';\nimport type { AttachmentListProps, AttachmentListState } from './AttachmentList.types';\nimport type { AttachmentProps } from '../Attachment';\n\n/**\n * Create the state required to render AttachmentList.\n *\n * The returned state can be modified with hooks such as useAttachmentListStyles_unstable,\n * before being passed to renderAttachmentList_unstable.\n *\n * @param props - props from this instance of AttachmentList\n * @param ref - reference to root HTMLElement of AttachmentList\n */\nexport const useAttachmentList_unstable = (\n  props: AttachmentListProps,\n  ref: React.Ref<HTMLDivElement>,\n): AttachmentListState => {\n  const { children, maxVisibleAttachments, onAttachmentDismiss, overflowMenuProps } = props;\n  const innerRef = React.useRef<HTMLDivElement>(null);\n  const [setTimeout] = useTimeout();\n  const { targetDocument } = useFluent();\n  const { findNextFocusable, findPrevFocusable, findLastFocusable } = useFocusFinders();\n  const [attachments, setAttachments] = React.useState<AttachmentProps[]>([]);\n  const handleAttachmentDismiss: AttachmentListState['onAttachmentDismiss'] = useEventCallback((e, data) => {\n    if (!onAttachmentDismiss) {\n      return;\n    }\n\n    onAttachmentDismiss(e, data);\n\n    // set focus after attachment dismiss\n    const activeElement = targetDocument?.activeElement;\n    if (innerRef.current?.contains(activeElement as HTMLElement)) {\n      // focus on next attachment only if the active element is within the current attachment list\n      const next = findNextFocusable(activeElement as HTMLElement, { container: innerRef.current });\n      if (next) {\n        // focus on the overflow button if the next focusable element is the overflow button.\n        // if overflow button is removed from the DOM, focus on the last focusable element in the attachment list.\n        if (next.classList.contains(attachmentOverflowMenuButtonClassNames.root)) {\n          setTimeout(() => {\n            findLastFocusable(innerRef.current as HTMLElement)?.focus();\n          }, 0);\n        } else {\n          next.focus();\n        }\n      } else {\n        const prev = findPrevFocusable(activeElement?.parentElement as HTMLElement, { container: innerRef.current });\n        prev?.focus();\n      }\n    } else {\n      // Handles keyboard focus when attachment removed is in the overflow menu. Also handles focus when the overflow button is removed from the DOM.\n      setTimeout(() => {\n        findLastFocusable(innerRef.current as HTMLElement)?.focus();\n      }, 0);\n    }\n  });\n\n  const attachmentOverflowClassName = useAttachmentOverflowStyles().overflow;\n  const resolvedChildren = React.useMemo(() => {\n    if (maxVisibleAttachments !== undefined) {\n      const results = [];\n      const childrenArray = React.Children.toArray(children);\n      for (let index = 0; index < childrenArray.length; index++) {\n        const child = childrenArray[index] as React.ReactElement;\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n        if (index >= maxVisibleAttachments && React.isValidElement<any>(child)) {\n          results.push(\n            React.cloneElement(child, {\n              ...child.props,\n              className: mergeClasses(child.props.className, attachmentOverflowClassName),\n            }),\n          );\n        } else {\n          results.push(child);\n        }\n      }\n\n      return results;\n    }\n    return children;\n  }, [attachmentOverflowClassName, children, maxVisibleAttachments]);\n\n  React.useEffect(() => {\n    if (resolvedChildren && Array.isArray(resolvedChildren)) {\n      setAttachments(resolvedChildren.map(child => child.props));\n    }\n  }, [resolvedChildren]);\n\n  const arrowNavigationProps = useArrowNavigationGroup({\n    circular: true,\n    axis: 'both',\n    memorizeCurrent: true,\n  });\n\n  const shouldUseOverflow = maxVisibleAttachments !== undefined;\n\n  return {\n    attachments,\n    onAttachmentDismiss: handleAttachmentDismiss,\n    shouldUseOverflow,\n    overflowMenuProps,\n    components: {\n      root: 'div',\n      overflowMenuButton: 'span',\n      overflowMenuItem: 'span',\n    },\n    root: slot.always(\n      getIntrinsicElementProps('div', {\n        'aria-label': 'Attachments',\n        ref: useMergedRefs(ref, innerRef),\n        role: 'toolbar',\n        ...arrowNavigationProps,\n        ...props,\n        children: resolvedChildren,\n      }),\n      { elementType: 'div' },\n    ),\n    overflowMenuButton: slot.optional(props.overflowMenuButton, {\n      defaultProps: { children: <AttachmentOverflowMenuButton /> },\n      elementType: 'span',\n      renderByDefault: true,\n    }),\n    overflowMenuItem: slot.optional(props.overflowMenuItem, {\n      defaultProps: { children: <AttachmentOverflowMenuItem /> },\n      elementType: 'span',\n      renderByDefault: true,\n    }),\n  };\n};\n"],"names":["React","getIntrinsicElementProps","mergeClasses","slot","useArrowNavigationGroup","useEventCallback","useFocusFinders","useMergedRefs","useFluent_unstable","useFluent","useTimeout","useOverflowStyles","useAttachmentOverflowStyles","AttachmentOverflowMenuButton","AttachmentOverflowMenuItem","attachmentOverflowMenuButtonClassNames","useAttachmentList_unstable","props","ref","children","maxVisibleAttachments","onAttachmentDismiss","overflowMenuProps","innerRef","useRef","setTimeout","targetDocument","findNextFocusable","findPrevFocusable","findLastFocusable","attachments","setAttachments","useState","handleAttachmentDismiss","e","data","activeElement","current","contains","next","container","classList","root","focus","prev","parentElement","attachmentOverflowClassName","overflow","resolvedChildren","useMemo","undefined","results","childrenArray","Children","toArray","index","length","child","isValidElement","push","cloneElement","className","useEffect","Array","isArray","map","arrowNavigationProps","circular","axis","memorizeCurrent","shouldUseOverflow","components","overflowMenuButton","overflowMenuItem","always","role","elementType","optional","defaultProps","renderByDefault"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,wBAAwB,EACxBC,YAAY,EACZC,IAAI,EACJC,uBAAuB,EACvBC,gBAAgB,EAChBC,eAAe,EACfC,aAAa,QACR,6BAA6B;AACpC,SAASC,sBAAsBC,SAAS,QAAQ,kCAAkC;AAClF,SAASC,UAAU,QAAQ,4BAA4B;AACvD,SAASC,qBAAqBC,2BAA2B,QAAQ,gBAAgB;AACjF,SAASC,4BAA4B,QAAQ,kCAAkC;AAC/E,SAASC,0BAA0B,QAAQ,gCAAgC;AAC3E,SAASC,sCAAsC,QAAQ,+EAA+E;AAItI;;;;;;;;CAQC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,qBAAqB,EAAEC,mBAAmB,EAAEC,iBAAiB,EAAE,GAAGL;IACpF,MAAMM,WAAWvB,MAAMwB,MAAM,CAAiB;IAC9C,MAAM,CAACC,WAAW,GAAGf;IACrB,MAAM,EAAEgB,cAAc,EAAE,GAAGjB;IAC3B,MAAM,EAAEkB,iBAAiB,EAAEC,iBAAiB,EAAEC,iBAAiB,EAAE,GAAGvB;IACpE,MAAM,CAACwB,aAAaC,eAAe,GAAG/B,MAAMgC,QAAQ,CAAoB,EAAE;IAC1E,MAAMC,0BAAsE5B,iBAAiB,CAAC6B,GAAGC;YAS3FZ;QARJ,IAAI,CAACF,qBAAqB;YACxB;QACF;QAEAA,oBAAoBa,GAAGC;QAEvB,qCAAqC;QACrC,MAAMC,gBAAgBV,2BAAAA,qCAAAA,eAAgBU,aAAa;QACnD,KAAIb,oBAAAA,SAASc,OAAO,cAAhBd,wCAAAA,kBAAkBe,QAAQ,CAACF,gBAA+B;YAC5D,4FAA4F;YAC5F,MAAMG,OAAOZ,kBAAkBS,eAA8B;gBAAEI,WAAWjB,SAASc,OAAO;YAAC;YAC3F,IAAIE,MAAM;gBACR,qFAAqF;gBACrF,0GAA0G;gBAC1G,IAAIA,KAAKE,SAAS,CAACH,QAAQ,CAACvB,uCAAuC2B,IAAI,GAAG;oBACxEjB,WAAW;4BACTI;yBAAAA,qBAAAA,kBAAkBN,SAASc,OAAO,eAAlCR,yCAAAA,mBAAoDc,KAAK;oBAC3D,GAAG;gBACL,OAAO;oBACLJ,KAAKI,KAAK;gBACZ;YACF,OAAO;gBACL,MAAMC,OAAOhB,kBAAkBQ,0BAAAA,oCAAAA,cAAeS,aAAa,EAAiB;oBAAEL,WAAWjB,SAASc,OAAO;gBAAC;gBAC1GO,iBAAAA,2BAAAA,KAAMD,KAAK;YACb;QACF,OAAO;YACL,+IAA+I;YAC/IlB,WAAW;oBACTI;iBAAAA,qBAAAA,kBAAkBN,SAASc,OAAO,eAAlCR,yCAAAA,mBAAoDc,KAAK;YAC3D,GAAG;QACL;IACF;IAEA,MAAMG,8BAA8BlC,8BAA8BmC,QAAQ;IAC1E,MAAMC,mBAAmBhD,MAAMiD,OAAO,CAAC;QACrC,IAAI7B,0BAA0B8B,WAAW;YACvC,MAAMC,UAAU,EAAE;YAClB,MAAMC,gBAAgBpD,MAAMqD,QAAQ,CAACC,OAAO,CAACnC;YAC7C,IAAK,IAAIoC,QAAQ,GAAGA,QAAQH,cAAcI,MAAM,EAAED,QAAS;gBACzD,MAAME,QAAQL,aAAa,CAACG,MAAM;gBAClC,8DAA8D;gBAC9D,IAAIA,SAASnC,uCAAyBpB,MAAM0D,cAAc,CAAMD,QAAQ;oBACtEN,QAAQQ,IAAI,eACV3D,MAAM4D,YAAY,CAACH,OAAO;wBACxB,GAAGA,MAAMxC,KAAK;wBACd4C,WAAW3D,aAAauD,MAAMxC,KAAK,CAAC4C,SAAS,EAAEf;oBACjD;gBAEJ,OAAO;oBACLK,QAAQQ,IAAI,CAACF;gBACf;YACF;YAEA,OAAON;QACT;QACA,OAAOhC;IACT,GAAG;QAAC2B;QAA6B3B;QAAUC;KAAsB;IAEjEpB,MAAM8D,SAAS,CAAC;QACd,IAAId,oBAAoBe,MAAMC,OAAO,CAAChB,mBAAmB;YACvDjB,eAAeiB,iBAAiBiB,GAAG,CAACR,CAAAA,QAASA,MAAMxC,KAAK;QAC1D;IACF,GAAG;QAAC+B;KAAiB;IAErB,MAAMkB,uBAAuB9D,wBAAwB;QACnD+D,UAAU;QACVC,MAAM;QACNC,iBAAiB;IACnB;IAEA,MAAMC,oBAAoBlD,0BAA0B8B;IAEpD,OAAO;QACLpB;QACAT,qBAAqBY;QACrBqC;QACAhD;QACAiD,YAAY;YACV7B,MAAM;YACN8B,oBAAoB;YACpBC,kBAAkB;QACpB;QACA/B,MAAMvC,KAAKuE,MAAM,CACfzE,yBAAyB,OAAO;YAC9B,cAAc;YACdiB,KAAKX,cAAcW,KAAKK;YACxBoD,MAAM;YACN,GAAGT,oBAAoB;YACvB,GAAGjD,KAAK;YACRE,UAAU6B;QACZ,IACA;YAAE4B,aAAa;QAAM;QAEvBJ,oBAAoBrE,KAAK0E,QAAQ,CAAC5D,MAAMuD,kBAAkB,EAAE;YAC1DM,cAAc;gBAAE3D,wBAAU,oBAACN;YAAgC;YAC3D+D,aAAa;YACbG,iBAAiB;QACnB;QACAN,kBAAkBtE,KAAK0E,QAAQ,CAAC5D,MAAMwD,gBAAgB,EAAE;YACtDK,cAAc;gBAAE3D,wBAAU,oBAACL;YAA8B;YACzD8D,aAAa;YACbG,iBAAiB;QACnB;IACF;AACF,EAAE"}

package/lib/components/AttachmentList/useAttachmentListContextValues.js

@@ -1,10 +1,12 @@
 export function useAttachmentListContextValues_unstable(state) {
   const {
-    onAttachmentDismiss
+    onAttachmentDismiss,
+    shouldUseOverflow
   } = state;
   // This context is created with "@fluentui/react-context-selector", there is no sense to memoize it
   const attachmentList = {
-    onAttachmentDismiss
+    onAttachmentDismiss,
+    shouldUseOverflow
   };
   return {
     attachmentList

package/lib/components/AttachmentList/useAttachmentListContextValues.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAttachmentListContextValues.ts"],"sourcesContent":["import type { AttachmentListContextValues, AttachmentListState } from './AttachmentList.types';\n\nexport function useAttachmentListContextValues_unstable(state: AttachmentListState): AttachmentListContextValues {\n  const { onAttachmentDismiss } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", there is no sense to memoize it\n  const attachmentList = {\n    onAttachmentDismiss,\n  };\n\n  return { attachmentList };\n}\n"],"names":["useAttachmentListContextValues_unstable","state","onAttachmentDismiss","attachmentList"],"rangeMappings":";;;;;;;;;","mappings":"AAEA,OAAO,SAASA,wCAAwCC,KAA0B;IAChF,MAAM,EAAEC,mBAAmB,EAAE,GAAGD;IAEhC,mGAAmG;IACnG,MAAME,iBAAiB;QACrBD;IACF;IAEA,OAAO;QAAEC;IAAe;AAC1B"}
+{"version":3,"sources":["useAttachmentListContextValues.ts"],"sourcesContent":["import type { AttachmentListContextValues, AttachmentListState } from './AttachmentList.types';\n\nexport function useAttachmentListContextValues_unstable(state: AttachmentListState): AttachmentListContextValues {\n  const { onAttachmentDismiss, shouldUseOverflow } = state;\n\n  // This context is created with \"@fluentui/react-context-selector\", there is no sense to memoize it\n  const attachmentList = {\n    onAttachmentDismiss,\n    shouldUseOverflow,\n  };\n\n  return { attachmentList };\n}\n"],"names":["useAttachmentListContextValues_unstable","state","onAttachmentDismiss","shouldUseOverflow","attachmentList"],"rangeMappings":";;;;;;;;;;","mappings":"AAEA,OAAO,SAASA,wCAAwCC,KAA0B;IAChF,MAAM,EAAEC,mBAAmB,EAAEC,iBAAiB,EAAE,GAAGF;IAEnD,mGAAmG;IACnG,MAAMG,iBAAiB;QACrBF;QACAC;IACF;IAEA,OAAO;QAAEC;IAAe;AAC1B"}

package/lib/components/AttachmentList/{useAttachmentListStyles.js → useAttachmentListStyles.styles.js}

@@ -1,14 +1,24 @@
 import { __resetStyles, mergeClasses, tokens } from '@fluentui/react-components';
 export const attachmentListClassNames = {
-  root: 'fai-AttachmentList'
+  root: 'fai-AttachmentList',
+  overflowMenuButton: 'fai-AttachmentList__overflowMenuButton',
+  overflowMenuItem: 'fai-AttachmentList__overflowMenuItem'
 };
 const useRootBaseClassName = __resetStyles("r168fwfa", null, [".r168fwfa{column-gap:var(--spacingHorizontalSNudge);display:flex;flex-direction:row;flex-shrink:0;flex-wrap:wrap;row-gap:var(--spacingVerticalXS);}"]);
 /**
  * Apply styling to the AttachmentList slots based on the state
  */
 export const useAttachmentListStyles_unstable = state => {
+  'use no memo';
+
   const rootBaseClassName = useRootBaseClassName();
   state.root.className = mergeClasses(attachmentListClassNames.root, rootBaseClassName, state.root.className);
+  if (state.overflowMenuButton) {
+    state.overflowMenuButton.className = mergeClasses(attachmentListClassNames.overflowMenuButton, state.overflowMenuButton.className);
+  }
+  if (state.overflowMenuItem) {
+    state.overflowMenuItem.className = mergeClasses(attachmentListClassNames.overflowMenuItem, state.overflowMenuItem.className);
+  }
   return state;
 };
-//# sourceMappingURL=useAttachmentListStyles.js.map
+//# sourceMappingURL=useAttachmentListStyles.styles.js.map

package/lib/components/AttachmentList/useAttachmentListStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAttachmentListStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, tokens } from '@fluentui/react-components';\nimport type { AttachmentListSlots, AttachmentListState } from './AttachmentList.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentListClassNames: SlotClassNames<AttachmentListSlots> = {\n  root: 'fai-AttachmentList',\n  overflowMenuButton: 'fai-AttachmentList__overflowMenuButton',\n  overflowMenuItem: 'fai-AttachmentList__overflowMenuItem',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  columnGap: tokens.spacingHorizontalSNudge,\n  display: 'flex',\n  flexDirection: 'row',\n  flexShrink: 0,\n  flexWrap: 'wrap',\n  rowGap: tokens.spacingVerticalXS,\n});\n\n/**\n * Apply styling to the AttachmentList slots based on the state\n */\nexport const useAttachmentListStyles_unstable = (state: AttachmentListState): AttachmentListState => {\n  'use no memo';\n\n  const rootBaseClassName = useRootBaseClassName();\n  state.root.className = mergeClasses(attachmentListClassNames.root, rootBaseClassName, state.root.className);\n\n  if (state.overflowMenuButton) {\n    state.overflowMenuButton.className = mergeClasses(\n      attachmentListClassNames.overflowMenuButton,\n      state.overflowMenuButton.className,\n    );\n  }\n\n  if (state.overflowMenuItem) {\n    state.overflowMenuItem.className = mergeClasses(\n      attachmentListClassNames.overflowMenuItem,\n      state.overflowMenuItem.className,\n    );\n  }\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","tokens","attachmentListClassNames","root","overflowMenuButton","overflowMenuItem","useRootBaseClassName","columnGap","spacingHorizontalSNudge","display","flexDirection","flexShrink","flexWrap","rowGap","spacingVerticalXS","useAttachmentListStyles_unstable","state","rootBaseClassName","className"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,MAAM,QAAQ,6BAA6B;AAInF,OAAO,MAAMC,2BAAgE;IAC3EC,MAAM;IACNC,oBAAoB;IACpBC,kBAAkB;AACpB,EAAE;AAEF,MAAMC,uBAAuBP,gBAAgB;IAC3CQ,WAAWN,OAAOO,uBAAuB;IACzCC,SAAS;IACTC,eAAe;IACfC,YAAY;IACZC,UAAU;IACVC,QAAQZ,OAAOa,iBAAiB;AAClC;AAEA;;CAEC,GACD,OAAO,MAAMC,mCAAmC,CAACC;IAC/C;IAEA,MAAMC,oBAAoBX;IAC1BU,MAAMb,IAAI,CAACe,SAAS,GAAGlB,aAAaE,yBAAyBC,IAAI,EAAEc,mBAAmBD,MAAMb,IAAI,CAACe,SAAS;IAE1G,IAAIF,MAAMZ,kBAAkB,EAAE;QAC5BY,MAAMZ,kBAAkB,CAACc,SAAS,GAAGlB,aACnCE,yBAAyBE,kBAAkB,EAC3CY,MAAMZ,kBAAkB,CAACc,SAAS;IAEtC;IAEA,IAAIF,MAAMX,gBAAgB,EAAE;QAC1BW,MAAMX,gBAAgB,CAACa,SAAS,GAAGlB,aACjCE,yBAAyBG,gBAAgB,EACzCW,MAAMX,gBAAgB,CAACa,SAAS;IAEpC;IACA,OAAOF;AACT,EAAE"}

package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useAttachmentOverflowMenuButton_unstable } from './useAttachmentOverflowMenuButton';
 import { renderAttachmentOverflowMenuButton_unstable } from './renderAttachmentOverflowMenuButton';
-import { useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles';
+import { useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles.styles';
 export const AttachmentOverflowMenuButton = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useAttachmentOverflowMenuButton_unstable(props, ref);
   useAttachmentOverflowMenuButtonStyles_unstable(state);

package/lib/components/AttachmentOverflowMenuButton/AttachmentOverflowMenuButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AttachmentOverflowMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentOverflowMenuButton_unstable } from './useAttachmentOverflowMenuButton';\nimport { renderAttachmentOverflowMenuButton_unstable } from './renderAttachmentOverflowMenuButton';\nimport { useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles';\nimport type { AttachmentOverflowMenuButtonProps } from './AttachmentOverflowMenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\nexport const AttachmentOverflowMenuButton: ForwardRefComponent<AttachmentOverflowMenuButtonProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useAttachmentOverflowMenuButton_unstable(props, ref);\n\n    useAttachmentOverflowMenuButtonStyles_unstable(state);\n    return renderAttachmentOverflowMenuButton_unstable(state);\n  },\n);\n\nAttachmentOverflowMenuButton.displayName = 'AttachmentOverflowMenuButton';\n"],"names":["React","useAttachmentOverflowMenuButton_unstable","renderAttachmentOverflowMenuButton_unstable","useAttachmentOverflowMenuButtonStyles_unstable","AttachmentOverflowMenuButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wCAAwC,QAAQ,oCAAoC;AAC7F,SAASC,2CAA2C,QAAQ,uCAAuC;AACnG,SAASC,8CAA8C,QAAQ,0CAA0C;AAIzG,OAAO,MAAMC,6CAAuFJ,MAAMK,UAAU,CAClH,CAACC,OAAOC;IACN,MAAMC,QAAQP,yCAAyCK,OAAOC;IAE9DJ,+CAA+CK;IAC/C,OAAON,4CAA4CM;AACrD,GACA;AAEFJ,6BAA6BK,WAAW,GAAG"}
+{"version":3,"sources":["AttachmentOverflowMenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentOverflowMenuButton_unstable } from './useAttachmentOverflowMenuButton';\nimport { renderAttachmentOverflowMenuButton_unstable } from './renderAttachmentOverflowMenuButton';\nimport { useAttachmentOverflowMenuButtonStyles_unstable } from './useAttachmentOverflowMenuButtonStyles.styles';\nimport type { AttachmentOverflowMenuButtonProps } from './AttachmentOverflowMenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\n\nexport const AttachmentOverflowMenuButton: ForwardRefComponent<AttachmentOverflowMenuButtonProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useAttachmentOverflowMenuButton_unstable(props, ref);\n\n    useAttachmentOverflowMenuButtonStyles_unstable(state);\n    return renderAttachmentOverflowMenuButton_unstable(state);\n  },\n);\n\nAttachmentOverflowMenuButton.displayName = 'AttachmentOverflowMenuButton';\n"],"names":["React","useAttachmentOverflowMenuButton_unstable","renderAttachmentOverflowMenuButton_unstable","useAttachmentOverflowMenuButtonStyles_unstable","AttachmentOverflowMenuButton","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wCAAwC,QAAQ,oCAAoC;AAC7F,SAASC,2CAA2C,QAAQ,uCAAuC;AACnG,SAASC,8CAA8C,QAAQ,iDAAiD;AAIhH,OAAO,MAAMC,6CAAuFJ,MAAMK,UAAU,CAClH,CAACC,OAAOC;IACN,MAAMC,QAAQP,yCAAyCK,OAAOC;IAE9DJ,+CAA+CK;IAC/C,OAAON,4CAA4CM;AACrD,GACA;AAEFJ,6BAA6BK,WAAW,GAAG"}

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

@@ -1 +1 @@
-{"version":3,"sources":["AttachmentOverflowMenuButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, ProgressBar, Slot } from '@fluentui/react-components';\nimport type { AttachmentOverflowMenuState } from '../AttachmentOverflowMenu';\n\nexport type AttachmentOverflowMenuButtonSlots = {\n  root: NonNullable<Slot<'button'>>;\n  progress: NonNullable<Slot<typeof ProgressBar>>;\n};\n\n/**\n * AttachmentOverflowMenuButton Props\n */\nexport type AttachmentOverflowMenuButtonProps = ComponentProps<Partial<AttachmentOverflowMenuButtonSlots>> & {\n  /**\n   * Toggle prop to indicate that there are Attachments in the overflow menu that's currently loading.\n   * Setting this to true will show an indeterminate progress bar on the button.\n   * @default false\n   */\n  isLoading?: boolean;\n};\n\n/**\n * State used in rendering AttachmentOverflowMenuButton\n */\nexport type AttachmentOverflowMenuButtonState = ComponentState<AttachmentOverflowMenuButtonSlots> &\n  Pick<AttachmentOverflowMenuState, 'isOverflowing' | 'overflowCount'> &\n  Pick<AttachmentOverflowMenuButtonProps, 'isLoading'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAoBA;;CAEC,GACD,WAEuD"}
+{"version":3,"sources":["AttachmentOverflowMenuButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, ProgressBar, Slot } from '@fluentui/react-components';\nimport type { AttachmentOverflowMenuState } from '../AttachmentOverflowMenu';\n\nexport type AttachmentOverflowMenuButtonSlots = {\n  root: NonNullable<Slot<'button'>>;\n  progress: NonNullable<Slot<typeof ProgressBar>>;\n};\n\n/**\n * AttachmentOverflowMenuButton Props\n */\nexport type AttachmentOverflowMenuButtonProps = ComponentProps<Partial<AttachmentOverflowMenuButtonSlots>> & {\n  /**\n   * Toggle prop to indicate that there are Attachments in the overflow menu that's currently loading.\n   * Setting this to true will show an indeterminate progress bar on the button.\n   * @default false\n   */\n  isLoading?: boolean;\n  text?: string | ((overflowCount: number) => React.ReactNode);\n};\n\n/**\n * State used in rendering AttachmentOverflowMenuButton\n */\nexport type AttachmentOverflowMenuButtonState = ComponentState<AttachmentOverflowMenuButtonSlots> &\n  Pick<AttachmentOverflowMenuState, 'isOverflowing' | 'overflowCount'> &\n  Pick<AttachmentOverflowMenuButtonProps, 'isLoading'>;\n"],"names":[],"rangeMappings":";;","mappings":"AAqBA;;CAEC,GACD,WAEuD"}

package/lib/components/AttachmentOverflowMenuButton/index.js

@@ -2,5 +2,5 @@ export * from './AttachmentOverflowMenuButton';
 export * from './AttachmentOverflowMenuButton.types';
 export * from './renderAttachmentOverflowMenuButton';
 export * from './useAttachmentOverflowMenuButton';
-export * from './useAttachmentOverflowMenuButtonStyles';
+export * from './useAttachmentOverflowMenuButtonStyles.styles';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentOverflowMenuButton';\nexport * from './AttachmentOverflowMenuButton.types';\nexport * from './renderAttachmentOverflowMenuButton';\nexport * from './useAttachmentOverflowMenuButton';\nexport * from './useAttachmentOverflowMenuButtonStyles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,iCAAiC;AAC/C,cAAc,uCAAuC;AACrD,cAAc,uCAAuC;AACrD,cAAc,oCAAoC;AAClD,cAAc,0CAA0C"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentOverflowMenuButton';\nexport * from './AttachmentOverflowMenuButton.types';\nexport * from './renderAttachmentOverflowMenuButton';\nexport * from './useAttachmentOverflowMenuButton';\nexport * from './useAttachmentOverflowMenuButtonStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,iCAAiC;AAC/C,cAAc,uCAAuC;AACrD,cAAc,uCAAuC;AACrD,cAAc,oCAAoC;AAClD,cAAc,iDAAiD"}

package/lib/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js

@@ -7,7 +7,7 @@ export const renderAttachmentOverflowMenuButton_unstable = state => {
   assertSlots(state);
   return state.isOverflowing ? /*#__PURE__*/_jsx(MenuTrigger, {
     children: /*#__PURE__*/_jsxs(state.root, {
-      children: ["+", state.overflowCount, state.isLoading && /*#__PURE__*/_jsx(state.progress, {})]
+      children: [state.root.children, state.isLoading && /*#__PURE__*/_jsx(state.progress, {})]
     })
   }) : null;
 };

package/lib/components/AttachmentOverflowMenuButton/renderAttachmentOverflowMenuButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["renderAttachmentOverflowMenuButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { MenuTrigger, assertSlots } from '@fluentui/react-components';\nimport type {\n  AttachmentOverflowMenuButtonState,\n  AttachmentOverflowMenuButtonSlots,\n} from './AttachmentOverflowMenuButton.types';\n\n/**\n * Render the final JSX of AttachmentOverflowMenuButton\n */\nexport const renderAttachmentOverflowMenuButton_unstable = (state: AttachmentOverflowMenuButtonState) => {\n  assertSlots<AttachmentOverflowMenuButtonSlots>(state);\n\n  return state.isOverflowing ? (\n    <MenuTrigger>\n      <state.root>\n        +{state.overflowCount}\n        {state.isLoading && <state.progress />}\n      </state.root>\n    </MenuTrigger>\n  ) : null;\n};\n"],"names":["MenuTrigger","assertSlots","renderAttachmentOverflowMenuButton_unstable","state","isOverflowing","root","overflowCount","isLoading","progress"],"rangeMappings":";;;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,EAAEC,WAAW,QAAQ,6BAA6B;AAMtE;;CAEC,GACD,OAAO,MAAMC,8CAA8C,CAACC;IAC1DF,YAA+CE;IAE/C,OAAOA,MAAMC,aAAa,iBACxB,KAACJ;kBACC,cAAA,MAACG,MAAME,IAAI;;gBAAC;gBACRF,MAAMG,aAAa;gBACpBH,MAAMI,SAAS,kBAAI,KAACJ,MAAMK,QAAQ;;;SAGrC;AACN,EAAE"}
+{"version":3,"sources":["renderAttachmentOverflowMenuButton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { MenuTrigger, assertSlots } from '@fluentui/react-components';\nimport type {\n  AttachmentOverflowMenuButtonState,\n  AttachmentOverflowMenuButtonSlots,\n} from './AttachmentOverflowMenuButton.types';\n\n/**\n * Render the final JSX of AttachmentOverflowMenuButton\n */\nexport const renderAttachmentOverflowMenuButton_unstable = (state: AttachmentOverflowMenuButtonState) => {\n  assertSlots<AttachmentOverflowMenuButtonSlots>(state);\n\n  return state.isOverflowing ? (\n    <MenuTrigger>\n      <state.root>\n        {state.root.children}\n        {state.isLoading && <state.progress />}\n      </state.root>\n    </MenuTrigger>\n  ) : null;\n};\n"],"names":["MenuTrigger","assertSlots","renderAttachmentOverflowMenuButton_unstable","state","isOverflowing","root","children","isLoading","progress"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,EAAEC,WAAW,QAAQ,6BAA6B;AAMtE;;CAEC,GACD,OAAO,MAAMC,8CAA8C,CAACC;IAC1DF,YAA+CE;IAE/C,OAAOA,MAAMC,aAAa,iBACxB,KAACJ;kBACC,cAAA,MAACG,MAAME,IAAI;;gBACRF,MAAME,IAAI,CAACC,QAAQ;gBACnBH,MAAMI,SAAS,kBAAI,KAACJ,MAAMK,QAAQ;;;SAGrC;AACN,EAAE"}

package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js

@@ -10,12 +10,17 @@ import { useAttachmentOverflowMenuContext_unstable } from '../../contexts/attach
  * @param ref - reference to root HTMLElement of AttachmentOverflowMenuButton
  */
 export const useAttachmentOverflowMenuButton_unstable = (props, ref) => {
+  const {
+    children,
+    text
+  } = props;
   const {
     isOverflowing,
     overflowCount,
     overflowButtonRef
   } = useAttachmentOverflowMenuContext_unstable(context => context);
   const isLoading = !!props.isLoading;
+  const processedText = children !== null && children !== void 0 ? children : typeof text === 'function' ? text(overflowCount) : text;
   return {
     components: {
       root: 'button',
@@ -25,6 +30,9 @@ export const useAttachmentOverflowMenuButton_unstable = (props, ref) => {
       ref: useMergedRefs(ref, overflowButtonRef),
       ...props
     }), {
+      defaultProps: {
+        children: processedText !== null && processedText !== void 0 ? processedText : `+${overflowCount}`
+      },
       elementType: 'button'
     }),
     progress: slot.always(props.progress, {

package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButton.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAttachmentOverflowMenuButton.ts"],"sourcesContent":["import { ProgressBar, getIntrinsicElementProps, slot, useMergedRefs } from '@fluentui/react-components';\nimport { useAttachmentOverflowMenuContext_unstable } from '../../contexts/attachmentOverflowMenuContext';\nimport type {\n  AttachmentOverflowMenuButtonProps,\n  AttachmentOverflowMenuButtonState,\n} from './AttachmentOverflowMenuButton.types';\n\n/**\n * Create the state required to render AttachmentOverflowMenuButton.\n *\n * The returned state can be modified with hooks such as useAttachmentOverflowMenuButtonStyles_unstable,\n * before being passed to renderAttachmentOverflowMenuButton_unstable.\n *\n * @param props - props from this instance of AttachmentOverflowMenuButton\n * @param ref - reference to root HTMLElement of AttachmentOverflowMenuButton\n */\nexport const useAttachmentOverflowMenuButton_unstable = (\n  props: AttachmentOverflowMenuButtonProps,\n  ref: React.Ref<HTMLButtonElement>,\n): AttachmentOverflowMenuButtonState => {\n  const { isOverflowing, overflowCount, overflowButtonRef } = useAttachmentOverflowMenuContext_unstable(\n    context => context,\n  );\n  const isLoading = !!props.isLoading;\n\n  return {\n    components: {\n      root: 'button',\n      progress: ProgressBar,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref: useMergedRefs(ref, overflowButtonRef),\n        ...props,\n      }),\n      { elementType: 'button' },\n    ),\n    progress: slot.always(props.progress, {\n      defaultProps: { value: undefined, shape: 'square', thickness: 'large', 'aria-label': 'Loading' },\n      elementType: ProgressBar,\n    }),\n    isOverflowing,\n    overflowCount,\n    isLoading,\n  };\n};\n"],"names":["ProgressBar","getIntrinsicElementProps","slot","useMergedRefs","useAttachmentOverflowMenuContext_unstable","useAttachmentOverflowMenuButton_unstable","props","ref","isOverflowing","overflowCount","overflowButtonRef","context","isLoading","components","root","progress","always","elementType","defaultProps","value","undefined","shape","thickness"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,WAAW,EAAEC,wBAAwB,EAAEC,IAAI,EAAEC,aAAa,QAAQ,6BAA6B;AACxG,SAASC,yCAAyC,QAAQ,+CAA+C;AAMzG;;;;;;;;CAQC,GACD,OAAO,MAAMC,2CAA2C,CACtDC,OACAC;IAEA,MAAM,EAAEC,aAAa,EAAEC,aAAa,EAAEC,iBAAiB,EAAE,GAAGN,0CAC1DO,CAAAA,UAAWA;IAEb,MAAMC,YAAY,CAAC,CAACN,MAAMM,SAAS;IAEnC,OAAO;QACLC,YAAY;YACVC,MAAM;YACNC,UAAUf;QACZ;QACAc,MAAMZ,KAAKc,MAAM,CACff,yBAAyB,UAAU;YACjCM,KAAKJ,cAAcI,KAAKG;YACxB,GAAGJ,KAAK;QACV,IACA;YAAEW,aAAa;QAAS;QAE1BF,UAAUb,KAAKc,MAAM,CAACV,MAAMS,QAAQ,EAAE;YACpCG,cAAc;gBAAEC,OAAOC;gBAAWC,OAAO;gBAAUC,WAAW;gBAAS,cAAc;YAAU;YAC/FL,aAAajB;QACf;QACAQ;QACAC;QACAG;IACF;AACF,EAAE"}
+{"version":3,"sources":["useAttachmentOverflowMenuButton.ts"],"sourcesContent":["import { ProgressBar, getIntrinsicElementProps, slot, useMergedRefs } from '@fluentui/react-components';\nimport { useAttachmentOverflowMenuContext_unstable } from '../../contexts/attachmentOverflowMenuContext';\nimport type {\n  AttachmentOverflowMenuButtonProps,\n  AttachmentOverflowMenuButtonState,\n} from './AttachmentOverflowMenuButton.types';\n\n/**\n * Create the state required to render AttachmentOverflowMenuButton.\n *\n * The returned state can be modified with hooks such as useAttachmentOverflowMenuButtonStyles_unstable,\n * before being passed to renderAttachmentOverflowMenuButton_unstable.\n *\n * @param props - props from this instance of AttachmentOverflowMenuButton\n * @param ref - reference to root HTMLElement of AttachmentOverflowMenuButton\n */\nexport const useAttachmentOverflowMenuButton_unstable = (\n  props: AttachmentOverflowMenuButtonProps,\n  ref: React.Ref<HTMLButtonElement>,\n): AttachmentOverflowMenuButtonState => {\n  const { children, text } = props;\n  const { isOverflowing, overflowCount, overflowButtonRef } = useAttachmentOverflowMenuContext_unstable(\n    context => context,\n  );\n  const isLoading = !!props.isLoading;\n\n  const processedText = children ?? (typeof text === 'function' ? text(overflowCount) : text);\n  return {\n    components: {\n      root: 'button',\n      progress: ProgressBar,\n    },\n    root: slot.always(\n      getIntrinsicElementProps('button', {\n        ref: useMergedRefs(ref, overflowButtonRef),\n        ...props,\n      }),\n      { defaultProps: { children: processedText ?? `+${overflowCount}` }, elementType: 'button' },\n    ),\n    progress: slot.always(props.progress, {\n      defaultProps: { value: undefined, shape: 'square', thickness: 'large', 'aria-label': 'Loading' },\n      elementType: ProgressBar,\n    }),\n    isOverflowing,\n    overflowCount,\n    isLoading,\n  };\n};\n"],"names":["ProgressBar","getIntrinsicElementProps","slot","useMergedRefs","useAttachmentOverflowMenuContext_unstable","useAttachmentOverflowMenuButton_unstable","props","ref","children","text","isOverflowing","overflowCount","overflowButtonRef","context","isLoading","processedText","components","root","progress","always","defaultProps","elementType","value","undefined","shape","thickness"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,WAAW,EAAEC,wBAAwB,EAAEC,IAAI,EAAEC,aAAa,QAAQ,6BAA6B;AACxG,SAASC,yCAAyC,QAAQ,+CAA+C;AAMzG;;;;;;;;CAQC,GACD,OAAO,MAAMC,2CAA2C,CACtDC,OACAC;IAEA,MAAM,EAAEC,QAAQ,EAAEC,IAAI,EAAE,GAAGH;IAC3B,MAAM,EAAEI,aAAa,EAAEC,aAAa,EAAEC,iBAAiB,EAAE,GAAGR,0CAC1DS,CAAAA,UAAWA;IAEb,MAAMC,YAAY,CAAC,CAACR,MAAMQ,SAAS;IAEnC,MAAMC,gBAAgBP,qBAAAA,sBAAAA,WAAa,OAAOC,SAAS,aAAaA,KAAKE,iBAAiBF;IACtF,OAAO;QACLO,YAAY;YACVC,MAAM;YACNC,UAAUlB;QACZ;QACAiB,MAAMf,KAAKiB,MAAM,CACflB,yBAAyB,UAAU;YACjCM,KAAKJ,cAAcI,KAAKK;YACxB,GAAGN,KAAK;QACV,IACA;YAAEc,cAAc;gBAAEZ,UAAUO,0BAAAA,2BAAAA,gBAAiB,CAAC,CAAC,EAAEJ,cAAc,CAAC;YAAC;YAAGU,aAAa;QAAS;QAE5FH,UAAUhB,KAAKiB,MAAM,CAACb,MAAMY,QAAQ,EAAE;YACpCE,cAAc;gBAAEE,OAAOC;gBAAWC,OAAO;gBAAUC,WAAW;gBAAS,cAAc;YAAU;YAC/FJ,aAAarB;QACf;QACAU;QACAC;QACAG;IACF;AACF,EAAE"}

package/lib/components/AttachmentOverflowMenuButton/{useAttachmentOverflowMenuButtonStyles.js → useAttachmentOverflowMenuButtonStyles.styles.js}

@@ -1,5 +1,5 @@
 import { __resetStyles, mergeClasses, slot, tokens, typographyStyles } from '@fluentui/react-components';
-import { useProgressBarStyles } from '../utils/useProgressBarStyles';
+import { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';
 export const attachmentOverflowMenuButtonClassNames = {
   root: 'fai-AttachmentOverflowMenuButton',
   progress: 'fai-AttachmentOverflowMenuButton__progress'
@@ -12,6 +12,8 @@ const useRootBaseClassName = __resetStyles("r1opa2g9", null, {
  * Apply styling to the AttachmentOverflowMenuButton slots based on the state
  */
 export const useAttachmentOverflowMenuButtonStyles_unstable = state => {
+  'use no memo';
+
   const rootBaseClassName = useRootBaseClassName();
   const progressBarStyles = useProgressBarStyles();
   state.root.className = mergeClasses(attachmentOverflowMenuButtonClassNames.root, rootBaseClassName, state.root.className);
@@ -32,4 +34,4 @@ export const useAttachmentOverflowMenuButtonStyles_unstable = state => {
   }
   return state;
 };
-//# sourceMappingURL=useAttachmentOverflowMenuButtonStyles.js.map
+//# sourceMappingURL=useAttachmentOverflowMenuButtonStyles.styles.js.map

package/lib/components/AttachmentOverflowMenuButton/useAttachmentOverflowMenuButtonStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAttachmentOverflowMenuButtonStyles.styles.ts"],"sourcesContent":["import { makeResetStyles, mergeClasses, slot, tokens, typographyStyles } from '@fluentui/react-components';\nimport { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';\nimport type {\n  AttachmentOverflowMenuButtonSlots,\n  AttachmentOverflowMenuButtonState,\n} from './AttachmentOverflowMenuButton.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentOverflowMenuButtonClassNames: SlotClassNames<AttachmentOverflowMenuButtonSlots> = {\n  root: 'fai-AttachmentOverflowMenuButton',\n  progress: 'fai-AttachmentOverflowMenuButton__progress',\n};\n\nconst useRootBaseClassName = makeResetStyles({\n  color: tokens.colorNeutralForeground1,\n  alignItems: 'center',\n  backgroundColor: tokens.colorNeutralBackground1,\n  border: `${tokens.strokeWidthThin} solid ${tokens.colorNeutralStroke1}`,\n  borderRadius: tokens.borderRadiusMedium,\n  boxSizing: 'border-box',\n  columnGap: tokens.spacingHorizontalSNudge,\n  cursor: 'pointer',\n  display: 'inline-flex',\n  flexWrap: 'nowrap',\n  fontFamily: typographyStyles.body1.fontFamily,\n  fontSize: typographyStyles.body1.fontSize,\n  fontWeight: typographyStyles.body1.fontWeight,\n  justifyContent: 'center',\n  padding: tokens.spacingVerticalS,\n  verticalAlign: 'middle',\n  alignSelf: 'end',\n  position: 'relative',\n\n  ':hover': {\n    cursor: 'pointer',\n    backgroundColor: tokens.colorNeutralBackground3Hover,\n    color: tokens.colorNeutralForeground2Hover,\n  },\n  ':active': {\n    backgroundColor: tokens.colorNeutralBackground3Pressed,\n    color: tokens.colorNeutralForeground2Pressed,\n  },\n  '@media (forced-colors: active)': {\n    ':hover': {\n      backgroundColor: 'HighlightText',\n    },\n    ':active': {\n      backgroundColor: 'HighlightText',\n    },\n  },\n});\n\n/**\n * Apply styling to the AttachmentOverflowMenuButton slots based on the state\n */\nexport const useAttachmentOverflowMenuButtonStyles_unstable = (\n  state: AttachmentOverflowMenuButtonState,\n): AttachmentOverflowMenuButtonState => {\n  'use no memo';\n\n  const rootBaseClassName = useRootBaseClassName();\n  const progressBarStyles = useProgressBarStyles();\n\n  state.root.className = mergeClasses(\n    attachmentOverflowMenuButtonClassNames.root,\n    rootBaseClassName,\n    state.root.className,\n  );\n\n  if (state.progress) {\n    state.progress.className = mergeClasses(\n      attachmentOverflowMenuButtonClassNames.progress,\n      progressBarStyles.progress,\n      state.progress.className,\n    );\n\n    const bar = slot.optional(state.progress.bar, { elementType: 'div', renderByDefault: true });\n    if (bar) {\n      if (state.progress.value === undefined) {\n        bar.className = mergeClasses(progressBarStyles.indeterminateProgressBar, bar.className);\n      } else {\n        bar.className = mergeClasses(progressBarStyles.regularProgressBar, bar.className);\n      }\n      state.progress.bar = bar;\n    }\n  }\n\n  return state;\n};\n"],"names":["makeResetStyles","mergeClasses","slot","tokens","typographyStyles","useProgressBarStyles","attachmentOverflowMenuButtonClassNames","root","progress","useRootBaseClassName","color","colorNeutralForeground1","alignItems","backgroundColor","colorNeutralBackground1","border","strokeWidthThin","colorNeutralStroke1","borderRadius","borderRadiusMedium","boxSizing","columnGap","spacingHorizontalSNudge","cursor","display","flexWrap","fontFamily","body1","fontSize","fontWeight","justifyContent","padding","spacingVerticalS","verticalAlign","alignSelf","position","colorNeutralBackground3Hover","colorNeutralForeground2Hover","colorNeutralBackground3Pressed","colorNeutralForeground2Pressed","useAttachmentOverflowMenuButtonStyles_unstable","state","rootBaseClassName","progressBarStyles","className","bar","optional","elementType","renderByDefault","value","undefined","indeterminateProgressBar","regularProgressBar"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,eAAe,EAAEC,YAAY,EAAEC,IAAI,EAAEC,MAAM,EAAEC,gBAAgB,QAAQ,6BAA6B;AAC3G,SAASC,oBAAoB,QAAQ,uCAAuC;AAO5E,OAAO,MAAMC,yCAA4F;IACvGC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,uBAAuBT,gBAAgB;IAC3CU,OAAOP,OAAOQ,uBAAuB;IACrCC,YAAY;IACZC,iBAAiBV,OAAOW,uBAAuB;IAC/CC,QAAQ,CAAC,EAAEZ,OAAOa,eAAe,CAAC,OAAO,EAAEb,OAAOc,mBAAmB,CAAC,CAAC;IACvEC,cAAcf,OAAOgB,kBAAkB;IACvCC,WAAW;IACXC,WAAWlB,OAAOmB,uBAAuB;IACzCC,QAAQ;IACRC,SAAS;IACTC,UAAU;IACVC,YAAYtB,iBAAiBuB,KAAK,CAACD,UAAU;IAC7CE,UAAUxB,iBAAiBuB,KAAK,CAACC,QAAQ;IACzCC,YAAYzB,iBAAiBuB,KAAK,CAACE,UAAU;IAC7CC,gBAAgB;IAChBC,SAAS5B,OAAO6B,gBAAgB;IAChCC,eAAe;IACfC,WAAW;IACXC,UAAU;IAEV,UAAU;QACRZ,QAAQ;QACRV,iBAAiBV,OAAOiC,4BAA4B;QACpD1B,OAAOP,OAAOkC,4BAA4B;IAC5C;IACA,WAAW;QACTxB,iBAAiBV,OAAOmC,8BAA8B;QACtD5B,OAAOP,OAAOoC,8BAA8B;IAC9C;IACA,kCAAkC;QAChC,UAAU;YACR1B,iBAAiB;QACnB;QACA,WAAW;YACTA,iBAAiB;QACnB;IACF;AACF;AAEA;;CAEC,GACD,OAAO,MAAM2B,iDAAiD,CAC5DC;IAEA;IAEA,MAAMC,oBAAoBjC;IAC1B,MAAMkC,oBAAoBtC;IAE1BoC,MAAMlC,IAAI,CAACqC,SAAS,GAAG3C,aACrBK,uCAAuCC,IAAI,EAC3CmC,mBACAD,MAAMlC,IAAI,CAACqC,SAAS;IAGtB,IAAIH,MAAMjC,QAAQ,EAAE;QAClBiC,MAAMjC,QAAQ,CAACoC,SAAS,GAAG3C,aACzBK,uCAAuCE,QAAQ,EAC/CmC,kBAAkBnC,QAAQ,EAC1BiC,MAAMjC,QAAQ,CAACoC,SAAS;QAG1B,MAAMC,MAAM3C,KAAK4C,QAAQ,CAACL,MAAMjC,QAAQ,CAACqC,GAAG,EAAE;YAAEE,aAAa;YAAOC,iBAAiB;QAAK;QAC1F,IAAIH,KAAK;YACP,IAAIJ,MAAMjC,QAAQ,CAACyC,KAAK,KAAKC,WAAW;gBACtCL,IAAID,SAAS,GAAG3C,aAAa0C,kBAAkBQ,wBAAwB,EAAEN,IAAID,SAAS;YACxF,OAAO;gBACLC,IAAID,SAAS,GAAG3C,aAAa0C,kBAAkBS,kBAAkB,EAAEP,IAAID,SAAS;YAClF;YACAH,MAAMjC,QAAQ,CAACqC,GAAG,GAAGA;QACvB;IACF;IAEA,OAAOJ;AACT,EAAE"}

package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useAttachmentOverflowMenuItem_unstable } from './useAttachmentOverflowMenuItem';
 import { renderAttachmentOverflowMenuItem_unstable } from './renderAttachmentOverflowMenuItem';
-import { useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles';
+import { useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles.styles';
 export const AttachmentOverflowMenuItem = /*#__PURE__*/React.forwardRef((props, ref) => {
   const state = useAttachmentOverflowMenuItem_unstable(props, ref);
   useAttachmentOverflowMenuItemStyles_unstable(state);

package/lib/components/AttachmentOverflowMenuItem/AttachmentOverflowMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AttachmentOverflowMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentOverflowMenuItem_unstable } from './useAttachmentOverflowMenuItem';\nimport { renderAttachmentOverflowMenuItem_unstable } from './renderAttachmentOverflowMenuItem';\nimport type { AttachmentOverflowMenuItemProps } from './AttachmentOverflowMenuItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles';\nexport const AttachmentOverflowMenuItem: ForwardRefComponent<AttachmentOverflowMenuItemProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useAttachmentOverflowMenuItem_unstable(props, ref);\n    useAttachmentOverflowMenuItemStyles_unstable(state);\n\n    return renderAttachmentOverflowMenuItem_unstable(state);\n  },\n);\n\nAttachmentOverflowMenuItem.displayName = 'AttachmentOverflowMenuItem';\n"],"names":["React","useAttachmentOverflowMenuItem_unstable","renderAttachmentOverflowMenuItem_unstable","useAttachmentOverflowMenuItemStyles_unstable","AttachmentOverflowMenuItem","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,qCAAqC;AAG/F,SAASC,4CAA4C,QAAQ,wCAAwC;AACrG,OAAO,MAAMC,2CAAmFJ,MAAMK,UAAU,CAC9G,CAACC,OAAOC;IACN,MAAMC,QAAQP,uCAAuCK,OAAOC;IAC5DJ,6CAA6CK;IAE7C,OAAON,0CAA0CM;AACnD,GACA;AAEFJ,2BAA2BK,WAAW,GAAG"}
+{"version":3,"sources":["AttachmentOverflowMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentOverflowMenuItem_unstable } from './useAttachmentOverflowMenuItem';\nimport { renderAttachmentOverflowMenuItem_unstable } from './renderAttachmentOverflowMenuItem';\nimport type { AttachmentOverflowMenuItemProps } from './AttachmentOverflowMenuItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useAttachmentOverflowMenuItemStyles_unstable } from './useAttachmentOverflowMenuItemStyles.styles';\nexport const AttachmentOverflowMenuItem: ForwardRefComponent<AttachmentOverflowMenuItemProps> = React.forwardRef(\n  (props, ref) => {\n    const state = useAttachmentOverflowMenuItem_unstable(props, ref);\n    useAttachmentOverflowMenuItemStyles_unstable(state);\n\n    return renderAttachmentOverflowMenuItem_unstable(state);\n  },\n);\n\nAttachmentOverflowMenuItem.displayName = 'AttachmentOverflowMenuItem';\n"],"names":["React","useAttachmentOverflowMenuItem_unstable","renderAttachmentOverflowMenuItem_unstable","useAttachmentOverflowMenuItemStyles_unstable","AttachmentOverflowMenuItem","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,sCAAsC,QAAQ,kCAAkC;AACzF,SAASC,yCAAyC,QAAQ,qCAAqC;AAG/F,SAASC,4CAA4C,QAAQ,+CAA+C;AAC5G,OAAO,MAAMC,2CAAmFJ,MAAMK,UAAU,CAC9G,CAACC,OAAOC;IACN,MAAMC,QAAQP,uCAAuCK,OAAOC;IAC5DJ,6CAA6CK;IAE7C,OAAON,0CAA0CM;AACnD,GACA;AAEFJ,2BAA2BK,WAAW,GAAG"}

package/lib/components/AttachmentOverflowMenuItem/index.js

@@ -2,5 +2,5 @@ export * from './AttachmentOverflowMenuItem';
 export * from './AttachmentOverflowMenuItem.types';
 export * from './renderAttachmentOverflowMenuItem';
 export * from './useAttachmentOverflowMenuItem';
-export * from './useAttachmentOverflowMenuItemStyles';
+export * from './useAttachmentOverflowMenuItemStyles.styles';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentOverflowMenuItem';\nexport * from './AttachmentOverflowMenuItem.types';\nexport * from './renderAttachmentOverflowMenuItem';\nexport * from './useAttachmentOverflowMenuItem';\nexport * from './useAttachmentOverflowMenuItemStyles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,+BAA+B;AAC7C,cAAc,qCAAqC;AACnD,cAAc,qCAAqC;AACnD,cAAc,kCAAkC;AAChD,cAAc,wCAAwC"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentOverflowMenuItem';\nexport * from './AttachmentOverflowMenuItem.types';\nexport * from './renderAttachmentOverflowMenuItem';\nexport * from './useAttachmentOverflowMenuItem';\nexport * from './useAttachmentOverflowMenuItemStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,+BAA+B;AAC7C,cAAc,qCAAqC;AACnD,cAAc,qCAAqC;AACnD,cAAc,kCAAkC;AAChD,cAAc,+CAA+C"}

package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { MenuItem, ProgressBar, mergeCallbacks, slot, useIsOverflowItemVisible } from '@fluentui/react-components';
+import { MenuItem, ProgressBar, mergeCallbacks, slot, useId, useIsOverflowItemVisible } from '@fluentui/react-components';
 import { Dismiss20Filled, Dismiss20Regular, bundleIcon } from '@fluentui/react-icons';
 import { useAttachmentListContext_unstable } from '../../contexts/attachmentListContext';
 /**
@@ -12,25 +12,34 @@ import { useAttachmentListContext_unstable } from '../../contexts/attachmentList
  * @param ref - reference to root HTMLElement of AttachmentOverflowMenuItem
  */
 export const useAttachmentOverflowMenuItem_unstable = (props, ref) => {
+  'use no memo';
+
   const {
-    id,
     imageOnly,
     media
   } = props;
   const DismissIcon = bundleIcon(Dismiss20Filled, Dismiss20Regular);
-  const isVisible = useIsOverflowItemVisible(id);
-  const onAttachmentDismiss = useAttachmentListContext_unstable(context => context.onAttachmentDismiss);
+  const menuItemId = useId('attachment-', props.id);
+  const isVisible = useIsOverflowItemVisible(menuItemId);
+  const {
+    onAttachmentDismiss
+  } = useAttachmentListContext_unstable(context => context);
   const root = slot.always({
     ref,
     icon: media,
     secondaryContent: /*#__PURE__*/React.createElement(DismissIcon, null),
-    ...props
+    ...props,
+    id: menuItemId
   }, {
     elementType: MenuItem
   });
-  root.onClick = mergeCallbacks(root.onClick, ev => onAttachmentDismiss === null || onAttachmentDismiss === void 0 ? void 0 : onAttachmentDismiss(ev, {
-    id
-  }));
+  root.onClick = mergeCallbacks(root.onClick, ev => {
+    onAttachmentDismiss === null || onAttachmentDismiss === void 0 ? void 0 : onAttachmentDismiss(ev, {
+      content: props.children,
+      media,
+      id: menuItemId
+    });
+  });
   const progress = slot.optional(props.progress, {
     defaultProps: {
       shape: 'square',

package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["useAttachmentOverflowMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { MenuItem, ProgressBar, mergeCallbacks, slot, useIsOverflowItemVisible } from '@fluentui/react-components';\nimport { Dismiss20Filled, Dismiss20Regular, bundleIcon } from '@fluentui/react-icons';\nimport { useAttachmentListContext_unstable } from '../../contexts/attachmentListContext';\nimport type {\n  AttachmentOverflowMenuItemProps,\n  AttachmentOverflowMenuItemState,\n} from './AttachmentOverflowMenuItem.types';\n\n/**\n * Create the state required to render AttachmentOverflowMenuItem.\n *\n * The returned state can be modified with hooks such as useAttachmentOverflowMenuItemStyles_unstable,\n * before being passed to renderAttachmentOverflowMenuItem_unstable.\n *\n * @param props - props from this instance of AttachmentOverflowMenuItem\n * @param ref - reference to root HTMLElement of AttachmentOverflowMenuItem\n */\nexport const useAttachmentOverflowMenuItem_unstable = (\n  props: AttachmentOverflowMenuItemProps,\n  ref: React.Ref<HTMLDivElement>,\n): AttachmentOverflowMenuItemState => {\n  const { id, imageOnly, media } = props;\n  const DismissIcon = bundleIcon(Dismiss20Filled, Dismiss20Regular);\n  const isVisible = useIsOverflowItemVisible(id);\n\n  const onAttachmentDismiss = useAttachmentListContext_unstable(context => context.onAttachmentDismiss);\n\n  const root = slot.always(\n    { ref, icon: media, secondaryContent: <DismissIcon />, ...props },\n    { elementType: MenuItem },\n  );\n  root.onClick = mergeCallbacks(root.onClick, ev =>\n    onAttachmentDismiss?.(ev, {\n      id,\n    }),\n  );\n\n  const progress = slot.optional(props.progress, {\n    defaultProps: {\n      shape: 'square',\n      thickness: 'large',\n      'aria-labelledby': props.id,\n    },\n    elementType: ProgressBar,\n  });\n\n  return {\n    components: {\n      root: MenuItem,\n      progress: ProgressBar,\n    },\n    root,\n    progress,\n    isVisible,\n    imageOnly,\n  };\n};\n"],"names":["React","MenuItem","ProgressBar","mergeCallbacks","slot","useIsOverflowItemVisible","Dismiss20Filled","Dismiss20Regular","bundleIcon","useAttachmentListContext_unstable","useAttachmentOverflowMenuItem_unstable","props","ref","id","imageOnly","media","DismissIcon","isVisible","onAttachmentDismiss","context","root","always","icon","secondaryContent","elementType","onClick","ev","progress","optional","defaultProps","shape","thickness","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,QAAQ,EAAEC,WAAW,EAAEC,cAAc,EAAEC,IAAI,EAAEC,wBAAwB,QAAQ,6BAA6B;AACnH,SAASC,eAAe,EAAEC,gBAAgB,EAAEC,UAAU,QAAQ,wBAAwB;AACtF,SAASC,iCAAiC,QAAQ,uCAAuC;AAMzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,yCAAyC,CACpDC,OACAC;IAEA,MAAM,EAAEC,EAAE,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGJ;IACjC,MAAMK,cAAcR,WAAWF,iBAAiBC;IAChD,MAAMU,YAAYZ,yBAAyBQ;IAE3C,MAAMK,sBAAsBT,kCAAkCU,CAAAA,UAAWA,QAAQD,mBAAmB;IAEpG,MAAME,OAAOhB,KAAKiB,MAAM,CACtB;QAAET;QAAKU,MAAMP;QAAOQ,gCAAkB,oBAACP;QAAgB,GAAGL,KAAK;IAAC,GAChE;QAAEa,aAAavB;IAAS;IAE1BmB,KAAKK,OAAO,GAAGtB,eAAeiB,KAAKK,OAAO,EAAEC,CAAAA,KAC1CR,gCAAAA,0CAAAA,oBAAsBQ,IAAI;YACxBb;QACF;IAGF,MAAMc,WAAWvB,KAAKwB,QAAQ,CAACjB,MAAMgB,QAAQ,EAAE;QAC7CE,cAAc;YACZC,OAAO;YACPC,WAAW;YACX,mBAAmBpB,MAAME,EAAE;QAC7B;QACAW,aAAatB;IACf;IAEA,OAAO;QACL8B,YAAY;YACVZ,MAAMnB;YACN0B,UAAUzB;QACZ;QACAkB;QACAO;QACAV;QACAH;IACF;AACF,EAAE"}
+{"version":3,"sources":["useAttachmentOverflowMenuItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport {\n  MenuItem,\n  ProgressBar,\n  mergeCallbacks,\n  slot,\n  useId,\n  useIsOverflowItemVisible,\n} from '@fluentui/react-components';\nimport { Dismiss20Filled, Dismiss20Regular, bundleIcon } from '@fluentui/react-icons';\nimport { useAttachmentListContext_unstable } from '../../contexts/attachmentListContext';\nimport type {\n  AttachmentOverflowMenuItemProps,\n  AttachmentOverflowMenuItemState,\n} from './AttachmentOverflowMenuItem.types';\n\n/**\n * Create the state required to render AttachmentOverflowMenuItem.\n *\n * The returned state can be modified with hooks such as useAttachmentOverflowMenuItemStyles_unstable,\n * before being passed to renderAttachmentOverflowMenuItem_unstable.\n *\n * @param props - props from this instance of AttachmentOverflowMenuItem\n * @param ref - reference to root HTMLElement of AttachmentOverflowMenuItem\n */\nexport const useAttachmentOverflowMenuItem_unstable = (\n  props: AttachmentOverflowMenuItemProps,\n  ref: React.Ref<HTMLDivElement>,\n): AttachmentOverflowMenuItemState => {\n  'use no memo';\n\n  const { imageOnly, media } = props;\n  const DismissIcon = bundleIcon(Dismiss20Filled, Dismiss20Regular);\n  const menuItemId = useId('attachment-', props.id);\n  const isVisible = useIsOverflowItemVisible(menuItemId);\n  const { onAttachmentDismiss } = useAttachmentListContext_unstable(context => context);\n\n  const root = slot.always(\n    { ref, icon: media, secondaryContent: <DismissIcon />, ...props, id: menuItemId },\n    { elementType: MenuItem },\n  );\n  root.onClick = mergeCallbacks(root.onClick, ev => {\n    onAttachmentDismiss?.(ev, { content: props.children, media, id: menuItemId });\n  });\n\n  const progress = slot.optional(props.progress, {\n    defaultProps: {\n      shape: 'square',\n      thickness: 'large',\n      'aria-labelledby': props.id,\n    },\n    elementType: ProgressBar,\n  });\n\n  return {\n    components: {\n      root: MenuItem,\n      progress: ProgressBar,\n    },\n    root,\n    progress,\n    isVisible,\n    imageOnly,\n  };\n};\n"],"names":["React","MenuItem","ProgressBar","mergeCallbacks","slot","useId","useIsOverflowItemVisible","Dismiss20Filled","Dismiss20Regular","bundleIcon","useAttachmentListContext_unstable","useAttachmentOverflowMenuItem_unstable","props","ref","imageOnly","media","DismissIcon","menuItemId","id","isVisible","onAttachmentDismiss","context","root","always","icon","secondaryContent","elementType","onClick","ev","content","children","progress","optional","defaultProps","shape","thickness","components"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SACEC,QAAQ,EACRC,WAAW,EACXC,cAAc,EACdC,IAAI,EACJC,KAAK,EACLC,wBAAwB,QACnB,6BAA6B;AACpC,SAASC,eAAe,EAAEC,gBAAgB,EAAEC,UAAU,QAAQ,wBAAwB;AACtF,SAASC,iCAAiC,QAAQ,uCAAuC;AAMzF;;;;;;;;CAQC,GACD,OAAO,MAAMC,yCAAyC,CACpDC,OACAC;IAEA;IAEA,MAAM,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGH;IAC7B,MAAMI,cAAcP,WAAWF,iBAAiBC;IAChD,MAAMS,aAAaZ,MAAM,eAAeO,MAAMM,EAAE;IAChD,MAAMC,YAAYb,yBAAyBW;IAC3C,MAAM,EAAEG,mBAAmB,EAAE,GAAGV,kCAAkCW,CAAAA,UAAWA;IAE7E,MAAMC,OAAOlB,KAAKmB,MAAM,CACtB;QAAEV;QAAKW,MAAMT;QAAOU,gCAAkB,oBAACT;QAAgB,GAAGJ,KAAK;QAAEM,IAAID;IAAW,GAChF;QAAES,aAAazB;IAAS;IAE1BqB,KAAKK,OAAO,GAAGxB,eAAemB,KAAKK,OAAO,EAAEC,CAAAA;QAC1CR,gCAAAA,0CAAAA,oBAAsBQ,IAAI;YAAEC,SAASjB,MAAMkB,QAAQ;YAAEf;YAAOG,IAAID;QAAW;IAC7E;IAEA,MAAMc,WAAW3B,KAAK4B,QAAQ,CAACpB,MAAMmB,QAAQ,EAAE;QAC7CE,cAAc;YACZC,OAAO;YACPC,WAAW;YACX,mBAAmBvB,MAAMM,EAAE;QAC7B;QACAQ,aAAaxB;IACf;IAEA,OAAO;QACLkC,YAAY;YACVd,MAAMrB;YACN8B,UAAU7B;QACZ;QACAoB;QACAS;QACAZ;QACAL;IACF;AACF,EAAE"}

package/lib/components/AttachmentOverflowMenuItem/{useAttachmentOverflowMenuItemStyles.js → useAttachmentOverflowMenuItemStyles.styles.js}

@@ -1,5 +1,5 @@
 import { __styles, mergeClasses, slot } from '@fluentui/react-components';
-import { useProgressBarStyles } from '../utils/useProgressBarStyles';
+import { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';
 export const attachmentOverflowMenuItemClassNames = {
   root: 'fai-AttachmentOverflowMenuItem',
   progress: 'fai-AttachmentOverflowMenuItem__progress'
@@ -15,6 +15,8 @@ const useStyles = __styles({
  * Apply styling to the AttachmentList slots based on the state
  */
 export const useAttachmentOverflowMenuItemStyles_unstable = state => {
+  'use no memo';
+
   const {
     imageOnly
   } = state;
@@ -38,4 +40,4 @@ export const useAttachmentOverflowMenuItemStyles_unstable = state => {
   }
   return state;
 };
-//# sourceMappingURL=useAttachmentOverflowMenuItemStyles.js.map
+//# sourceMappingURL=useAttachmentOverflowMenuItemStyles.styles.js.map

package/lib/components/AttachmentOverflowMenuItem/useAttachmentOverflowMenuItemStyles.styles.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useAttachmentOverflowMenuItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, slot } from '@fluentui/react-components';\nimport { useProgressBarStyles } from '../utils/useProgressBarStyles.styles';\nimport type {\n  AttachmentOverflowMenuItemSlots,\n  AttachmentOverflowMenuItemState,\n} from './AttachmentOverflowMenuItem.types';\nimport type { SlotClassNames } from '@fluentui/react-components';\n\nexport const attachmentOverflowMenuItemClassNames: SlotClassNames<AttachmentOverflowMenuItemSlots> = {\n  root: 'fai-AttachmentOverflowMenuItem',\n  progress: 'fai-AttachmentOverflowMenuItem__progress',\n};\n\nconst useStyles = makeStyles({\n  imageOnly: {\n    alignItems: 'center',\n  },\n});\n\n/**\n * Apply styling to the AttachmentList slots based on the state\n */\nexport const useAttachmentOverflowMenuItemStyles_unstable = (\n  state: AttachmentOverflowMenuItemState,\n): AttachmentOverflowMenuItemState => {\n  'use no memo';\n\n  const { imageOnly } = state;\n  const styles = useStyles();\n  const progressBarStyles = useProgressBarStyles();\n\n  state.root.className = mergeClasses(\n    attachmentOverflowMenuItemClassNames.root,\n    imageOnly && styles.imageOnly,\n    state.root.className,\n  );\n\n  if (state.progress) {\n    state.progress.className = mergeClasses(\n      attachmentOverflowMenuItemClassNames.progress,\n      progressBarStyles.progress,\n      state.progress.className,\n    );\n\n    const bar = slot.optional(state.progress.bar, { elementType: 'div', renderByDefault: true });\n    if (bar) {\n      if (state.progress.value === undefined) {\n        bar.className = mergeClasses(progressBarStyles.indeterminateProgressBar, bar.className);\n      } else {\n        bar.className = mergeClasses(progressBarStyles.regularProgressBar, bar.className);\n      }\n      state.progress.bar = bar;\n    }\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","slot","useProgressBarStyles","attachmentOverflowMenuItemClassNames","root","progress","useStyles","imageOnly","alignItems","useAttachmentOverflowMenuItemStyles_unstable","state","styles","progressBarStyles","className","bar","optional","elementType","renderByDefault","value","undefined","indeterminateProgressBar","regularProgressBar"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,EAAEC,IAAI,QAAQ,6BAA6B;AAC5E,SAASC,oBAAoB,QAAQ,uCAAuC;AAO5E,OAAO,MAAMC,uCAAwF;IACnGC,MAAM;IACNC,UAAU;AACZ,EAAE;AAEF,MAAMC,YAAYP,WAAW;IAC3BQ,WAAW;QACTC,YAAY;IACd;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,+CAA+C,CAC1DC;IAEA;IAEA,MAAM,EAAEH,SAAS,EAAE,GAAGG;IACtB,MAAMC,SAASL;IACf,MAAMM,oBAAoBV;IAE1BQ,MAAMN,IAAI,CAACS,SAAS,GAAGb,aACrBG,qCAAqCC,IAAI,EACzCG,aAAaI,OAAOJ,SAAS,EAC7BG,MAAMN,IAAI,CAACS,SAAS;IAGtB,IAAIH,MAAML,QAAQ,EAAE;QAClBK,MAAML,QAAQ,CAACQ,SAAS,GAAGb,aACzBG,qCAAqCE,QAAQ,EAC7CO,kBAAkBP,QAAQ,EAC1BK,MAAML,QAAQ,CAACQ,SAAS;QAG1B,MAAMC,MAAMb,KAAKc,QAAQ,CAACL,MAAML,QAAQ,CAACS,GAAG,EAAE;YAAEE,aAAa;YAAOC,iBAAiB;QAAK;QAC1F,IAAIH,KAAK;YACP,IAAIJ,MAAML,QAAQ,CAACa,KAAK,KAAKC,WAAW;gBACtCL,IAAID,SAAS,GAAGb,aAAaY,kBAAkBQ,wBAAwB,EAAEN,IAAID,SAAS;YACxF,OAAO;gBACLC,IAAID,SAAS,GAAGb,aAAaY,kBAAkBS,kBAAkB,EAAEP,IAAID,SAAS;YAClF;YACAH,MAAML,QAAQ,CAACS,GAAG,GAAGA;QACvB;IACF;IAEA,OAAOJ;AACT,EAAE"}

package/lib/components/AttachmentTag/AttachmentTag.js

@@ -1,7 +1,7 @@
 import * as React from 'react';
 import { useAttachmentTag_unstable } from './useAttachmentTag';
 import { renderAttachmentTag_unstable } from './renderAttachmentTag';
-import { useAttachmentTagStyles_unstable } from './useAttachmentTagStyles';
+import { useAttachmentTagStyles_unstable } from './useAttachmentTagStyles.styles';
 import { useCustomStyleHook } from '@fluentui-copilot/react-provider';
 /**
  * @deprecated use new Attachment component exported from \@fluentui-copilot/react-attachments package instead.

package/lib/components/AttachmentTag/AttachmentTag.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AttachmentTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentTag_unstable } from './useAttachmentTag';\nimport { renderAttachmentTag_unstable } from './renderAttachmentTag';\nimport { useAttachmentTagStyles_unstable } from './useAttachmentTagStyles';\nimport type { AttachmentTagProps } from './AttachmentTag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n/**\n * @deprecated use new Attachment component exported from \\@fluentui-copilot/react-attachments package instead.\n * Deprecated on 4/9/2024.\n */\nexport const AttachmentTag: ForwardRefComponent<AttachmentTagProps> = React.forwardRef((props, ref) => {\n  const state = useAttachmentTag_unstable(props, ref);\n\n  useAttachmentTagStyles_unstable(state);\n  useCustomStyleHook('useAttachmentTagStyles')(state);\n\n  return renderAttachmentTag_unstable(state);\n});\n\nAttachmentTag.displayName = 'AttachmentTag';\n"],"names":["React","useAttachmentTag_unstable","renderAttachmentTag_unstable","useAttachmentTagStyles_unstable","useCustomStyleHook","AttachmentTag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,2BAA2B;AAG3E,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE;;;CAGC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,mBAAmB,0BAA0BK;IAE7C,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}
+{"version":3,"sources":["AttachmentTag.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useAttachmentTag_unstable } from './useAttachmentTag';\nimport { renderAttachmentTag_unstable } from './renderAttachmentTag';\nimport { useAttachmentTagStyles_unstable } from './useAttachmentTagStyles.styles';\nimport type { AttachmentTagProps } from './AttachmentTag.types';\nimport type { ForwardRefComponent } from '@fluentui/react-components';\nimport { useCustomStyleHook } from '@fluentui-copilot/react-provider';\n\n/**\n * @deprecated use new Attachment component exported from \\@fluentui-copilot/react-attachments package instead.\n * Deprecated on 4/9/2024.\n */\nexport const AttachmentTag: ForwardRefComponent<AttachmentTagProps> = React.forwardRef((props, ref) => {\n  const state = useAttachmentTag_unstable(props, ref);\n\n  useAttachmentTagStyles_unstable(state);\n  useCustomStyleHook('useAttachmentTagStyles')(state);\n\n  return renderAttachmentTag_unstable(state);\n});\n\nAttachmentTag.displayName = 'AttachmentTag';\n"],"names":["React","useAttachmentTag_unstable","renderAttachmentTag_unstable","useAttachmentTagStyles_unstable","useCustomStyleHook","AttachmentTag","forwardRef","props","ref","state","displayName"],"rangeMappings":";;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,4BAA4B,QAAQ,wBAAwB;AACrE,SAASC,+BAA+B,QAAQ,kCAAkC;AAGlF,SAASC,kBAAkB,QAAQ,mCAAmC;AAEtE;;;CAGC,GACD,OAAO,MAAMC,8BAAyDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC7F,MAAMC,QAAQR,0BAA0BM,OAAOC;IAE/CL,gCAAgCM;IAChCL,mBAAmB,0BAA0BK;IAE7C,OAAOP,6BAA6BO;AACtC,GAAG;AAEHJ,cAAcK,WAAW,GAAG"}

package/lib/components/AttachmentTag/index.js

@@ -2,5 +2,5 @@ export * from './AttachmentTag';
 export * from './AttachmentTag.types';
 export * from './renderAttachmentTag';
 export * from './useAttachmentTag';
-export * from './useAttachmentTagStyles';
+export * from './useAttachmentTagStyles.styles';
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentTag';\nexport * from './AttachmentTag.types';\nexport * from './renderAttachmentTag';\nexport * from './useAttachmentTag';\nexport * from './useAttachmentTagStyles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,2BAA2B"}
+{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './AttachmentTag';\nexport * from './AttachmentTag.types';\nexport * from './renderAttachmentTag';\nexport * from './useAttachmentTag';\nexport * from './useAttachmentTagStyles.styles';\n"],"names":[],"rangeMappings":";;;;","mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,wBAAwB;AACtC,cAAc,wBAAwB;AACtC,cAAc,qBAAqB;AACnC,cAAc,kCAAkC"}

package/lib/components/AttachmentTag/{useAttachmentTagStyles.js → useAttachmentTagStyles.styles.js}

@@ -27,6 +27,8 @@ export const useIconBaseClassName = __resetStyles("r176grtk", null, [".r176grtk{
  * Apply styling to the AttachmentTag slots based on the state
  */
 export const useAttachmentTagStyles_unstable = state => {
+  'use no memo';
+
   const rootBaseClassName = useRootBaseClassName();
   const mediaBaseClassName = useMediaBaseClassName();
   const contentBaseClassName = useContentBaseClassName();
@@ -39,4 +41,4 @@ export const useAttachmentTagStyles_unstable = state => {
   state.icon.className = mergeClasses(attachmentTagClassNames.icon, iconBaseClassName, state.icon.className);
   return state;
 };
-//# sourceMappingURL=useAttachmentTagStyles.js.map
+//# sourceMappingURL=useAttachmentTagStyles.styles.js.map