feat(react-menu): integrate useSafeZoneArea()

[layershifter]

New Behavior

This PR integrates a safe zone feature implemented in #34445 to the Menu component:

https://github.com/user-attachments/assets/d77ae264-c564-4e32-94be-12e082deb58d

Currently feature is not enabled by default, we will do more testing before enabling it by default.

However, it's possible to enable it via composition as it's exposed on useMenu() hook.

Notes

• mouseEnter was changed to mouseMove as there is a strange React behavior when mouseenter React event is not called (unlike the native one)

[github-actions[bot]]

Pull request demo site: URL

[github-actions[bot]]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	226.756 kB 65.562 kB	233.944 kB 67.797 kB	7.188 kB 2.235 kB
react-components react-components: entire library	1.27 MB 319.97 kB	1.271 MB 320.375 kB	1.18 kB 405 B
react-menu Menu (including children components)	155.612 kB 46.732 kB	162.815 kB 49.391 kB	7.203 kB 2.659 kB
react-menu Menu (including selectable components)	158.594 kB 47.297 kB	165.797 kB 49.973 kB	7.203 kB 2.676 kB

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
react-avatar Avatar	48.435 kB 15.47 kB
react-avatar AvatarGroup	19.235 kB 7.617 kB
react-avatar AvatarGroupItem	62.579 kB 19.688 kB
react-breadcrumb @fluentui/react-breadcrumb - package	114.129 kB 31.478 kB
react-components react-components: Button, FluentProvider & webLightTheme	68.79 kB 19.902 kB
react-components react-components: FluentProvider & webLightTheme	43.624 kB 14.255 kB
react-datepicker-compat DatePicker Compat	225.689 kB 63.825 kB
react-dialog Dialog (including children components)	102.401 kB 30.602 kB
react-overflow hooks only	12.832 kB 4.828 kB
react-persona Persona	55.326 kB 17.35 kB
react-popover Popover	131.354 kB 40.872 kB
react-portal-compat PortalCompatProvider	8.386 kB 2.624 kB
react-table DataGrid	161.134 kB 45.539 kB
react-table Table (Primitives only)	41.895 kB 13.537 kB
react-table Table as DataGrid	131.392 kB 36.305 kB
react-table Table (Selection only)	69.763 kB 19.668 kB
react-table Table (Sort only)	68.406 kB 19.286 kB
react-tag-picker @fluentui/react-tag-picker - package	187.334 kB 56.148 kB
react-tags InteractionTag	14.563 kB 5.864 kB
react-tags Tag	29.728 kB 9.62 kB
react-tags TagGroup	83.089 kB 24.555 kB
react-teaching-popover TeachingPopover	102.747 kB 30.737 kB
react-timepicker-compat TimePicker	108.969 kB 36.011 kB
react-tree FlatTree	148.652 kB 42.581 kB
react-tree PersonaFlatTree	149.41 kB 42.704 kB
react-tree PersonaTree	145.667 kB 41.587 kB
react-tree Tree	144.915 kB 41.444 kB

_{🤖 This report was generated against 94cc3a3e0ab75132a2aadb7cce5f1220c5301a98}