HTML
SCSS
TypeScript
Summary
PMat Ripple is an opt-in interaction directive that starts a wave at the point of mouse, pen, or touch contact. Enter and Space receive equivalent centered feedback.
Common Example
Interaction Model
Opt-in feedback
The directive supplements the existing Button state layer. It does not change button, checkbox, or radio defaults.
Semantic host required
Ripple does not add a role, tab index, accessible name, focus ring, or a 48px target. Use an already-correct action.
Theme-aware
The wave uses currentColor and tokenized opacity and motion, so it follows the action surface and active theme.