title: How to access onClick action in Material UI Link through keyboard Tab key without using component="button" or href when I use tabIndex in it
body: <p>After I got the focus on Material UI Link through keyboard tab key using tabIndex, the click action is not working when I hit the enter button. I don't understand why. Can anyone help me with this? Thank you.</p>
  <p>sandbox link: <a href="https://codesandbox.io/s/material-demo-forked-4evbh?file=/demo.tsx" rel="nofollow noreferrer">https://codesandbox.io/s/material-demo-forked-4evbh?file=/demo.tsx</a></p>
  <p>code:</p>
  <pre><code>/* eslint-disable jsx-a11y/anchor-is-valid */
   import React from &quot;react&quot;;
   import { makeStyles, createStyles, Theme } from &quot;@material-ui/core/styles&quot;;
   import Link from &quot;@material-ui/core/Link&quot;;
   import Typography from &quot;@material-ui/core/Typography&quot;;
  
   const useStyles = makeStyles((theme: Theme) =&gt;
   createStyles({
   root: {
    &quot;&amp; &gt; * + *&quot;: {
      marginLeft: theme.spacing(2)
    }
  }
  })
  );
  
  export default function Links() {
  const classes = useStyles();
  
  const [state, setState] = React.useState(true);
  
  const handleClick = () =&gt; {
  setState(!state);
  };
  
  return (
   &lt;Typography className={classes.root}&gt;
   &lt;Link onClick={handleClick} tabIndex={0}&gt;
      Link
   &lt;/Link&gt;
   &lt;Typography&gt;Click on above link to display hidden content..&lt;/Typography&gt;
      {state ? &quot;&quot; : &quot;focus on Link using Tab key?&quot;}
   &lt;/Typography&gt;
   );
   }
  </code></pre>