# v-range-component

> Vue Range Slider component

Latest version **1.1.4** (published 2021-10-27) · ISC license · 0 weekly downloads

## Install

```sh
npm install v-range-component
pnpm add v-range-component
yarn add v-range-component
bun add v-range-component
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.4 |
| Published | 2021-10-27 |
| First published | 2021-10-21 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 1 |
| Unpacked size | 54.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Jacek Polski |
| Maintainers | jpolskicom |
| Keywords | vue, nuxt, range, plugin, simple, light, slider, range slider, range slider click, range slider touch, range slider input, component |

## Links

- npm: https://www.npmjs.com/package/v-range-component
- Repository: https://github.com/jpolskicom/vRange
- Homepage: https://github.com/jpolskicom/vRange#readme
- Issues: https://github.com/jpolskicom/vRange/issues
- npm.io page: https://npm.io/package/v-range-component

## Dependencies (1)

- [vue-sfc-rollup](https://npm.io/package/vue-sfc-rollup.md) ^4.1.1

## Alternatives

- [@oh-my-pi/pi-natives](https://npm.io/package/@oh-my-pi/pi-natives.md) — 51.8K weekly downloads
- [@capgo/capacitor-light-sensor](https://npm.io/package/@capgo/capacitor-light-sensor.md) — 3.0K weekly downloads
- [@heyhuynhgiabuu/pi-diff](https://npm.io/package/@heyhuynhgiabuu/pi-diff.md) — 492 weekly downloads
- [@lotsa/verdant-lang-asm](https://npm.io/package/@lotsa/verdant-lang-asm.md) — 38 weekly downloads
- [new-era-syntax](https://npm.io/package/new-era-syntax.md) — 20 weekly downloads

## Recent versions

- 1.1.4 (latest) — 2021-10-27
- 1.1.3 — 2021-10-26
- 1.1.2 — 2021-10-26
- 1.1.1 — 2021-10-26
- 1.1.0 — 2021-10-26
- 1.0.9 — 2021-10-26
- 1.0.8 — 2021-10-22
- 1.0.7 — 2021-10-22
- 1.0.5 — 2021-10-22
- 1.0.4 — 2021-10-22
- 1.0.3 — 2021-10-21
- 1.0.2 — 2021-10-21
- 1.0.1 — 2021-10-21
- 1.0.0 — 2021-10-21

## README

# vRange Component

![demo image](https://github.com/jpolskicom/vRange/blob/main/demo.png?raw=true)

## Ussage

### 1. Install

```
npm i v-range-component
```

### 2.Just import module into your component.
Build in styles are not required, but without any styling component will not work as expected.

```
    import VRangeComponent from 'v-range-component'
    import 'v-range-component/dist/styles.css'

```

### Avaible options:

| Prop | Type | Default | Description |
| ---- | ---- | ---- | ---- |
| value | Array | [0, 100] | Provides initial values |
| label | Array | ["from", "to"] | Labels for min,max values |
| unit | String | 'PLN' | Unit display at input fields |
| range | Array | [0, 100] | Min-max slider values |
| step | Number | 1 | Number of steps between min-max values |
| showSteps | Boolean | false | That option generates div for each step that may be used for show track step points |
| showInputs | Boolean | true | Show input fields |
| stepsArray | Array | [] | Steps values. As default will generate array from 'step' and max range value |
| lazy | Number | 500 | Delay (ms) before emit value by component after change |
| logarithmic | Boolean | false| Makes values growth logarithmic |

---
_Source: https://npm.io/package/v-range-component · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._