The package can be installed through npm or by using a CDN.
npm i -S @wilkr/alpine-ripple
x-ripple-focus directives to your project by importing the package.
import Alpine from "alpinejs"; import Ripple from "@wilkr/alpine-ripple"; Alpine.plugin(Ripple); window.Alpine = Alpine; window.Alpine.start();
Import the package styles into your CSS.
If CDNs are more your thing, you can include the following
<link> tags in the
<head> of your document, just before Alpine.
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@wilkr/[email protected]/dist/alpine-ripple.css" /> <script src="https://cdn.jsdelivr.net/npm/@wilkr/[email protected]/dist/alpine-ripple.min.js" defer ></script>