virtual.d.ts 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. export interface VirtualMethods {
  2. /**
  3. * Object with cached slides HTML elements
  4. */
  5. cache: object;
  6. /**
  7. * Index of first rendered slide
  8. */
  9. from: number;
  10. /**
  11. * Index of last rendered slide
  12. */
  13. to: number;
  14. /**
  15. * Array with slide items passed by `virtual.slides` parameter
  16. */
  17. slides: any[];
  18. /*
  19. * Methods
  20. */
  21. /**
  22. * Append slide. `slides` can be a single slide item or array with such slides.
  23. *
  24. * @note Only for Core version (in React, Svelte, Vue & Angular it should be done by modifying slides array/data/source)
  25. */
  26. appendSlide(slide: HTMLElement | string | HTMLElement[] | string[]): void;
  27. /**
  28. * Prepend slide. `slides` can be a single slide item or array with such slides.
  29. *
  30. * @note Only for Core version (in React, Svelte, Vue & Angular it should be done by modifying slides array/data/source)
  31. */
  32. prependSlide(slide: HTMLElement | string | HTMLElement[] | string[]): void;
  33. /**
  34. * Remove specific slide or slides. `slideIndexes` can be a number with slide index to remove or array with indexes.
  35. *
  36. * @note Only for Core version (in React, Svelte, Vue & Angular it should be done by modifying slides array/data/source)
  37. */
  38. removeSlide(slideIndexes: number[]): void;
  39. /**
  40. * Remove all slides
  41. *
  42. * @note Only for Core version (in React, Svelte, Vue & Angular it should be done by modifying slides array/data/source)
  43. */
  44. removeAllSlides(): void;
  45. /**
  46. * Update virtual slides state
  47. */
  48. update(force: boolean): void;
  49. }
  50. export interface VirtualEvents {}
  51. export interface VirtualData {
  52. /**
  53. * slides left/top offset in px
  54. */
  55. offset: number;
  56. /**
  57. * index of first slide required to be rendered
  58. */
  59. from: number;
  60. /**
  61. * index of last slide required to be rendered
  62. */
  63. to: number;
  64. /**
  65. * array with slide items to be rendered
  66. */
  67. slides: any[];
  68. }
  69. export interface VirtualOptions {
  70. enabled?: boolean;
  71. /**
  72. * Array with slides
  73. *
  74. * @default []
  75. */
  76. slides?: any[];
  77. /**
  78. * Enables DOM cache of rendering slides html elements. Once they are rendered they will be saved to cache and reused from it.
  79. *
  80. * @default true
  81. */
  82. cache?: boolean;
  83. /**
  84. * Increases amount of pre-rendered slides before active slide
  85. *
  86. * @default 0
  87. */
  88. addSlidesBefore?: number;
  89. /**
  90. * Increases amount of pre-rendered slides after active slide
  91. *
  92. * @default 0
  93. */
  94. addSlidesAfter?: number;
  95. /**
  96. * Function to render slide. As an argument it accepts current slide item for `slides` array and index number of the current slide. Function must return an outter HTML of the swiper slide.
  97. *
  98. * @default null
  99. */
  100. renderSlide?: (slide: any, index: any) => any | null;
  101. /**
  102. * Function for external rendering (e.g. using some other library to handle DOM manipulations and state like React.js or Vue.js). As an argument it accepts `data` object with the following properties:
  103. *
  104. * - `offset` - slides left/top offset in px
  105. * - `from` - index of first slide required to be rendered
  106. * - `to` - index of last slide required to be rendered
  107. * - `slides` - array with slide items to be rendered
  108. *
  109. * @default null
  110. */
  111. renderExternal?: (data: VirtualData) => any | null;
  112. /**
  113. * When enabled (by default) it will update Swiper layout right after renderExternal called. Useful to disable and update swiper manually when used with render libraries that renders asynchronously
  114. *
  115. * @default true
  116. */
  117. renderExternalUpdate?: boolean;
  118. }