Callout/composed path

change/@fluentui-react-87fd4c4f-594a-4a62-b5a2-8306eb0c1d19.json

@@ -0,0 +1,10 @@
+{
+  "type": "patch",
+  "comment": {
+    "title": "",
+    "value": ""
+  },
+  "packageName": "@fluentui/react",
+  "email": "[email protected]",
+  "dependentChangeType": "patch"
+}

packages/react/src/components/Callout/CalloutContent.base.tsx

@@ -347,7 +347,8 @@ function useDismissHandlers(
     };
 
     const dismissOnClickOrScroll = (ev: Event) => {
-      const target = ev.target as HTMLElement;
+      const eventPaths: Array<EventTarget> = ev.composedPath ? ev.composedPath() : [];
+      const target = eventPaths.length > 0 ? (eventPaths[0] as HTMLElement) : (ev.target as HTMLElement);
       const isEventTargetOutsideCallout = hostElement.current && !elementContains(hostElement.current, target);
 
       // If mouse is pressed down on callout but moved outside then released, don't dismiss the callout.