solid-slider 1.3.2 → 1.3.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +11 -0
- package/dist/adaptiveHeight/adaptiveHeight.d.ts +11 -0
- package/dist/adaptiveHeight/adaptiveHeight.jsx +18 -0
- package/dist/adaptiveHeight/index.common.js +23 -0
- package/dist/adaptiveHeight/index.common.js.map +1 -0
- package/dist/adaptiveHeight/index.module.js +21 -0
- package/dist/adaptiveHeight/index.module.js.map +1 -0
- package/dist/adaptiveHeight/style.css +3 -0
- package/dist/autoplay/autoplay.d.ts +1 -2
- package/dist/autoplay/autoplay.jsx +1 -2
- package/dist/autoplay/index.common.js +1 -2
- package/dist/autoplay/index.common.js.map +1 -1
- package/dist/autoplay/index.module.js +1 -2
- package/dist/autoplay/index.module.js.map +1 -1
- package/dist/index/components.d.ts +4 -4
- package/dist/index/components.jsx +4 -2
- package/dist/index/index.common.js +25 -27
- package/dist/index/index.common.js.map +1 -1
- package/dist/index/index.module.js +25 -27
- package/dist/index/index.module.js.map +1 -1
- package/dist/slider.css +1 -1
- package/package.json +15 -7
package/README.md
CHANGED
|
@@ -154,6 +154,15 @@ Solid Slider is meant to be a lightweight and compact wrapper of Keen-Slider. It
|
|
|
154
154
|
|
|
155
155
|
Thie library exports it's own CSS which is the basic Keen-Slider implementation for convenience. If you supply options as an accessor function, the slider will reactively update the configuration so that you don't have to destroy and recreate the slider. As of Keen-Slider 6 plugins are now fully supported. You may supply them as a param in createSlider. Note that plugins are not reactively updated and must be supplied on creation.
|
|
156
156
|
|
|
157
|
+
## Roadmap
|
|
158
|
+
|
|
159
|
+
- [ ] Create [adaptiveHeight](https://codesandbox.io/s/github/rcbyr/keen-slider-sandboxes/tree/v6/misc/adaptive-height/react?file=/src/App.js:191-403) plugin
|
|
160
|
+
- [ ] Add Dots components (to display a row of dots below the slider)
|
|
161
|
+
- [ ] Add slider thumbnail navigation
|
|
162
|
+
- [ ] Add slider loader
|
|
163
|
+
- [ ] Build [timepicker](https://keen-slider.io/examples#timepicker) component
|
|
164
|
+
- [ ] Create [Scroll Wheel](https://keen-slider.io/examples#scroll-wheel-controls) component
|
|
165
|
+
|
|
157
166
|
## Changelog
|
|
158
167
|
|
|
159
168
|
- 1.0.0 - Initial release
|
|
@@ -164,6 +173,8 @@ Thie library exports it's own CSS which is the basic Keen-Slider implementation
|
|
|
164
173
|
- 1.2.9 - Updated timer primitive and patched issue with current slide setting from initial options.
|
|
165
174
|
- 1.3.1 - Introduced Slider, SliderProvider and SliderButton for ease.
|
|
166
175
|
- 1.3.2 - Patched issue with initial slide not setting current signal.
|
|
176
|
+
- 1.3.5 - Updated to latest SolidJS version.
|
|
177
|
+
- 1.3.7 - Fixed TS issues updated to latest KeenSlider.
|
|
167
178
|
|
|
168
179
|
## Keen Options API
|
|
169
180
|
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { KeenSliderInstance } from "keen-slider";
|
|
2
|
+
/**
|
|
3
|
+
* Adaptive height is a plugin that adjusts the height of the slider to the content on change.
|
|
4
|
+
*
|
|
5
|
+
* @example
|
|
6
|
+
* ```ts
|
|
7
|
+
* const [create] = createSlider({}, [adaptiveHeight]);
|
|
8
|
+
* ```
|
|
9
|
+
*/
|
|
10
|
+
declare const adaptiveHeight: () => (slider: KeenSliderInstance) => void;
|
|
11
|
+
export default adaptiveHeight;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Adaptive height is a plugin that adjusts the height of the slider to the content on change.
|
|
3
|
+
*
|
|
4
|
+
* @example
|
|
5
|
+
* ```ts
|
|
6
|
+
* const [create] = createSlider({}, [adaptiveHeight]);
|
|
7
|
+
* ```
|
|
8
|
+
*/
|
|
9
|
+
const adaptiveHeight = () => {
|
|
10
|
+
return (slider) => {
|
|
11
|
+
function updateHeight() {
|
|
12
|
+
slider.container.style.height = slider.slides[slider.track.details.rel].offsetHeight + "px";
|
|
13
|
+
}
|
|
14
|
+
slider.on("created", updateHeight);
|
|
15
|
+
slider.on("slideChanged", updateHeight);
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
export default adaptiveHeight;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* Adaptive height is a plugin that adjusts the height of the slider to the content on change.
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* ```ts
|
|
8
|
+
* const [create] = createSlider({}, [adaptiveHeight]);
|
|
9
|
+
* ```
|
|
10
|
+
*/
|
|
11
|
+
const adaptiveHeight = () => {
|
|
12
|
+
return slider => {
|
|
13
|
+
function updateHeight() {
|
|
14
|
+
slider.container.style.height = slider.slides[slider.track.details.rel].offsetHeight + "px";
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
slider.on("created", updateHeight);
|
|
18
|
+
slider.on("slideChanged", updateHeight);
|
|
19
|
+
};
|
|
20
|
+
};
|
|
21
|
+
|
|
22
|
+
module.exports = adaptiveHeight;
|
|
23
|
+
//# sourceMappingURL=index.common.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.common.js","sources":["../../src/plugins/adaptiveHeight.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Adaptive height is a plugin that adjusts the height of the slider to the content on change.\n *\n * @example\n * ```ts\n * const [create] = createSlider({}, [adaptiveHeight]);\n * ```\n */\nconst adaptiveHeight = () => {\n return (slider: KeenSliderInstance) => {\n function updateHeight() {\n slider.container.style.height = slider.slides[slider.track.details.rel].offsetHeight + \"px\";\n }\n slider.on(\"created\", updateHeight);\n slider.on(\"slideChanged\", updateHeight);\n };\n};\n\nexport default adaptiveHeight;\n"],"names":["adaptiveHeight","slider","updateHeight","container","style","height","slides","track","details","rel","offsetHeight","on"],"mappings":";;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACMA,MAAAA,cAAc,GAAG,MAAM;AAC3B,EAAA,OAAQC,MAAD,IAAgC;AACrC,IAAA,SAASC,YAAT,GAAwB;AACtBD,MAAAA,MAAM,CAACE,SAAP,CAAiBC,KAAjB,CAAuBC,MAAvB,GAAgCJ,MAAM,CAACK,MAAP,CAAcL,MAAM,CAACM,KAAP,CAAaC,OAAb,CAAqBC,GAAnC,CAAA,CAAwCC,YAAxC,GAAuD,IAAvF,CAAA;AACD,KAAA;;AACDT,IAAAA,MAAM,CAACU,EAAP,CAAU,SAAV,EAAqBT,YAArB,CAAA,CAAA;AACAD,IAAAA,MAAM,CAACU,EAAP,CAAU,cAAV,EAA0BT,YAA1B,CAAA,CAAA;AACD,GAND,CAAA;AAOD;;;;"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Adaptive height is a plugin that adjusts the height of the slider to the content on change.
|
|
3
|
+
*
|
|
4
|
+
* @example
|
|
5
|
+
* ```ts
|
|
6
|
+
* const [create] = createSlider({}, [adaptiveHeight]);
|
|
7
|
+
* ```
|
|
8
|
+
*/
|
|
9
|
+
const adaptiveHeight = () => {
|
|
10
|
+
return slider => {
|
|
11
|
+
function updateHeight() {
|
|
12
|
+
slider.container.style.height = slider.slides[slider.track.details.rel].offsetHeight + "px";
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
slider.on("created", updateHeight);
|
|
16
|
+
slider.on("slideChanged", updateHeight);
|
|
17
|
+
};
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
export { adaptiveHeight as default };
|
|
21
|
+
//# sourceMappingURL=index.module.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.module.js","sources":["../../src/plugins/adaptiveHeight.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Adaptive height is a plugin that adjusts the height of the slider to the content on change.\n *\n * @example\n * ```ts\n * const [create] = createSlider({}, [adaptiveHeight]);\n * ```\n */\nconst adaptiveHeight = () => {\n return (slider: KeenSliderInstance) => {\n function updateHeight() {\n slider.container.style.height = slider.slides[slider.track.details.rel].offsetHeight + \"px\";\n }\n slider.on(\"created\", updateHeight);\n slider.on(\"slideChanged\", updateHeight);\n };\n};\n\nexport default adaptiveHeight;\n"],"names":["adaptiveHeight","slider","updateHeight","container","style","height","slides","track","details","rel","offsetHeight","on"],"mappings":"AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACMA,MAAAA,cAAc,GAAG,MAAM;AAC3B,EAAA,OAAQC,MAAD,IAAgC;AACrC,IAAA,SAASC,YAAT,GAAwB;AACtBD,MAAAA,MAAM,CAACE,SAAP,CAAiBC,KAAjB,CAAuBC,MAAvB,GAAgCJ,MAAM,CAACK,MAAP,CAAcL,MAAM,CAACM,KAAP,CAAaC,OAAb,CAAqBC,GAAnC,CAAA,CAAwCC,YAAxC,GAAuD,IAAvF,CAAA;AACD,KAAA;;AACDT,IAAAA,MAAM,CAACU,EAAP,CAAU,SAAV,EAAqBT,YAArB,CAAA,CAAA;AACAD,IAAAA,MAAM,CAACU,EAAP,CAAU,cAAV,EAA0BT,YAA1B,CAAA,CAAA;AACD,GAND,CAAA;AAOD;;;;"}
|
|
@@ -13,8 +13,7 @@ import { KeenSliderInstance } from "keen-slider";
|
|
|
13
13
|
*
|
|
14
14
|
* @example
|
|
15
15
|
* ```ts
|
|
16
|
-
* const [create
|
|
17
|
-
* <div use:slider>...</div>
|
|
16
|
+
* const [create] = createSlider({}, [autoplay]);
|
|
18
17
|
* ```
|
|
19
18
|
*/
|
|
20
19
|
declare const autoplay: (interval: number, options: {
|
|
@@ -13,8 +13,7 @@ import { makeTimer } from "@solid-primitives/timer";
|
|
|
13
13
|
*
|
|
14
14
|
* @example
|
|
15
15
|
* ```ts
|
|
16
|
-
* const [create
|
|
17
|
-
* <div use:slider>...</div>
|
|
16
|
+
* const [create] = createSlider({}, [autoplay]);
|
|
18
17
|
* ```
|
|
19
18
|
*/
|
|
20
19
|
const autoplay = (interval = 1000, options) => {
|
|
@@ -16,8 +16,7 @@ var timer = require('@solid-primitives/timer');
|
|
|
16
16
|
*
|
|
17
17
|
* @example
|
|
18
18
|
* ```ts
|
|
19
|
-
* const [create
|
|
20
|
-
* <div use:slider>...</div>
|
|
19
|
+
* const [create] = createSlider({}, [autoplay]);
|
|
21
20
|
* ```
|
|
22
21
|
*/
|
|
23
22
|
const autoplay = (interval = 1000, options) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.common.js","sources":["../../src/plugins/autoplay.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Provides an autoplay plugin.\n *\n * @param {number} interval Interval in milliseconds for switching slides\n * @param {object} options Options to customize the autoplay\n * @param {Function} options.pause A pause signal to control the autoplay\n * @param {boolean} options.pauseOnDrag Denotes of the autoplay should pause on drag.\n * @param {object} options.animation Allows for control of duration and easing.\n * @param {number} options.duration Duration for transitioning the slide.\n * @param {number} options.easing Easing function for the transition animation.\n *\n * @example\n * ```ts\n * const [create
|
|
1
|
+
{"version":3,"file":"index.common.js","sources":["../../src/plugins/autoplay.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Provides an autoplay plugin.\n *\n * @param {number} interval Interval in milliseconds for switching slides\n * @param {object} options Options to customize the autoplay\n * @param {Function} options.pause A pause signal to control the autoplay\n * @param {boolean} options.pauseOnDrag Denotes of the autoplay should pause on drag.\n * @param {object} options.animation Allows for control of duration and easing.\n * @param {number} options.duration Duration for transitioning the slide.\n * @param {number} options.easing Easing function for the transition animation.\n *\n * @example\n * ```ts\n * const [create] = createSlider({}, [autoplay]);\n * ```\n */\nconst autoplay = (\n interval: number = 1000,\n options: {\n pause?: Accessor<boolean>;\n pauseOnDrag?: boolean;\n animation?: {\n duration?: number;\n easing?: (t: number) => number;\n };\n }\n) => {\n return (slider: KeenSliderInstance) => {\n let dispose: Function;\n const start = () => {\n dispose = makeTimer(\n () => slider.moveToIdx(slider.track.details.position + 1, true, options.animation),\n interval,\n setInterval\n );\n };\n // Pause the slider on drag\n if (options.pauseOnDrag || true) {\n slider.on(\"dragStarted\", () => dispose());\n }\n createEffect(() => (!options.pause || options.pause() === false ? start() : dispose()));\n };\n};\n\nexport default autoplay;\n"],"names":["autoplay","interval","options","slider","dispose","start","makeTimer","moveToIdx","track","details","position","animation","setInterval","pauseOnDrag","on","createEffect","pause"],"mappings":";;;;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACMA,MAAAA,QAAQ,GAAG,CACfC,QAAgB,GAAG,IADJ,EAEfC,OAFe,KAUZ;AACH,EAAA,OAAQC,MAAD,IAAgC;AACrC,IAAA,IAAIC,OAAJ,CAAA;;AACA,IAAMC,MAAAA,KAAK,GAAG,MAAM;AAClBD,MAAAA,OAAO,GAAGE,eAAS,CACjB,MAAMH,MAAM,CAACI,SAAP,CAAiBJ,MAAM,CAACK,KAAP,CAAaC,OAAb,CAAqBC,QAArB,GAAgC,CAAjD,EAAoD,IAApD,EAA0DR,OAAO,CAACS,SAAlE,CADW,EAEjBV,QAFiB,EAGjBW,WAHiB,CAAnB,CAAA;AAKD,KAND,CAFqC;;;AAUrC,IAAA,IAAIV,OAAO,CAACW,WAAR,IAAuB,IAA3B,EAAiC;AAC/BV,MAAAA,MAAM,CAACW,EAAP,CAAU,aAAV,EAAyB,MAAMV,OAAO,EAAtC,CAAA,CAAA;AACD,KAAA;;AACDW,IAAAA,oBAAY,CAAC,MAAO,CAACb,OAAO,CAACc,KAAT,IAAkBd,OAAO,CAACc,KAAR,EAAA,KAAoB,KAAtC,GAA8CX,KAAK,EAAnD,GAAwDD,OAAO,EAAvE,CAAZ,CAAA;AACD,GAdD,CAAA;AAeD;;;;"}
|
|
@@ -14,8 +14,7 @@ import { makeTimer } from '@solid-primitives/timer';
|
|
|
14
14
|
*
|
|
15
15
|
* @example
|
|
16
16
|
* ```ts
|
|
17
|
-
* const [create
|
|
18
|
-
* <div use:slider>...</div>
|
|
17
|
+
* const [create] = createSlider({}, [autoplay]);
|
|
19
18
|
* ```
|
|
20
19
|
*/
|
|
21
20
|
const autoplay = (interval = 1000, options) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.module.js","sources":["../../src/plugins/autoplay.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Provides an autoplay plugin.\n *\n * @param {number} interval Interval in milliseconds for switching slides\n * @param {object} options Options to customize the autoplay\n * @param {Function} options.pause A pause signal to control the autoplay\n * @param {boolean} options.pauseOnDrag Denotes of the autoplay should pause on drag.\n * @param {object} options.animation Allows for control of duration and easing.\n * @param {number} options.duration Duration for transitioning the slide.\n * @param {number} options.easing Easing function for the transition animation.\n *\n * @example\n * ```ts\n * const [create
|
|
1
|
+
{"version":3,"file":"index.module.js","sources":["../../src/plugins/autoplay.tsx"],"sourcesContent":["import { Accessor, createEffect } from \"solid-js\";\nimport { makeTimer } from \"@solid-primitives/timer\";\nimport { KeenSliderInstance } from \"keen-slider\";\n\n/**\n * Provides an autoplay plugin.\n *\n * @param {number} interval Interval in milliseconds for switching slides\n * @param {object} options Options to customize the autoplay\n * @param {Function} options.pause A pause signal to control the autoplay\n * @param {boolean} options.pauseOnDrag Denotes of the autoplay should pause on drag.\n * @param {object} options.animation Allows for control of duration and easing.\n * @param {number} options.duration Duration for transitioning the slide.\n * @param {number} options.easing Easing function for the transition animation.\n *\n * @example\n * ```ts\n * const [create] = createSlider({}, [autoplay]);\n * ```\n */\nconst autoplay = (\n interval: number = 1000,\n options: {\n pause?: Accessor<boolean>;\n pauseOnDrag?: boolean;\n animation?: {\n duration?: number;\n easing?: (t: number) => number;\n };\n }\n) => {\n return (slider: KeenSliderInstance) => {\n let dispose: Function;\n const start = () => {\n dispose = makeTimer(\n () => slider.moveToIdx(slider.track.details.position + 1, true, options.animation),\n interval,\n setInterval\n );\n };\n // Pause the slider on drag\n if (options.pauseOnDrag || true) {\n slider.on(\"dragStarted\", () => dispose());\n }\n createEffect(() => (!options.pause || options.pause() === false ? start() : dispose()));\n };\n};\n\nexport default autoplay;\n"],"names":["autoplay","interval","options","slider","dispose","start","makeTimer","moveToIdx","track","details","position","animation","setInterval","pauseOnDrag","on","createEffect","pause"],"mappings":";;;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACMA,MAAAA,QAAQ,GAAG,CACfC,QAAgB,GAAG,IADJ,EAEfC,OAFe,KAUZ;AACH,EAAA,OAAQC,MAAD,IAAgC;AACrC,IAAA,IAAIC,OAAJ,CAAA;;AACA,IAAMC,MAAAA,KAAK,GAAG,MAAM;AAClBD,MAAAA,OAAO,GAAGE,SAAS,CACjB,MAAMH,MAAM,CAACI,SAAP,CAAiBJ,MAAM,CAACK,KAAP,CAAaC,OAAb,CAAqBC,QAArB,GAAgC,CAAjD,EAAoD,IAApD,EAA0DR,OAAO,CAACS,SAAlE,CADW,EAEjBV,QAFiB,EAGjBW,WAHiB,CAAnB,CAAA;AAKD,KAND,CAFqC;;;AAUrC,IAAA,IAAIV,OAAO,CAACW,WAAR,IAAuB,IAA3B,EAAiC;AAC/BV,MAAAA,MAAM,CAACW,EAAP,CAAU,aAAV,EAAyB,MAAMV,OAAO,EAAtC,CAAA,CAAA;AACD,KAAA;;AACDW,IAAAA,YAAY,CAAC,MAAO,CAACb,OAAO,CAACc,KAAT,IAAkBd,OAAO,CAACc,KAAR,EAAA,KAAoB,KAAtC,GAA8CX,KAAK,EAAnD,GAAwDD,OAAO,EAAvE,CAAZ,CAAA;AACD,GAdD,CAAA;AAeD;;;;"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { FlowComponent } from "solid-js";
|
|
2
2
|
import { KeenSliderOptions, KeenSliderPlugin } from "keen-slider";
|
|
3
3
|
interface Func<T> {
|
|
4
4
|
([...args]: any, args2?: any): T;
|
|
@@ -19,14 +19,14 @@ export declare const SliderContext: import("solid-js").Context<import("solid-js"
|
|
|
19
19
|
* @param props {KeenSliderOptions} options - Accepts all KeenSlider options.
|
|
20
20
|
* @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.
|
|
21
21
|
*/
|
|
22
|
-
export declare const SliderProvider:
|
|
22
|
+
export declare const SliderProvider: FlowComponent;
|
|
23
23
|
/**
|
|
24
24
|
* Main Slider component for specifying the Slider on the page.
|
|
25
25
|
*
|
|
26
26
|
* @param props {KeenSliderOptions} options - Accepts all KeenSlider options.
|
|
27
27
|
* @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.
|
|
28
28
|
*/
|
|
29
|
-
export declare const Slider:
|
|
29
|
+
export declare const Slider: FlowComponent<{
|
|
30
30
|
options?: KeenSliderOptions;
|
|
31
31
|
plugins?: KeenSliderPlugin[];
|
|
32
32
|
}>;
|
|
@@ -38,7 +38,7 @@ export declare const Slider: Component<{
|
|
|
38
38
|
* @param props {string} class - Class to override the button.
|
|
39
39
|
* @param props {object} classList - List of classes to override the button.
|
|
40
40
|
*/
|
|
41
|
-
export declare const SliderButton:
|
|
41
|
+
export declare const SliderButton: FlowComponent<{
|
|
42
42
|
next?: boolean;
|
|
43
43
|
prev?: boolean;
|
|
44
44
|
disabled?: boolean;
|
|
@@ -22,12 +22,14 @@ export const SliderProvider = props => (<SliderContext.Provider value={createSig
|
|
|
22
22
|
*/
|
|
23
23
|
export const Slider = props => {
|
|
24
24
|
if (isServer)
|
|
25
|
-
return props.children
|
|
25
|
+
return <div class="keen-slider">{props.children}</div>;
|
|
26
26
|
const [, setHelpers] = useContext(SliderContext);
|
|
27
27
|
const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));
|
|
28
28
|
setHelpers(helpers);
|
|
29
29
|
slider;
|
|
30
|
-
return <div use:slider>
|
|
30
|
+
return (<div use:slider class="keen-slider">
|
|
31
|
+
{props.children}
|
|
32
|
+
</div>);
|
|
31
33
|
};
|
|
32
34
|
/**
|
|
33
35
|
* Provides a helpful button with next/prev to pair with your slider.
|
|
@@ -32,13 +32,11 @@ var KeenSlider__default = /*#__PURE__*/_interopDefaultLegacy(KeenSlider);
|
|
|
32
32
|
* ```
|
|
33
33
|
*/
|
|
34
34
|
const createSlider = (options, ...plugins) => {
|
|
35
|
-
var _opts;
|
|
36
|
-
|
|
37
35
|
let slider;
|
|
38
36
|
|
|
39
37
|
const opts = () => typeof options == "function" ? options() : options;
|
|
40
38
|
|
|
41
|
-
const [current, setCurrent] = solidJs.createSignal(
|
|
39
|
+
const [current, setCurrent] = solidJs.createSignal(opts()?.initial || 0);
|
|
42
40
|
|
|
43
41
|
const destroy = () => slider && slider.destroy(); // Slider creation method and directive function
|
|
44
42
|
|
|
@@ -68,19 +66,15 @@ const createSlider = (options, ...plugins) => {
|
|
|
68
66
|
prev: () => slider && slider.prev(),
|
|
69
67
|
details: () => slider ? slider.track.details : {},
|
|
70
68
|
slider: () => slider,
|
|
71
|
-
moveTo: (id, duration = 250, absolute = false, easing) => {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
duration,
|
|
76
|
-
easing: easing
|
|
77
|
-
});
|
|
78
|
-
},
|
|
69
|
+
moveTo: (id, duration = 250, absolute = false, easing) => slider?.moveToIdx(id, absolute, {
|
|
70
|
+
duration,
|
|
71
|
+
easing: easing
|
|
72
|
+
}),
|
|
79
73
|
destroy
|
|
80
74
|
}];
|
|
81
75
|
};
|
|
82
76
|
|
|
83
|
-
const _tmpl$ = /*#__PURE__*/web.template(`<div></div>`, 2),
|
|
77
|
+
const _tmpl$ = /*#__PURE__*/web.template(`<div class="keen-slider"></div>`, 2),
|
|
84
78
|
_tmpl$2 = /*#__PURE__*/web.template(`<button></button>`, 2);
|
|
85
79
|
|
|
86
80
|
function returnType(func) {
|
|
@@ -113,18 +107,24 @@ const SliderProvider = props => web.createComponent(SliderContext.Provider, {
|
|
|
113
107
|
*/
|
|
114
108
|
|
|
115
109
|
const Slider = props => {
|
|
116
|
-
if (web.isServer) return
|
|
110
|
+
if (web.isServer) return (() => {
|
|
111
|
+
const _el$ = _tmpl$.cloneNode(true);
|
|
112
|
+
|
|
113
|
+
web.insert(_el$, () => props.children);
|
|
114
|
+
|
|
115
|
+
return _el$;
|
|
116
|
+
})();
|
|
117
117
|
const [, setHelpers] = solidJs.useContext(SliderContext);
|
|
118
118
|
const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));
|
|
119
119
|
setHelpers(helpers);
|
|
120
120
|
return (() => {
|
|
121
|
-
const _el$ = _tmpl$.cloneNode(true);
|
|
121
|
+
const _el$2 = _tmpl$.cloneNode(true);
|
|
122
122
|
|
|
123
|
-
slider(_el
|
|
123
|
+
slider(_el$2, () => true);
|
|
124
124
|
|
|
125
|
-
web.insert(_el
|
|
125
|
+
web.insert(_el$2, () => props.children);
|
|
126
126
|
|
|
127
|
-
return _el
|
|
127
|
+
return _el$2;
|
|
128
128
|
})();
|
|
129
129
|
};
|
|
130
130
|
/**
|
|
@@ -140,28 +140,26 @@ const SliderButton = props => {
|
|
|
140
140
|
const context = solidJs.useContext(SliderContext);
|
|
141
141
|
|
|
142
142
|
const changeSlide = () => {
|
|
143
|
-
var _helpers, _helpers2;
|
|
144
|
-
|
|
145
143
|
if (context == null) return;
|
|
146
144
|
const [helpers] = context;
|
|
147
|
-
props.next ?
|
|
145
|
+
props.next ? helpers()?.next() : helpers()?.prev();
|
|
148
146
|
};
|
|
149
147
|
|
|
150
148
|
return (() => {
|
|
151
|
-
const _el$
|
|
149
|
+
const _el$3 = _tmpl$2.cloneNode(true);
|
|
152
150
|
|
|
153
|
-
_el$
|
|
151
|
+
_el$3.$$click = changeSlide;
|
|
154
152
|
|
|
155
|
-
web.insert(_el$
|
|
153
|
+
web.insert(_el$3, () => props.children);
|
|
156
154
|
|
|
157
155
|
web.effect(_p$ => {
|
|
158
156
|
const _v$ = props.disabled || false,
|
|
159
157
|
_v$2 = props.class,
|
|
160
158
|
_v$3 = props.classList;
|
|
161
159
|
|
|
162
|
-
_v$ !== _p$._v$ && (_el$
|
|
163
|
-
_v$2 !== _p$._v$2 && (_el$
|
|
164
|
-
_p$._v$3 = web.classList(_el$
|
|
160
|
+
_v$ !== _p$._v$ && (_el$3.disabled = _p$._v$ = _v$);
|
|
161
|
+
_v$2 !== _p$._v$2 && (_el$3.className = _p$._v$2 = _v$2);
|
|
162
|
+
_p$._v$3 = web.classList(_el$3, _v$3, _p$._v$3);
|
|
165
163
|
return _p$;
|
|
166
164
|
}, {
|
|
167
165
|
_v$: undefined,
|
|
@@ -169,7 +167,7 @@ const SliderButton = props => {
|
|
|
169
167
|
_v$3: undefined
|
|
170
168
|
});
|
|
171
169
|
|
|
172
|
-
return _el$
|
|
170
|
+
return _el$3;
|
|
173
171
|
})();
|
|
174
172
|
};
|
|
175
173
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.common.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n KeenSliderHooks,\n KeenSliderInstance,\n KeenSliderOptions,\n KeenSliderPlugin,\n TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n namespace JSX {\n interface Directives {\n slider: {};\n }\n }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n create: (el: HTMLElement) => void,\n helpers: {\n current: Accessor<number>;\n next: Accessor<void>;\n prev: Accessor<void>;\n moveTo: (\n id: number,\n duration?: number,\n absolute?: boolean,\n easing?: (t: number) => number\n ) => void;\n details: Accessor<TrackDetails>;\n slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n destroy: Accessor<void>;\n }\n] => {\n let slider: KeenSliderInstance<O, P, H> | undefined;\n const opts = () => typeof options == \"function\" ? options() : options;\n const [current, setCurrent] = createSignal(opts()?.initial || 0);\n const destroy = () => slider && slider.destroy();\n // Slider creation method and directive function\n const create = (el: HTMLElement) => {\n el.classList.add(\"keen-slider\");\n // @ts-ignore\n const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n selector: el.childNodes,\n ...(opts())\n });\n onMount(() => {\n slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n });\n onCleanup(destroy);\n if (typeof options === \"function\") {\n createEffect(\n on(\n () => options,\n () => slider && slider.update(getOptions())\n )\n );\n }\n };\n return [\n create,\n {\n current,\n next: () => slider && slider.next(),\n prev: () => slider && slider.prev(),\n details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n slider: () => slider,\n moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n destroy\n }\n ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n options?: KeenSliderOptions;\n plugins?: KeenSliderPlugin[];\n}> = props => {\n if (isServer) return props.children;\n const [, setHelpers] = useContext(SliderContext);\n const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n setHelpers(helpers);\n slider;\n return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n next?: boolean;\n prev?: boolean;\n disabled?: boolean;\n class?: string;\n classList?: { [k: string]: boolean | undefined };\n}> = props => {\n const context = useContext(SliderContext);\n const changeSlide = () => {\n if (context == null) return;\n const [helpers] = context;\n props.next ? helpers()?.next() : helpers()?.prev();\n };\n return (\n <button\n disabled={props.disabled || false}\n class={props.class}\n classList={props.classList}\n onClick={changeSlide}\n >\n {props.children}\n </button>\n );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":";;;;;;;;;;;;AAiBA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,MAAMA,YAAY,GAAG,CAC1BC,OAD0B,EAE1B,GAAGC,OAFuB,KAmBvB;AAAA,EAAA,IAAA,KAAA,CAAA;;AACH,EAAA,IAAIC,MAAJ,CAAA;;AACA,EAAMC,MAAAA,IAAI,GAAG,MAAM,OAAOH,OAAP,IAAkB,UAAlB,GAA+BA,OAAO,EAAtC,GAA2CA,OAA9D,CAAA;;AACA,EAAA,MAAM,CAACI,OAAD,EAAUC,UAAV,IAAwBC,oBAAY,CAAC,CAAAH,CAAAA,KAAAA,GAAAA,IAAI,EAAJ,MAAA,IAAA,IAAA,KAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,KAAA,CAAQI,OAAR,KAAmB,CAApB,CAA1C,CAAA;;AACA,EAAMC,MAAAA,OAAO,GAAG,MAAMN,MAAM,IAAIA,MAAM,CAACM,OAAP,EAAhC,CAJG;;;AAMH,EAAMC,MAAAA,MAAM,GAAIC,EAAD,IAAqB;AAClCA,IAAAA,EAAE,CAACC,SAAH,CAAaC,GAAb,CAAiB,aAAjB,EADkC;;AAGlC,IAAMC,MAAAA,UAA4D,GAAG,OAAO;AAC1EC,MAAAA,QAAQ,EAAEJ,EAAE,CAACK,UAD6D;AAE1E,MAAA,GAAIZ,IAAI,EAAA;AAFkE,KAAP,CAArE,CAAA;;AAIAa,IAAAA,eAAO,CAAC,MAAM;AACZd,MAAAA,MAAM,GAAG,IAAIe,8BAAJ,CAAwBP,EAAxB,EAA4BG,UAAU,EAAtC,EAA0CZ,OAA1C,CAAT,CAAA;AACAC,MAAAA,MAAM,CAACgB,EAAP,CAAU,cAAV,EAA0B,MAAMb,UAAU,CAACH,MAAM,CAAEiB,KAAR,CAAcC,OAAd,CAAsBC,GAAvB,CAA1C,CAAA,CAAA;AACD,KAHM,CAAP,CAAA;AAIAC,IAAAA,iBAAS,CAACd,OAAD,CAAT,CAAA;;AACA,IAAA,IAAI,OAAOR,OAAP,KAAmB,UAAvB,EAAmC;AACjCuB,MAAAA,oBAAY,CACVL,UAAE,CACA,MAAMlB,OADN,EAEA,MAAME,MAAM,IAAIA,MAAM,CAACsB,MAAP,CAAcX,UAAU,EAAxB,CAFhB,CADQ,CAAZ,CAAA;AAMD,KAAA;AACF,GApBD,CAAA;;AAqBA,EAAO,OAAA,CACLJ,MADK,EAEL;AACEL,IAAAA,OADF;AAEEqB,IAAAA,IAAI,EAAE,MAAMvB,MAAM,IAAIA,MAAM,CAACuB,IAAP,EAFxB;AAGEC,IAAAA,IAAI,EAAE,MAAMxB,MAAM,IAAIA,MAAM,CAACwB,IAAP,EAHxB;AAIEN,IAAAA,OAAO,EAAE,MAAOlB,MAAM,GAAGA,MAAM,CAACiB,KAAP,CAAaC,OAAhB,GAA2B,EAJnD;AAKElB,IAAAA,MAAM,EAAE,MAAMA,MALhB;AAMEyB,IAAAA,MAAM,EAAE,CAACC,EAAD,EAAaC,QAAQ,GAAG,GAAxB,EAA6BC,QAAQ,GAAG,KAAxC,EAA+CC,MAA/C,KAAA;AAAA,MAAA,IAAA,OAAA,CAAA;;AAAA,MACN7B,OAAAA,CAAAA,OAAAA,GAAAA,MADM,4CACN,OAAQ8B,CAAAA,SAAR,CAAkBJ,EAAlB,EAAsBE,QAAtB,EAAgC;AAAED,QAAAA,QAAF;AAAYE,QAAAA,MAAM,EAAEA,MAAAA;AAApB,OAAhC,CADM,CAAA;AAAA,KANV;AAQEvB,IAAAA,OAAAA;AARF,GAFK,CAAP,CAAA;AAaD;;;;;ACxFM,SAASyB,UAAT,CAAuBC,IAAvB,EAAsC;AAC3C,EAAA,OAAO,EAAP,CAAA;AACD,CAAA;AAID;AACO,MAAMC,aAAa,GAAGC,qBAAa,CAAC9B,oBAAY,CAAuB,IAAvB,CAAb,EAAnC;AAEP;AACA;AACA;AACA;AACA;AACA;;MACa+B,cAAyB,GAAGC,KAAK,IAC3CC,mBAAA,CAAA,aAD2C,CAC7B,QAD6B,EAAA;AAAA,EAAA,IACpB,KADoB,GAAA;AAAA,IACbjC,OAAAA,oBAAY,CAAC,IAAD,CADC,CAAA;AAAA,GAAA;;AAAA,EAAA,IAAA,QAAA,GAAA;AAAA,IACQgC,OAAAA,KAAK,CAACE,QADd,CAAA;AAAA,GAAA;;AAAA,CAAvC,EAAA;AAIP;AACA;AACA;AACA;AACA;AACA;;AACaC,MAAAA,MAGX,GAAGH,KAAK,IAAI;AACZ,EAAA,IAAII,YAAJ,EAAc,OAAOJ,KAAK,CAACE,QAAb,CAAA;AACd,EAAA,MAAM,GAAGG,UAAH,CAAA,GAAiBC,kBAAU,CAACT,aAAD,CAAjC,CAAA;AACA,EAAM,MAAA,CAACjC,MAAD,EAAS2C,OAAT,IAAoB9C,YAAY,CAACuC,KAAK,CAACtC,OAAN,IAAiB,EAAlB,EAAsB,IAAIsC,KAAK,CAACrC,OAAN,IAAiB,EAArB,CAAtB,CAAtC,CAAA;AACA0C,EAAAA,UAAU,CAACE,OAAD,CAAV,CAAA;AAEA,EAAA,OAAA,CAAA,MAAA;AAAA,IAAA,MAAA,IAAA,GAAA,MAAA,CAAA,SAAA,CAAA,IAAA,CAAA,CAAA;;AAAgB,IAAA,MAAhB,CAAA,IAAA,EAAA,MAAA,IAAA,CAAA,CAAA;;AAAA,IAAwBP,UAAAA,CAAAA,IAAAA,EAAAA,MAAAA,KAAK,CAACE,QAA9B,CAAA,CAAA;;AAAA,IAAA,OAAA,IAAA,CAAA;AAAA,GAAA,GAAA,CAAA;AACD,EAVM;AAYP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AACaM,MAAAA,YAMX,GAAGR,KAAK,IAAI;AACZ,EAAA,MAAMS,OAAO,GAAGH,kBAAU,CAACT,aAAD,CAA1B,CAAA;;AACA,EAAMa,MAAAA,WAAW,GAAG,MAAM;AAAA,IAAA,IAAA,QAAA,EAAA,SAAA,CAAA;;AACxB,IAAID,IAAAA,OAAO,IAAI,IAAf,EAAqB,OAAA;AACrB,IAAM,MAAA,CAACF,OAAD,CAAA,GAAYE,OAAlB,CAAA;AACAT,IAAAA,KAAK,CAACb,IAAN,GAAaoB,CAAAA,QAAAA,GAAAA,OAAO,EAApB,MAAa,IAAA,IAAA,QAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,QAAA,CAAWpB,IAAX,EAAb,gBAAiCoB,OAAO,EAAxC,MAAiC,IAAA,IAAA,SAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,SAAA,CAAWnB,IAAX,EAAjC,CAAA;AACD,GAJD,CAAA;;AAKA,EAAA,OAAA,CAAA,MAAA;AAAA,IAAA,MAAA,KAAA,GAAA,OAAA,CAAA,SAAA,CAAA,IAAA,CAAA,CAAA;;AAAA,IAAA,KAAA,CAAA,OAAA,GAKasB,WALb,CAAA;;AAAA,IAOKV,UAAAA,CAAAA,KAAAA,EAAAA,MAAAA,KAAK,CAACE,QAPX,CAAA,CAAA;;AAAA,IAAAS,UAAA,CAAA,GAAA,IAAA;AAAA,MAAA,MAAA,GAAA,GAEcX,KAAK,CAACY,QAAN,IAAkB,KAFhC;AAAA,YAGWZ,IAAAA,GAAAA,KAAK,CAACa,KAHjB;AAAA,YAIeb,IAAAA,GAAAA,KAAK,CAAC3B,SAJrB,CAAA;;AAAA,MAAA,GAAA,KAAA,GAAA,CAAA,GAAA,KAAA,KAAA,CAAA,QAAA,GAAA,GAAA,CAAA,GAAA,GAAA,GAAA,CAAA,CAAA;AAAA,MAAA,IAAA,KAAA,GAAA,CAAA,IAAA,KAAA,KAAA,CAAA,SAAA,GAAA,GAAA,CAAA,IAAA,GAAA,IAAA,CAAA,CAAA;AAAA,MAAA,GAAA,CAAA,IAAA,GAAAyC,aAAA,CAAA,KAAA,EAAA,IAAA,EAAA,GAAA,CAAA,IAAA,CAAA,CAAA;AAAA,MAAA,OAAA,GAAA,CAAA;AAAA,KAAA,EAAA;AAAA,MAAA,GAAA,EAAA,SAAA;AAAA,MAAA,IAAA,EAAA,SAAA;AAAA,MAAA,IAAA,EAAA,SAAA;AAAA,KAAA,CAAA,CAAA;;AAAA,IAAA,OAAA,KAAA,CAAA;AAAA,GAAA,GAAA,CAAA;AAUD,EAvBM;;;;;;;;;;;"}
|
|
1
|
+
{"version":3,"file":"index.common.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n KeenSliderHooks,\n KeenSliderInstance,\n KeenSliderOptions,\n KeenSliderPlugin,\n TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n namespace JSX {\n interface Directives {\n slider: {};\n }\n }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n create: (el: HTMLElement) => void,\n helpers: {\n current: Accessor<number>;\n next: Accessor<void>;\n prev: Accessor<void>;\n moveTo: (\n id: number,\n duration?: number,\n absolute?: boolean,\n easing?: (t: number) => number\n ) => void;\n details: Accessor<TrackDetails>;\n slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n destroy: Accessor<void>;\n }\n] => {\n let slider: KeenSliderInstance<O, P, H> | undefined;\n const opts = () => typeof options == \"function\" ? options() : options;\n const [current, setCurrent] = createSignal(opts()?.initial || 0);\n const destroy = () => slider && slider.destroy();\n // Slider creation method and directive function\n const create = (el: HTMLElement) => {\n el.classList.add(\"keen-slider\");\n // @ts-ignore\n const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n selector: el.childNodes,\n ...(opts())\n });\n onMount(() => {\n slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n });\n onCleanup(destroy);\n if (typeof options === \"function\") {\n createEffect(\n on(\n () => options,\n () => slider && slider.update(getOptions())\n )\n );\n }\n };\n return [\n create,\n {\n current,\n next: () => slider && slider.next(),\n prev: () => slider && slider.prev(),\n details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n slider: () => slider,\n moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n destroy\n }\n ];\n};\n","import { createContext, useContext, createSignal, FlowComponent } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: FlowComponent = props => (\n <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: FlowComponent<{\n options?: KeenSliderOptions;\n plugins?: KeenSliderPlugin[];\n}> = props => {\n if (isServer) return <div class=\"keen-slider\">{props.children}</div>;\n const [, setHelpers] = useContext(SliderContext);\n const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n setHelpers(helpers);\n slider;\n return (\n <div use:slider class=\"keen-slider\">\n {props.children}\n </div>\n );\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: FlowComponent<{\n next?: boolean;\n prev?: boolean;\n disabled?: boolean;\n class?: string;\n classList?: { [k: string]: boolean | undefined };\n}> = props => {\n const context = useContext(SliderContext);\n const changeSlide = () => {\n if (context == null) return;\n const [helpers] = context;\n props.next ? helpers()?.next() : helpers()?.prev();\n };\n return (\n <button\n disabled={props.disabled || false}\n class={props.class}\n classList={props.classList}\n onClick={changeSlide}\n >\n {props.children}\n </button>\n );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}
|
|
@@ -24,13 +24,11 @@ import { createComponent, isServer, insert, effect, classList, delegateEvents, t
|
|
|
24
24
|
* ```
|
|
25
25
|
*/
|
|
26
26
|
const createSlider = (options, ...plugins) => {
|
|
27
|
-
var _opts;
|
|
28
|
-
|
|
29
27
|
let slider;
|
|
30
28
|
|
|
31
29
|
const opts = () => typeof options == "function" ? options() : options;
|
|
32
30
|
|
|
33
|
-
const [current, setCurrent] = createSignal(
|
|
31
|
+
const [current, setCurrent] = createSignal(opts()?.initial || 0);
|
|
34
32
|
|
|
35
33
|
const destroy = () => slider && slider.destroy(); // Slider creation method and directive function
|
|
36
34
|
|
|
@@ -60,19 +58,15 @@ const createSlider = (options, ...plugins) => {
|
|
|
60
58
|
prev: () => slider && slider.prev(),
|
|
61
59
|
details: () => slider ? slider.track.details : {},
|
|
62
60
|
slider: () => slider,
|
|
63
|
-
moveTo: (id, duration = 250, absolute = false, easing) => {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
duration,
|
|
68
|
-
easing: easing
|
|
69
|
-
});
|
|
70
|
-
},
|
|
61
|
+
moveTo: (id, duration = 250, absolute = false, easing) => slider?.moveToIdx(id, absolute, {
|
|
62
|
+
duration,
|
|
63
|
+
easing: easing
|
|
64
|
+
}),
|
|
71
65
|
destroy
|
|
72
66
|
}];
|
|
73
67
|
};
|
|
74
68
|
|
|
75
|
-
const _tmpl$ = /*#__PURE__*/template(`<div></div>`, 2),
|
|
69
|
+
const _tmpl$ = /*#__PURE__*/template(`<div class="keen-slider"></div>`, 2),
|
|
76
70
|
_tmpl$2 = /*#__PURE__*/template(`<button></button>`, 2);
|
|
77
71
|
|
|
78
72
|
function returnType(func) {
|
|
@@ -105,18 +99,24 @@ const SliderProvider = props => createComponent(SliderContext.Provider, {
|
|
|
105
99
|
*/
|
|
106
100
|
|
|
107
101
|
const Slider = props => {
|
|
108
|
-
if (isServer) return
|
|
102
|
+
if (isServer) return (() => {
|
|
103
|
+
const _el$ = _tmpl$.cloneNode(true);
|
|
104
|
+
|
|
105
|
+
insert(_el$, () => props.children);
|
|
106
|
+
|
|
107
|
+
return _el$;
|
|
108
|
+
})();
|
|
109
109
|
const [, setHelpers] = useContext(SliderContext);
|
|
110
110
|
const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));
|
|
111
111
|
setHelpers(helpers);
|
|
112
112
|
return (() => {
|
|
113
|
-
const _el$ = _tmpl$.cloneNode(true);
|
|
113
|
+
const _el$2 = _tmpl$.cloneNode(true);
|
|
114
114
|
|
|
115
|
-
slider(_el
|
|
115
|
+
slider(_el$2, () => true);
|
|
116
116
|
|
|
117
|
-
insert(_el
|
|
117
|
+
insert(_el$2, () => props.children);
|
|
118
118
|
|
|
119
|
-
return _el
|
|
119
|
+
return _el$2;
|
|
120
120
|
})();
|
|
121
121
|
};
|
|
122
122
|
/**
|
|
@@ -132,28 +132,26 @@ const SliderButton = props => {
|
|
|
132
132
|
const context = useContext(SliderContext);
|
|
133
133
|
|
|
134
134
|
const changeSlide = () => {
|
|
135
|
-
var _helpers, _helpers2;
|
|
136
|
-
|
|
137
135
|
if (context == null) return;
|
|
138
136
|
const [helpers] = context;
|
|
139
|
-
props.next ?
|
|
137
|
+
props.next ? helpers()?.next() : helpers()?.prev();
|
|
140
138
|
};
|
|
141
139
|
|
|
142
140
|
return (() => {
|
|
143
|
-
const _el$
|
|
141
|
+
const _el$3 = _tmpl$2.cloneNode(true);
|
|
144
142
|
|
|
145
|
-
_el$
|
|
143
|
+
_el$3.$$click = changeSlide;
|
|
146
144
|
|
|
147
|
-
insert(_el$
|
|
145
|
+
insert(_el$3, () => props.children);
|
|
148
146
|
|
|
149
147
|
effect(_p$ => {
|
|
150
148
|
const _v$ = props.disabled || false,
|
|
151
149
|
_v$2 = props.class,
|
|
152
150
|
_v$3 = props.classList;
|
|
153
151
|
|
|
154
|
-
_v$ !== _p$._v$ && (_el$
|
|
155
|
-
_v$2 !== _p$._v$2 && (_el$
|
|
156
|
-
_p$._v$3 = classList(_el$
|
|
152
|
+
_v$ !== _p$._v$ && (_el$3.disabled = _p$._v$ = _v$);
|
|
153
|
+
_v$2 !== _p$._v$2 && (_el$3.className = _p$._v$2 = _v$2);
|
|
154
|
+
_p$._v$3 = classList(_el$3, _v$3, _p$._v$3);
|
|
157
155
|
return _p$;
|
|
158
156
|
}, {
|
|
159
157
|
_v$: undefined,
|
|
@@ -161,7 +159,7 @@ const SliderButton = props => {
|
|
|
161
159
|
_v$3: undefined
|
|
162
160
|
});
|
|
163
161
|
|
|
164
|
-
return _el$
|
|
162
|
+
return _el$3;
|
|
165
163
|
})();
|
|
166
164
|
};
|
|
167
165
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.module.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n KeenSliderHooks,\n KeenSliderInstance,\n KeenSliderOptions,\n KeenSliderPlugin,\n TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n namespace JSX {\n interface Directives {\n slider: {};\n }\n }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n create: (el: HTMLElement) => void,\n helpers: {\n current: Accessor<number>;\n next: Accessor<void>;\n prev: Accessor<void>;\n moveTo: (\n id: number,\n duration?: number,\n absolute?: boolean,\n easing?: (t: number) => number\n ) => void;\n details: Accessor<TrackDetails>;\n slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n destroy: Accessor<void>;\n }\n] => {\n let slider: KeenSliderInstance<O, P, H> | undefined;\n const opts = () => typeof options == \"function\" ? options() : options;\n const [current, setCurrent] = createSignal(opts()?.initial || 0);\n const destroy = () => slider && slider.destroy();\n // Slider creation method and directive function\n const create = (el: HTMLElement) => {\n el.classList.add(\"keen-slider\");\n // @ts-ignore\n const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n selector: el.childNodes,\n ...(opts())\n });\n onMount(() => {\n slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n });\n onCleanup(destroy);\n if (typeof options === \"function\") {\n createEffect(\n on(\n () => options,\n () => slider && slider.update(getOptions())\n )\n );\n }\n };\n return [\n create,\n {\n current,\n next: () => slider && slider.next(),\n prev: () => slider && slider.prev(),\n details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n slider: () => slider,\n moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n destroy\n }\n ];\n};\n","import { Component, createContext, useContext, createSignal, createMemo } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: Component = props => (\n <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: Component<{\n options?: KeenSliderOptions;\n plugins?: KeenSliderPlugin[];\n}> = props => {\n if (isServer) return props.children;\n const [, setHelpers] = useContext(SliderContext);\n const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n setHelpers(helpers);\n slider;\n return <div use:slider>{props.children}</div>;\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: Component<{\n next?: boolean;\n prev?: boolean;\n disabled?: boolean;\n class?: string;\n classList?: { [k: string]: boolean | undefined };\n}> = props => {\n const context = useContext(SliderContext);\n const changeSlide = () => {\n if (context == null) return;\n const [helpers] = context;\n props.next ? helpers()?.next() : helpers()?.prev();\n };\n return (\n <button\n disabled={props.disabled || false}\n class={props.class}\n classList={props.classList}\n onClick={changeSlide}\n >\n {props.children}\n </button>\n );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.module.js","sources":["../../src/primitive.ts","../../src/components.tsx"],"sourcesContent":["import { on, onMount, createSignal, onCleanup, Accessor, createEffect } from \"solid-js\";\nimport KeenSlider, {\n KeenSliderHooks,\n KeenSliderInstance,\n KeenSliderOptions,\n KeenSliderPlugin,\n TrackDetails\n} from \"keen-slider\";\n\ndeclare module \"solid-js\" {\n namespace JSX {\n interface Directives {\n slider: {};\n }\n }\n}\n\n/**\n * Creates a slider powered by KeenSlider.\n *\n * @param {Object} options Values to initialize the slider with\n * @param {Array} plugins Extensions that enhance KeenSlider options\n * @returns {[create: Function, helpers: Object]} Returns mount and helper methods\n * @returns {Function} create Mounts the slider on provided element\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.current Current slide number\n * @returns {Function} helpers.next Function to trigger the next slide\n * @returns {Function} helpers.prev Function to trigger the previous slide\n * @returns {Function<Object>} helpers.details Provides details about the current slider\n * @returns {Function} helpers.slider Returns the KeenSlider instance\n * @returns {Function} helpers.destroy Manual destroy function\n *\n * @example\n * ```ts\n * const [create, { prev, next }] = createSlider();\n * <div use:slider>...</div>\n * ```\n */\nexport const createSlider = <O = {}, P = {}, H extends string = KeenSliderHooks>(\n options?: KeenSliderOptions<O, P, H> | Accessor<KeenSliderOptions<O, P, H>>,\n ...plugins: KeenSliderPlugin<O, P, H>[]\n): [\n create: (el: HTMLElement) => void,\n helpers: {\n current: Accessor<number>;\n next: Accessor<void>;\n prev: Accessor<void>;\n moveTo: (\n id: number,\n duration?: number,\n absolute?: boolean,\n easing?: (t: number) => number\n ) => void;\n details: Accessor<TrackDetails>;\n slider: Accessor<KeenSliderInstance<O, P, H> | undefined>;\n destroy: Accessor<void>;\n }\n] => {\n let slider: KeenSliderInstance<O, P, H> | undefined;\n const opts = () => typeof options == \"function\" ? options() : options;\n const [current, setCurrent] = createSignal(opts()?.initial || 0);\n const destroy = () => slider && slider.destroy();\n // Slider creation method and directive function\n const create = (el: HTMLElement) => {\n el.classList.add(\"keen-slider\");\n // @ts-ignore\n const getOptions: Accessor<KeenSliderOptions<O, P, H> | undefined> = () => ({\n selector: el.childNodes,\n ...(opts())\n });\n onMount(() => {\n slider = new KeenSlider<O, P, H>(el, getOptions(), plugins);\n slider.on(\"slideChanged\", () => setCurrent(slider!.track.details.rel));\n });\n onCleanup(destroy);\n if (typeof options === \"function\") {\n createEffect(\n on(\n () => options,\n () => slider && slider.update(getOptions())\n )\n );\n }\n };\n return [\n create,\n {\n current,\n next: () => slider && slider.next(),\n prev: () => slider && slider.prev(),\n details: () => (slider ? slider.track.details : ({} as TrackDetails)),\n slider: () => slider,\n moveTo: (id: number, duration = 250, absolute = false, easing?: (t: number) => number) =>\n slider?.moveToIdx(id, absolute, { duration, easing: easing }),\n destroy\n }\n ];\n};\n","import { createContext, useContext, createSignal, FlowComponent } from \"solid-js\";\nimport { createSlider } from \"./primitive\";\nimport { KeenSliderOptions, KeenSliderPlugin } from \"keen-slider\";\nimport { isServer } from \"solid-js/web\";\n\n// The following is a hacky way of extracting SliderHelpers\ninterface Func<T> {\n ([...args]: any, args2?: any): T;\n}\nexport function returnType<T>(func: Func<T>) {\n return {} as T;\n}\nconst sliderValues = returnType(createSlider);\ntype SliderHelpers = typeof sliderValues[1];\n\n// Main context for the slider\nexport const SliderContext = createContext(createSignal<SliderHelpers | null>(null));\n\n/**\n * A helpful and simple Provider to wrap your Slider if controls such as SliderButton are used.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const SliderProvider: FlowComponent = props => (\n <SliderContext.Provider value={createSignal(null)}>{props.children}</SliderContext.Provider>\n);\n\n/**\n * Main Slider component for specifying the Slider on the page.\n *\n * @param props {KeenSliderOptions} options - Accepts all KeenSlider options.\n * @param props {KeenSLiderPlugin} plugins - A list of Solid Slider or Keen slider plugins.\n */\nexport const Slider: FlowComponent<{\n options?: KeenSliderOptions;\n plugins?: KeenSliderPlugin[];\n}> = props => {\n if (isServer) return <div class=\"keen-slider\">{props.children}</div>;\n const [, setHelpers] = useContext(SliderContext);\n const [slider, helpers] = createSlider(props.options || {}, ...(props.plugins || []));\n setHelpers(helpers);\n slider;\n return (\n <div use:slider class=\"keen-slider\">\n {props.children}\n </div>\n );\n};\n\n/**\n * Provides a helpful button with next/prev to pair with your slider.\n *\n * @param props {boolean} next - Specify if this should be a next button.\n * @param props {boolean} prev - Specify if this should be a prev button.\n * @param props {string} class - Class to override the button.\n * @param props {object} classList - List of classes to override the button.\n */\nexport const SliderButton: FlowComponent<{\n next?: boolean;\n prev?: boolean;\n disabled?: boolean;\n class?: string;\n classList?: { [k: string]: boolean | undefined };\n}> = props => {\n const context = useContext(SliderContext);\n const changeSlide = () => {\n if (context == null) return;\n const [helpers] = context;\n props.next ? helpers()?.next() : helpers()?.prev();\n };\n return (\n <button\n disabled={props.disabled || false}\n class={props.class}\n classList={props.classList}\n onClick={changeSlide}\n >\n {props.children}\n </button>\n );\n};\n"],"names":["createSlider","options","plugins","slider","opts","current","setCurrent","createSignal","initial","destroy","create","el","classList","add","getOptions","selector","childNodes","onMount","KeenSlider","on","track","details","rel","onCleanup","createEffect","update","next","prev","moveTo","id","duration","absolute","easing","moveToIdx","returnType","func","SliderContext","createContext","SliderProvider","props","_$createComponent","children","Slider","isServer","setHelpers","useContext","helpers","SliderButton","context","changeSlide","_$effect","disabled","class","_$classList"],"mappings":"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"}
|
package/dist/slider.css
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "solid-slider",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.7",
|
|
4
4
|
"description": "A slider utility for SolidJS.",
|
|
5
5
|
"author": "David Di Biase",
|
|
6
6
|
"repository": {
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"homepage": "https://github.com/davedbase/solid-slider#readme",
|
|
15
15
|
"scripts": {
|
|
16
16
|
"format": "prettier -w \"src/**/*.{js,ts,json,css,tsx,jsx}\"",
|
|
17
|
-
"build": "rollup -c rollup.config.js && cp src/slider.css dist/slider.css"
|
|
17
|
+
"build": "rollup -c rollup.config.js && cp src/slider.css dist/slider.css && cp src/plugins/adaptiveHeight.css dist/adaptiveHeight/style.css"
|
|
18
18
|
},
|
|
19
19
|
"main": "dist/index/index.common.js",
|
|
20
20
|
"module": "dist/index/index.module.js",
|
|
@@ -27,14 +27,22 @@
|
|
|
27
27
|
"require": "./dist/index/index.common.js",
|
|
28
28
|
"node": "./dist/index/index.common.js"
|
|
29
29
|
},
|
|
30
|
-
"./plugins/autoplay":
|
|
30
|
+
"./plugins/autoplay": {
|
|
31
31
|
"solid": "./dist/autoplay/autoplay.jsx",
|
|
32
32
|
"import": "./dist/autoplay/index.module.js",
|
|
33
33
|
"browser": "./dist/autoplay/index.module.js",
|
|
34
34
|
"require": "./dist/autoplay/index.common.js",
|
|
35
35
|
"node": "./dist/autoplay/index.common.js"
|
|
36
36
|
},
|
|
37
|
-
"./
|
|
37
|
+
"./plugins/adaptiveHeight": {
|
|
38
|
+
"solid": "./dist/adaptiveHeight/autoplay.jsx",
|
|
39
|
+
"import": "./dist/adaptiveHeight/index.module.js",
|
|
40
|
+
"browser": "./dist/adaptiveHeight/index.module.js",
|
|
41
|
+
"require": "./dist/adaptiveHeight/index.common.js",
|
|
42
|
+
"node": "./dist/adaptiveHeight/index.common.js"
|
|
43
|
+
},
|
|
44
|
+
"./slider.css": "./dist/slider.css",
|
|
45
|
+
"./adaptiveHeight/style.css": "./dist/adaptiveHeight/slider.css"
|
|
38
46
|
},
|
|
39
47
|
"sideEffects": false,
|
|
40
48
|
"files": [
|
|
@@ -54,14 +62,14 @@
|
|
|
54
62
|
],
|
|
55
63
|
"dependencies": {
|
|
56
64
|
"@solid-primitives/timer": "1.3.0",
|
|
57
|
-
"keen-slider": "^6.
|
|
58
|
-
"solid-js": "^1.
|
|
65
|
+
"keen-slider": "^6.7.0",
|
|
66
|
+
"solid-js": "^1.4.7"
|
|
59
67
|
},
|
|
60
68
|
"devDependencies": {
|
|
61
69
|
"esbuild-plugin-solid": "^0.4.2",
|
|
70
|
+
"prettier": "^2.5.1",
|
|
62
71
|
"rollup": "^2.70.2",
|
|
63
72
|
"rollup-preset-solid": "^1.4.0",
|
|
64
|
-
"prettier": "^2.5.1",
|
|
65
73
|
"typescript": "^4.5.5"
|
|
66
74
|
}
|
|
67
75
|
}
|