Security News
PyPI Now Supports iOS and Android Wheels for Mobile Python Development
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
By Sarah Gooding - Feb 12, 2025
New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More →
alpinejs-swipe
Advanced tools
alpinejs-swipe
AlpineJS custom directive to detect swipe gestures on an element.
Installation
CDN
Include the following <script> tag in the <head> of your document:
<script src="https://unpkg.com/alpinejs-swipe"></script>
Important: This must be added before loading Alpine.js when using CDN links.
NPM
You can also install using a package manager.
npm install alpinejs-swipe
yarn add alpinejs-swipe
And then register the plugin before Alpine.start():
import swipePlugin from "alpinejs-swipe";
Alpine.plugin(swipePlugin);
Alpine.start();
Usage
Just use the "x-swipe" directive with an expression and you'll be called back when the user swipes in the direction you want.
<div x-swipe:down="console.log('SWIPED DOWN!')"></div>
<div x-swipe:right="console.log('SWIPED RIGHT!')"></div>
You can also define a threshold with modifiers:
<div x-swipe:down.threshold.200px="console.log('SWIPED DOWN!')"></div>
The default threshold is 50.
If you want, it's also possible to be called back when the user swipes to any side, just omit the direction:
<div x-swipe="console.log('SWIPED!')"></div>
In this case the direction will be passed to the function in the expression through the first argument.
Future ideas
- Allow other gestures detection (like pan, doubletap and longpress) with https://github.com/sciactive/tinygesture.
License
Licensed under the MIT license, see LICENSE.md for details.
FAQs
AlpineJS custom directive to detect swipe gestures on an element.
The npm package alpinejs-swipe receives a total of 625 weekly downloads. As such, alpinejs-swipe popularity was classified as not popular.
We found that alpinejs-swipe demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Package last updated on 21 Feb 2023
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Related posts
Security News
Create React App Officially Deprecated Amid React 19 Compatibility Issues
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
By Sarah Gooding - Feb 11, 2025
Security News
Oracle Drags Its Feet in the JavaScript Trademark Dispute
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.
By Sarah Gooding - Feb 07, 2025