@egjs/flicking 4.15.0 → 4.16.0-beta.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (185) hide show
  1. package/README.md +6 -175
  2. package/{declaration → dist}/CrossFlicking.d.ts +7 -2
  3. package/dist/Flicking.d.ts +1231 -0
  4. package/dist/camera/Camera.d.ts +324 -0
  5. package/{declaration → dist}/camera/mode/BoundCameraMode.d.ts +5 -4
  6. package/{declaration → dist}/camera/mode/CameraMode.d.ts +7 -6
  7. package/{declaration → dist}/camera/mode/CircularCameraMode.d.ts +9 -5
  8. package/{declaration → dist}/camera/mode/LinearCameraMode.d.ts +2 -4
  9. package/{declaration → dist}/cfc/getDefaultCameraTransform.d.ts +1 -1
  10. package/dist/cfc/withFlickingMethods.d.ts +15 -0
  11. package/{declaration/const/axes.d.ts → dist/constants/internal.d.ts} +8 -0
  12. package/dist/constants/values.d.ts +67 -0
  13. package/dist/control/AxesController.d.ts +186 -0
  14. package/dist/control/Control.d.ts +185 -0
  15. package/dist/control/FreeControl.d.ts +44 -0
  16. package/dist/control/SnapControl.d.ts +54 -0
  17. package/{declaration → dist}/control/StateMachine.d.ts +3 -0
  18. package/dist/control/StrictControl.d.ts +60 -0
  19. package/{declaration → dist}/control/states/AnimatingState.d.ts +12 -0
  20. package/{declaration → dist}/control/states/DisabledState.d.ts +12 -0
  21. package/{declaration → dist}/control/states/DraggingState.d.ts +12 -0
  22. package/{declaration → dist}/control/states/HoldingState.d.ts +12 -0
  23. package/{declaration → dist}/control/states/IdleState.d.ts +12 -0
  24. package/dist/control/states/State.d.ts +86 -0
  25. package/dist/core/AnchorPoint.d.ts +40 -0
  26. package/{declaration → dist}/core/AutoResizer.d.ts +6 -0
  27. package/dist/core/Viewport.d.ts +60 -0
  28. package/dist/core/VirtualManager.d.ts +84 -0
  29. package/dist/core/index.d.ts +6 -0
  30. package/dist/core/panel/Panel.d.ts +298 -0
  31. package/dist/core/panel/VirtualPanel.d.ts +41 -0
  32. package/dist/core/panel/index.d.ts +5 -0
  33. package/{declaration → dist}/core/panel/provider/VanillaElementProvider.d.ts +3 -0
  34. package/{declaration → dist}/core/panel/provider/VirtualElementProvider.d.ts +3 -0
  35. package/dist/error/FlickingError.d.ts +25 -0
  36. package/dist/error/codes.d.ts +79 -0
  37. package/dist/error/groups.d.ts +94 -0
  38. package/dist/error/index.d.ts +4 -0
  39. package/dist/error/types.d.ts +516 -0
  40. package/dist/event/groups.d.ts +40 -0
  41. package/dist/event/index.d.ts +3 -0
  42. package/dist/event/names.d.ts +47 -0
  43. package/dist/event/types.d.ts +318 -0
  44. package/dist/flicking.cjs.js +5559 -7791
  45. package/dist/flicking.cjs.js.map +1 -1
  46. package/dist/flicking.esm.js +5637 -7699
  47. package/dist/flicking.esm.js.map +1 -1
  48. package/dist/flicking.js +6722 -8893
  49. package/dist/flicking.js.map +1 -1
  50. package/dist/flicking.min.js +1 -9
  51. package/dist/flicking.min.js.map +1 -1
  52. package/dist/flicking.pkgd.js +9661 -14086
  53. package/dist/flicking.pkgd.js.map +1 -1
  54. package/dist/flicking.pkgd.min.js +1 -9
  55. package/dist/flicking.pkgd.min.js.map +1 -1
  56. package/dist/index.d.ts +16 -0
  57. package/dist/reactive/index.d.ts +126 -0
  58. package/{declaration → dist}/renderer/ExternalRenderer.d.ts +3 -0
  59. package/dist/renderer/Renderer.d.ts +215 -0
  60. package/{declaration → dist}/renderer/VanillaRenderer.d.ts +6 -0
  61. package/{declaration → dist}/renderer/strategy/NormalRenderingStrategy.d.ts +5 -2
  62. package/{declaration → dist}/renderer/strategy/RenderingStrategy.d.ts +4 -1
  63. package/dist/types/external.d.ts +58 -0
  64. package/dist/types/params.d.ts +10 -0
  65. package/{declaration → dist}/utils.d.ts +7 -7
  66. package/package.json +35 -162
  67. package/src/CrossFlicking.ts +68 -96
  68. package/src/Flicking.ts +1051 -972
  69. package/src/camera/Camera.ts +217 -206
  70. package/src/camera/index.ts +2 -6
  71. package/src/camera/mode/BoundCameraMode.ts +38 -27
  72. package/src/camera/mode/CameraMode.ts +14 -12
  73. package/src/camera/mode/CircularCameraMode.ts +24 -16
  74. package/src/camera/mode/LinearCameraMode.ts +3 -1
  75. package/src/camera/mode/index.ts +4 -10
  76. package/src/cfc/getDefaultCameraTransform.ts +9 -11
  77. package/src/cfc/getRenderingPanels.ts +2 -4
  78. package/src/cfc/index.ts +4 -9
  79. package/src/cfc/sync.ts +11 -5
  80. package/src/cfc/withFlickingMethods.ts +6 -7
  81. package/src/{const/axes.ts → constants/internal.ts} +1 -0
  82. package/src/constants/values.ts +78 -0
  83. package/src/control/AxesController.ts +119 -110
  84. package/src/control/Control.ts +147 -180
  85. package/src/control/FreeControl.ts +36 -60
  86. package/src/control/SnapControl.ts +64 -68
  87. package/src/control/StateMachine.ts +14 -11
  88. package/src/control/StrictControl.ts +58 -73
  89. package/src/control/index.ts +9 -12
  90. package/src/control/states/AnimatingState.ts +8 -11
  91. package/src/control/states/DisabledState.ts +0 -5
  92. package/src/control/states/DraggingState.ts +8 -12
  93. package/src/control/states/HoldingState.ts +10 -15
  94. package/src/control/states/IdleState.ts +1 -6
  95. package/src/control/states/State.ts +46 -85
  96. package/src/core/AnchorPoint.ts +25 -23
  97. package/src/core/AutoResizer.ts +6 -15
  98. package/src/core/ResizeWatcher.ts +17 -16
  99. package/src/core/Viewport.ts +35 -46
  100. package/src/core/VirtualManager.ts +48 -36
  101. package/src/core/index.ts +6 -9
  102. package/src/core/panel/Panel.ts +190 -185
  103. package/src/core/panel/VirtualPanel.ts +17 -21
  104. package/src/core/panel/index.ts +4 -9
  105. package/src/core/panel/provider/VanillaElementProvider.ts +6 -2
  106. package/src/core/panel/provider/VirtualElementProvider.ts +6 -2
  107. package/src/core/panel/provider/index.ts +2 -7
  108. package/src/{core → error}/FlickingError.ts +5 -7
  109. package/src/error/codes.ts +164 -0
  110. package/src/error/groups.ts +124 -0
  111. package/src/error/index.ts +9 -0
  112. package/src/error/types.ts +535 -0
  113. package/src/event/groups.ts +61 -0
  114. package/src/event/index.ts +8 -0
  115. package/src/event/names.ts +52 -0
  116. package/src/event/types.ts +355 -0
  117. package/src/index.ts +9 -11
  118. package/src/index.umd.ts +9 -3
  119. package/src/reactive/index.ts +39 -74
  120. package/src/renderer/Renderer.ts +170 -115
  121. package/src/renderer/VanillaRenderer.ts +12 -9
  122. package/src/renderer/index.ts +4 -9
  123. package/src/renderer/strategy/NormalRenderingStrategy.ts +26 -22
  124. package/src/renderer/strategy/RenderingStrategy.ts +2 -1
  125. package/src/renderer/strategy/VirtualRenderingStrategy.ts +20 -13
  126. package/src/renderer/strategy/index.ts +4 -9
  127. package/src/types/external.ts +72 -0
  128. package/src/{type → types}/internal.ts +2 -5
  129. package/src/types/params.ts +15 -0
  130. package/src/utils.ts +37 -32
  131. package/CONTRIBUTING.md +0 -59
  132. package/NOTICE +0 -31
  133. package/core-packages-link.js +0 -75
  134. package/debug/reactive/index.html +0 -240
  135. package/declaration/Flicking.d.ts +0 -264
  136. package/declaration/camera/Camera.d.ts +0 -90
  137. package/declaration/cfc/withFlickingMethods.d.ts +0 -2
  138. package/declaration/const/error.d.ts +0 -34
  139. package/declaration/const/external.d.ts +0 -54
  140. package/declaration/control/AxesController.d.ts +0 -45
  141. package/declaration/control/Control.d.ts +0 -45
  142. package/declaration/control/FreeControl.d.ts +0 -14
  143. package/declaration/control/SnapControl.d.ts +0 -16
  144. package/declaration/control/StrictControl.d.ts +0 -20
  145. package/declaration/control/states/State.d.ts +0 -47
  146. package/declaration/core/AnchorPoint.d.ts +0 -15
  147. package/declaration/core/FlickingError.d.ts +0 -5
  148. package/declaration/core/Viewport.d.ts +0 -25
  149. package/declaration/core/VirtualManager.d.ts +0 -37
  150. package/declaration/core/index.d.ts +0 -6
  151. package/declaration/core/panel/Panel.d.ts +0 -89
  152. package/declaration/core/panel/VirtualPanel.d.ts +0 -19
  153. package/declaration/core/panel/index.d.ts +0 -5
  154. package/declaration/index.d.ts +0 -16
  155. package/declaration/reactive/index.d.ts +0 -25
  156. package/declaration/renderer/Renderer.d.ts +0 -60
  157. package/declaration/type/event.d.ts +0 -88
  158. package/declaration/type/external.d.ts +0 -31
  159. package/jsconfig.json +0 -5
  160. package/jsdoc-to-mdx.json +0 -7
  161. package/rollup.config.demo.js +0 -24
  162. package/rollup.config.dev.js +0 -12
  163. package/rollup.config.js +0 -57
  164. package/src/const/error.ts +0 -64
  165. package/src/const/external.ts +0 -138
  166. package/src/type/event.ts +0 -315
  167. package/src/type/external.ts +0 -78
  168. package/tsconfig.declaration.json +0 -17
  169. package/tsconfig.eslint.json +0 -10
  170. package/tsconfig.json +0 -23
  171. package/{declaration → dist}/camera/index.d.ts +0 -0
  172. package/{declaration → dist}/camera/mode/index.d.ts +2 -2
  173. package/{declaration → dist}/cfc/getRenderingPanels.d.ts +0 -0
  174. package/{declaration → dist}/cfc/index.d.ts +3 -3
  175. package/{declaration → dist}/cfc/sync.d.ts +0 -0
  176. package/{declaration → dist}/control/index.d.ts +7 -7
  177. package/{declaration → dist}/core/ResizeWatcher.d.ts +0 -0
  178. package/{declaration → dist}/core/panel/provider/ElementProvider.d.ts +0 -0
  179. package/{declaration → dist}/core/panel/provider/index.d.ts +0 -0
  180. package/{declaration → dist}/index.cjs.d.ts +0 -0
  181. package/{declaration → dist}/index.umd.d.ts +0 -0
  182. package/{declaration → dist}/renderer/index.d.ts +1 -1
  183. package/{declaration → dist}/renderer/strategy/VirtualRenderingStrategy.d.ts +1 -1
  184. package/{declaration → dist}/renderer/strategy/index.d.ts +1 -1
  185. /package/{declaration/type → dist/types}/internal.d.ts +0 -0
