UNPKG

12.6 kBTypeScriptView Raw
1import { Dom7Array } from 'dom7';
2import { SwiperOptions } from './swiper-options';
3import { CSSSelector, SwiperModule } from './shared';
4import { SwiperEvents } from './swiper-events';
5
6import { A11yMethods } from './modules/a11y';
7import { AutoplayMethods } from './modules/autoplay';
8import { ControllerMethods } from './modules/controller';
9import { CoverflowEffectMethods } from './modules/effect-coverflow';
10import { CubeEffectMethods } from './modules/effect-cube';
11import { FadeEffectMethods } from './modules/effect-fade';
12import { FlipEffectMethods } from './modules/effect-flip';
13import { CreativeEffectMethods } from './modules/effect-creative';
14import { CardsEffectMethods } from './modules/effect-cards';
15import { HashNavigationMethods } from './modules/hash-navigation';
16import { HistoryMethods } from './modules/history';
17import { KeyboardMethods } from './modules/keyboard';
18import { LazyMethods } from './modules/lazy';
19import { MousewheelMethods } from './modules/mousewheel';
20import { NavigationMethods } from './modules/navigation';
21import { PaginationMethods } from './modules/pagination';
22import { ParallaxMethods } from './modules/parallax';
23import { ScrollbarMethods } from './modules/scrollbar';
24import { ThumbsMethods } from './modules/thumbs';
25import { VirtualMethods } from './modules/virtual';
26import { ZoomMethods } from './modules/zoom';
27import { FreeModeMethods } from './modules/free-mode';
28import { ManipulationMethods } from './modules/manipulation';
29
30interface SwiperClass<Events> {
31 /** Add event handler */
32 on<E extends keyof Events>(event: E, handler: Events[E]): void;
33 /** Add event handler that will be removed after it was fired */
34 once<E extends keyof Events>(event: E, handler: Events[E]): void;
35 /** Remove event handler */
36 off<E extends keyof Events>(event: E, handler: Events[E]): void;
37 /** Remove all handlers for specified event */
38 off<E extends keyof Events>(event: E): void;
39 /** Fire event on instance */
40 emit<E extends keyof Events>(event: E, ...args: any[]): void;
41}
42
43interface Swiper extends SwiperClass<SwiperEvents> {
44 /**
45 * Object with passed initialization parameters
46 */
47 params: SwiperOptions;
48
49 /**
50 * Object with original initialization parameters
51 */
52 originalParams: SwiperOptions;
53
54 /**
55 * Dom7 element with slider container HTML element. To get vanilla HTMLElement use `swiper.el`
56 */
57 $el: Dom7Array;
58
59 /**
60 * Slider container HTML element
61 */
62 el: HTMLElement;
63
64 /**
65 * Dom7 element with slider wrapper HTML element. To get vanilla HTMLElement use `swiper.wrapperEl`
66 */
67 $wrapperEl: Dom7Array;
68
69 /**
70 * Wrapper HTML element
71 */
72 wrapperEl: HTMLElement;
73
74 /**
75 * Dom7 array-like collection of slides HTML elements. To get specific slide HTMLElement use `swiper.slides[1]`
76 */
77 slides: Dom7Array;
78
79 /**
80 * !INTERNAL
81 */
82 loopedSlides: number | null;
83
84 /**
85 * Width of container
86 */
87 width: number;
88
89 /**
90 * Height of container
91 */
92 height: number;
93
94 /**
95 * Current value of wrapper translate
96 */
97 translate: number;
98
99 /**
100 * Current progress of wrapper translate (from 0 to 1)
101 */
102 progress: number;
103
104 /**
105 * Index number of currently active slide
106 *
107 * @note Note, that in loop mode active index value will be always shifted on a number of looped/duplicated slides
108 */
109 activeIndex: number;
110
111 /**
112 * Index number of currently active slide considering duplicated slides in loop mode
113 */
114 realIndex: number;
115
116 /**
117 * Index number of previously active slide
118 */
119 previousIndex: number;
120
121 /**
122 * `true` if slider on most "left"/"top" position
123 */
124 isBeginning: boolean;
125
126 /**
127 * `true` if slider on most "right"/"bottom" position
128 */
129 isEnd: boolean;
130
131 /**
132 * `true` if swiper is in transition
133 */
134 animating: boolean;
135
136 /**
137 * Object with the following touch event properties:
138 *
139 * - `swiper.touches.startX`
140 * - `swiper.touches.startY`
141 * - `swiper.touches.currentX`
142 * - `swiper.touches.currentY`
143 * - `swiper.touches.diff`
144 */
145 touches: {
146 startX: number;
147 startY: number;
148 currentX: number;
149 currentY: number;
150 diff: number;
151 };
152
153 /**
154 * Index number of last clicked slide
155 */
156 clickedIndex: number;
157
158 /**
159 * Link to last clicked slide (HTMLElement)
160 */
161 clickedSlide: HTMLElement;
162
163 /**
164 * Disable / enable ability to slide to the next slides by assigning `false` / `true` to this property
165 */
166 allowSlideNext: boolean;
167
168 /**
169 * Disable / enable ability to slide to the previous slides by assigning `false` / `true` to this property
170 */
171 allowSlidePrev: boolean;
172
173 /**
174 * Disable / enable ability move slider by grabbing it with mouse or by touching it with finger (on touch screens) by assigning `false` / `true` to this property
175 */
176 allowTouchMove: boolean;
177
178 /**
179 * !INTERNAL
180 */
181 rtlTranslate: boolean;
182
183 /**
184 * Disable Swiper (if it was enabled). When Swiper is disabled, it will hide all navigation elements and won't respond to any events and interactions
185 *
186 */
187 disable(): void;
188
189 /**
190 * Enable Swiper (if it was disabled)
191 *
192 */
193 enable(): void;
194
195 /**
196 * Set Swiper translate progress (from 0 to 1). Where 0 - its initial position (offset) on first slide, and 1 - its maximum position (offset) on last slide
197 *
198 * @param progress Swiper translate progress (from 0 to 1).
199 * @param speed Transition duration (in ms).
200 */
201 setProgress(progress: number, speed?: number): void;
202
203 /**
204 * Run transition to next slide.
205 *
206 * @param speed Transition duration (in ms).
207 * @param runCallbacks Set it to false (by default it is true) and transition will
208 * not produce transition events.
209 */
210 slideNext(speed?: number, runCallbacks?: boolean): void;
211
212 /**
213 * Run transition to previous slide.
214 *
215 * @param speed Transition duration (in ms).
216 * @param runCallbacks Set it to false (by default it is true) and transition will
217 * not produce transition events.
218 */
219 slidePrev(speed?: number, runCallbacks?: boolean): void;
220
221 /**
222 * Run transition to the slide with index number equal to 'index' parameter for the
223 * duration equal to 'speed' parameter.
224 *
225 * @param index Index number of slide.
226 * @param speed Transition duration (in ms).
227 * @param runCallbacks Set it to false (by default it is true) and transition will
228 * not produce transition events.
229 */
230 slideTo(index: number, speed?: number, runCallbacks?: boolean): void;
231
232 /**
233 * Does the same as .slideTo but for the case when used with enabled loop. So this
234 * method will slide to slides with realIndex matching to passed index
235 *
236 * @param index Index number of slide.
237 * @param speed Transition duration (in ms).
238 * @param runCallbacks Set it to false (by default it is true) and transition will
239 * not produce transition events.
240 */
241 slideToLoop(index: number, speed?: number, runCallbacks?: boolean): void;
242
243 /**
244 * Reset swiper position to currently active slide for the duration equal to 'speed'
245 * parameter.
246 *
247 * @param speed Transition duration (in ms).
248 * @param runCallbacks Set it to false (by default it is true) and transition will
249 * not produce transition events.
250 */
251 slideReset(speed?: number, runCallbacks?: boolean): void;
252
253 /**
254 * Reset swiper position to closest slide/snap point for the duration equal to 'speed' parameter.
255 *
256 * @param speed Transition duration (in ms).
257 * @param runCallbacks Set it to false (by default it is true) and transition will
258 * not produce transition events.
259 */
260 slideToClosest(speed?: number, runCallbacks?: boolean): void;
261
262 /**
263 * Force swiper to update its height (when autoHeight enabled) for the duration equal to
264 * 'speed' parameter
265 *
266 * @param speed Transition duration (in ms).
267 */
268 updateAutoHeight(speed?: number): void;
269
270 /**
271 * You should call it after you add/remove slides
272 * manually, or after you hide/show it, or do any
273 * custom DOM modifications with Swiper
274 * This method also includes subcall of the following
275 * methods which you can use separately:
276 */
277 update(): void;
278
279 /**
280 * recalculate size of swiper container
281 */
282 updateSize(): void;
283
284 /**
285 * recalculate number of slides and their offsets. Useful after you add/remove slides with JavaScript
286 */
287 updateSlides(): void;
288
289 /**
290 * recalculate swiper progress
291 */
292 updateProgress(): void;
293
294 /**
295 * update active/prev/next classes on slides and bullets
296 */
297 updateSlidesClasses(): void;
298
299 /**
300 * Changes slider direction from horizontal to vertical and back.
301 *
302 * @param direction New direction. If not specified, then will automatically changed to opposite direction
303 * @param needUpdate Will call swiper.update(). Default true
304 */
305 changeDirection(direction?: 'horizontal' | 'vertical', needUpdate?: boolean): void;
306
307 /**
308 * Detach all events listeners
309 */
310 detachEvents(): void;
311
312 /**
313 * Attach all events listeners again
314 */
315 attachEvents(): void;
316
317 /**
318 * !INTERNAL
319 */
320 loopCreate(): void;
321
322 /**
323 * !INTERNAL
324 */
325 loopDestroy(): void;
326
327 /**
328 * Initialize slider
329 */
330 init(el?: HTMLElement): Swiper;
331
332 /**
333 * Destroy slider instance and detach all events listeners
334 *
335 * @param deleteInstance Set it to false (by default it is true) to not to delete Swiper instance
336 * @param cleanStyles Set it to true (by default it is true) and all custom styles will be removed from slides, wrapper and container.
337 * Useful if you need to destroy Swiper and to init again with new options or in different direction
338 */
339 destroy(deleteInstance?: boolean, cleanStyles?: boolean): void;
340
341 /**
342 * Set custom css3 transform's translate value for swiper wrapper
343 */
344 setTranslate(translate: any): void;
345
346 /**
347 * Get current value of swiper wrapper css3 transform translate
348 */
349 getTranslate(): any;
350
351 /**
352 * Animate custom css3 transform's translate value for swiper wrapper
353 *
354 * @param translate Translate value (in px)
355 * @param speed Transition duration (in ms)
356 * @param runCallbacks Set it to false (by default it is true) and transition will not produce transition events
357 * @param translateBounds Set it to false (by default it is true) and transition value can extend beyond min and max translate
358 *
359 */
360 translateTo(
361 translate: number,
362 speed: number,
363 runCallbacks?: boolean,
364 translateBounds?: boolean,
365 ): any;
366
367 /**
368 * Unset grab cursor
369 */
370 unsetGrabCursor(): void;
371
372 /**
373 * Set grab cursor
374 */
375 setGrabCursor(): void;
376
377 /**
378 * Add event listener that will be fired on all events
379 */
380 onAny(handler: (eventName: string, ...args: any[]) => void): void;
381
382 /**
383 * Remove event listener that will be fired on all events
384 */
385 offAny(handler: (eventName: string, ...args: any[]) => void): void;
386
387 /**
388 * !INTERNAL
389 */
390 isHorizontal(): boolean;
391
392 /**
393 * !INTERNAL
394 */
395 getBreakpoint(breakpoints: SwiperOptions['breakpoints']): string;
396
397 /**
398 * !INTERNAL
399 */
400 setBreakpoint(): void;
401
402 /**
403 * !INTERNAL
404 */
405 currentBreakpoint: any;
406
407 /**
408 * !INTERNAL
409 */
410 destroyed: boolean;
411
412 /**
413 * !INTERNAL
414 */
415 modules: Array<SwiperModule>;
416
417 a11y: A11yMethods;
418 autoplay: AutoplayMethods;
419 controller: ControllerMethods;
420 coverflowEffect: CoverflowEffectMethods;
421 cubeEffect: CubeEffectMethods;
422 fadeEffect: FadeEffectMethods;
423 flipEffect: FlipEffectMethods;
424 creativeEffect: CreativeEffectMethods;
425 cardsEffect: CardsEffectMethods;
426 hashNavigation: HashNavigationMethods;
427 history: HistoryMethods;
428 keyboard: KeyboardMethods;
429 lazy: LazyMethods;
430 mousewheel: MousewheelMethods;
431 navigation: NavigationMethods;
432 pagination: PaginationMethods;
433 parallax: ParallaxMethods;
434 scrollbar: ScrollbarMethods;
435 thumbs: ThumbsMethods;
436 virtual: VirtualMethods;
437 zoom: ZoomMethods;
438 freeMode: FreeModeMethods;
439}
440
441interface Swiper extends ManipulationMethods {}
442
443declare class Swiper implements Swiper {
444 /**
445 * Constructs a new Swiper instance.
446 *
447 * @param container Where Swiper applies to.
448 * @param options Instance options.
449 */
450 constructor(container: CSSSelector | HTMLElement, options?: SwiperOptions);
451 /**
452 * Installs modules on Swiper in runtime.
453 */
454 static use(modules: SwiperModule[]): void;
455
456 /**
457 * Swiper default options
458 */
459 static defaults: SwiperOptions;
460
461 /**
462 * Extend global Swiper defaults
463 */
464 static extendDefaults(options: SwiperOptions): void;
465
466 /**
467 * Object with global Swiper extended options
468 */
469 static extendedDefaults: SwiperOptions;
470}
471
472export default Swiper;