How to disable ripple in Material Design React

Question

I am talking about this repository. https://github.com/callemall/material-ui

I want to know how to disable the ripple effect from all components.

Thanks.

Answer 1

For anyone that cares about how to do so on an individual button by button bases, be sure to apply the disableRipple property to the individual button you care to disable the ripple effect for.

for example

import {Button, IconButton} from '@material-ui/core';
function RiplelessButtonSampleComponent(props)
{
   return (
            <div>
               <strong>Icon Button</strong>
               <IconButton disableRipple onClick={this.showModal} variant="text" color="primary">
                  <i className="fal fa-chevron-right" />
               </IconButton>

               <strong>Standard Button</strong>

               <Button disableRipple onClick={this.showModal} variant="text" color="primary">
                  Click Me for No effect
               </Button>
            </div>
   )
}