swiper-svelte.d.ts 14 KB

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