Skip to content

feat(react-motion): create useReducedMotion and apply to useMotion to skip animations#29014

Merged
marcosmoura merged 2 commits into
microsoft:masterfrom
marcosmoura:feat/ignore-motion-when-reduced-motion
Aug 31, 2023
Merged

feat(react-motion): create useReducedMotion and apply to useMotion to skip animations#29014
marcosmoura merged 2 commits into
microsoft:masterfrom
marcosmoura:feat/ignore-motion-when-reduced-motion

Conversation

@marcosmoura

Copy link
Copy Markdown
Contributor

Create a new useReducedMotion hook to react-motion.

The goal of this hook is to detect the client has reduced motion enabled.
By applying this to the useMotion hook, we avoid unnecessary calculations as, when reduced motion is enabled, we can consider that no CSS Transitions/Animations should be applied.

@marcosmoura marcosmoura added the Package: motion react-motion related changes label Aug 29, 2023
@marcosmoura marcosmoura self-assigned this Aug 29, 2023
@marcosmoura
marcosmoura requested a review from a team as a code owner August 29, 2023 13:39
@marcosmoura
marcosmoura marked this pull request as draft August 29, 2023 13:39
@marcosmoura
marcosmoura marked this pull request as ready for review August 29, 2023 13:40
@marcosmoura marcosmoura changed the title feat: create useReducedMotion and apply to useMotion to skip all moti… feat(react-motion): create useReducedMotion and apply to useMotion to skip all motion calculations Aug 29, 2023
@fabricteam

Copy link
Copy Markdown
Collaborator

📊 Bundle size report

🤖 This report was generated against 937bff2d22d6e9d5848a1c0be748006c684934a3

@codesandbox-ci

Copy link
Copy Markdown

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit 1539d03:

Sandbox Source
@fluentui/react 8 starter Configuration
@fluentui/react-components 9 starter Configuration

@size-auditor

size-auditor Bot commented Aug 29, 2023

Copy link
Copy Markdown

Asset size changes

Size Auditor did not detect a change in bundle size for any component!

Baseline commit: 937bff2d22d6e9d5848a1c0be748006c684934a3 (build)

@marcosmoura marcosmoura changed the title feat(react-motion): create useReducedMotion and apply to useMotion to skip all motion calculations feat(react-motion): create useReducedMotion and apply to useMotion to skip animations Aug 30, 2023
@marcosmoura
marcosmoura enabled auto-merge (squash) August 30, 2023 18:22
@marcosmoura
marcosmoura merged commit 00a6c4e into microsoft:master Aug 31, 2023
@marcosmoura
marcosmoura deleted the feat/ignore-motion-when-reduced-motion branch August 31, 2023 12:14
marcosmoura added a commit to marcosmoura/fluentui that referenced this pull request Sep 3, 2023
* master: (32 commits)
  refactor(react-drawer): change DrawerHeaderTitle slot creation while keeping the same API (microsoft#29042)
  test(react-drawer): add render tests for drawer subcomponents (microsoft#29043)
  Grouped vertical bar chart - Component tests (microsoft#29031)
  docs: add Fluent UI Insights EP06 to README (microsoft#29051)
  chore: use swc-plugin-de-indent-template-literal for consoles (microsoft#29040)
  chore: adds swc-plugin-de-indent-template-literal (microsoft#29037)
  feat(react-jsx-runtime): v9 packages to use importSource (microsoft#28959)
  chore: update swc build dependencies (microsoft#28989)
  fix(react-tags-preview): add hover/pressed style for windows high contrast (microsoft#29035)
  chore(react-tags-preview): use InteractionTag for TagGroup's stories (microsoft#29024)
  chore(react-tags-preview): use makeResetStyles for base styles (microsoft#29022)
  chore: fix codesandbox export for preview component by making @fluentui/react-components required dependency (microsoft#29016)
  applying package updates
  feat(react-motion): create useReducedMotion and apply to useMotion to skip animations (microsoft#29014)
  ReAdd: Keytips: Align keytipData with visible instance for dupes (microsoft#28992)
  feat(react-drawer): add motion to Drawer (microsoft#28999)
  fix(react-utilities): avoid calling requestAnimationFrame when in SSR (microsoft#29015)
  fix(ssr-tests-v9): use correct path for ssr-tests-v9 stories (microsoft#29025)
  chore: updates devcontainer to use v16-bookworm image (microsoft#28997)
  feat(docsite): add Application Insights telemetry (microsoft#28709)
  ...
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Package: motion react-motion related changes

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants