modern, lightweight, robust and extensible user gesture recognizer

Demo • Documentation • npm

What's Pointeract?

Pointeract is a tiny JavaScript/TypeScript utility library focusing on one thing - handling user interactions with DOM elements, e.g. multitouch and touchpad.

With the unique strength of versatile typings in TypeScript and its dynamic nature, Pointeract has achieved a highly modular, extendable and efficient architecture. Its core bundle size is only 1KB minified + gzipped, functionalities come from also byte-sized modules. It's fully tree-shakable, the fewer modules you use, the smaller your bundle is.

Advantages

• 🐣 Tiny: With base 1KB minified and gzipped, 1-2KB for normal usage.
• 💪 Robust: Excels at complex gestures where most interaction libraries fail, Why?
• 🧩 Extensible: Extend Pointeract effortlessly via our module API.
• 🔌 Flexible during Runtime: Options are updated reactively. Stop/start any module during runtime.
• 🛡️ Safe: Not modifying the DOM (except the PreventDefault module). Meticulous clean up prevents memory leaks.

Get Started

Install Pointeract using your favorite package manager:

# npm
$ npm add pointeract

# pnpm
$ pnpm add pointeract

# yarn
$ yarn add pointeract

Or include the following lines directly in your HTML file:

<script type="module">
	import { Pointeract } from 'https://unpkg.com/pointeract';
</script>

This link ships the latest ESM version by default.

Then simply grab the core class and a module:

import { Pointeract, Drag } from 'pointeract';

new Pointeract({ element: yourElement }, Drag)
    .start()
    .on('drag', e => console.log(e));

Congratulations! You can now press your mouse or finger to the element and move, the console will log events like a waterfall.

Read next: dive into the usage of Pointeract in Use Pointeract.

Currently Supported Features

• Click (Double Click, Triple Click, Quadruple Click, Any Click)
• Drag
• Pan and Zoom via Mouse Wheel (ctrl/shift key binding, touchpad support)
• Pan and Zoom via Multitouch (Pan, Pinch)
• One-line Prevent Default
• Smooth Everything (drag / pan / zoom / any interaction involving numbers)

Those interactions are shipped via modules, which can be composed from a single drag-and-drop to a canvas app.

Missing your desired interaction? Write your own module!

How Pointeract Stands Out?

There're already plenty of interaction libraries out there, most famous ones are Interact.js and Hammer.js, but Pointeract is different.

Criteria	Pointeract	Hammer.js	Interact.js
Written in TypeScript?	✅	❌	✅
Tree-shakeable?	✅	❌	❌
Total Bundle Size (Minified + Gzipped)	👑 3KB	7KB	28KB
Last Updated	👑 Actively Maintained	2015	2023
Features	Pointer and Wheel Related + Some Utils	Pointer Related	👑 Pointer and Wheel Related + Comprehensive Utils
Robust? (See Testing)	✅	❌ Element Jerks	❌ Element Ignores the Second Touch
Extensible?	✅	❌	❌

Get Involved

This project welcomes anyone that has ideas to improve it.

• Open a pull request for a new module, event standard, documentation update, and so on.
• Open an issue if you find a bug.
• Start a new thread in Discussions if you have feature requests or questions, please avoid posting them in Issues.
• Report a vulnerability if you find one, please do not disclose it publicly.

Copyright and License

Copyright ©️ 2025-2026 Hesprs (Hēsperus) | Apache License 2.0