Ripple

Imports

import {Ripple} from 'material-expressive-react';
import {Ripple} from 'material-expressive-react/ripple';

Props

Prop	Type	Default	Required	Description
control	HTMLElement | null		No	Attach to an element directly.
disabled	boolean		No	Disables the ripple.
for	string		No	Alias for htmlFor to match the docs <md-ripple for="...">
htmlFor	string | null		No	References the id of an element to attach to. (Maps to the underlying ripple's htmlFor property.)
onClick	((event: Event) => void)		No	Explicit click handler (wired via addEventListener for CustomElements).

Events

This component does not explicitly re-emit DOM events via wrapper props.

Slots

Material Web components frequently use named slots. In React, you can pass slot="..." on children (e.g. <Icon slot="icon" />).

If you need to slot a child component that does not accept a slot prop, use the Slotted utility (see Utilities → Slotted).

Examples

See Storybook for live examples and variants.