Skip to content

Commit 1f57260

Browse files
authored
Update README.md
1 parent d2aef8a commit 1f57260

File tree

1 file changed

+35
-6
lines changed

1 file changed

+35
-6
lines changed

README.md

Lines changed: 35 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ npm install svelte-range-slider-pips --save-dev # if you prefer npm
6565

6666
## Usage
6767

68-
### In a svelte project
68+
### In a svelte 4/5 project
6969

7070
Assuming you have a Svelte app up and running;
7171

@@ -88,6 +88,10 @@ Assuming you have a Svelte app up and running;
8888

8989
---
9090

91+
### In a svelte 3 project
92+
93+
_Version 3 of Range Slider Pips is not compatible with Svelte 3. [see below](#svelte-3)_
94+
9195
### As a regular JS file
9296

9397
If you're not building a svelte-app, you can use the [`/dist/`
@@ -123,7 +127,7 @@ This should even work with jQuery.
123127

124128
---
125129

126-
### As a JS module
130+
### As a JS module, or with Vue & React
127131

128132
If you're building a bleeding-edge JS application (maybe Vue or React), you might
129133
want to use js imports (`import`)
@@ -156,6 +160,7 @@ var mySlider = new RangeSlider({
156160

157161
| prop | type | default | description |
158162
| ------------------- | ------------------ | ----------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
163+
| **value** | `Number` | `50` | Value to apply on the slider. |
159164
| **values** | `Array` | `[50]` | Array of values to apply on the slider. Multiple values creates multiple handles. (_**note:** A slider with `range` property set can only have two values max_) |
160165
| **min** | `Number` | `0` | Minimum value for the slider _(should be `< max`)_ |
161166
| **max** | `Number` | `100` | Maximum value for the slider _(should be `> min`)_ |
@@ -227,13 +232,37 @@ I am very happy to accept;
227232

228233
[Read the CONTRIBUTING.md](./CONTRIBUTING.md)
229234

235+
<br>
236+
<br>
237+
230238
---
231239

232-
## Support / Donate
240+
## Notes
241+
242+
### Svelte 3
243+
244+
Because of the code in Range Slider Pips 3, it is now incompatible with Svelte version 3.
245+
246+
If you are unable to upgrade your project, then I suggest looking for [Svelte-Range-Slider-Pips version `2.3.1`](https://github.com/simeydotme/svelte-range-slider-pips/tree/2.3.1) which
247+
will not be upgraded, but it's still pretty robust. You can install it like so;
248+
249+
```bash
250+
yarn add [email protected] --dev # or
251+
npm install [email protected] --save-dev # if you prefer npm
252+
```
253+
254+
<br>
255+
<br>
256+
<br>
257+
258+
---
259+
260+
## Support / Tip
233261

234262
I'd be super excited if you find this project useful and wish to donate a small amount for my efforts!
235263

236-
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20> | [![£1 One Pound Donation](https://user-images.githubusercontent.com/2817396/149629980-08b9a952-bd6a-4c23-be78-05e3fd534352.png)](https://www.paypal.com/paypalme/simey/1) | [£1 GBP donation](https://www.paypal.com/paypalme/simey/1) |
264+
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=30> | [![£1 One Pound Tip](https://user-images.githubusercontent.com/2817396/149629980-08b9a952-bd6a-4c23-be78-05e3fd534352.png)](https://www.paypal.com/paypalme/simey/1) | [£1 GBP Tip](https://www.paypal.com/paypalme/simey/1) |
237265
| ------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------: | ------------------------------------------------------------ |
238-
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20> | [![£5 Five Pounds Donation](https://user-images.githubusercontent.com/2817396/149629994-3a99770c-d333-46e7-9818-ab6b18ad0202.png)](https://www.paypal.com/paypalme/simey/5) | [£5 GBP donation](https://www.paypal.com/paypalme/simey/5) |
239-
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=20> | [![£10 Ten Pounds Donation](https://user-images.githubusercontent.com/2817396/149630000-95aa4234-ff67-4e7c-a7f4-ffd52f25e6d8.png)](https://www.paypal.com/paypalme/simey/10) | [£10 GBP donation](https://www.paypal.com/paypalme/simey/10) |
266+
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=30> | [![£5 Five Pound Tip](https://user-images.githubusercontent.com/2817396/149629994-3a99770c-d333-46e7-9818-ab6b18ad0202.png)](https://www.paypal.com/paypalme/simey/5) | [£5 GBP Tip](https://www.paypal.com/paypalme/simey/5) |
267+
| <img src="https://user-images.githubusercontent.com/2817396/149629283-6002944f-9253-4e35-917d-89b476deae4e.png" width=30> | [![£10 Ten Pound Tip](https://user-images.githubusercontent.com/2817396/149630000-95aa4234-ff67-4e7c-a7f4-ffd52f25e6d8.png)](https://www.paypal.com/paypalme/simey/10) | [£10 GBP Tip](https://www.paypal.com/paypalme/simey/10) |
268+

0 commit comments

Comments
 (0)