1 | "use strict";
|
2 |
|
3 | exports.__esModule = true;
|
4 | exports.Swiper = void 0;
|
5 |
|
6 | var _vue = require("vue");
|
7 |
|
8 | var _getParams3 = require("./get-params");
|
9 |
|
10 | var _initSwiper = require("./init-swiper");
|
11 |
|
12 | var _utils = require("./utils");
|
13 |
|
14 | var _loop = require("./loop");
|
15 |
|
16 | var _getChangedParams = require("./get-changed-params");
|
17 |
|
18 | var _getChildren2 = require("./get-children");
|
19 |
|
20 | var _updateSwiper = require("./update-swiper");
|
21 |
|
22 | var _virtual = require("./virtual");
|
23 |
|
24 | var Swiper = {
|
25 | name: 'Swiper',
|
26 | props: {
|
27 | tag: {
|
28 | type: String,
|
29 | default: 'div'
|
30 | },
|
31 | wrapperTag: {
|
32 | type: String,
|
33 | default: 'div'
|
34 | },
|
35 | init: {
|
36 | type: Boolean,
|
37 | default: undefined
|
38 | },
|
39 | direction: {
|
40 | type: String,
|
41 | default: undefined
|
42 | },
|
43 | touchEventsTarget: {
|
44 | type: String,
|
45 | default: undefined
|
46 | },
|
47 | initialSlide: {
|
48 | type: Number,
|
49 | default: undefined
|
50 | },
|
51 | speed: {
|
52 | type: Number,
|
53 | default: undefined
|
54 | },
|
55 | cssMode: {
|
56 | type: Boolean,
|
57 | default: undefined
|
58 | },
|
59 | updateOnWindowResize: {
|
60 | type: Boolean,
|
61 | default: undefined
|
62 | },
|
63 | nested: {
|
64 | type: Boolean,
|
65 | default: undefined
|
66 | },
|
67 | width: {
|
68 | type: Number,
|
69 | default: undefined
|
70 | },
|
71 | height: {
|
72 | type: Number,
|
73 | default: undefined
|
74 | },
|
75 | preventInteractionOnTransition: {
|
76 | type: Boolean,
|
77 | default: undefined
|
78 | },
|
79 | userAgent: {
|
80 | type: String,
|
81 | default: undefined
|
82 | },
|
83 | url: {
|
84 | type: String,
|
85 | default: undefined
|
86 | },
|
87 | edgeSwipeDetection: {
|
88 | type: Boolean,
|
89 | default: undefined
|
90 | },
|
91 | edgeSwipeThreshold: {
|
92 | type: Number,
|
93 | default: undefined
|
94 | },
|
95 | freeMode: {
|
96 | type: Boolean,
|
97 | default: undefined
|
98 | },
|
99 | freeModeMomentum: {
|
100 | type: Boolean,
|
101 | default: undefined
|
102 | },
|
103 | freeModeMomentumRatio: {
|
104 | type: Number,
|
105 | default: undefined
|
106 | },
|
107 | freeModeMomentumBounce: {
|
108 | type: Boolean,
|
109 | default: undefined
|
110 | },
|
111 | freeModeMomentumBounceRatio: {
|
112 | type: Number,
|
113 | default: undefined
|
114 | },
|
115 | freeModeMomentumVelocityRatio: {
|
116 | type: Number,
|
117 | default: undefined
|
118 | },
|
119 | freeModeSticky: {
|
120 | type: Boolean,
|
121 | default: undefined
|
122 | },
|
123 | freeModeMinimumVelocity: {
|
124 | type: Number,
|
125 | default: undefined
|
126 | },
|
127 | autoHeight: {
|
128 | type: Boolean,
|
129 | default: undefined
|
130 | },
|
131 | setWrapperSize: {
|
132 | type: Boolean,
|
133 | default: undefined
|
134 | },
|
135 | virtualTranslate: {
|
136 | type: Boolean,
|
137 | default: undefined
|
138 | },
|
139 | effect: {
|
140 | type: String,
|
141 | default: undefined
|
142 | },
|
143 | breakpoints: {
|
144 | type: Object,
|
145 | default: undefined
|
146 | },
|
147 | spaceBetween: {
|
148 | type: Number,
|
149 | default: undefined
|
150 | },
|
151 | slidesPerView: {
|
152 | type: [Number, String],
|
153 | default: undefined
|
154 | },
|
155 | slidesPerColumn: {
|
156 | type: Number,
|
157 | default: undefined
|
158 | },
|
159 | slidesPerColumnFill: {
|
160 | type: String,
|
161 | default: undefined
|
162 | },
|
163 | slidesPerGroup: {
|
164 | type: Number,
|
165 | default: undefined
|
166 | },
|
167 | slidesPerGroupSkip: {
|
168 | type: Number,
|
169 | default: undefined
|
170 | },
|
171 | centeredSlides: {
|
172 | type: Boolean,
|
173 | default: undefined
|
174 | },
|
175 | centeredSlidesBounds: {
|
176 | type: Boolean,
|
177 | default: undefined
|
178 | },
|
179 | slidesOffsetBefore: {
|
180 | type: Number,
|
181 | default: undefined
|
182 | },
|
183 | slidesOffsetAfter: {
|
184 | type: Number,
|
185 | default: undefined
|
186 | },
|
187 | normalizeSlideIndex: {
|
188 | type: Boolean,
|
189 | default: undefined
|
190 | },
|
191 | centerInsufficientSlides: {
|
192 | type: Boolean,
|
193 | default: undefined
|
194 | },
|
195 | watchOverflow: {
|
196 | type: Boolean,
|
197 | default: undefined
|
198 | },
|
199 | roundLengths: {
|
200 | type: Boolean,
|
201 | default: undefined
|
202 | },
|
203 | touchRatio: {
|
204 | type: Number,
|
205 | default: undefined
|
206 | },
|
207 | touchAngle: {
|
208 | type: Number,
|
209 | default: undefined
|
210 | },
|
211 | simulateTouch: {
|
212 | type: Boolean,
|
213 | default: undefined
|
214 | },
|
215 | shortSwipes: {
|
216 | type: Boolean,
|
217 | default: undefined
|
218 | },
|
219 | longSwipes: {
|
220 | type: Boolean,
|
221 | default: undefined
|
222 | },
|
223 | longSwipesRatio: {
|
224 | type: Number,
|
225 | default: undefined
|
226 | },
|
227 | longSwipesMs: {
|
228 | type: Number,
|
229 | default: undefined
|
230 | },
|
231 | followFinger: {
|
232 | type: Boolean,
|
233 | default: undefined
|
234 | },
|
235 | allowTouchMove: {
|
236 | type: Boolean,
|
237 | default: undefined
|
238 | },
|
239 | threshold: {
|
240 | type: Number,
|
241 | default: undefined
|
242 | },
|
243 | touchMoveStopPropagation: {
|
244 | type: Boolean,
|
245 | default: undefined
|
246 | },
|
247 | touchStartPreventDefault: {
|
248 | type: Boolean,
|
249 | default: undefined
|
250 | },
|
251 | touchStartForcePreventDefault: {
|
252 | type: Boolean,
|
253 | default: undefined
|
254 | },
|
255 | touchReleaseOnEdges: {
|
256 | type: Boolean,
|
257 | default: undefined
|
258 | },
|
259 | uniqueNavElements: {
|
260 | type: Boolean,
|
261 | default: undefined
|
262 | },
|
263 | resistance: {
|
264 | type: Boolean,
|
265 | default: undefined
|
266 | },
|
267 | resistanceRatio: {
|
268 | type: Number,
|
269 | default: undefined
|
270 | },
|
271 | watchSlidesProgress: {
|
272 | type: Boolean,
|
273 | default: undefined
|
274 | },
|
275 | watchSlidesVisibility: {
|
276 | type: Boolean,
|
277 | default: undefined
|
278 | },
|
279 | grabCursor: {
|
280 | type: Boolean,
|
281 | default: undefined
|
282 | },
|
283 | preventClicks: {
|
284 | type: Boolean,
|
285 | default: undefined
|
286 | },
|
287 | preventClicksPropagation: {
|
288 | type: Boolean,
|
289 | default: undefined
|
290 | },
|
291 | slideToClickedSlide: {
|
292 | type: Boolean,
|
293 | default: undefined
|
294 | },
|
295 | preloadImages: {
|
296 | type: Boolean,
|
297 | default: undefined
|
298 | },
|
299 | updateOnImagesReady: {
|
300 | type: Boolean,
|
301 | default: undefined
|
302 | },
|
303 | loop: {
|
304 | type: Boolean,
|
305 | default: undefined
|
306 | },
|
307 | loopAdditionalSlides: {
|
308 | type: Number,
|
309 | default: undefined
|
310 | },
|
311 | loopedSlides: {
|
312 | type: Number,
|
313 | default: undefined
|
314 | },
|
315 | loopFillGroupWithBlank: {
|
316 | type: Boolean,
|
317 | default: undefined
|
318 | },
|
319 | loopPreventsSlide: {
|
320 | type: Boolean,
|
321 | default: undefined
|
322 | },
|
323 | allowSlidePrev: {
|
324 | type: Boolean,
|
325 | default: undefined
|
326 | },
|
327 | allowSlideNext: {
|
328 | type: Boolean,
|
329 | default: undefined
|
330 | },
|
331 | swipeHandler: {
|
332 | type: Boolean,
|
333 | default: undefined
|
334 | },
|
335 | noSwiping: {
|
336 | type: Boolean,
|
337 | default: undefined
|
338 | },
|
339 | noSwipingClass: {
|
340 | type: String,
|
341 | default: undefined
|
342 | },
|
343 | noSwipingSelector: {
|
344 | type: String,
|
345 | default: undefined
|
346 | },
|
347 | passiveListeners: {
|
348 | type: Boolean,
|
349 | default: undefined
|
350 | },
|
351 | containerModifierClass: {
|
352 | type: String,
|
353 | default: undefined
|
354 | },
|
355 | slideClass: {
|
356 | type: String,
|
357 | default: undefined
|
358 | },
|
359 | slideBlankClass: {
|
360 | type: String,
|
361 | default: undefined
|
362 | },
|
363 | slideActiveClass: {
|
364 | type: String,
|
365 | default: undefined
|
366 | },
|
367 | slideDuplicateActiveClass: {
|
368 | type: String,
|
369 | default: undefined
|
370 | },
|
371 | slideVisibleClass: {
|
372 | type: String,
|
373 | default: undefined
|
374 | },
|
375 | slideDuplicateClass: {
|
376 | type: String,
|
377 | default: undefined
|
378 | },
|
379 | slideNextClass: {
|
380 | type: String,
|
381 | default: undefined
|
382 | },
|
383 | slideDuplicateNextClass: {
|
384 | type: String,
|
385 | default: undefined
|
386 | },
|
387 | slidePrevClass: {
|
388 | type: String,
|
389 | default: undefined
|
390 | },
|
391 | slideDuplicatePrevClass: {
|
392 | type: String,
|
393 | default: undefined
|
394 | },
|
395 | wrapperClass: {
|
396 | type: String,
|
397 | default: undefined
|
398 | },
|
399 | runCallbacksOnInit: {
|
400 | type: Boolean,
|
401 | default: undefined
|
402 | },
|
403 | a11y: {
|
404 | type: [Boolean, Object],
|
405 | default: undefined
|
406 | },
|
407 | autoplay: {
|
408 | type: [Boolean, Object],
|
409 | default: undefined
|
410 | },
|
411 | controller: {
|
412 | type: Object,
|
413 | default: undefined
|
414 | },
|
415 | coverflowEffect: {
|
416 | type: Object,
|
417 | default: undefined
|
418 | },
|
419 | cubeEffect: {
|
420 | type: Object,
|
421 | default: undefined
|
422 | },
|
423 | fadeEffect: {
|
424 | type: Object,
|
425 | default: undefined
|
426 | },
|
427 | flipEffect: {
|
428 | type: Object,
|
429 | default: undefined
|
430 | },
|
431 | hashNavigation: {
|
432 | type: [Boolean, Object],
|
433 | default: undefined
|
434 | },
|
435 | history: {
|
436 | type: [Boolean, Object],
|
437 | default: undefined
|
438 | },
|
439 | keyboard: {
|
440 | type: [Boolean, Object],
|
441 | default: undefined
|
442 | },
|
443 | lazy: {
|
444 | type: [Boolean, Object],
|
445 | default: undefined
|
446 | },
|
447 | mousewheel: {
|
448 | type: [Boolean, Object],
|
449 | default: undefined
|
450 | },
|
451 | navigation: {
|
452 | type: [Boolean, Object],
|
453 | default: undefined
|
454 | },
|
455 | pagination: {
|
456 | type: [Boolean, Object],
|
457 | default: undefined
|
458 | },
|
459 | parallax: {
|
460 | type: [Boolean, Object],
|
461 | default: undefined
|
462 | },
|
463 | scrollbar: {
|
464 | type: [Boolean, Object],
|
465 | default: undefined
|
466 | },
|
467 | thumbs: {
|
468 | type: Object,
|
469 | default: undefined
|
470 | },
|
471 | virtual: {
|
472 | type: [Boolean, Object],
|
473 | default: undefined
|
474 | },
|
475 | zoom: {
|
476 | type: [Boolean, Object],
|
477 | default: undefined
|
478 | }
|
479 | },
|
480 | emits: ['_beforeBreakpoint', '_containerClasses', '_slideClass', '_swiper', 'activeIndexChange', 'afterInit', 'autoplay', 'autoplayStart', 'autoplayStop', 'beforeDestroy', 'beforeInit', 'beforeLoopFix', 'beforeResize', 'beforeSlideChangeStart', 'beforeTransitionStart', 'breakpoint', 'changeDirection', 'click', 'doubleTap', 'doubleClick', 'destroy', 'fromEdge', 'hashChange', 'hashSet', 'imagesReady', 'init', 'keyPress', 'lazyImageLoad', 'lazyImageReady', 'loopFix', 'momentumBounce', 'navigationHide', 'navigationShow', 'observerUpdate', 'orientationchange', 'paginationHide', 'paginationRender', 'paginationShow', 'paginationUpdate', 'progress', 'reachBeginning', 'reachEnd', 'realIndexChange', 'resize', 'scroll', 'scrollbarDragEnd', 'scrollbarDragMove', 'scrollbarDragStart', 'setTransition', 'setTranslate', 'slideChange', 'slideChangeTransitionEnd', 'slideChangeTransitionStart', 'slideNextTransitionEnd', 'slideNextTransitionStart', 'slidePrevTransitionEnd', 'slidePrevTransitionStart', 'slideResetTransitionStart', 'slideResetTransitionEnd', 'sliderMove', 'sliderFirstMove', 'slidesLengthChange', 'slidesGridLengthChange', 'snapGridLengthChange', 'snapIndexChange', 'swiper', 'tap', 'toEdge', 'touchEnd', 'touchMove', 'touchMoveOpposite', 'touchStart', 'transitionEnd', 'transitionStart', 'update', 'zoomChange'],
|
481 | setup: function setup(props, _ref) {
|
482 | var originalSlots = _ref.slots,
|
483 | emit = _ref.emit;
|
484 | var Tag = props.tag,
|
485 | WrapperTag = props.wrapperTag;
|
486 | var containerClasses = (0, _vue.ref)('swiper-container');
|
487 | var virtualData = (0, _vue.ref)(null);
|
488 | var breakpointChanged = (0, _vue.ref)(false);
|
489 | var initializedRef = (0, _vue.ref)(false);
|
490 | var swiperElRef = (0, _vue.ref)(null);
|
491 | var swiperRef = (0, _vue.ref)(null);
|
492 | var oldPassedParamsRef = (0, _vue.ref)(null);
|
493 | var slidesRef = {
|
494 | value: []
|
495 | };
|
496 | var oldSlidesRef = {
|
497 | value: []
|
498 | };
|
499 | var nextElRef = (0, _vue.ref)(null);
|
500 | var prevElRef = (0, _vue.ref)(null);
|
501 | var paginationElRef = (0, _vue.ref)(null);
|
502 | var scrollbarElRef = (0, _vue.ref)(null);
|
503 |
|
504 | var _getParams = (0, _getParams3.getParams)(props),
|
505 | swiperParams = _getParams.params,
|
506 | passedParams = _getParams.passedParams;
|
507 |
|
508 | (0, _getChildren2.getChildren)(originalSlots, slidesRef, oldSlidesRef);
|
509 | oldPassedParamsRef.value = passedParams;
|
510 | oldSlidesRef.value = slidesRef.value;
|
511 |
|
512 | var onBeforeBreakpoint = function onBeforeBreakpoint() {
|
513 | (0, _getChildren2.getChildren)(originalSlots, slidesRef, oldSlidesRef);
|
514 | breakpointChanged.value = true;
|
515 | };
|
516 |
|
517 | swiperParams.onAny = function (event) {
|
518 | for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
519 | args[_key - 1] = arguments[_key];
|
520 | }
|
521 |
|
522 | emit.apply(void 0, [event].concat(args));
|
523 | };
|
524 |
|
525 | Object.assign(swiperParams.on, {
|
526 | _beforeBreakpoint: onBeforeBreakpoint,
|
527 | _containerClasses: function _containerClasses(swiper, classes) {
|
528 | containerClasses.value = classes;
|
529 | },
|
530 | _swiper: function _swiper(swiper) {
|
531 | swiper.loopCreate = function () {};
|
532 |
|
533 | swiper.loopDestroy = function () {};
|
534 |
|
535 | if (swiperParams.loop) {
|
536 | swiper.loopedSlides = (0, _loop.calcLoopedSlides)(slidesRef.value, swiperParams);
|
537 | }
|
538 |
|
539 | swiperRef.value = swiper;
|
540 |
|
541 | if (swiper.virtual && swiper.params.virtual.enabled) {
|
542 | swiper.virtual.slides = slidesRef.value;
|
543 | swiper.params.virtual.cache = false;
|
544 |
|
545 | swiper.params.virtual.renderExternal = function (data) {
|
546 | virtualData.value = data;
|
547 | };
|
548 |
|
549 | swiper.params.virtual.renderExternalUpdate = false;
|
550 | }
|
551 | }
|
552 | });
|
553 | (0, _vue.onUpdated)(function () {
|
554 |
|
555 | if (!initializedRef.value && swiperRef.value) {
|
556 | swiperRef.value.emitSlidesClasses();
|
557 | initializedRef.value = true;
|
558 | }
|
559 |
|
560 |
|
561 | var _getParams2 = (0, _getParams3.getParams)(props),
|
562 | newPassedParams = _getParams2.passedParams;
|
563 |
|
564 | var changedParams = (0, _getChangedParams.getChangedParams)(newPassedParams, oldPassedParamsRef.value, slidesRef.value, oldSlidesRef.value);
|
565 | oldPassedParamsRef.value = newPassedParams;
|
566 |
|
567 | if ((changedParams.length || breakpointChanged.value) && swiperRef.value && !swiperRef.value.destroyed) {
|
568 | (0, _updateSwiper.updateSwiper)(swiperRef.value, slidesRef.value, newPassedParams, changedParams);
|
569 | }
|
570 |
|
571 | breakpointChanged.value = false;
|
572 | });
|
573 |
|
574 | (0, _vue.watch)(virtualData, function () {
|
575 | (0, _virtual.updateOnVirtualData)(swiperRef.value);
|
576 | });
|
577 |
|
578 | (0, _vue.onMounted)(function () {
|
579 | if (!swiperElRef.value) return;
|
580 | (0, _initSwiper.initSwiper)({
|
581 | el: swiperElRef.value,
|
582 | nextEl: nextElRef.value,
|
583 | prevEl: prevElRef.value,
|
584 | paginationEl: paginationElRef.value,
|
585 | scrollbarEl: scrollbarElRef.value
|
586 | }, swiperParams);
|
587 | emit('swiper', swiperRef.value);
|
588 | });
|
589 | (0, _vue.onBeforeUnmount)(function () {
|
590 | if (swiperRef.value && !swiperRef.value.destroyed) {
|
591 | swiperRef.value.destroy(true, false);
|
592 | }
|
593 | });
|
594 |
|
595 | function renderSlides(slides) {
|
596 | if (swiperParams.virtual) {
|
597 | return (0, _virtual.renderVirtual)(swiperRef, slides, virtualData.value);
|
598 | }
|
599 |
|
600 | if (!swiperParams.loop || swiperRef.value && swiperRef.value.destroyed) {
|
601 | slides.forEach(function (slide) {
|
602 | if (!slide.props) slide.props = {};
|
603 | slide.props.swiperRef = swiperRef;
|
604 | });
|
605 | return slides;
|
606 | }
|
607 |
|
608 | return (0, _loop.renderLoop)(swiperRef, slides, swiperParams);
|
609 | }
|
610 |
|
611 | return function () {
|
612 | var _getChildren = (0, _getChildren2.getChildren)(originalSlots, slidesRef, oldSlidesRef),
|
613 | slides = _getChildren.slides,
|
614 | slots = _getChildren.slots;
|
615 |
|
616 | return (0, _vue.h)(Tag, {
|
617 | ref: swiperElRef,
|
618 | class: (0, _utils.uniqueClasses)(containerClasses.value)
|
619 | }, [slots['container-start'], (0, _utils.needsNavigation)(props) && [(0, _vue.h)('div', {
|
620 | ref: prevElRef,
|
621 | class: 'swiper-button-prev'
|
622 | }), (0, _vue.h)('div', {
|
623 | ref: nextElRef,
|
624 | class: 'swiper-button-next'
|
625 | })], (0, _utils.needsScrollbar)(props) && (0, _vue.h)('div', {
|
626 | ref: scrollbarElRef,
|
627 | class: 'swiper-scrollbar'
|
628 | }), (0, _utils.needsPagination)(props) && (0, _vue.h)('div', {
|
629 | ref: paginationElRef,
|
630 | class: 'swiper-pagination'
|
631 | }), (0, _vue.h)(WrapperTag, {
|
632 | class: 'swiper-wrapper'
|
633 | }, [slots['wrapper-start'], renderSlides(slides), slots['wrapper-end']]), slots['container-end']]);
|
634 | };
|
635 | }
|
636 | };
|
637 | exports.Swiper = Swiper; |
\ | No newline at end of file |