fix(checkbox): add focusable=false to svg for a11y (#375)

material-components · Oct 30, 2018 · c7f3b97 · c7f3b97
1 parent dac1ecf
commit c7f3b97
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 3 deletions.
diff --git a/packages/checkbox/index.js b/packages/checkbox/index.js
@@ -150,7 +150,9 @@ export class Checkbox extends Component {
         />
         <div className='mdc-checkbox__background'>
           <svg className='mdc-checkbox__checkmark'
-              viewBox='0 0 24 24'>
+              viewBox='0 0 24 24'
+              focusable='false'
+          >
             <path className='mdc-checkbox__checkmark-path'
                   fill='none'
                   d='M1.73,12.91 8.1,19.28 22.79,4.59'/>

diff --git a/packages/chips/ChipCheckmark.js b/packages/chips/ChipCheckmark.js
@@ -38,7 +38,7 @@ export default class ChipCheckmark extends Component {
   render() {
     return (
       <div className='mdc-chip__checkmark' ref={this.init}>
-        <svg className='mdc-chip__checkmark-svg' viewBox='-2 -3 30 30'>
+        <svg className='mdc-chip__checkmark-svg' viewBox='-2 -3 30 30' focusable='false'>
           <path
             className='mdc-chip__checkmark-path'
             fill='none'

diff --git a/packages/notched-outline/index.js b/packages/notched-outline/index.js
@@ -102,7 +102,7 @@ export default class NotchedOutline extends React.Component {
         className={this.classes}
         key='notched-outline'
         ref={this.outlineElement_}>
-        <svg>
+        <svg focusable='false'>
           <path ref={this.pathElement_}
             className='mdc-notched-outline__path' />
         </svg>