@v-c/slick 1.0.0 → 1.0.2

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.
Files changed (12) hide show
  1. package/dist/InnerSlider.js +12 -9
  2. package/package.json +3 -3
  3. package/dist/Arrows.cjs +0 -186
  4. package/dist/Dots.cjs +0 -124
  5. package/dist/InnerSlider.cjs +0 -917
  6. package/dist/Slider.cjs +0 -452
  7. package/dist/Track.cjs +0 -314
  8. package/dist/default-props.cjs +0 -62
  9. package/dist/index.cjs +0 -7
  10. package/dist/initial-state.cjs +0 -36
  11. package/dist/interface.cjs +0 -1
  12. package/dist/utils/innerSliderUtils.cjs +0 -602
package/dist/Slider.cjs DELETED
@@ -1,452 +0,0 @@
1
- Object.defineProperties(exports, {
2
- __esModule: { value: true },
3
- [Symbol.toStringTag]: { value: "Module" }
4
- });
5
- const require_default_props = require("./default-props.cjs");
6
- const require_innerSliderUtils = require("./utils/innerSliderUtils.cjs");
7
- const require_InnerSlider = require("./InnerSlider.cjs");
8
- let vue = require("vue");
9
- let _v_c_util_dist_props_util = require("@v-c/util/dist/props-util");
10
- let _v_c_util_dist_Children_toArray = require("@v-c/util/dist/Children/toArray");
11
- function _isSlot(s) {
12
- return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !(0, vue.isVNode)(s);
13
- }
14
- function toMediaQuery(query) {
15
- const parts = [];
16
- if (typeof query.minWidth === "number") parts.push(`(min-width: ${query.minWidth}px)`);
17
- if (typeof query.maxWidth === "number") parts.push(`(max-width: ${query.maxWidth}px)`);
18
- return parts.join(" and ");
19
- }
20
- var Slider = /* @__PURE__ */ (0, vue.defineComponent)((props, { slots, expose }) => {
21
- const breakpoint = (0, vue.shallowRef)(null);
22
- const innerSliderRef = (0, vue.shallowRef)(null);
23
- const responsiveMediaHandlers = [];
24
- const media = (query, handler) => {
25
- if (!require_innerSliderUtils.canUseDOM()) return;
26
- const mql = window.matchMedia(query);
27
- const listener = (e) => {
28
- if (e.matches) handler();
29
- };
30
- if (mql.addEventListener) mql.addEventListener("change", listener);
31
- else mql.addListener(listener);
32
- responsiveMediaHandlers.push({
33
- mql,
34
- listener
35
- });
36
- };
37
- (0, vue.onMounted)(() => {
38
- if (props.responsive) {
39
- const breakpoints = props.responsive.map((breakpt) => breakpt.breakpoint);
40
- breakpoints.sort((x, y) => x - y);
41
- breakpoints.forEach((value, index) => {
42
- let bQuery = "";
43
- if (index === 0) bQuery = toMediaQuery({
44
- minWidth: 0,
45
- maxWidth: value
46
- });
47
- else bQuery = toMediaQuery({
48
- minWidth: breakpoints[index - 1] + 1,
49
- maxWidth: value
50
- });
51
- require_innerSliderUtils.canUseDOM() && media(bQuery, () => {
52
- breakpoint.value = value;
53
- });
54
- });
55
- const query = toMediaQuery({ minWidth: breakpoints.slice(-1)[0] });
56
- require_innerSliderUtils.canUseDOM() && media(query, () => {
57
- breakpoint.value = null;
58
- });
59
- }
60
- });
61
- (0, vue.onBeforeUnmount)(() => {
62
- responsiveMediaHandlers.forEach((obj) => {
63
- if (obj.mql.removeEventListener) obj.mql.removeEventListener("change", obj.listener);
64
- else obj.mql.removeListener(obj.listener);
65
- });
66
- });
67
- const slickPrev = () => innerSliderRef.value?.slickPrev();
68
- const slickNext = () => innerSliderRef.value?.slickNext();
69
- const slickGoTo = (slide, dontAnimate = false) => innerSliderRef.value?.slickGoTo(slide, dontAnimate);
70
- const slickPause = () => innerSliderRef.value?.pause("paused");
71
- const slickPlay = () => innerSliderRef.value?.autoPlay("play");
72
- expose({
73
- innerSlider: innerSliderRef,
74
- slickPrev,
75
- slickNext,
76
- slickGoTo,
77
- slickPause,
78
- slickPlay
79
- });
80
- return () => {
81
- let settings;
82
- if (breakpoint.value && props.responsive) {
83
- const newProps = props.responsive.filter((resp) => resp.breakpoint === breakpoint.value);
84
- settings = newProps[0].settings === "unslick" ? "unslick" : {
85
- ...require_default_props.default,
86
- ...props,
87
- ...newProps[0].settings
88
- };
89
- } else settings = {
90
- ...require_default_props.default,
91
- ...props
92
- };
93
- if (settings.centerMode) {
94
- if (settings.slidesToScroll > 1 && process.env.NODE_ENV !== "production") console.warn(`slidesToScroll should be equal to 1 in centerMode, you are using ${settings.slidesToScroll}`);
95
- settings.slidesToScroll = 1;
96
- }
97
- if (settings.fade) {
98
- if (settings.slidesToShow > 1 && process.env.NODE_ENV !== "production") console.warn(`slidesToShow should be equal to 1 when fade is true, you're using ${settings.slidesToShow}`);
99
- if (settings.slidesToScroll > 1 && process.env.NODE_ENV !== "production") console.warn(`slidesToScroll should be equal to 1 when fade is true, you're using ${settings.slidesToScroll}`);
100
- settings.slidesToShow = 1;
101
- settings.slidesToScroll = 1;
102
- }
103
- let children = (0, _v_c_util_dist_props_util.filterEmpty)((0, _v_c_util_dist_Children_toArray.toArray)(slots.default?.() ?? []));
104
- children = children.filter((child) => {
105
- if (typeof child === "string") return !!child.trim();
106
- return !!child;
107
- });
108
- if (settings.variableWidth && (settings.rows > 1 || settings.slidesPerRow > 1)) {
109
- console.warn("variableWidth is not supported in case of rows > 1 or slidesPerRow > 1");
110
- settings.variableWidth = false;
111
- }
112
- const newChildren = [];
113
- let currentWidth = null;
114
- const rows = settings.rows || 1;
115
- const slidesPerRow = settings.slidesPerRow || 1;
116
- for (let i = 0; i < children.length; i += rows * slidesPerRow) {
117
- const newSlide = [];
118
- for (let j = i; j < i + rows * slidesPerRow; j += slidesPerRow) {
119
- const row = [];
120
- for (let k = j; k < j + slidesPerRow; k += 1) {
121
- if (k >= children.length) break;
122
- const rawChild = children[k];
123
- const child = (0, vue.isVNode)(rawChild) ? rawChild : (0, vue.createVNode)("div", null, [rawChild]);
124
- if (settings.variableWidth && child.props?.style) currentWidth = child.props.style.width;
125
- row.push((0, vue.cloneVNode)(child, {
126
- key: 100 * i + 10 * j + k,
127
- tabindex: -1,
128
- style: {
129
- width: `${100 / slidesPerRow}%`,
130
- display: "inline-block"
131
- }
132
- }));
133
- }
134
- newSlide.push((0, vue.createVNode)("div", { "key": 10 * i + j }, [row]));
135
- }
136
- if (settings.variableWidth) newChildren.push((0, vue.createVNode)("div", {
137
- "key": i,
138
- "style": { width: currentWidth }
139
- }, [newSlide]));
140
- else newChildren.push((0, vue.createVNode)("div", { "key": i }, [newSlide]));
141
- }
142
- if (settings === "unslick") {
143
- const className = `regular slider ${props.className || ""}`;
144
- return (0, vue.createVNode)("div", { "class": className }, [children]);
145
- } else if (newChildren.length <= settings.slidesToShow) settings.unslick = true;
146
- return (0, vue.createVNode)(require_InnerSlider.default, (0, vue.mergeProps)({
147
- "ref": innerSliderRef,
148
- "style": props.style
149
- }, require_innerSliderUtils.filterSettings(settings)), _isSlot(newChildren) ? newChildren : { default: () => [newChildren] });
150
- };
151
- }, { props: {
152
- accessibility: {
153
- type: Boolean,
154
- required: false,
155
- default: void 0
156
- },
157
- adaptiveHeight: {
158
- type: Boolean,
159
- required: false,
160
- default: void 0
161
- },
162
- afterChange: {
163
- type: [Function, null],
164
- required: false,
165
- default: void 0
166
- },
167
- appendDots: {
168
- type: Function,
169
- required: false,
170
- default: void 0
171
- },
172
- arrows: {
173
- type: Boolean,
174
- required: false,
175
- default: void 0
176
- },
177
- autoplay: {
178
- type: Boolean,
179
- required: false,
180
- default: void 0
181
- },
182
- autoplaySpeed: {
183
- type: Number,
184
- required: false,
185
- default: void 0
186
- },
187
- beforeChange: {
188
- type: [Function, null],
189
- required: false,
190
- default: void 0
191
- },
192
- centerMode: {
193
- type: Boolean,
194
- required: false,
195
- default: void 0
196
- },
197
- centerPadding: {
198
- type: String,
199
- required: false,
200
- default: void 0
201
- },
202
- className: {
203
- type: String,
204
- required: false,
205
- default: void 0
206
- },
207
- cssEase: {
208
- type: String,
209
- required: false,
210
- default: void 0
211
- },
212
- customPaging: {
213
- type: Function,
214
- required: false,
215
- default: void 0
216
- },
217
- dots: {
218
- type: Boolean,
219
- required: false,
220
- default: void 0
221
- },
222
- dotsClass: {
223
- type: String,
224
- required: false,
225
- default: void 0
226
- },
227
- draggable: {
228
- type: Boolean,
229
- required: false,
230
- default: void 0
231
- },
232
- easing: {
233
- type: String,
234
- required: false,
235
- default: void 0
236
- },
237
- edgeFriction: {
238
- type: Number,
239
- required: false,
240
- default: void 0
241
- },
242
- fade: {
243
- type: Boolean,
244
- required: false,
245
- default: void 0
246
- },
247
- focusOnSelect: {
248
- type: Boolean,
249
- required: false,
250
- default: void 0
251
- },
252
- infinite: {
253
- type: Boolean,
254
- required: false,
255
- default: void 0
256
- },
257
- initialSlide: {
258
- type: Number,
259
- required: false,
260
- default: void 0
261
- },
262
- lazyLoad: {
263
- type: [
264
- String,
265
- Boolean,
266
- null
267
- ],
268
- required: false,
269
- default: void 0
270
- },
271
- nextArrow: {
272
- type: [
273
- Object,
274
- String,
275
- Number,
276
- Boolean,
277
- null,
278
- Array
279
- ],
280
- required: false,
281
- default: void 0
282
- },
283
- onEdge: {
284
- type: [Function, null],
285
- required: false,
286
- default: void 0
287
- },
288
- onInit: {
289
- type: [Function, null],
290
- required: false,
291
- default: void 0
292
- },
293
- onLazyLoad: {
294
- type: [Function, null],
295
- required: false,
296
- default: void 0
297
- },
298
- onLazyLoadError: {
299
- type: [Function, null],
300
- required: false,
301
- default: void 0
302
- },
303
- onReInit: {
304
- type: [Function, null],
305
- required: false,
306
- default: void 0
307
- },
308
- onSwipe: {
309
- type: [Function, null],
310
- required: false,
311
- default: void 0
312
- },
313
- pauseOnDotsHover: {
314
- type: Boolean,
315
- required: false,
316
- default: void 0
317
- },
318
- pauseOnFocus: {
319
- type: Boolean,
320
- required: false,
321
- default: void 0
322
- },
323
- pauseOnHover: {
324
- type: Boolean,
325
- required: false,
326
- default: void 0
327
- },
328
- prevArrow: {
329
- type: [
330
- Object,
331
- String,
332
- Number,
333
- Boolean,
334
- null,
335
- Array
336
- ],
337
- required: false,
338
- default: void 0
339
- },
340
- responsive: {
341
- type: [Array, null],
342
- required: false,
343
- default: void 0
344
- },
345
- rows: {
346
- type: Number,
347
- required: false,
348
- default: void 0
349
- },
350
- rtl: {
351
- type: Boolean,
352
- required: false,
353
- default: void 0
354
- },
355
- slide: {
356
- type: String,
357
- required: false,
358
- default: void 0
359
- },
360
- slidesPerRow: {
361
- type: Number,
362
- required: false,
363
- default: void 0
364
- },
365
- slidesToScroll: {
366
- type: Number,
367
- required: false,
368
- default: void 0
369
- },
370
- slidesToShow: {
371
- type: Number,
372
- required: false,
373
- default: void 0
374
- },
375
- speed: {
376
- type: Number,
377
- required: false,
378
- default: void 0
379
- },
380
- swipe: {
381
- type: Boolean,
382
- required: false,
383
- default: void 0
384
- },
385
- swipeEvent: {
386
- type: [Function, null],
387
- required: false,
388
- default: void 0
389
- },
390
- swipeToSlide: {
391
- type: Boolean,
392
- required: false,
393
- default: void 0
394
- },
395
- touchMove: {
396
- type: Boolean,
397
- required: false,
398
- default: void 0
399
- },
400
- touchThreshold: {
401
- type: Number,
402
- required: false,
403
- default: void 0
404
- },
405
- useCSS: {
406
- type: Boolean,
407
- required: false,
408
- default: void 0
409
- },
410
- useTransform: {
411
- type: Boolean,
412
- required: false,
413
- default: void 0
414
- },
415
- variableWidth: {
416
- type: Boolean,
417
- required: false,
418
- default: void 0
419
- },
420
- vertical: {
421
- type: Boolean,
422
- required: false,
423
- default: void 0
424
- },
425
- verticalSwiping: {
426
- type: Boolean,
427
- required: false,
428
- default: void 0
429
- },
430
- waitForAnimate: {
431
- type: Boolean,
432
- required: false,
433
- default: void 0
434
- },
435
- asNavFor: {
436
- type: [Object, null],
437
- required: false,
438
- default: void 0
439
- },
440
- unslick: {
441
- type: Boolean,
442
- required: false,
443
- default: void 0
444
- },
445
- style: {
446
- type: Object,
447
- required: false,
448
- default: void 0
449
- }
450
- } });
451
- var Slider_default = Slider;
452
- exports.default = Slider_default;