ProgressSpinner accessibility #5356

primefaces · Nov 23, 2023 · f9b58e4 · f9b58e4
1 parent 19c0df7
commit f9b58e4
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 15 deletions.
diff --git a/components/doc/progressspinner/accessibilitydoc.js b/components/doc/progressspinner/accessibilitydoc.js
@@ -1,24 +1,21 @@
 import { CodeHighlight } from '@/components/doc/common/codehighlight';
-import { DevelopmentSection } from '@/components/doc/common/developmentsection';
 import { DocSectionText } from '@/components/doc/common/docsectiontext';
 
 export function AccessibilityDoc() {
     return (
-        <DevelopmentSection>
-            <DocSectionText id="accessibility" label="Accessibility">
-                <h3>Screen Reader</h3>
-                <p>
-                    ProgressSpinner components uses <i>progressbar</i> role. Value to describe the component can be defined using <i>aria-labelledby</i> and <i>aria-label</i> props.
-                </p>
-                <CodeHighlight>
-                    {`
+        <DocSectionText id="accessibility" label="Accessibility">
+            <h3>Screen Reader</h3>
+            <p>
+                ProgressSpinner components uses <i>progressbar</i> role. Value to describe the component can be defined using <i>aria-labelledby</i> and <i>aria-label</i> props.
+            </p>
+            <CodeHighlight>
+                {`
 <ProgressSpinner aria-label="Loading" />
 `}
-                </CodeHighlight>
+            </CodeHighlight>
 
-                <h3>Keyboard Support</h3>
-                <p>Component does not include any interactive elements.</p>
-            </DocSectionText>
-        </DevelopmentSection>
+            <h3>Keyboard Support</h3>
+            <p>Component does not include any interactive elements.</p>
+        </DocSectionText>
     );
 }
diff --git a/components/lib/progressspinner/ProgressSpinner.js b/components/lib/progressspinner/ProgressSpinner.js
@@ -28,9 +28,10 @@ export const ProgressSpinner = React.memo(
                 ref: elementRef,
                 style: props.style,
                 className: classNames(props.className, cx('root')),
-                role: 'alert',
+                role: 'progressbar',
                 'aria-busy': true
             },
+            ProgressSpinnerBase.getOtherProps(props),
             ptm('root')
         );