From 5f0b8de993dda694d3a460fd7bd17ee05c32556f Mon Sep 17 00:00:00 2001 From: Tomi Olubeko Date: Mon, 7 Nov 2022 13:06:48 -0800 Subject: [PATCH 1/2] chore: Add reduced-motion documentation to Spinner --- packages/react-components/react-spinner/Spec.md | 2 ++ .../react-spinner/src/stories/Spinner/SpinnerBestPractices.md | 1 + 2 files changed, 3 insertions(+) diff --git a/packages/react-components/react-spinner/Spec.md b/packages/react-components/react-spinner/Spec.md index e28dc0f114140..380ef7ead3d85 100644 --- a/packages/react-components/react-spinner/Spec.md +++ b/packages/react-components/react-spinner/Spec.md @@ -118,3 +118,5 @@ The Spinner is non-interactive. - **Touch** - Nothing ## Accessibility + +When reduced motion, is active the `indeterminate` `Spinner` will rotate once and then stop animating. diff --git a/packages/react-components/react-spinner/src/stories/Spinner/SpinnerBestPractices.md b/packages/react-components/react-spinner/src/stories/Spinner/SpinnerBestPractices.md index 5c3d196e5ab83..be456ed8de8a2 100644 --- a/packages/react-components/react-spinner/src/stories/Spinner/SpinnerBestPractices.md +++ b/packages/react-components/react-spinner/src/stories/Spinner/SpinnerBestPractices.md @@ -10,6 +10,7 @@ - Use one Spinner at a time. - Descriptive verbs are appropriate under a Spinner to help the user understand what's happening. Ie: Saving, processing, updating. - Use a Spinner when confirming a change has been made or a task is being processed. +- Add a description to a Spinner when reduced-motion is active ### Don't From bbff13c580f18a58d9fd126287f92c33bb9bae25 Mon Sep 17 00:00:00 2001 From: Tomi Olubeko Date: Mon, 7 Nov 2022 13:09:36 -0800 Subject: [PATCH 2/2] change file --- ...react-spinner-9b660086-15f0-4220-970b-d21b6a1e0ed4.json | 7 +++++++ 1 file changed, 7 insertions(+) create mode 100644 change/@fluentui-react-spinner-9b660086-15f0-4220-970b-d21b6a1e0ed4.json diff --git a/change/@fluentui-react-spinner-9b660086-15f0-4220-970b-d21b6a1e0ed4.json b/change/@fluentui-react-spinner-9b660086-15f0-4220-970b-d21b6a1e0ed4.json new file mode 100644 index 0000000000000..8a0807bf5d8dc --- /dev/null +++ b/change/@fluentui-react-spinner-9b660086-15f0-4220-970b-d21b6a1e0ed4.json @@ -0,0 +1,7 @@ +{ + "type": "patch", + "comment": "Add documentation for Spinner when reduced-motion is active", + "packageName": "@fluentui/react-spinner", + "email": "ololubek@microsoft.com", + "dependentChangeType": "patch" +}