Browse code

Refactor and rewrite as contao bundle

Benjamin Roth authored on04/11/2022 22:32:32
Showing1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,313 @@
1
+import * as React from 'react';
2
+
3
+import { SwiperOptions } from './types/swiper-options';
4
+import SwiperClass from './types/swiper-class';
5
+
6
+interface Swiper extends SwiperOptions {
7
+  /**
8
+   * Swiper container tag
9
+   *
10
+   * @default 'div'
11
+   */
12
+  tag?: string;
13
+
14
+  /**
15
+   * Swiper wrapper tag
16
+   *
17
+   * @default 'div'
18
+   */
19
+  wrapperTag?: string;
20
+
21
+  /**
22
+   * Get Swiper instance
23
+   */
24
+  onSwiper?: (swiper: SwiperClass) => void;
25
+
26
+  
27
+  /**
28
+   * Fired right after Swiper initialization.
29
+   * @note Note that with swiper.on('init') syntax it will
30
+   * work only in case you set init: false parameter.
31
+   *
32
+   * @example
33
+   * var swiper = new Swiper('.swiper-container', {
34
+   *   init: false,
35
+   *   // other parameters
36
+   * });
37
+   * swiper.on('init', function() {
38
+   *  // do something
39
+   * });
40
+   * // init Swiper
41
+   * swiper.init();
42
+   *
43
+   * @example
44
+   * // Otherwise use it as the parameter:
45
+   * var swiper = new Swiper('.swiper-container', {
46
+   *   // other parameters
47
+   *   on: {
48
+   *     init: function () {
49
+   *       // do something
50
+   *     },
51
+   *   }
52
+   * });
53
+   */
54
+  onInit?: (swiper: SwiperClass) => any;
55
+
56
+  /**
57
+   * Event will be fired right before Swiper destroyed
58
+   */
59
+  onBeforeDestroy?: (swiper: SwiperClass) => void;
60
+
61
+  /**
62
+   * Event will be fired when currently active slide is changed
63
+   */
64
+  onSlideChange?: (swiper: SwiperClass) => void;
65
+
66
+  /**
67
+   * Event will be fired in the beginning of animation to other slide (next or previous).
68
+   */
69
+  onSlideChangeTransitionStart?: (swiper: SwiperClass) => void;
70
+
71
+  /**
72
+   * Event will be fired after animation to other slide (next or previous).
73
+   */
74
+  onSlideChangeTransitionEnd?: (swiper: SwiperClass) => void;
75
+
76
+  /**
77
+   * Same as "slideChangeTransitionStart" but for "forward" direction only
78
+   */
79
+  onSlideNextTransitionStart?: (swiper: SwiperClass) => void;
80
+
81
+  /**
82
+   * Same as "slideChangeTransitionEnd" but for "forward" direction only
83
+   */
84
+  onSlideNextTransitionEnd?: (swiper: SwiperClass) => void;
85
+
86
+  /**
87
+   * Same as "slideChangeTransitionStart" but for "backward" direction only
88
+   */
89
+  onSlidePrevTransitionStart?: (swiper: SwiperClass) => void;
90
+
91
+  /**
92
+   * Same as "slideChangeTransitionEnd" but for "backward" direction only
93
+   */
94
+  onSlidePrevTransitionEnd?: (swiper: SwiperClass) => void;
95
+
96
+  /**
97
+   * Event will be fired in the beginning of transition.
98
+   */
99
+  onTransitionStart?: (swiper: SwiperClass) => void;
100
+
101
+  /**
102
+   * Event will be fired after transition.
103
+   */
104
+  onTransitionEnd?: (swiper: SwiperClass) => void;
105
+
106
+  /**
107
+   * Event will be fired when user touch Swiper. Receives 'touchstart' event as an arguments.
108
+   */
109
+  onTouchStart?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
110
+
111
+  /**
112
+   * Event will be fired when user touch and move finger over Swiper. Receives 'touchmove' event as an arguments.
113
+   */
114
+  onTouchMove?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
115
+
116
+  /**
117
+   * Event will be fired when user touch and move finger over Swiper in direction opposite to direction parameter. Receives 'touchmove' event as an arguments.
118
+   */
119
+  onTouchMoveOpposite?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
120
+
121
+  /**
122
+   * Event will be fired when user touch and move finger over Swiper and move it. Receives 'touchmove' event as an arguments.
123
+   */
124
+  onSliderMove?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
125
+
126
+  /**
127
+   * Event will be fired when user release Swiper. Receives 'touchend' event as an arguments.
128
+   */
129
+  onTouchEnd?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
130
+
131
+  /**
132
+   * Event will be fired when user click/tap on Swiper. Receives 'touchend' event as an arguments.
133
+   */
134
+  onClick?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
135
+
136
+  /**
137
+   * Event will be fired when user click/tap on Swiper. Receives 'touchend' event as an arguments.
138
+   */
139
+  onTap?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
140
+
141
+  /**
142
+   * Event will be fired when user double tap on Swiper's container. Receives 'touchend' event as an arguments
143
+   */
144
+  onDoubleTap?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
145
+
146
+  /**
147
+   * Event will be fired right after all inner images are loaded. updateOnImagesReady should be also enabled
148
+   */
149
+  onImagesReady?: (swiper: SwiperClass) => void;
150
+
151
+  /**
152
+   * Event will be fired when Swiper progress is changed, as an arguments it receives progress that is always from 0 to 1
153
+   */
154
+  onProgress?: (swiper: SwiperClass, progress: number) => void;
155
+
156
+  /**
157
+   * Event will be fired when Swiper reach its beginning (initial position)
158
+   */
159
+  onReachBeginning?: (swiper: SwiperClass) => void;
160
+
161
+  /**
162
+   * Event will be fired when Swiper reach last slide
163
+   */
164
+  onReachEnd?: (swiper: SwiperClass) => void;
165
+
166
+  /**
167
+   * Event will be fired when Swiper goes to beginning or end position
168
+   */
169
+  onToEdge?: (swiper: SwiperClass) => void;
170
+
171
+  /**
172
+   * Event will be fired when Swiper goes from beginning or end position
173
+   */
174
+  onFromEdge?: (swiper: SwiperClass) => void;
175
+
176
+  /**
177
+   * Event will be fired when swiper's wrapper change its position. Receives current translate value as an arguments
178
+   */
179
+  onSetTranslate?: (swiper: SwiperClass, translate: number) => void;
180
+
181
+  /**
182
+   * Event will be fired everytime when swiper starts animation. Receives current transition duration (in ms) as an arguments
183
+   */
184
+  onSetTransition?: (swiper: SwiperClass, transition: number) => void;
185
+
186
+  /**
187
+   * Event will be fired on window resize right before swiper's onresize manipulation
188
+   */
189
+  onResize?: (swiper: SwiperClass) => void;
190
+
191
+  /**
192
+   * Event will be fired if observer is enabled and it detects DOM mutations
193
+   */
194
+  onObserverUpdate?: (swiper: SwiperClass) => void;
195
+
196
+  /**
197
+   * Event will be fired right before "loop fix"
198
+   */
199
+  onBeforeLoopFix?: (swiper: SwiperClass) => void;
200
+
201
+  /**
202
+   * Event will be fired after "loop fix"
203
+   */
204
+  onLoopFix?: (swiper: SwiperClass) => void;
205
+
206
+  /**
207
+   * Event will be fired on breakpoint change
208
+   */
209
+  onBreakpoint?: (swiper: SwiperClass, breakpointParams: SwiperOptions) => void;
210
+  
211
+  /**
212
+   * Event will be fired in when autoplay started
213
+   */
214
+  onAutoplayStart?: (swiper: SwiperClass) => void;
215
+  /**
216
+   * Event will be fired when autoplay stopped
217
+   */
218
+  onAutoplayStop?: (swiper: SwiperClass) => void;
219
+  /**
220
+   * Event will be fired when slide changed with autoplay
221
+   */
222
+  onAutoplay?: (swiper: SwiperClass) => void;/**
223
+   * Event will be fired on window hash change
224
+   */
225
+  onHashChange?: (swiper: SwiperClass) => void;
226
+  /**
227
+   * Event will be fired when swiper updates the hash
228
+   */
229
+  onHashSet?: (swiper: SwiperClass) => void;/**
230
+   * Event will be fired in the beginning of lazy loading of image
231
+   */
232
+  onLazyImageLoad?: (swiper: SwiperClass, slideEl: HTMLElement, imageEl: HTMLElement) => void;
233
+  /**
234
+   * Event will be fired when lazy loading image will be loaded
235
+   */
236
+  onLazyImageReady?: (swiper: SwiperClass, slideEl: HTMLElement, imageEl: HTMLElement) => void;/**
237
+   * Event will be fired on navigation hide
238
+   */
239
+  onNavigationHide?: (swiper: SwiperClass) => void;
240
+  /**
241
+   * Event will be fired on navigation show
242
+   */
243
+  onNavigationShow?: (swiper: SwiperClass) => void;/**
244
+   * Event will be fired after pagination rendered
245
+   */
246
+  onPaginationRender?: (swiper: SwiperClass, paginationEl: HTMLElement) => void;
247
+
248
+  /**
249
+   * Event will be fired when pagination updated
250
+   */
251
+  onPaginationUpdate?: (swiper: SwiperClass, paginationEl: HTMLElement) => void;
252
+
253
+  /**
254
+   * Event will be fired on pagination hide
255
+   */
256
+  onPaginationHide?: (swiper: SwiperClass) => void;
257
+
258
+  /**
259
+   * Event will be fired on pagination show
260
+   */
261
+  onPaginationShow?: (swiper: SwiperClass) => void;/**
262
+   * Event will be fired on draggable scrollbar drag start
263
+   */
264
+  onScrollbarDragStart?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
265
+
266
+  /**
267
+   * Event will be fired on draggable scrollbar drag move
268
+   */
269
+  onScrollbarDragMove?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;
270
+
271
+  /**
272
+   * Event will be fired on draggable scrollbar drag end
273
+   */
274
+  onScrollbarDragEnd?: (swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent) => void;/**
275
+   * Event will be fired on zoom change
276
+   */
277
+  onZoomChange?: (swiper: SwiperClass, value: number, imageEl: HTMLElement, slideEl: HTMLElement) => void;
278
+}
279
+
280
+interface SwiperSlide {
281
+  /**
282
+   * Slide tag
283
+   *
284
+   * @default 'div'
285
+   */
286
+  tag?: string;
287
+
288
+  /**
289
+   * Enables additional wrapper required for zoom mode
290
+   *
291
+   * @default false
292
+   */
293
+  zoom?: boolean;
294
+
295
+  /**
296
+   * Slide's index in slides array/collection
297
+   *
298
+   * @default false
299
+   */
300
+  virtualIndex?: number;
301
+}
302
+
303
+interface Swiper
304
+  extends Omit<
305
+    React.HTMLAttributes<HTMLElement>,
306
+    'onProgress' | 'onClick' | 'onTouchEnd' | 'onTouchMove' | 'onTouchStart' | 'onTransitionEnd'
307
+  > {}
308
+interface SwiperSlide extends React.HTMLAttributes<HTMLElement> {}
309
+
310
+declare const Swiper: React.FunctionComponent<Swiper>;
311
+declare const SwiperSlide: React.FunctionComponent<SwiperSlide>;
312
+
313
+export { Swiper, SwiperSlide };