@@ -0,0 +1,1231 @@
1
+ import Component from "@egjs/component";
2
+ import { Camera } from "./camera";
3
+ import { ALIGN, CIRCULAR_FALLBACK, DIRECTION, MOVE_TYPE } from "./constants/values";
4
+ import { Control } from "./control";
5
+ import AutoResizer from "./core/AutoResizer";
6
+ import { Panel } from "./core/panel";
7
+ import Viewport from "./core/Viewport";
8
+ import VirtualManager, { VirtualOptions } from "./core/VirtualManager";
9
+ import { FlickingEvents } from "./event/types";
10
+ import { ExternalRenderer, Renderer, RendererOptions } from "./renderer";
11
+ import { ElementLike, MoveTypeOptions, Plugin, Status } from "./types/external";
12
+ import { LiteralUnion, ValueOf } from "./types/internal";
13
+ /**
14
+ * Options for the Flicking component
15
+ * @public
16
+ */
17
+ export interface FlickingOptions {
18
+ /**
19
+ * Align position of the panels within viewport. You can set different values each for the panel and camera.
20
+ * @remarks
21
+ * Possible values include
22
+ *
23
+ * - literal strings ("prev", "center", "next")
24
+ *
25
+ * - percentage values ("0%", "25%")
26
+ *
27
+ * - pixel values ("0px", "100px")
28
+ *
29
+ * - arithmetic expressions ("50% - 25px")
30
+ *
31
+ * - numbers
32
+ *
33
+ * - an object with separate `panel` and `camera` alignment values
34
+ *
35
+ * @example
36
+ * ```ts
37
+ * const possibleOptions = [
38
+ * // Literal strings
39
+ * "prev", "center", "next",
40
+ * // % values, applied to both panel & camera
41
+ * "0%", "25%", "42%",
42
+ * // px values, arithmetic calculation with (+/-) is also allowed.
43
+ * "0px", "100px", "50% - 25px",
44
+ * // numbers, same to number + px ("0px", "100px")
45
+ * 0, 100, 1000,
46
+ * // Setting a different value for panel & camera
47
+ * { panel: "10%", camera: "25%" }
48
+ * ];
49
+ *
50
+ * possibleOptions.forEach(align => {
51
+ * new Flicking("#el", { align });
52
+ * });
53
+ * ```
54
+ * @accepts {@link ALIGN}
55
+ * @defaultValue "center"
56
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/alignment | Demo: Alignment}
57
+ */
58
+ align: LiteralUnion<ValueOf<typeof ALIGN>> | number | {
59
+ panel: number | string;
60
+ camera: number | string;
61
+ };
62
+ /**
63
+ * Index of the panel to move when Flicking's {@link Flicking.init | init()} is called. A zero-based integer.
64
+ * @defaultValue 0
65
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/default-index | Demo: Default Index}
66
+ */
67
+ defaultIndex: number;
68
+ /**
69
+ * Direction of panel movement. `true` for horizontal, `false` for vertical.
70
+ *
71
+ * @remarks
72
+ * In vanilla JS, you must manually add the `vertical` class to the viewport element when using vertical mode.
73
+ * React and Vue wrappers add this class automatically.
74
+ *
75
+ * @example
76
+ * ```ts
77
+ * // Vanilla JS: add "vertical" class to the viewport element
78
+ * // <div class="flicking-viewport vertical">
79
+ * // <div class="flicking-camera">...</div>
80
+ * // </div>
81
+ * const flicking = new Flicking("#my-flicking", {
82
+ * horizontal: false
83
+ * });
84
+ * ```
85
+ *
86
+ * @defaultValue true
87
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/vertical | Demo: Vertical}
88
+ */
89
+ horizontal: boolean;
90
+ /**
91
+ * Enables circular (continuous loop) mode, which connects first/last panel for continuous scrolling.
92
+ * @dependency Mutual Exclusive - {@link FlickingOptions.bound | bound}. When both are true, circular takes precedence and bound will be ignored.
93
+ * @dependency Conditional - Total panel size must be ≥ viewport size. If not met, automatically falls back to {@link FlickingOptions.circularFallback | circularFallback} mode.
94
+ * @dependency Related - {@link FlickingOptions.circularFallback | circularFallback} determines fallback behavior when circular cannot be enabled
95
+ *
96
+ * @defaultValue false
97
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/circular | Demo: Circular}
98
+ */
99
+ circular: boolean;
100
+ /**
101
+ * Set panel control mode for the case when circular cannot be enabled.
102
+ * @dependency Requires - Only takes effect when {@link FlickingOptions.circular | circular} is true but activation requirements are not met (total panel size < viewport size)
103
+ *
104
+ * @remarks
105
+ * - "linear": The view's range is set from the top of the first panel to the top of the last panel.
106
+ * - "bound": Prevents the view from going out of the first/last panel, hiding empty spaces.
107
+ *
108
+ * @accepts {@link CIRCULAR_FALLBACK}
109
+ * @defaultValue "linear"
110
+ *
111
+ * @since 4.5.0
112
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/circular | Demo: Circular}
113
+ */
114
+ circularFallback: LiteralUnion<ValueOf<typeof CIRCULAR_FALLBACK>>;
115
+ /**
116
+ * Prevent the view (camera element) from going out of the first/last panel.
117
+ * @dependency Mutual Exclusive - {@link FlickingOptions.circular | circular}. When circular is true, this option is ignored.
118
+ * @dependency Related - Works with {@link FlickingOptions.bounce | bounce} for bounce effect at boundaries
119
+ *
120
+ * @defaultValue false
121
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/bound | Demo: Bound}
122
+ */
123
+ bound: boolean;
124
+ /**
125
+ * Update height of the viewport element after movement same to the height of the panel below.
126
+ * @dependency Conditional - Only works when {@link FlickingOptions.horizontal | horizontal} is true. When horizontal is false, this option has no effect.
127
+ *
128
+ * @defaultValue false
129
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/adaptive | Demo: Adaptive}
130
+ */
131
+ adaptive: boolean;
132
+ /**
133
+ * A visible number of panels on viewport. Enabling this option will force the panel to resize.
134
+ * @remarks
135
+ * When set to -1, automatically calculates based on panel sizes.
136
+ *
137
+ * @dependency Related - Affects how {@link FlickingOptions.align | align} calculates panel positions
138
+ * @dependency Requires - Required for {@link FlickingOptions.virtual | virtual} to work (must be > 0)
139
+ * @dependency Related - Works with {@link FlickingOptions.noPanelStyleOverride | noPanelStyleOverride} to prevent style modifications
140
+ *
141
+ * @defaultValue -1
142
+ *
143
+ * @since 4.2.0
144
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/panels-per-view | Demo: Panels Per View}
145
+ */
146
+ panelsPerView: number;
147
+ /**
148
+ * When enabled, prevents modifying the panel's `width/height` styles when {@link Flicking.panelsPerView | panelsPerView} is enabled.
149
+ * Enabling this option can improve performance if you are manually managing all panel sizes.
150
+ * @defaultValue false
151
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/panels-per-view | Demo: Panels Per View}
152
+ */
153
+ noPanelStyleOverride: boolean;
154
+ /**
155
+ * When enabled, automatically calls {@link Flicking.resize} when images/videos inside Flicking panels are loaded.
156
+ * This is useful when Flicking contains content that changes size before and after loading.
157
+ * @defaultValue false
158
+ * @since 4.3.0
159
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/resize-on-contents-ready | Demo: Resize On Contents Ready}
160
+ */
161
+ resizeOnContentsReady: boolean;
162
+ /**
163
+ * Enable nested Flicking mode to allow parent Flicking to move when reaching boundaries.
164
+ * @remarks
165
+ * When Flicking is nested inside another Flicking, enabling this option allows the parent
166
+ * Flicking to move in the same direction after the nested Flicking reaches the first or last panel.
167
+ *
168
+ * This option is not required if the parent and nested Flicking have different horizontal options.
169
+ *
170
+ * @defaultValue false
171
+ *
172
+ * @since 4.7.0
173
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/nested | Demo: Nested}
174
+ */
175
+ nested: boolean;
176
+ /**
177
+ * A threshold from the viewport edge to trigger the `needPanel` event.
178
+ * @defaultValue 0
179
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/infinite-scroll | Demo: Infinite Scroll}
180
+ */
181
+ needPanelThreshold: number;
182
+ /**
183
+ * When enabled, disables events before the `ready` event during initialization.
184
+ * @defaultValue true
185
+ * @since 4.2.0
186
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/auto-init | Demo: Auto Init}
187
+ */
188
+ preventEventsBeforeInit: boolean;
189
+ /**
190
+ * Deceleration of panel movement animation with momentum applied by user interaction (input).
191
+ * Higher values result in a shorter animation duration.
192
+ * @defaultValue 0.0075
193
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/deceleration | Demo: Deceleration}
194
+ */
195
+ deceleration: number;
196
+ /**
197
+ * Default duration of the animation in milliseconds.
198
+ * @defaultValue 500
199
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/duration | Demo: Duration}
200
+ */
201
+ duration: number;
202
+ /**
203
+ * An easing function applied to the panel movement animation.
204
+ * @defaultValue "easeOutCubic" (x => 1 - Math.pow(1 - x, 3))
205
+ * @see {@link http://easings.net/ | Easing Functions Cheat Sheet}
206
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/easing | Demo: Easing}
207
+ */
208
+ easing: (x: number) => number;
209
+ /**
210
+ * Types of input devices to enable.
211
+ * @defaultValue ["touch", "mouse"]
212
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/input-type | Demo: Input Type}
213
+ */
214
+ inputType: string[];
215
+ /**
216
+ * Movement style by user input. Determines the instance type of {@link Flicking.control | control}.
217
+ * @remarks
218
+ * - "snap": Uses {@link SnapControl}
219
+ *
220
+ * - "freeScroll": Uses {@link FreeControl} with {@link FreeControlOptions}
221
+ *
222
+ * - "strict": Uses {@link StrictControl} with {@link StrictControlOptions}
223
+ * @accepts {@link MOVE_TYPE}
224
+ * @example
225
+ * ```ts
226
+ * import Flicking, { MOVE_TYPE } from "@egjs/flicking";
227
+ *
228
+ * const flicking = new Flicking({
229
+ * moveType: MOVE_TYPE.SNAP
230
+ * });
231
+ * ```
232
+ *
233
+ * ```ts
234
+ * const flicking = new Flicking({
235
+ * // If you want more specific settings for the moveType
236
+ * // [moveType, options for that moveType]
237
+ * // In this case, it's ["freeScroll", FreeControlOptions]
238
+ * moveType: [MOVE_TYPE.FREE_SCROLL, { stopAtEdge: true }]
239
+ * });
240
+ * ```
241
+ * @defaultValue "snap"
242
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/movement-types | Demo: Movement Types}
243
+ */
244
+ moveType: ValueOf<typeof MOVE_TYPE> | MoveTypeOptions<ValueOf<typeof MOVE_TYPE>>;
245
+ /**
246
+ * Movement threshold to change panels (unit: px). Panels will only change after scrolling beyond this value.
247
+ * @defaultValue 40
248
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/threshold | Demo: Threshold}
249
+ */
250
+ threshold: number;
251
+ /**
252
+ * Minimum distance to recognize user input (unit: px). Panels will only move after scrolling beyond this value.
253
+ * @defaultValue 1
254
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/threshold | Demo: Threshold}
255
+ */
256
+ dragThreshold: number;
257
+ /**
258
+ * The minimum distance for animation to proceed.
259
+ * @remarks
260
+ * If the distance to be moved is less than `animationThreshold`, the movement proceeds immediately without animation (duration: 0).
261
+ * @defaultValue 0.5
262
+ * @since 4.15.0
263
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/animation-threshold | Demo: Animation Threshold}
264
+ */
265
+ animationThreshold: number;
266
+ /**
267
+ * Using `useCSSOrder` does not change the DOM order, but the `order` CSS property changes the order on the screen.
268
+ * @remarks
269
+ * When `circular` is used, the DOM order changes depending on the position.
270
+ * When using `iframe`, you can prevent reloading when the DOM order changes.
271
+ * In svelte, CSS order is always used.
272
+ * @defaultValue false
273
+ * @since 4.15.0
274
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/use-css-order | Demo: CSS Order}
275
+ */
276
+ useCSSOrder: boolean;
277
+ /**
278
+ * Allows stopping animations with user click/touch input.
279
+ * @defaultValue true
280
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/interruptable | Demo: Interruptable}
281
+ */
282
+ interruptable: boolean;
283
+ /**
284
+ * The size value of the bounce area.
285
+ * @dependency Conditional - Only can be enabled when {@link FlickingOptions.circular | circular} is false
286
+ * @dependency Related - Works with {@link FlickingOptions.bound | bound} to provide bounce effect at panel boundaries
287
+ *
288
+ * @remarks
289
+ * You can set different bounce value for prev/next direction by using array.
290
+ * Use `number` for px value, and `string` for px or % value relative to viewport size.
291
+ * You have to call {@link Control.updateInput | updateInput()} after changing this value to take effect.
292
+ *
293
+ * @example
294
+ * ```ts
295
+ * const possibleOptions = [
296
+ * "0%", "25%", "42%", // % values
297
+ * "0px", "100px", "50% - 25px", // px values with arithmetic
298
+ * 0, 100, 1000 // numbers (same as px)
299
+ * ];
300
+ * ```
301
+ *
302
+ * @defaultValue "20%"
303
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/bound | Demo: Bound}
304
+ */
305
+ bounce: number | string | [number | string, number | string];
306
+ /**
307
+ * Size of the area from the right edge in iOS Safari (in px) that enables swipe-back or swipe-forward.
308
+ * @defaultValue 30
309
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/input-type | Demo: Input Type}
310
+ */
311
+ iOSEdgeSwipeThreshold: number;
312
+ /**
313
+ * Automatically cancels {@link https://developer.mozilla.org/ko/docs/Web/API/Element/click_event | click} events when the user drags the viewport by any amount.
314
+ * @defaultValue true
315
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/prevent-click | Demo: Prevent Click}
316
+ */
317
+ preventClickOnDrag: boolean;
318
+ /**
319
+ * Whether to use the {@link https://developer.mozilla.org/ko/docs/Web/API/Event/preventDefault | preventDefault} when the user starts dragging
320
+ * @defaultValue false
321
+ * @since 4.11.0
322
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/prevent-click | Demo: Prevent Click}
323
+ */
324
+ preventDefaultOnDrag: boolean;
325
+ /**
326
+ * Automatically call {@link Flicking.disableInput | disableInput()} during initialization.
327
+ * @defaultValue false
328
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/disable-input | Demo: Disable Input}
329
+ */
330
+ disableOnInit: boolean;
331
+ /**
332
+ * Change active panel index on mouse/touch hold while animating.
333
+ * @remarks
334
+ * `index` of the `willChange`/`willRestore` event will be used as new index.
335
+ * @defaultValue false
336
+ * @since 4.8.0
337
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/interruptable | Demo: Interruptable}
338
+ */
339
+ changeOnHold: boolean;
340
+ /**
341
+ * When enabled, only renders visible panels. Can significantly improve performance with many panels.
342
+ * @defaultValue false
343
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/render-only-visible | Demo: Render Only Visible}
344
+ */
345
+ renderOnlyVisible: boolean;
346
+ /**
347
+ * When enabled, restricts the number of panel elements to `panelsPerView + 1` to reduce memory usage.
348
+ * @dependency Requires - Must be used with {@link FlickingOptions.panelsPerView | panelsPerView}. When panelsPerView is -1 (auto), this option is ignored.
349
+ *
350
+ * @remarks
351
+ * After Flicking initialization, this property can be used to add or remove the number of rendered panels.
352
+ *
353
+ * The option object contains:
354
+ * - `renderPanel`: A rendering function for the panel element's innerHTML
355
+ * - `initialPanelCount`: Initial panel count to render
356
+ * - `cache` (optional, default: false): Whether to cache rendered panel's innerHTML
357
+ * - `panelClass` (optional, default: "flicking-panel"): The class name for rendered panel elements
358
+ *
359
+ * @example
360
+ * ```ts
361
+ * import Flicking, { VirtualPanel } from "@egjs/flicking";
362
+ *
363
+ * const flicking = new Flicking("#some_el", {
364
+ * panelsPerView: 3,
365
+ * virtual: {
366
+ * renderPanel: (panel: VirtualPanel, index: number) => `Panel ${index}`,
367
+ * initialPanelCount: 100
368
+ * }
369
+ * });
370
+ *
371
+ * // Add 100 virtual panels (at the end)
372
+ * flicking.virtual.append(100);
373
+ *
374
+ * // Remove 100 virtual panels from 0 to 100
375
+ * flicking.virtual.remove(0, 100);
376
+ * ```
377
+ *
378
+ * @defaultValue null
379
+ *
380
+ * @since 4.4.0
381
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/virtual-scroll | Demo: Virtual Scroll}
382
+ */
383
+ virtual: VirtualOptions | null;
384
+ /**
385
+ * Call {@link Flicking.init | init()} automatically when creating Flicking's instance.
386
+ * @defaultValue true
387
+ * @readonly
388
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/basic/auto-init | Demo: Auto Init}
389
+ */
390
+ autoInit: boolean;
391
+ /**
392
+ * Whether to automatically call {@link Flicking.resize | resize()} when the viewport element (.flicking-viewport) size is changed.
393
+ * @defaultValue true
394
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/auto-resize | Demo: Auto Resize}
395
+ */
396
+ autoResize: boolean;
397
+ /**
398
+ * Whether to listen {@link https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver | ResizeObserver}'s event instead of Window's {@link https://developer.mozilla.org/ko/docs/Web/API/Window/resize_event | resize} event when using the `autoResize` option
399
+ * @defaultValue true
400
+ * @since 4.4.0
401
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/auto-resize | Demo: Auto Resize}
402
+ */
403
+ useResizeObserver: boolean;
404
+ /**
405
+ * Delays size recalculation from `autoResize` by the given time in milliseconds.
406
+ * @remarks
407
+ * If the size is changed again while being delayed, it cancels the previous one and delays from the beginning again.
408
+ * This can increase performance by preventing `resize` being called too often.
409
+ * @defaultValue 0
410
+ * @since 4.6.0
411
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/resize-debounce | Demo: Resize Debounce}
412
+ */
413
+ resizeDebounce: number;
414
+ /**
415
+ * Whether to use ResizeObserver to observe the size of the panel element.
416
+ * @dependency Conditional - Only available when {@link FlickingOptions.useResizeObserver | useResizeObserver} is enabled
417
+ *
418
+ * @remarks
419
+ * This option guarantees that the resize event is triggered when the size of the panel element is changed.
420
+ *
421
+ * @since 4.13.1
422
+ * @defaultValue false
423
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/observe-panel-resize | Demo: Observe Panel Resize}
424
+ */
425
+ observePanelResize: boolean;
426
+ /**
427
+ * The maximum time for size recalculation delay when using `resizeDebounce`, in milliseconds.
428
+ * @remarks
429
+ * This guarantees that size recalculation is performed at least once every (n)ms.
430
+ * @defaultValue 100
431
+ * @since 4.6.0
432
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/resize-debounce | Demo: Resize Debounce}
433
+ */
434
+ maxResizeDebounce: number;
435
+ /**
436
+ * By enabling this, Flicking will calculate all internal size with CSS width computed with getComputedStyle.
437
+ * @remarks
438
+ * This can prevent 1px offset issue in some cases where panel size has the fractional part.
439
+ * All sizes will have the original size before CSS {@link https://developer.mozilla.org/en-US/docs/Web/CSS/transform | transform} is applied on the element.
440
+ * @defaultValue false
441
+ * @since 4.9.0
442
+ * @see {@link https://naver.github.io/egjs-flicking/docs/demos/advanced/fractional-size | Demo: Fractional Size}
443
+ */
444
+ useFractionalSize: boolean;
445
+ /**
446
+ * This is an option for the frameworks (React, Vue, Angular, ...).
447
+ * Don't set it as it's automatically managed by Flicking.
448
+ * @defaultValue null
449
+ * @internal
450
+ * @readonly
451
+ */
452
+ externalRenderer: ExternalRenderer | null;
453
+ /**
454
+ * This option works only when autoResize is set to true.
455
+ * @internal
456
+ * @defaultValue false
457
+ */
458
+ optimizeSizeUpdate: boolean;
459
+ /**
460
+ * @deprecated Use {@link FlickingOptions.externalRenderer | externalRenderer} instead
461
+ */
462
+ renderExternal: {
463
+ renderer: new (options: RendererOptions) => ExternalRenderer;
464
+ rendererOptions: RendererOptions;
465
+ } | null;
466
+ }
467
+ /**
468
+ * Parameters for {@link Flicking.getStatus}
469
+ * @public
470
+ */
471
+ export interface GetStatusParams {
472
+ /**
473
+ * Include current panel index
474
+ * @defaultValue true
475
+ */
476
+ index?: boolean;
477
+ /**
478
+ * Include camera position. Only works when {@link FlickingOptions.moveType | moveType} is `freeScroll`
479
+ * @defaultValue true
480
+ */
481
+ position?: boolean;
482
+ /**
483
+ * Include panel's `outerHTML`
484
+ * @defaultValue false
485
+ */
486
+ includePanelHTML?: boolean;
487
+ /**
488
+ * Include only visible panels' HTML. Only available when `includePanelHTML` is `true`
489
+ * @defaultValue false
490
+ */
491
+ visiblePanelsOnly?: boolean;
492
+ }
493
+ declare class Flicking extends Component<FlickingEvents> {
494
+ /**
495
+ * Version info string
496
+ * @example
497
+ * ```ts
498
+ * Flicking.VERSION; // ex) 4.0.0
499
+ * ```
500
+ */
501
+ static readonly VERSION: string;
502
+ private _viewport;
503
+ private _autoResizer;
504
+ private _camera;
505
+ private _control;
506
+ private _renderer;
507
+ private _virtualManager;
508
+ private _align;
509
+ private _defaultIndex;
510
+ private _horizontal;
511
+ private _circular;
512
+ private _circularFallback;
513
+ private _bound;
514
+ private _adaptive;
515
+ private _panelsPerView;
516
+ private _noPanelStyleOverride;
517
+ private _resizeOnContentsReady;
518
+ private _virtual;
519
+ private _nested;
520
+ private _needPanelThreshold;
521
+ private _preventEventsBeforeInit;
522
+ private _deceleration;
523
+ private _duration;
524
+ private _easing;
525
+ private _inputType;
526
+ private _moveType;
527
+ private _threshold;
528
+ private _dragThreshold;
529
+ private _animationThreshold;
530
+ private _useCSSOrder;
531
+ private _interruptable;
532
+ private _bounce;
533
+ private _iOSEdgeSwipeThreshold;
534
+ private _preventClickOnDrag;
535
+ private _preventDefaultOnDrag;
536
+ private _disableOnInit;
537
+ private _changeOnHold;
538
+ private _renderOnlyVisible;
539
+ private _autoInit;
540
+ private _autoResize;
541
+ private _useResizeObserver;
542
+ private _resizeDebounce;
543
+ private _observePanelResize;
544
+ private _maxResizeDebounce;
545
+ private _useFractionalSize;
546
+ private _externalRenderer;
547
+ private _renderExternal;
548
+ private _optimizeSizeUpdate;
549
+ private _initialized;
550
+ private _plugins;
551
+ private _isResizing;
552
+ private _scheduleResize;
553
+ /**
554
+ * {@link Control} instance that manages user input and panel movement animations
555
+ * @remarks
556
+ * The concrete Control implementation is selected based on {@link FlickingOptions.moveType | moveType} option.
557
+ * @privateRemarks
558
+ * The control instance is created during construction by {@link Flicking._createControl}.
559
+ * @readonly
560
+ */
561
+ get control(): Control;
562
+ /**
563
+ * {@link Camera} instance that manages actual movement and positioning inside the viewport
564
+ * @remarks
565
+ * The concrete Camera implementation is selected based on {@link FlickingOptions.circular} and {@link FlickingOptions.bound} options.
566
+ * @privateRemarks
567
+ * The camera instance is created during construction by {@link Flicking._createCamera}.
568
+ * @readonly
569
+ */
570
+ get camera(): Camera;
571
+ /**
572
+ * {@link Renderer} instance that manages panels and their elements
573
+ * @remarks
574
+ * The concrete Renderer implementation is selected based on {@link Flicking.externalRenderer} and {@link FlickingOptions.virtual} options.
575
+ * @privateRemarks
576
+ * The renderer instance is created during construction by {@link Flicking._createRenderer}.
577
+ * @readonly
578
+ */
579
+ get renderer(): Renderer;
580
+ /**
581
+ * {@link Viewport} instance that manages viewport size and element
582
+ * @privateRemarks
583
+ * The viewport instance is created during construction by {@link Flicking} constructor.
584
+ * @readonly
585
+ */
586
+ get viewport(): Viewport;
587
+ /**
588
+ * {@link AutoResizer} instance that detects size changes and triggers resize when {@link FlickingOptions.autoResize | autoResize} option is enabled
589
+ * @privateRemarks
590
+ * The autoResizer instance is created during construction by {@link Flicking} constructor.
591
+ * @readonly
592
+ */
593
+ get autoResizer(): AutoResizer;
594
+ /**
595
+ * Whether Flicking's {@link Flicking.init} is called.
596
+ * @remarks
597
+ * This is `true` when {@link Flicking.init} is called, and is `false` after calling {@link Flicking.destroy}.
598
+ * Use this to check if Flicking is ready before calling certain methods that require initialization.
599
+ * @defaultValue false
600
+ * @readonly
601
+ * @example
602
+ * ```ts
603
+ * if (flicking.initialized) {
604
+ * flicking.setStatus(status);
605
+ * } else {
606
+ * await flicking.init();
607
+ * flicking.setStatus(status);
608
+ * }
609
+ * ```
610
+ */
611
+ get initialized(): boolean;
612
+ /**
613
+ * Whether the circular mode is actually enabled.
614
+ * @remarks
615
+ * The {@link FlickingOptions.circular} option may not be enabled when the sum of panel sizes is too small.
616
+ * This property reflects the actual enabled state, which may differ from the {@link FlickingOptions.circular} option value.
617
+ * @defaultValue false
618
+ * @readonly
619
+ */
620
+ get circularEnabled(): boolean;
621
+ /**
622
+ * Whether the virtual mode is actually enabled.
623
+ * @remarks
624
+ * The {@link FlickingOptions.virtual} option may not be enabled when {@link FlickingOptions.panelsPerView} is less than or equal to zero.
625
+ * This property reflects the actual enabled state, which may differ from the {@link FlickingOptions.virtual} option value.
626
+ * @defaultValue false
627
+ * @readonly
628
+ */
629
+ get virtualEnabled(): boolean;
630
+ /**
631
+ * Index of the currently active panel.
632
+ * @remarks
633
+ * Returns -1 when there is no active panel. This is a shorthand for `Flicking.currentPanel.index`.
634
+ * @readonly
635
+ */
636
+ get index(): number;
637
+ /**
638
+ * The root viewport element (`.flicking-viewport`).
639
+ * @remarks
640
+ * This is the element passed to the Flicking constructor. It is a shorthand for `Flicking.viewport.element`.
641
+ * @readonly
642
+ */
643
+ get element(): HTMLElement;
644
+ /**
645
+ * The currently active panel.
646
+ * @remarks
647
+ * Returns `null` when there is no active panel. This is a shorthand for `Flicking.control.activePanel`.
648
+ * @readonly
649
+ */
650
+ get currentPanel(): Panel | null;
651
+ /**
652
+ * Array of all panels.
653
+ * @remarks
654
+ * This is a shorthand for `Flicking.renderer.panels`.
655
+ * @readonly
656
+ */
657
+ get panels(): Panel[];
658
+ /**
659
+ * Total number of panels.
660
+ * @remarks
661
+ * This is a shorthand for `Flicking.renderer.panelCount`.
662
+ * @readonly
663
+ */
664
+ get panelCount(): number;
665
+ /**
666
+ * Array of panels that are currently visible in the viewport.
667
+ * @remarks
668
+ * This is a shorthand for `Flicking.camera.visiblePanels`.
669
+ * @readonly
670
+ */
671
+ get visiblePanels(): Panel[];
672
+ /**
673
+ * Whether Flicking is currently animating.
674
+ * @remarks
675
+ * This is a shorthand for `Flicking.control.animating`.
676
+ * @readonly
677
+ */
678
+ get animating(): boolean;
679
+ /**
680
+ * Whether the user is currently clicking or touching the viewport.
681
+ * @remarks
682
+ * This is a shorthand for `Flicking.control.holding`.
683
+ * @readonly
684
+ */
685
+ get holding(): boolean;
686
+ /**
687
+ * Array of currently activated plugins.
688
+ * @remarks
689
+ * Plugins are added via {@link Flicking.addPlugins} and removed via {@link Flicking.removePlugins}.
690
+ * @readonly
691
+ */
692
+ get activePlugins(): Plugin[];
693
+ /** Current value of the {@link FlickingOptions.align | align} option. */
694
+ get align(): FlickingOptions["align"];
695
+ /** Current value of the {@link FlickingOptions.defaultIndex | defaultIndex} option. */
696
+ get defaultIndex(): FlickingOptions["defaultIndex"];
697
+ /** Current value of the {@link FlickingOptions.horizontal | horizontal} option. */
698
+ get horizontal(): FlickingOptions["horizontal"];
699
+ /** Current value of the {@link FlickingOptions.circular | circular} option. */
700
+ get circular(): FlickingOptions["circular"];
701
+ /**
702
+ * Current value of the {@link FlickingOptions.circularFallback | circularFallback} option.
703
+ * @since 4.5.0
704
+ */
705
+ get circularFallback(): FlickingOptions["circularFallback"];
706
+ /** Current value of the {@link FlickingOptions.bound | bound} option. */
707
+ get bound(): FlickingOptions["bound"];
708
+ /** Current value of the {@link FlickingOptions.adaptive | adaptive} option. */
709
+ get adaptive(): FlickingOptions["adaptive"];
710
+ /**
711
+ * Current value of the {@link FlickingOptions.panelsPerView | panelsPerView} option.
712
+ * @since 4.2.0
713
+ */
714
+ get panelsPerView(): FlickingOptions["panelsPerView"];
715
+ /** Current value of the {@link FlickingOptions.noPanelStyleOverride | noPanelStyleOverride} option. */
716
+ get noPanelStyleOverride(): FlickingOptions["noPanelStyleOverride"];
717
+ /**
718
+ * Current value of the {@link FlickingOptions.resizeOnContentsReady | resizeOnContentsReady} option.
719
+ * @since 4.3.0
720
+ */
721
+ get resizeOnContentsReady(): FlickingOptions["resizeOnContentsReady"];
722
+ /**
723
+ * Current value of the {@link FlickingOptions.nested | nested} option.
724
+ * @since 4.7.0
725
+ */
726
+ get nested(): FlickingOptions["nested"];
727
+ /** Current value of the {@link FlickingOptions.needPanelThreshold | needPanelThreshold} option. */
728
+ get needPanelThreshold(): FlickingOptions["needPanelThreshold"];
729
+ /**
730
+ * Current value of the {@link FlickingOptions.preventEventsBeforeInit | preventEventsBeforeInit} option.
731
+ * @since 4.2.0
732
+ */
733
+ get preventEventsBeforeInit(): FlickingOptions["preventEventsBeforeInit"];
734
+ /** Current value of the {@link FlickingOptions.deceleration | deceleration} option. */
735
+ get deceleration(): FlickingOptions["deceleration"];
736
+ /** Current value of the {@link FlickingOptions.easing | easing} option. */
737
+ get easing(): FlickingOptions["easing"];
738
+ /** Current value of the {@link FlickingOptions.duration | duration} option. */
739
+ get duration(): FlickingOptions["duration"];
740
+ /** Current value of the {@link FlickingOptions.inputType | inputType} option. */
741
+ get inputType(): FlickingOptions["inputType"];
742
+ /** Current value of the {@link FlickingOptions.moveType | moveType} option. */
743
+ get moveType(): FlickingOptions["moveType"];
744
+ /** Current value of the {@link FlickingOptions.threshold | threshold} option. */
745
+ get threshold(): FlickingOptions["threshold"];
746
+ /** Current value of the {@link FlickingOptions.dragThreshold | dragThreshold} option. */
747
+ get dragThreshold(): FlickingOptions["dragThreshold"];
748
+ /**
749
+ * Current value of the {@link FlickingOptions.animationThreshold | animationThreshold} option.
750
+ * @since 4.15.0
751
+ */
752
+ get animationThreshold(): FlickingOptions["animationThreshold"];
753
+ /**
754
+ * Current value of the {@link FlickingOptions.useCSSOrder | useCSSOrder} option.
755
+ * @since 4.15.0
756
+ */
757
+ get useCSSOrder(): FlickingOptions["useCSSOrder"];
758
+ /** Current value of the {@link FlickingOptions.interruptable | interruptable} option. */
759
+ get interruptable(): FlickingOptions["interruptable"];
760
+ /** Current value of the {@link FlickingOptions.bounce | bounce} option. */
761
+ get bounce(): FlickingOptions["bounce"];
762
+ /** Current value of the {@link FlickingOptions.iOSEdgeSwipeThreshold | iOSEdgeSwipeThreshold} option. */
763
+ get iOSEdgeSwipeThreshold(): FlickingOptions["iOSEdgeSwipeThreshold"];
764
+ /** Current value of the {@link FlickingOptions.preventClickOnDrag | preventClickOnDrag} option. */
765
+ get preventClickOnDrag(): FlickingOptions["preventClickOnDrag"];
766
+ /**
767
+ * Current value of the {@link FlickingOptions.preventDefaultOnDrag | preventDefaultOnDrag} option.
768
+ * @since 4.11.0
769
+ */
770
+ get preventDefaultOnDrag(): FlickingOptions["preventDefaultOnDrag"];
771
+ /** Current value of the {@link FlickingOptions.disableOnInit | disableOnInit} option. */
772
+ get disableOnInit(): FlickingOptions["disableOnInit"];
773
+ /**
774
+ * Current value of the {@link FlickingOptions.changeOnHold | changeOnHold} option.
775
+ * @since 4.8.0
776
+ */
777
+ get changeOnHold(): FlickingOptions["changeOnHold"];
778
+ /** Current value of the {@link FlickingOptions.renderOnlyVisible | renderOnlyVisible} option. */
779
+ get renderOnlyVisible(): FlickingOptions["renderOnlyVisible"];
780
+ /**
781
+ * {@link VirtualManager} instance that manages virtual panels
782
+ * @privateRemarks
783
+ * The virtualManager instance is created during construction by {@link Flicking} constructor.
784
+ * @readonly
785
+ */
786
+ get virtual(): VirtualManager;
787
+ /** Current value of the {@link FlickingOptions.autoInit | autoInit} option. */
788
+ get autoInit(): FlickingOptions["autoInit"];
789
+ /** Current value of the {@link FlickingOptions.autoResize | autoResize} option. */
790
+ get autoResize(): FlickingOptions["autoResize"];
791
+ /**
792
+ * Current value of the {@link FlickingOptions.useResizeObserver | useResizeObserver} option.
793
+ * @since 4.4.0
794
+ */
795
+ get useResizeObserver(): FlickingOptions["useResizeObserver"];
796
+ /**
797
+ * Current value of the {@link FlickingOptions.observePanelResize | observePanelResize} option.
798
+ * @since 4.13.1
799
+ */
800
+ get observePanelResize(): FlickingOptions["observePanelResize"];
801
+ /**
802
+ * Current value of the {@link FlickingOptions.resizeDebounce | resizeDebounce} option.
803
+ * @since 4.6.0
804
+ */
805
+ get resizeDebounce(): FlickingOptions["resizeDebounce"];
806
+ /**
807
+ * Current value of the {@link FlickingOptions.maxResizeDebounce | maxResizeDebounce} option.
808
+ * @since 4.6.0
809
+ */
810
+ get maxResizeDebounce(): FlickingOptions["maxResizeDebounce"];
811
+ /**
812
+ * Current value of the {@link FlickingOptions.useFractionalSize | useFractionalSize} option.
813
+ * @since 4.9.0
814
+ */
815
+ get useFractionalSize(): FlickingOptions["useFractionalSize"];
816
+ /** Current value of the {@link FlickingOptions.externalRenderer | externalRenderer} option. */
817
+ get externalRenderer(): FlickingOptions["externalRenderer"];
818
+ /**
819
+ * @deprecated Use {@link Flicking.externalRenderer | externalRenderer} instead.
820
+ * Current value of the {@link FlickingOptions.renderExternal | renderExternal} option.
821
+ */
822
+ get renderExternal(): FlickingOptions["renderExternal"];
823
+ /** @internal */
824
+ get optimizeSizeUpdate(): FlickingOptions["optimizeSizeUpdate"];
825
+ /**
826
+ * Sets {@link FlickingOptions.align}.
827
+ * @privateRemarks
828
+ * Setting this value updates the renderer and camera alignment, and triggers a resize operation.
829
+ */
830
+ set align(val: FlickingOptions["align"]);
831
+ set defaultIndex(val: FlickingOptions["defaultIndex"]);
832
+ /**
833
+ * Sets {@link FlickingOptions.horizontal}.
834
+ * @privateRemarks
835
+ * Setting this value updates the control direction and triggers a resize operation.
836
+ */
837
+ set horizontal(val: FlickingOptions["horizontal"]);
838
+ /**
839
+ * Sets {@link FlickingOptions.circular}.
840
+ * @privateRemarks
841
+ * Setting this value triggers a resize operation to recalculate panel positions.
842
+ */
843
+ set circular(val: FlickingOptions["circular"]);
844
+ /**
845
+ * Sets {@link FlickingOptions.bound}.
846
+ * @privateRemarks
847
+ * Setting this value triggers a resize operation to recalculate panel positions.
848
+ */
849
+ set bound(val: FlickingOptions["bound"]);
850
+ /**
851
+ * Sets {@link FlickingOptions.adaptive}.
852
+ * @privateRemarks
853
+ * Setting this value triggers a resize operation to recalculate panel sizes.
854
+ */
855
+ set adaptive(val: FlickingOptions["adaptive"]);
856
+ /**
857
+ * Sets {@link FlickingOptions.panelsPerView}.
858
+ * @privateRemarks
859
+ * Setting this value triggers a resize operation to recalculate panel sizes.
860
+ */
861
+ set panelsPerView(val: FlickingOptions["panelsPerView"]);
862
+ /**
863
+ * Sets {@link FlickingOptions.noPanelStyleOverride}.
864
+ * @privateRemarks
865
+ * Setting this value triggers a resize operation to update panel styles.
866
+ */
867
+ set noPanelStyleOverride(val: FlickingOptions["noPanelStyleOverride"]);
868
+ /**
869
+ * Sets {@link FlickingOptions.resizeOnContentsReady}.
870
+ * @privateRemarks
871
+ * When set to `true`, immediately checks all panels for content readiness.
872
+ */
873
+ set resizeOnContentsReady(val: FlickingOptions["resizeOnContentsReady"]);
874
+ /**
875
+ * Sets {@link FlickingOptions.nested}.
876
+ * @privateRemarks
877
+ * Setting this value updates the control's axes options.
878
+ */
879
+ set nested(val: FlickingOptions["nested"]);
880
+ set needPanelThreshold(val: FlickingOptions["needPanelThreshold"]);
881
+ set preventEventsBeforeInit(val: FlickingOptions["preventEventsBeforeInit"]);
882
+ /**
883
+ * Sets {@link FlickingOptions.deceleration}.
884
+ * @privateRemarks
885
+ * Setting this value updates the control's axes deceleration option.
886
+ */
887
+ set deceleration(val: FlickingOptions["deceleration"]);
888
+ /**
889
+ * Sets {@link FlickingOptions.easing}.
890
+ * @privateRemarks
891
+ * Setting this value updates the control's axes easing option.
892
+ */
893
+ set easing(val: FlickingOptions["easing"]);
894
+ set duration(val: FlickingOptions["duration"]);
895
+ /**
896
+ * Sets {@link FlickingOptions.inputType}.
897
+ * @privateRemarks
898
+ * Setting this value updates the control's pan input options.
899
+ */
900
+ set inputType(val: FlickingOptions["inputType"]);
901
+ /**
902
+ * Sets {@link FlickingOptions.moveType}.
903
+ * @privateRemarks
904
+ * Setting this value creates a new Control instance based on the moveType and preserves the current panel position and progress.
905
+ */
906
+ set moveType(val: FlickingOptions["moveType"]);
907
+ set threshold(val: FlickingOptions["threshold"]);
908
+ /**
909
+ * Sets {@link FlickingOptions.dragThreshold}.
910
+ * @privateRemarks
911
+ * Setting this value updates the control's pan input threshold option.
912
+ */
913
+ set dragThreshold(val: FlickingOptions["dragThreshold"]);
914
+ /**
915
+ * Sets {@link FlickingOptions.animationThreshold}.
916
+ */
917
+ set animationThreshold(val: FlickingOptions["animationThreshold"]);
918
+ /**
919
+ * Sets {@link FlickingOptions.useCSSOrder}.
920
+ */
921
+ set useCSSOrder(val: FlickingOptions["useCSSOrder"]);
922
+ /**
923
+ * Sets {@link FlickingOptions.interruptable}.
924
+ * @privateRemarks
925
+ * Setting this value updates the control's axes interruptable option.
926
+ */
927
+ set interruptable(val: FlickingOptions["interruptable"]);
928
+ /**
929
+ * Sets {@link FlickingOptions.bounce}.
930
+ * @privateRemarks
931
+ * Setting this value updates the control input configuration.
932
+ */
933
+ set bounce(val: FlickingOptions["bounce"]);
934
+ /**
935
+ * Sets {@link FlickingOptions.iOSEdgeSwipeThreshold}.
936
+ * @privateRemarks
937
+ * Setting this value updates the control's pan input iOS edge swipe threshold option.
938
+ */
939
+ set iOSEdgeSwipeThreshold(val: FlickingOptions["iOSEdgeSwipeThreshold"]);
940
+ /**
941
+ * Sets {@link FlickingOptions.preventClickOnDrag}.
942
+ * @privateRemarks
943
+ * Setting this value adds or removes the prevent click handler from the control.
944
+ */
945
+ set preventClickOnDrag(val: FlickingOptions["preventClickOnDrag"]);
946
+ /**
947
+ * Sets {@link FlickingOptions.preventDefaultOnDrag}.
948
+ * @privateRemarks
949
+ * Setting this value updates the control's pan input preventDefaultOnDrag option.
950
+ */
951
+ set preventDefaultOnDrag(val: FlickingOptions["preventDefaultOnDrag"]);
952
+ set disableOnInit(val: FlickingOptions["disableOnInit"]);
953
+ set changeOnHold(val: FlickingOptions["changeOnHold"]);
954
+ /**
955
+ * Sets {@link FlickingOptions.renderOnlyVisible}.
956
+ * @privateRemarks
957
+ * Setting this value triggers an immediate render operation.
958
+ */
959
+ set renderOnlyVisible(val: FlickingOptions["renderOnlyVisible"]);
960
+ /**
961
+ * Sets {@link FlickingOptions.autoResize}.
962
+ * @privateRemarks
963
+ * Setting this value enables or disables the auto resizer if Flicking is already initialized.
964
+ */
965
+ set autoResize(val: FlickingOptions["autoResize"]);
966
+ /**
967
+ * Sets {@link FlickingOptions.useResizeObserver}.
968
+ * @privateRemarks
969
+ * Setting this value re-enables the auto resizer if Flicking is initialized and autoResize is enabled.
970
+ */
971
+ set useResizeObserver(val: FlickingOptions["useResizeObserver"]);
972
+ /**
973
+ * Sets {@link FlickingOptions.observePanelResize}.
974
+ * @privateRemarks
975
+ * Setting this value starts or stops observing panel sizes if Flicking is initialized and autoResize is enabled.
976
+ */
977
+ set observePanelResize(val: FlickingOptions["observePanelResize"]);
978
+ set optimizeSizeUpdate(val: FlickingOptions["optimizeSizeUpdate"]);
979
+ /** Creates a new Flicking instance
980
+ * @param root - A root HTMLElement to initialize Flicking on it. When it's a typeof `string`, it should be a css selector string
981
+ * @param options - A {@link FlickingOptions} object
982
+ * @throws {@link InitializationErrors}
983
+ * @example
984
+ * ```ts
985
+ * import Flicking from "@egjs/flicking";
986
+ *
987
+ * // Creating new instance of Flicking with HTMLElement
988
+ * const flicking = new Flicking(document.querySelector(".flicking-viewport"), { circular: true });
989
+ *
990
+ * // Creating new instance of Flicking with CSS selector
991
+ * const flicking2 = new Flicking(".flicking-viewport", { circular: true });
992
+ * ```
993
+ */
994
+ constructor(root: HTMLElement | string, options?: Partial<FlickingOptions>);
995
+ /**
996
+ * Initialize Flicking and move to the default index.
997
+ * @remarks
998
+ * This method is automatically called in the constructor when {@link FlickingOptions.autoInit | autoInit} is `true` (default).
999
+ * If Flicking is already initialized, this method returns immediately without doing anything.
1000
+ * @fires {@link ReadyEvent}
1001
+ * @returns Promise that resolves when initialization is complete
1002
+ */
1003
+ init(): Promise<void>;
1004
+ /**
1005
+ * Destroy Flicking and remove all event handlers.
1006
+ * @remarks
1007
+ * This method cleans up all resources including event handlers, components, and plugins.
1008
+ * After calling this method, {@link Flicking.initialized} will be `false` and the instance should not be used.
1009
+ */
1010
+ destroy(): void;
1011
+ /**
1012
+ * Move to the previous panel (current index - 1).
1013
+ * @param duration - Duration of the panel movement animation (unit: ms). Defaults to {@link FlickingOptions.duration}
1014
+ * @fires {@link MovementEvents}
1015
+ * @throws {@link MovementErrors}
1016
+ * @returns Promise that resolves after reaching the previous panel
1017
+ */
1018
+ prev(duration?: number): Promise<void>;
1019
+ /**
1020
+ * Move to the next panel (current index + 1).
1021
+ * @param duration - Duration of the panel movement animation (unit: ms). Defaults to {@link FlickingOptions.duration}
1022
+ * @fires {@link MovementEvents}
1023
+ * @throws {@link MovementErrors}
1024
+ * @returns Promise that resolves after reaching the next panel
1025
+ */
1026
+ next(duration?: number): Promise<void>;
1027
+ /**
1028
+ * Move to the panel with the given index.
1029
+ * @param index - The index of the panel to move to
1030
+ * @param duration - Duration of the animation (unit: ms). Defaults to {@link FlickingOptions.duration}
1031
+ * @param direction - Direction to move (circular mode only). Defaults to {@link DIRECTION.NONE}
1032
+ * @fires {@link MovementEvents}
1033
+ * @throws {@link MovementErrors}
1034
+ * @returns Promise that resolves after reaching the target panel
1035
+ */
1036
+ moveTo(index: number, duration?: number, direction?: ValueOf<typeof DIRECTION>): Promise<void>;
1037
+ /**
1038
+ * Change the destination and duration of the animation currently playing.
1039
+ * @remarks
1040
+ * This method does nothing if no animation is currently playing.
1041
+ * @param index - The index of the panel to move to
1042
+ * @param duration - Duration of the animation (unit: ms)
1043
+ * @param direction - Direction to move. Only available when {@link FlickingOptions.circular} is enabled
1044
+ * @since 4.10.0
1045
+ * @throws {@link AnimationUpdateErrors}
1046
+ */
1047
+ updateAnimation(index: number, duration?: number, direction?: ValueOf<typeof DIRECTION>): void;
1048
+ /**
1049
+ * Stop the animation currently playing.
1050
+ * @remarks
1051
+ * This method does nothing if no animation is currently playing.
1052
+ * @since 4.10.0
1053
+ * @fires {@link MoveEndEvent}
1054
+ */
1055
+ stopAnimation(): void;
1056
+ /**
1057
+ * Get the panel at the given index.
1058
+ * @param index - The index of the panel to get
1059
+ * @returns The panel at the given index, or `null` if it doesn't exist. This is a shorthand for `Flicking.renderer.getPanel(index)`.
1060
+ * @example
1061
+ * ```ts
1062
+ * const panel = flicking.getPanel(0);
1063
+ * // Which is a shorthand to...
1064
+ * const samePanel = flicking.panels[0];
1065
+ * ```
1066
+ */
1067
+ getPanel(index: number): Panel | null;
1068
+ /**
1069
+ * Enable user input (mouse/touch).
1070
+ * @remarks
1071
+ * This is a shorthand for `Flicking.control.enable`.
1072
+ * @returns The current instance for method chaining
1073
+ */
1074
+ enableInput(): this;
1075
+ /**
1076
+ * Disable user input (mouse/touch).
1077
+ * @remarks
1078
+ * This is a shorthand for `Flicking.control.disable`.
1079
+ * @returns The current instance for method chaining
1080
+ */
1081
+ disableInput(): this;
1082
+ /**
1083
+ * Get the current Flicking status.
1084
+ * @param options - {@link GetStatusParams}
1085
+ * @returns Status object that can be used with {@link Flicking.setStatus} to restore the state
1086
+ */
1087
+ getStatus(options?: GetStatusParams): Status;
1088
+ /**
1089
+ * Restore Flicking to the state of the given {@link Status}.
1090
+ * @param status - {@link Status}
1091
+ * @throws {@link StatusRestoreErrors}
1092
+ */
1093
+ setStatus(status: Status): void;
1094
+ /**
1095
+ * Add plugins to Flicking.
1096
+ * @remarks
1097
+ * Plugins are automatically initialized if Flicking is already initialized.
1098
+ * @param plugins - {@link Plugin}
1099
+ * @returns The current instance for method chaining
1100
+ * @see https://github.com/naver/egjs-flicking-plugins
1101
+ */
1102
+ addPlugins(...plugins: Plugin[]): this;
1103
+ /**
1104
+ * Remove plugins from Flicking.
1105
+ * @param plugins - {@link Plugin}
1106
+ * @returns The current instance for method chaining
1107
+ * @see https://github.com/naver/egjs-flicking-plugins
1108
+ */
1109
+ removePlugins(...plugins: Plugin[]): this;
1110
+ /**
1111
+ * Update viewport and panel sizes.
1112
+ * @remarks
1113
+ * This method does nothing if a resize is already in progress.
1114
+ * @fires {@link ResizeEvents}
1115
+ * @returns Promise that resolves when resize is complete
1116
+ */
1117
+ resize(): Promise<void>;
1118
+ /**
1119
+ * Add new panels after the last panel.
1120
+ * @param element - A new HTMLElement, outerHTML string, or an array of both
1121
+ * @throws {@link DOMManipulationErrors}
1122
+ * @returns Array of appended panels
1123
+ * @example
1124
+ * ```ts
1125
+ * const flicking = new Flicking("#flick");
1126
+ * flicking.append(document.createElement("div"));
1127
+ * flicking.append("<div>Panel</div>");
1128
+ * flicking.append(["<div>Panel</div>", document.createElement("div")]);
1129
+ * ```
1130
+ */
1131
+ append(element: ElementLike | ElementLike[]): Panel[];
1132
+ /**
1133
+ * Add new panels before the first panel.
1134
+ * @remarks
1135
+ * This will increase the index of existing panels by the number of panels added.
1136
+ * @param element - A new HTMLElement, outerHTML string, or an array of both
1137
+ * @throws {@link DOMManipulationErrors}
1138
+ * @returns Array of prepended panels
1139
+ * @example
1140
+ * ```ts
1141
+ * const flicking = new Flicking("#flick");
1142
+ * flicking.prepend(document.createElement("div"));
1143
+ * flicking.prepend("<div>Panel</div>");
1144
+ * flicking.prepend(["<div>Panel</div>", document.createElement("div")]);
1145
+ * ```
1146
+ */
1147
+ prepend(element: ElementLike | ElementLike[]): Panel[];
1148
+ /**
1149
+ * Insert new panels at the given index.
1150
+ * @remarks
1151
+ * This will increase the index of panels at or after the given index by the number of panels added.
1152
+ * @param index - Index to insert new panels at
1153
+ * @param element - A new HTMLElement, outerHTML string, or an array of both
1154
+ * @throws {@link DOMManipulationErrors}
1155
+ * @returns Array of inserted panels
1156
+ * @example
1157
+ * ```ts
1158
+ * const flicking = new Flicking("#flick");
1159
+ * flicking.insert(0, document.createElement("div"));
1160
+ * flicking.insert(2, "<div>Panel</div>");
1161
+ * flicking.insert(1, ["<div>Panel</div>", document.createElement("div")]);
1162
+ * ```
1163
+ */
1164
+ insert(index: number, element: ElementLike | ElementLike[]): Panel[];
1165
+ /**
1166
+ * Remove panels starting from the given index.
1167
+ * @remarks
1168
+ * This will decrease the index of panels after the removed ones by the number of panels removed.
1169
+ * @param index - Index of the first panel to remove
1170
+ * @param deleteCount - Number of panels to remove. Defaults to `1`
1171
+ * @throws {@link DOMManipulationErrors}
1172
+ * @returns Array of removed panels
1173
+ */
1174
+ remove(index: number, deleteCount?: number): Panel[];
1175
+ /**
1176
+ * Factory method to create the appropriate Control implementation based on moveType option.
1177
+ * @internal
1178
+ * @privateRemarks
1179
+ * Called during constructor and when moveType option is changed. The moveType option must be set before calling this method.
1180
+ * Throws error if moveType is invalid.
1181
+ */
1182
+ private _createControl;
1183
+ /**
1184
+ * Factory method to create Camera instance for managing viewport movement and positioning.
1185
+ * @internal
1186
+ * @privateRemarks
1187
+ * Called during constructor. The align option must be set before calling this method.
1188
+ * Warns if both circular and bound options are enabled (bound is ignored).
1189
+ */
1190
+ private _createCamera;
1191
+ /**
1192
+ * Factory method to create the appropriate Renderer implementation based on externalRenderer and virtual options.
1193
+ * @internal
1194
+ * @privateRemarks
1195
+ * Called during constructor. Selects ExternalRenderer if externalRenderer is provided, otherwise creates VanillaRenderer or ExternalRenderer based on renderExternal option.
1196
+ * Warns if virtual is enabled without panelsPerView.
1197
+ */
1198
+ private _createRenderer;
1199
+ /**
1200
+ * Factory method to create ExternalRenderer from renderExternal option (deprecated).
1201
+ * @internal
1202
+ * @privateRemarks
1203
+ * Called by _createRenderer when renderExternal option is set. The renderExternal option must not be null and must contain renderer class and options.
1204
+ */
1205
+ private _createExternalRenderer;
1206
+ /**
1207
+ * Factory method to create VanillaRenderer for vanilla JavaScript rendering.
1208
+ * @internal
1209
+ * @privateRemarks
1210
+ * Called by _createRenderer when neither externalRenderer nor renderExternal is set.
1211
+ * Uses VirtualRenderingStrategy if virtual is enabled, otherwise NormalRenderingStrategy.
1212
+ */
1213
+ private _createVanillaRenderer;
1214
+ /**
1215
+ * Move camera to the initial panel position based on defaultIndex option.
1216
+ * @internal
1217
+ * @privateRemarks
1218
+ * Called during init() method, after _initialResize(). Requires camera, renderer, and control to be already initialized.
1219
+ * Throws error if the initial panel position is not reachable.
1220
+ */
1221
+ private _moveToInitialPanel;
1222
+ /**
1223
+ * Calculate initial viewport and panel sizes during initialization.
1224
+ * @internal
1225
+ * @privateRemarks
1226
+ * Called during init() method, before _moveToInitialPanel(). This is separate from the regular resize() to avoid triggering events before initialization is complete.
1227
+ * Requires viewport, renderer, camera, and control to be already initialized. Triggers BEFORE_RESIZE and AFTER_RESIZE events.
1228
+ */
1229
+ private _initialResize;
1230
+ }
1231
+ export default Flicking;