React Pointer Ripple

An NPM Package to add ripple animation on pointer events to react components

Overview

Adds ripple animation to pointer events (mouse / touch) including:

• Click
• Touch / Tap
• Drag
• Scroll/Swipe

Works well on both desktop and mobile devices. Multi touch support comming soon..

Installation and Usage

The easiest way to use react-pointer-ripple is to install it from npm

yarn add react-pointer-ripple

Then use it as a wrapper around any component in your React app

import React from 'react';
import PointerRipple from 'react-pointer-ripple';

const App = () => {
  return (
    <PointerRipple>
      <div>Hello World!</div>     // any component/text here..
    </PointerRipple>
  )
}

Props

coming soon..