RippleButton

Pointer-origin click ripple with timer cleanup, accessible button semantics, and a static reduced-motion path.

InterfaceSource ready3 props documentedLive preview
Add with shadcnnpx shadcn@latest add https://www.uigrids.com/r/ripple-button.json
Interactive preview
Interface

Install with the CLI

# adds RippleButton to components/ui with the shadcn CLI
npx shadcn@latest add https://www.uigrids.com/r/ripple-button.json

Or install the package

// npm install @uigrids/react-ui
import { RippleButton } from '@uigrids/react-ui'

export default function App() {
  return <RippleButton />
}

Props

PropTypeDefaultDescription
childrenstring'Run action'Content rendered inside the component.
onClickunknown-Configures the on click option.
classNamestring''Additional CSS classes for the outer element.