File tree Expand file tree Collapse file tree 1 file changed +28
-1
lines changed Expand file tree Collapse file tree 1 file changed +28
-1
lines changed Original file line number Diff line number Diff line change @@ -20,7 +20,8 @@ import { FetchLoading } from 'fetch-loading'
20
20
<FetchLoading />
21
21
22
22
### with no arguments being passed,
23
- ### the animation will fall back to its default color #52525c
23
+ ### the animation will fall back to its default color #52525c,
24
+ ### and it will not contain any accessible attributes
24
25
25
26
...
26
27
@@ -49,3 +50,29 @@ You can also pass any Hex- / RGB- or RGBA-value as an argument for the `theme` p
49
50
```
50
51
51
52
![ Theme Fetch Loading Animation Preview] ( https://github.com/user-attachments/assets/e0179995-309a-46f0-988f-70bf3e2ce9d6 )
53
+
54
+ By passing a descriptive value for ` ariaLabel ` , the following properties are added:
55
+
56
+ ```
57
+ ...
58
+
59
+ <FetchLoading ariaLabel="Loading" />
60
+
61
+ ### role="status"
62
+ ### aria-live="polite"
63
+ ### aria-label="Loading"
64
+
65
+ ...
66
+ ```
67
+
68
+ This results in screen reader users hearing “Status - Loading” being read aloud.
69
+
70
+ Of course, ` theme ` and ` ariaLabel ` can also be used simultaneously:
71
+
72
+ ```
73
+ ...
74
+
75
+ <FetchLoading ariaLabel="Loading" theme="#ffe98c"/>
76
+
77
+ ...
78
+ ```
You can’t perform that action at this time.
0 commit comments