rippl v1.1.0

Ripple effect for React

This works with any type of element, from <div />, <button /> to <tr /> or <td />. Server-side rendering works fine too.

Demo: https://codesandbox.io/s/k5vo27469r

1. Installation

npm i rippl

# or

yarn add rippl

2. Usage

Example 1: wrap a button

import Ripple from 'rippl'

<Ripple>
  <button>click me</button>
</Ripple>

Example 2: wrap a table row

import Ripple from 'rippl'

<table>
  <tbody>
    {rows.map(row => (
      <Ripple key={row.id}>
        <tr>
          <td>{row.firstName}</td>
          <td>{row.lastName}</td>
        </tr>
      </Ripple>
    ))}
  </tbody>
</table>

Props

Road map

• add duration props
• add color prop