[@mantine/core] Set aria-hidden on Checkbox and Radio icons to prev…

…ent them being announced by screen readers (#5202)
mantinedev · Nov 7, 2023 · 233f924 · 233f924
1 parent 6214fc0
commit 233f924
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 1 deletion.
diff --git a/src/mantine-core/src/components/Checkbox/CheckIcon.tsx b/src/mantine-core/src/components/Checkbox/CheckIcon.tsx
@@ -18,6 +18,7 @@ export function CheckIcon({ size, style, ...others }: CheckIconProps) {
       fill="none"
       xmlns="http://www.w3.org/2000/svg"
       style={_style}
+      aria-hidden
       {...others}
     >
       <path
@@ -33,7 +34,13 @@ export function CheckIcon({ size, style, ...others }: CheckIconProps) {
 export function CheckboxIcon({ indeterminate, ...others }: CheckboxIconProps) {
   if (indeterminate) {
     return (
-      <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 32 6" {...others}>
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        fill="none"
+        viewBox="0 0 32 6"
+        aria-hidden
+        {...others}
+      >
         <rect width="32" height="6" fill="currentColor" rx="3" />
       </svg>
     );

diff --git a/src/mantine-core/src/components/Radio/RadioIcon.tsx b/src/mantine-core/src/components/Radio/RadioIcon.tsx
@@ -12,6 +12,7 @@ export function RadioIcon({ size, style, ...others }: RadioIconProps) {
       fill="none"
       viewBox="0 0 5 5"
       style={{ width: rem(size), height: rem(size), ...style }}
+      aria-hidden
       {...others}
     >
       <circle cx="2.5" cy="2.5" r="2.5" fill="currentColor" />