fix(motion): respect reduced motion in createMotionComponent()

[layershifter]

New Behavior

The check for motion being enabled was executed in useIsReducedMotion() during useEffect() while animations are triggered in useLayoutEffect(). This caused animations to start always with a false positive value.

Related Issue(s)

Related #33358.

[github-actions]

📊 Bundle size report

Package & Exports	Baseline (minified/GZIP)	PR	Change
react-accordion Accordion (including children components)	106.72 kB 32.714 kB	106.71 kB 32.714 kB	-10 B
react-components react-components: Accordion, Button, FluentProvider, Image, Menu, Popover	220.63 kB 63.913 kB	220.62 kB 63.913 kB	-10 B
react-components react-components: entire library	1.163 MB 291.211 kB	1.163 MB 291.211 kB	-9 B
react-dialog Dialog (including children components)	100.285 kB 30.064 kB	100.276 kB 30.064 kB	-9 B
react-motion @fluentui/react-motion - createMotionComponent()	4.303 kB 1.899 kB	4.293 kB 1.895 kB	-10 B -4 B
react-motion @fluentui/react-motion - createPresenceComponent()	5.034 kB 2.226 kB	5.024 kB 2.226 kB	-10 B
react-toast Toast (including Toaster)	98.335 kB 29.587 kB	98.326 kB 29.588 kB	-9 B 1 B
react-tree FlatTree	145.102 kB 41.693 kB	145.092 kB 41.692 kB	-10 B -1 B
react-tree PersonaFlatTree	145.79 kB 41.805 kB	145.78 kB 41.805 kB	-10 B
react-tree PersonaTree	142.021 kB 40.623 kB	142.011 kB 40.622 kB	-10 B -1 B
react-tree Tree	141.333 kB 40.519 kB	141.323 kB 40.519 kB	-10 B

Unchanged fixtures

Package & Exports	Size (minified/GZIP)
react-components react-components: Button, FluentProvider & webLightTheme	69.21 kB 20.174 kB
react-components react-components: FluentProvider & webLightTheme	44.447 kB 14.59 kB
react-motion @fluentui/react-motion - PresenceGroup	1.714 kB 819 B
react-portal-compat PortalCompatProvider	8.39 kB 2.64 kB
react-timepicker-compat TimePicker	107.39 kB 35.763 kB

_{🤖 This report was generated against 5ada132ed98fea112ebbfe8663dce19d10653f77}

[github-actions]

Pull request demo site: URL