Docs / Components

SenseRippleDirective

Material-style click ripple effect for interactive host elements from @artificialsenselabs/ui. Respects prefers-reduced-motion.

Live demo: run nx serve showcase and open /components/ripple (port 4202).

Overview

Category: Display. Selector: [senseRipple]. Import: import { SenseRippleDirective } from '@artificialsenselabs/ui';

Accessibility

  • Ripple waves are decorative and do not capture pointer events.
  • Animation is skipped when the user prefers reduced motion.
  • Set disabled to suppress ripples without removing the directive.