探客时代 | 知识就是力量
Selection Viselect - A high performance and lightweight library to add a visual way o...
README src="https://img.shields.io/badge/license-MIT-ae15cc.svg">
<img alt="No dependencies"
src="https://img.shields.io/badge/dependencies-none-8115cc.svg">
alt="Support me" src="https://img.shields.io/badge/github-support-6a15cc.svg">
alt="Buy me a coffee" src="https://img.shields.io/badge/%F0%9F%8D%BA-buy%20me%20a%20beer-%23FFDD00"> alt="Build Status" src="https://github.com/Simonwep/selection/workflows/CI/badge.svg"> alt="Vue support" src="https://img.shields.io/badge/✔-vue-%2340B581"> alt="Preact support" src="https://img.shields.io/badge/✔-preact-%236337B1"> alt="React support" src="https://img.shields.io/badge/✔-react-%2359D7FF"> alt="Svelte support" src="https://img.shields.io/badge/%E2%9A%99-svelte-%23F83C00">
Features 🤘
🌟 Modern bundle
🔩 Ultra tiny (<4kb)
👌 Simple usage
⚡ Highly optimized
✔ Zero dependencies
📱 Mobile / touch support
🖱 Vertical and horizontal scroll support
💪 Hardened (over 3 years old and used in many apps)
🖼 Support for major frameworks (WIP)
Getting started
Check out the documentation for the package you want to use:
@viselect/lit - TBA (planned).
@viselect/svelte - TBA (planned).
@viselect/angular - TBA (planned).
Check out recipes for commonly asked questions and how to solve them using the standart library!
Browser support
This library will always have the previous year as its target. For 2021 for example the target will be ES2020.
It always provides both a UMD (.js ) and .mjs version. If you want to support legacy browsers, please use the feature of your bundler to transpile dependencie. In case of
webpack and babel (give
vite a try, it's awesome) you'll have to install corresponding plugins such
entirely excluded from being processed.
I do this to provide maximum flexibility and give those who target ESNext a chance to make full use of how this library is bundled.
Everything else is just a matter of configuration :)
Is this library the right choice for me?
Viselect primarily focuses on being a high-performant engine to select elements with various boundaries, behaviours and modes in your browser.
Viselect is to "full-blown libraries" what is
popper.js to
tippy.js - the _core_ of your feature / of another
library.
Development
Use the following commands to work on this locally (we use
lerna to manage this):
npm run dev _- Spawns a dev-server for all packages. Every framework-dependend package is bundled with the vanilla version._
npm run build _- Builds all packages in parallel._
npm run lint:fix _- Lints and fixes all errors in all packages._
For the development servers
vite is used. It's superb, you should give it a try.
To bundle it we use
rollup (which is btw also used by vite behind the scenes) to have full control over how the bundle looks like.
Releasing a new version
This project is managed via
lerna .
To bump the version and publish a new one run the following commands:
lerna version
lerna publish from-package
You want to contribute?