UNPKG

13.3 kBTypeScriptView Raw
1import { SvelteComponentTyped } from 'svelte';
2import { SwiperOptions, Swiper as SwiperClass } from '../types/';
3
4// @ts-ignore
5interface SwiperProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {}
6interface SwiperProps extends SwiperOptions {}
7
8// @ts-ignore
9interface SwiperSlideProps extends svelte.JSX.HTMLAttributes<HTMLElementTagNameMap['div']> {
10 /**
11 * Enables additional wrapper required for zoom mode
12 *
13 * @default false
14 */
15 zoom?: boolean;
16
17 /**
18 * Slide's index in slides array/collection
19 *
20 * @default false
21 */
22 virtualIndex?: number;
23}
24
25declare class Swiper extends SvelteComponentTyped<
26 SwiperProps,
27 {
28 swiper: CustomEvent<void>;
29 /**
30 * Event will be fired in when autoplay started
31 */
32 autoplayStart: CustomEvent<[swiper: SwiperClass]>;
33 /**
34 * Event will be fired when autoplay stopped
35 */
36 autoplayStop: CustomEvent<[swiper: SwiperClass]>;
37 /**
38 * Event will be fired when slide changed with autoplay
39 */
40 autoplay: CustomEvent<[swiper: SwiperClass]>;/**
41 * Event will be fired on window hash change
42 */
43 hashChange: CustomEvent<[swiper: SwiperClass]>;
44 /**
45 * Event will be fired when swiper updates the hash
46 */
47 hashSet: CustomEvent<[swiper: SwiperClass]>;/**
48 * Event will be fired on mousewheel scroll
49 */
50 scroll: CustomEvent<[swiper: SwiperClass, event: WheelEvent]>;/**
51 * Event will be fired in the beginning of lazy loading of image
52 */
53 lazyImageLoad: CustomEvent<[swiper: SwiperClass, slideEl: HTMLElement, imageEl: HTMLElement]>;
54 /**
55 * Event will be fired when lazy loading image will be loaded
56 */
57 lazyImageReady: CustomEvent<[swiper: SwiperClass, slideEl: HTMLElement, imageEl: HTMLElement]>;/**
58 * Event will be fired on key press
59 */
60 keyPress: CustomEvent<[swiper: SwiperClass, keyCode: string]>;/**
61 * Event will be fired on navigation hide
62 */
63 navigationHide: CustomEvent<[swiper: SwiperClass]>;
64 /**
65 * Event will be fired on navigation show
66 */
67 navigationShow: CustomEvent<[swiper: SwiperClass]>;/**
68 * Event will be fired on draggable scrollbar drag start
69 */
70 scrollbarDragStart: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
71
72 /**
73 * Event will be fired on draggable scrollbar drag move
74 */
75 scrollbarDragMove: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
76
77 /**
78 * Event will be fired on draggable scrollbar drag end
79 */
80 scrollbarDragEnd: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;/**
81 * Event will be fired after pagination rendered
82 */
83 paginationRender: CustomEvent<[swiper: SwiperClass, paginationEl: HTMLElement]>;
84
85 /**
86 * Event will be fired when pagination updated
87 */
88 paginationUpdate: CustomEvent<[swiper: SwiperClass, paginationEl: HTMLElement]>;
89
90 /**
91 * Event will be fired on pagination hide
92 */
93 paginationHide: CustomEvent<[swiper: SwiperClass]>;
94
95 /**
96 * Event will be fired on pagination show
97 */
98 paginationShow: CustomEvent<[swiper: SwiperClass]>;/**
99 * Event will be fired on zoom change
100 */
101 zoomChange: CustomEvent<[swiper: SwiperClass, scale: number, imageEl: HTMLElement, slideEl: HTMLElement]>;
102
103 /**
104 * Fired right after Swiper initialization.
105 * @note Note that with `swiper.on('init')` syntax it will
106 * work only in case you set `init: false` parameter.
107 *
108 * @example
109 * ```js
110 * const swiper = new Swiper('.swiper', {
111 * init: false,
112 * // other parameters
113 * });
114 * swiper.on('init', function() {
115 * // do something
116 * });
117 * // init Swiper
118 * swiper.init();
119 * ```
120 *
121 * @example
122 * ```js
123 * // Otherwise use it as the parameter:
124 * const swiper = new Swiper('.swiper', {
125 * // other parameters
126 * on: {
127 * init: function () {
128 * // do something
129 * },
130 * }
131 * });
132 * ```
133 */
134 init: CustomEvent<[swiper: SwiperClass]>;
135
136 /**
137 * Event will be fired right before Swiper destroyed
138 */
139 beforeDestroy: CustomEvent<[swiper: SwiperClass]>;
140
141 /**
142 * Event will be fired when currently active slide is changed
143 */
144 slideChange: CustomEvent<[swiper: SwiperClass]>;
145
146 /**
147 * Event will be fired in the beginning of animation to other slide (next or previous).
148 */
149 slideChangeTransitionStart: CustomEvent<[swiper: SwiperClass]>;
150
151 /**
152 * Event will be fired after animation to other slide (next or previous).
153 */
154 slideChangeTransitionEnd: CustomEvent<[swiper: SwiperClass]>;
155
156 /**
157 * Same as "slideChangeTransitionStart" but for "forward" direction only
158 */
159 slideNextTransitionStart: CustomEvent<[swiper: SwiperClass]>;
160
161 /**
162 * Same as "slideChangeTransitionEnd" but for "forward" direction only
163 */
164 slideNextTransitionEnd: CustomEvent<[swiper: SwiperClass]>;
165
166 /**
167 * Same as "slideChangeTransitionStart" but for "backward" direction only
168 */
169 slidePrevTransitionStart: CustomEvent<[swiper: SwiperClass]>;
170
171 /**
172 * Same as "slideChangeTransitionEnd" but for "backward" direction only
173 */
174 slidePrevTransitionEnd: CustomEvent<[swiper: SwiperClass]>;
175
176 /**
177 * Event will be fired in the beginning of transition.
178 */
179 transitionStart: CustomEvent<[swiper: SwiperClass]>;
180
181 /**
182 * Event will be fired after transition.
183 */
184 transitionEnd: CustomEvent<[swiper: SwiperClass]>;
185
186 /**
187 * Event will be fired when user touch Swiper. Receives `touchstart` event as an arguments.
188 */
189 touchStart: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
190
191 /**
192 * Event will be fired when user touch and move finger over Swiper. Receives `touchmove` event as an arguments.
193 */
194 touchMove: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
195
196 /**
197 * Event will be fired when user touch and move finger over Swiper in direction opposite to direction parameter. Receives `touchmove` event as an arguments.
198 */
199 touchMoveOpposite: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
200
201 /**
202 * Event will be fired when user touch and move finger over Swiper and move it. Receives `touchmove` event as an arguments.
203 */
204 sliderMove: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
205
206 /**
207 * Event will be fired when user release Swiper. Receives `touchend` event as an arguments.
208 */
209 touchEnd: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
210
211 /**
212 * Event will be fired when user click/tap on Swiper. Receives `touchend` event as an arguments.
213 */
214 click: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
215
216 /**
217 * Event will be fired when user click/tap on Swiper. Receives `touchend` event as an arguments.
218 */
219 tap: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
220
221 /**
222 * Event will be fired when user double tap on Swiper's container. Receives `touchend` event as an arguments
223 */
224 doubleTap: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
225
226 /**
227 * Event will be fired right after all inner images are loaded. updateOnImagesReady should be also enabled
228 */
229 imagesReady: CustomEvent<[swiper: SwiperClass]>;
230
231 /**
232 * Event will be fired when Swiper progress is changed, as an arguments it receives progress that is always from 0 to 1
233 */
234 progress: CustomEvent<[swiper: SwiperClass, progress: number]>;
235
236 /**
237 * Event will be fired when Swiper reach its beginning (initial position)
238 */
239 reachBeginning: CustomEvent<[swiper: SwiperClass]>;
240
241 /**
242 * Event will be fired when Swiper reach last slide
243 */
244 reachEnd: CustomEvent<[swiper: SwiperClass]>;
245
246 /**
247 * Event will be fired when Swiper goes to beginning or end position
248 */
249 toEdge: CustomEvent<[swiper: SwiperClass]>;
250
251 /**
252 * Event will be fired when Swiper goes from beginning or end position
253 */
254 fromEdge: CustomEvent<[swiper: SwiperClass]>;
255
256 /**
257 * Event will be fired when swiper's wrapper change its position. Receives current translate value as an arguments
258 */
259 setTranslate: CustomEvent<[swiper: SwiperClass, translate: number]>;
260
261 /**
262 * Event will be fired everytime when swiper starts animation. Receives current transition duration (in ms) as an arguments
263 */
264 setTransition: CustomEvent<[swiper: SwiperClass, transition: number]>;
265
266 /**
267 * Event will be fired on window resize right before swiper's onresize manipulation
268 */
269 resize: CustomEvent<[swiper: SwiperClass]>;
270
271 /**
272 * Event will be fired if observer is enabled and it detects DOM mutations
273 */
274 observerUpdate: CustomEvent<[swiper: SwiperClass]>;
275
276 /**
277 * Event will be fired right before "loop fix"
278 */
279 beforeLoopFix: CustomEvent<[swiper: SwiperClass]>;
280
281 /**
282 * Event will be fired after "loop fix"
283 */
284 loopFix: CustomEvent<[swiper: SwiperClass]>;
285
286 /**
287 * Event will be fired on breakpoint change
288 */
289 breakpoint: CustomEvent<[swiper: SwiperClass, breakpointParams: SwiperOptions]>;
290
291 /**
292 * !INTERNAL: Event will fired right before breakpoint change
293 */
294 _beforeBreakpoint: CustomEvent<[swiper: SwiperClass, breakpointParams: SwiperOptions]>;
295
296 /**
297 * !INTERNAL: Event will fired after setting CSS classes on swiper container element
298 */
299 _containerClasses: CustomEvent<[swiper: SwiperClass, classNames: string]>;
300
301 /**
302 * !INTERNAL: Event will fired after setting CSS classes on swiper slide element
303 */
304 _slideClass: CustomEvent<[swiper: SwiperClass, slideEl: HTMLElement, classNames: string]>;
305
306 /**
307 * !INTERNAL: Event will fired after setting CSS classes on all swiper slides
308 */
309 _slideClasses: CustomEvent<[
310 swiper: SwiperClass,
311 slides: { slideEl: HTMLElement; classNames: string; index: number }[],
312 ]>;
313
314 /**
315 * !INTERNAL: Event will fired as soon as swiper instance available (before init)
316 */
317 _swiper: CustomEvent<[swiper: SwiperClass]>;
318
319 /**
320 * !INTERNAL: Event will be fired on free mode touch end (release) and there will no be momentum
321 */
322 _freeModeNoMomentumRelease: CustomEvent<[swiper: SwiperClass]>;
323
324 /**
325 * Event will fired on active index change
326 */
327 activeIndexChange: CustomEvent<[swiper: SwiperClass]>;
328 /**
329 * Event will fired on snap index change
330 */
331 snapIndexChange: CustomEvent<[swiper: SwiperClass]>;
332 /**
333 * Event will fired on real index change
334 */
335 realIndexChange: CustomEvent<[swiper: SwiperClass]>;
336 /**
337 * Event will fired right after initialization
338 */
339 afterInit: CustomEvent<[swiper: SwiperClass]>;
340 /**
341 * Event will fired right before initialization
342 */
343 beforeInit: CustomEvent<[swiper: SwiperClass]>;
344 /**
345 * Event will fired before resize handler
346 */
347 beforeResize: CustomEvent<[swiper: SwiperClass]>;
348 /**
349 * Event will fired before slide change transition start
350 */
351 beforeSlideChangeStart: CustomEvent<[swiper: SwiperClass]>;
352 /**
353 * Event will fired before transition start
354 */
355 beforeTransitionStart: CustomEvent<[swiper: SwiperClass, speed: number, internal: any]>; // what is internal?
356 /**
357 * Event will fired on direction change
358 */
359 changeDirection: CustomEvent<[swiper: SwiperClass]>;
360 /**
361 * Event will be fired when user double click/tap on Swiper
362 */
363 doubleClick: CustomEvent<[swiper: SwiperClass, event: MouseEvent | TouchEvent | PointerEvent]>;
364 /**
365 * Event will be fired on swiper destroy
366 */
367 destroy: CustomEvent<[swiper: SwiperClass]>;
368 /**
369 * Event will be fired on momentum bounce
370 */
371 momentumBounce: CustomEvent<[swiper: SwiperClass]>;
372 /**
373 * Event will be fired on orientation change (e.g. landscape -> portrait)
374 */
375 orientationchange: CustomEvent<[swiper: SwiperClass]>;
376 /**
377 * Event will be fired in the beginning of animation of resetting slide to current one
378 */
379 slideResetTransitionStart: CustomEvent<[swiper: SwiperClass]>;
380 /**
381 * Event will be fired in the end of animation of resetting slide to current one
382 */
383 slideResetTransitionEnd: CustomEvent<[swiper: SwiperClass]>;
384 /**
385 * Event will be fired with first touch/drag move
386 */
387 sliderFirstMove: CustomEvent<[swiper: SwiperClass, event: TouchEvent]>;
388 /**
389 * Event will be fired when number of slides has changed
390 */
391 slidesLengthChange: CustomEvent<[swiper: SwiperClass]>;
392 /**
393 * Event will be fired when slides grid has changed
394 */
395 slidesGridLengthChange: CustomEvent<[swiper: SwiperClass]>;
396 /**
397 * Event will be fired when snap grid has changed
398 */
399 snapGridLengthChange: CustomEvent<[swiper: SwiperClass]>;
400 /**
401 * Event will be fired after swiper.update() call
402 */
403 update: CustomEvent<[swiper: SwiperClass]>;
404 /**
405 * Event will be fired when swiper is locked (when `watchOverflow` enabled)
406 */
407 lock: CustomEvent<[swiper: SwiperClass]>;
408 /**
409 * Event will be fired when swiper is unlocked (when `watchOverflow` enabled)
410 */
411 unlock: CustomEvent<[swiper: SwiperClass]>;
412
413 },
414 {
415 default: {};
416 'container-start': {};
417 'wrapper-start': {};
418 'wrapper-end': {};
419 'container-end': {};
420 }
421> {}
422
423declare class SwiperSlide extends SvelteComponentTyped<
424 SwiperSlideProps,
425 {},
426 {
427 default: {};
428 }
429> {}
430
431export { Swiper, SwiperSlide };