inviton-powerduck 0.0.164 → 0.0.165
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/components/swiper/swiper.tsx +19 -15
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { Vue } from 'vue-facing-decorator';
|
|
2
2
|
import SwiperCore from 'swiper';
|
|
3
|
-
import { Navigation, Pagination, Autoplay } from 'swiper/modules';
|
|
3
|
+
import { Navigation, Pagination, Autoplay, FreeMode } from 'swiper/modules';
|
|
4
4
|
import { AutoplayOptions } from 'swiper/types';
|
|
5
5
|
import { Prop, toNative } from 'vue-facing-decorator';
|
|
6
6
|
import TsxComponent, { Component } from '../../app/vuetsx';
|
|
@@ -15,6 +15,7 @@ SwiperCore.use([
|
|
|
15
15
|
Navigation,
|
|
16
16
|
Pagination,
|
|
17
17
|
Autoplay,
|
|
18
|
+
FreeMode,
|
|
18
19
|
]);
|
|
19
20
|
|
|
20
21
|
interface SwiperArgs {
|
|
@@ -24,6 +25,7 @@ interface SwiperArgs {
|
|
|
24
25
|
slidesPerGroup?: number;
|
|
25
26
|
spaceBetween?: number;
|
|
26
27
|
freeMode?: boolean;
|
|
28
|
+
clickable?: boolean;
|
|
27
29
|
grabCursor?: boolean;
|
|
28
30
|
speed?: number;
|
|
29
31
|
autoplay?: AutoplayOptions;
|
|
@@ -55,6 +57,7 @@ class SwiperComponent extends TsxComponent<SwiperArgs> implements SwiperArgs {
|
|
|
55
57
|
@Prop() slidesPerGroup?: number;
|
|
56
58
|
@Prop() spaceBetween?: number;
|
|
57
59
|
@Prop() freeMode?: boolean;
|
|
60
|
+
@Prop() clickable?: boolean;
|
|
58
61
|
@Prop() grabCursor?: boolean;
|
|
59
62
|
@Prop() speed: number;
|
|
60
63
|
@Prop() autoplay: AutoplayOptions;
|
|
@@ -76,12 +79,13 @@ class SwiperComponent extends TsxComponent<SwiperArgs> implements SwiperArgs {
|
|
|
76
79
|
spaceBetween: this.spaceBetween > 0 ? this.spaceBetween : 0,
|
|
77
80
|
pagination: this.shouldRenderPagination()
|
|
78
81
|
? {
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
+
el: this.$refs.swiperPagination,
|
|
83
|
+
type: 'bullets',
|
|
84
|
+
clickable: this.clickable
|
|
85
|
+
}
|
|
82
86
|
: {
|
|
83
|
-
|
|
84
|
-
|
|
87
|
+
el: null,
|
|
88
|
+
},
|
|
85
89
|
};
|
|
86
90
|
|
|
87
91
|
if (this.slidesPerView != null) {
|
|
@@ -188,15 +192,15 @@ class SwiperComponent extends TsxComponent<SwiperArgs> implements SwiperArgs {
|
|
|
188
192
|
return (
|
|
189
193
|
<div class="swiper">
|
|
190
194
|
{this.shouldRenderPagination()
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
195
|
+
&& (
|
|
196
|
+
<div
|
|
197
|
+
ref="swiperPagination"
|
|
198
|
+
class={`swiper-pagination swiper-pagination-bullets swiper-pagination-horizontal ${this.zoomed
|
|
199
|
+
? 'hide-swiper-pagination-bulets'
|
|
200
|
+
: ''}`}
|
|
201
|
+
>
|
|
202
|
+
</div>
|
|
203
|
+
)}
|
|
200
204
|
|
|
201
205
|
<div class="swiper-wrapper">
|
|
202
206
|
{this.$slots?.default()}
|