@egjs/flicking 4.15.0 → 4.16.0-beta.1

package/rollup.config.dev.js

@@ -1,12 +0,0 @@
-const buildHelper = require("./config/build-helper");
-
-export default buildHelper([
-  {
-    name: "Flicking",
-    input: "./src/index.umd.ts",
-    output: "./dist/flicking.pkgd.js",
-    format: "umd",
-    resolve: true
-  }
-]);
-

package/rollup.config.js

@@ -1,57 +0,0 @@
-/* eslint-disable @typescript-eslint/no-var-requires */
-
-const buildHelper = require("./config/build-helper");
-
-const external = {
-  "@egjs/axes": "eg.Axes",
-  "@egjs/component": "eg.Component",
-  "@egjs/imready": "eg.ImReady"
-};
-const name = "Flicking";
-
-export default buildHelper([
-  {
-    name,
-    input: "./src/index.umd.ts",
-    output: "./dist/flicking.js",
-    format: "umd",
-    external
-  },
-  {
-    name,
-    input: "./src/index.umd.ts",
-    output: "./dist/flicking.min.js",
-    format: "umd",
-    uglify: true,
-    external
-  },
-  {
-    name,
-    input: "./src/index.umd.ts",
-    output: "./dist/flicking.pkgd.js",
-    format: "umd",
-    resolve: true
-  },
-  {
-    name,
-    input: "./src/index.umd.ts",
-    output: "./dist/flicking.pkgd.min.js",
-    format: "umd",
-    resolve: true,
-    uglify: true
-  },
-  {
-    input: "./src/index.ts",
-    output: "./dist/flicking.esm.js",
-    format: "esm",
-    external,
-    exports: "named"
-  },
-  {
-    input: "./src/index.cjs.ts",
-    output: "./dist/flicking.cjs.js",
-    format: "cjs",
-    exports: "named",
-  }
-]);
-

package/src/const/error.ts

@@ -1,64 +0,0 @@
-/*
- * Copyright (c) 2015 NAVER Corp.
- * egjs projects are licensed under the MIT license
- */
-/* eslint-disable @typescript-eslint/restrict-template-expressions */
-
-/**
- * Error codes of {@link FlickingError}. Below are the conditions where each error code occurs.
- * @ko {@link FlickingError}의 에러 코드. 아래는 각각의 에러 코드가 발생하는 조건입니다.
- * @name ERROR_CODE
- * @constant
- * @type object
- * @property {number} WRONG_TYPE Parameter type is wrong<ko>패러미터의 타입이 잘못되었을 경우</ko>
- * @property {number} ELEMENT_NOT_FOUND Element is not found inside page with the given CSS selector<ko>주어진 CSS selector로 페이지 내에서 해당 엘리먼트를 찾지 못했을 경우</ko>
- * @property {number} VAL_MUST_NOT_NULL Expected non-null value, but given `null` or `undefined`<ko>값을 기대했으나, `null`이나 `undefined`를 받은 경우</ko>
- * @property {number} NOT_ATTACHED_TO_FLICKING When Flicking's component is not initialized (i.e. {@link Flicking#init} is not called)<ko>Flicking 내부 컴포넌트가 초기화되지 않은 경우 ({@link Flicking#init}이 호출되지 않은 경우)</ko>
- * @property {number} WRONG_OPTION One of the options is wrong<ko>옵션들 중 잘못된 값이 있을 때</ko>
- * @property {number} INDEX_OUT_OF_RANGE When the given index is out of possible range<ko>인덱스가 주어진 범위를 벗어난 경우</ko>
- * @property {number} POSITION_NOT_REACHABLE When {@link Control#moveToPosition}'s position parameter is out of possible range.<ko>{@link Control#moveToPosition}의 `position` 패러미터가 도달 가능한 범위를 벗어난 경우</ko>
- * @property {number} TRANSFORM_NOT_SUPPORTED CSS `transform` property is not available(<=IE8) <ko>CSS `transform` 속성을 사용할 수 없는 경우(<=IE8)</ko>
- * @property {number} STOP_CALLED_BY_USER When the event's `stop()` is called by user.<ko>사용자에 의해 이벤트의 `stop()`이 호출된 경우</ko>
- * @property {number} ANIMATION_INTERRUPTED When the animation is interrupted by user.<ko>사용자에 의해 애니메이션이 중단된 경우</ko>
- * @property {number} ANIMATION_ALREADY_PLAYING When the animation is already playing.<ko>현재 애니메이션이 이미 진행중인 경우</ko>
- * @property {number} NOT_ALLOWED_IN_FRAMEWORK When the non-allowed method is called from frameworks (React, Angular, Vue...)
- * <ko>프레임워크(React, Angular, Vue ...)에서 사용 불가능한 메소드를 호출했을 경우</ko>
- * @property {number} NOT_INITIALIZED When the {@link Flicking#init} is not called before but is needed<ko>{@link Flicking#init}의 호출이 필요하나, 아직 호출되지 않았을 경우</ko>
- * @property {number} NO_ACTIVE When there're no active panel that flicking has selected. This may be due to the absence of any panels<ko>현재 Flicking이 선택한 패널이 없을 경우. 일반적으로 패널이 하나도 없는 경우에 발생할 수 있습니다</ko>
- * @property {number} NOT_ALLOWED_IN_VIRTUAL When the non-allowed method is called while the virtual option is enabled<ko>virtual 옵션이 활성화된 상태에서 사용 불가능한 메소드가 호출되었을 경우</ko>
- */
-export const CODE = {
-  WRONG_TYPE: 0,
-  ELEMENT_NOT_FOUND: 1,
-  VAL_MUST_NOT_NULL: 2,
-  NOT_ATTACHED_TO_FLICKING: 3,
-  WRONG_OPTION: 4,
-  INDEX_OUT_OF_RANGE: 5,
-  POSITION_NOT_REACHABLE: 6,
-  TRANSFORM_NOT_SUPPORTED: 7,
-  STOP_CALLED_BY_USER: 8,
-  ANIMATION_INTERRUPTED: 9,
-  ANIMATION_ALREADY_PLAYING: 10,
-  NOT_ALLOWED_IN_FRAMEWORK: 11,
-  NOT_INITIALIZED: 12,
-  NO_ACTIVE: 13,
-  NOT_ALLOWED_IN_VIRTUAL: 14
-} as const;
-
-export const MESSAGE = {
-  WRONG_TYPE: (wrongVal: any, correctTypes: string[]) => `${wrongVal}(${typeof wrongVal}) is not a ${correctTypes.map(type => `"${type}"`).join(" or ")}.`,
-  ELEMENT_NOT_FOUND: (selector: string) => `Element with selector "${selector}" not found.`,
-  VAL_MUST_NOT_NULL: (val: any, name: string) => `${name} should be provided. Given: ${val}`,
-  NOT_ATTACHED_TO_FLICKING: "This module is not attached to the Flicking instance. \"init()\" should be called first.",
-  WRONG_OPTION: (optionName: string, val: any) => `Option "${optionName}" is not in correct format, given: ${val}`,
-  INDEX_OUT_OF_RANGE: (val: number, min: number, max: number) => `Index "${val}" is out of range: should be between ${min} and ${max}.`,
-  POSITION_NOT_REACHABLE: (position: number) => `Position "${position}" is not reachable.`,
-  TRANSFORM_NOT_SUPPORTED: "Browser does not support CSS transform.",
-  STOP_CALLED_BY_USER: "Event stop() is called by user.",
-  ANIMATION_INTERRUPTED: "Animation is interrupted by user input.",
-  ANIMATION_ALREADY_PLAYING: "Animation is already playing.",
-  NOT_ALLOWED_IN_FRAMEWORK: "This behavior is not allowed in the frameworks like React, Vue, or Angular.",
-  NOT_INITIALIZED: "Flicking is not initialized yet, call init() first.",
-  NO_ACTIVE: "There's no active panel that Flicking has selected. This may be due to the absence of any panels.",
-  NOT_ALLOWED_IN_VIRTUAL: "This behavior is not allowed when the virtual option is enabled"
-} as const;

package/src/const/external.ts

@@ -1,138 +0,0 @@
-/*
- * Copyright (c) 2015 NAVER Corp.
- * egjs projects are licensed under the MIT license
- */
-export { CODE as ERROR_CODE } from "./error";
-
-/**
- * Event type object with event name strings of {@link Flicking}
- * @ko {@link Flicking}의 이벤트 이름 문자열들을 담은 객체
- * @type {object}
- * @property {"holdStart"} HOLD_START holdStart event<ko>holdStart 이벤트</ko>
- * @property {"holdEnd"} HOLD_END holdEnd event<ko>holdEnd 이벤트</ko>
- * @property {"moveStart"} MOVE_START moveStart event<ko>moveStart 이벤트</ko>
- * @property {"move"} MOVE move event<ko>move 이벤트</ko>
- * @property {"moveEnd"} MOVE_END moveEnd event<ko>moveEnd 이벤트</ko>
- * @property {"willChange"} WILL_CHANGE willChange event<ko>willChange 이벤트</ko>
- * @property {"changed"} CHANGED changed event<ko>changed 이벤트</ko>
- * @property {"willRestore"} WILL_RESTORE willRestore event<ko>willRestore 이벤트</ko>
- * @property {"restored"} RESTORED restored event<ko>restored 이벤트</ko>
- * @property {"select"} SELECT select event<ko>select 이벤트</ko>
- * @property {"needPanel"} NEED_PANEL needPanel event<ko>needPanel 이벤트</ko>
- * @property {"panelChange"} PANEL_CHANGE panelChange event<ko>panelChange 이벤트</ko>
- * @example
- * ```ts
- * import { EVENTS } from "@egjs/flicking";
- * EVENTS.MOVE_START; // "moveStart"
- * ```
- */
-export const EVENTS = {
-  READY: "ready",
-  BEFORE_RESIZE: "beforeResize",
-  AFTER_RESIZE: "afterResize",
-  HOLD_START: "holdStart",
-  HOLD_END: "holdEnd",
-  MOVE_START: "moveStart",
-  MOVE: "move",
-  MOVE_END: "moveEnd",
-  WILL_CHANGE: "willChange",
-  CHANGED: "changed",
-  WILL_RESTORE: "willRestore",
-  RESTORED: "restored",
-  SELECT: "select",
-  NEED_PANEL: "needPanel",
-  VISIBLE_CHANGE: "visibleChange",
-  REACH_EDGE: "reachEdge",
-  PANEL_CHANGE: "panelChange"
-} as const;
-
-/**
- * An object with all possible predefined literal string for the {@link Flicking#align align} option
- * @ko {@link Flicking#align align} 옵션에 사용되는 미리 정의된 리터럴 상수들을 담고 있는 객체
- * @type {object}
- * @property {"prev"} PREV left/top align<ko>좌/상 정렬</ko>
- * @property {"center"} CENTER center align<ko>중앙 정렬</ko>
- * @property {"next"} NEXT right/bottom align<ko>우/하 정렬</ko>
- */
-export const ALIGN = {
-  PREV: "prev",
-  CENTER: "center",
-  NEXT: "next"
-} as const;
-
-/**
- * An object of directions
- * @ko 방향을 나타내는 값들을 담고 있는 객체
- * @type {object}
- * @property {"PREV"} PREV "left" when {@link Flicking#horizontal horizontal} is true, and "top" when {@link Flicking#horizontal horizontal} is false
- * <ko>{@link Flicking#horizontal horizontal}가 `true`일 경우 왼쪽, {@link Flicking#horizontal horizontal}가 `false`일 경우 위쪽을 의미합니다</ko>
- * @property {"NEXT"} NEXT "right" when {@link Flicking#horizontal horizontal} is true, and "bottom" when {@link Flicking#horizontal horizontal} is false
- * <ko>{@link Flicking#horizontal horizontal}가 `true`일 경우 오른쪽, {@link Flicking#horizontal horizontal}가 `false`일 경우 아래쪽을 의미합니다</ko>
- * @property {null} NONE This value usually means it's the same position<ko>주로 제자리인 경우를 의미합니다</ko>
- */
-export const DIRECTION = {
-  PREV: "PREV",
-  NEXT: "NEXT",
-  NONE: null
-} as const;
-
-/**
- * An object with all possible {@link Flicking#moveType moveType}s
- * @ko Flicking이 제공하는 {@link Flicking#moveType moveType}들을 담고 있는 객체
- * @type {object}
- * @property {"snap"} SNAP Flicking's {@link Flicking#moveType moveType} that enables {@link SnapControl} as a Flicking's {@link Flicking#control control}
- * <ko>Flicking의 {@link Flicking#control control}을 {@link SnapControl}로 설정하게 하는 {@link Flicking#moveType moveType}</ko>
- * @property {"freeScroll"} FREE_SCROLL Flicking's {@link Flicking#moveType moveType} that enables {@link FreeControl} as a Flicking's {@link Flicking#control control}
- * <ko>Flicking의 {@link Flicking#control control}을 {@link FreeControl}로 설정하게 하는 {@link Flicking#moveType moveType}</ko>
- * @property {"strict"} STRICT Flicking's {@link Flicking#moveType moveType} that enables {@link StrictControl} as a Flicking's {@link Flicking#control control}
- * <ko>Flicking의 {@link Flicking#control control}을 {@link StrictControl}로 설정하게 하는 {@link Flicking#moveType moveType}</ko>
- */
-export const MOVE_TYPE = {
-  SNAP: "snap",
-  FREE_SCROLL: "freeScroll",
-  STRICT: "strict"
-} as const;
-
-export const CLASS = {
-  VIEWPORT: "flicking-viewport",
-  CAMERA: "flicking-camera",
-  VERTICAL: "vertical",
-  HIDDEN: "flicking-hidden",
-  DEFAULT_VIRTUAL: "flicking-panel"
-};
-
-/**
- * An object with all possible {@link Flicking#circularFallback circularFallback}s
- * @ko Flicking의 {@link Flicking#circularFallback circularFallback}에 설정 가능한 값들을 담고 있는 객체
- * @type {object}
- * @property {string} LINEAR "linear"
- * @property {string} BOUND "bound"
- */
-export const CIRCULAR_FALLBACK = {
-  LINEAR: "linear",
-  BOUND: "bound"
-} as const;
-
-/**
- * An object for identifying {@link https://developer.mozilla.org/en-US/docs/Web/CSS/direction direction} CSS property applied to the camera element(`.flicking-camera`)
- * @ko 카메라 엘리먼트(`.flicking-camera`)에 적용된 {@link https://developer.mozilla.org/en-US/docs/Web/CSS/direction direction} CSS 속성을 구분하기 위한 객체
- * @type {object}
- * @property {string} LTR "ltr"
- * @property {string} RTL "rtl"
- */
-export const ORDER = {
-  LTR: "ltr",
-  RTL: "rtl"
-} as const;
-
-/**
- * An object that contains the direction that {@link Flicking} is moving
- * @ko {@link Flicking}이 움직이는 방향을 담고 있는 객체
- * @type {object}
- * @property {"horizontal"} HORIZONTAL horizontal<ko>수평 방향</ko>
- * @property {"vertical"} VERTICAL vertical<ko>수직 방향</ko>
- */
-export const MOVE_DIRECTION = {
-  HORIZONTAL: "horizontal",
-  VERTICAL: "vertical"
-} as const;

package/src/type/event.ts

@@ -1,315 +0,0 @@
-/* eslint-disable @typescript-eslint/ban-types */
-/*
- * Copyright (c) 2015 NAVER Corp.
- * egjs projects are licensed under the MIT license
- */
-import { OnChange, OnFinish, OnHold, OnRelease } from "@egjs/axes";
-import { ComponentEvent } from "@egjs/component";
-
-import Flicking from "../Flicking";
-import Panel from "../core/panel/Panel";
-import { EVENTS, DIRECTION } from "../const/external";
-import { ValueOf } from "../type/internal";
-
-/**
- * Event that fires when Flicking's {@link Flicking#init init()} is called
- * @ko Flicking의 {@link Flicking#init init()}이 호출되었을 때 발생하는 이벤트
- * @event Flicking#ready
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- */
-export type ReadyEvent<T extends Flicking = Flicking> = ComponentEvent<{}, typeof EVENTS["READY"], T>;
-
-/**
- * Event that fires when Flicking's {@link Flicking#resize resize()} is called, before updating the sizes of panels and viewport.
- * You can update the sizes of panels and viewport with this event, and it'll be applied after {@link Flicking#resize resize()} is finished.
- * @ko Flicking의 {@link Flicking#resize resize())}이 호출되었을 때 발생하는 이벤트로, 패널 및 뷰포트의 크기를 업데이트하기 전에 발생합니다.
- * 이 이벤트 단계에서 패널 및 뷰포트의 크기를 업데이트할 경우, 해당 크기가 최종적으로 반영됩니다.
- * @event Flicking#beforeResize
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {number} width Previous width of the viewport<ko>기존 뷰포트 너비</ko>
- * @property {number} height Previous height of the viewport<ko>기존 뷰포트 높이</ko>
- * @property {HTMLElement} element The viewport element<ko>뷰포트 엘리먼트</ko>
- */
-export interface BeforeResizeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["BEFORE_RESIZE"], T> {
-  width: number;
-  height: number;
-  element: HTMLElement;
-}
-
-/**
- * Event that fires when Flicking's {@link Flicking#resize resize()} is called, after updating the sizes of panels and viewport.
- * @ko Flicking의 {@link Flicking#resize resize())}이 호출되었을 때 발생하는 이벤트로, 패널 및 뷰포트의 크기를 업데이트한 이후에 발생합니다.
- * @event Flicking#afterResize
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {number} width New width of the viewport<ko>업데이트된 뷰포트 너비</ko>
- * @property {number} height New height of the viewport<ko>업데이트된 뷰포트 높이</ko>
- * @property {object} prev Previous size of the viewport<ko>기존 뷰포트 크기</ko>
- * @property {number} [prev.width] Previous width of the viewport<ko>기존 뷰포트 너비</ko>
- * @property {number} [prev.height] Previous height of the viewport<ko>기존 뷰포트 높이</ko>
- * @property {boolean} sizeChanged A Boolean value indicating whether the width/height of the viewport element is changed<ko>뷰포트 너비/크기가 변경되었는지 여부를 나타내는 값</ko>
- * @property {HTMLElement} element The viewport element<ko>뷰포트 엘리먼트</ko>
- */
-export interface AfterResizeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["AFTER_RESIZE"], T> {
-  width: number;
-  height: number;
-  prev: {
-    width: number;
-    height: number;
-  };
-  sizeChanged: boolean;
-  element: HTMLElement;
-}
-
-/**
- * Event that fires when user started dragging.
- * @ko 사용자가 드래그를 시작했을 때 발생하는 이벤트
- * @event Flicking#holdStart
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {function} stop Stop the event action and prevent user from dragging<ko>이벤트 동작을 멈추고, 사용자가 드래그하지 못하도록 막습니다.</ko>
- * @property {object} axesEvent {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:hold hold} event of {@link https://naver.github.io/egjs-axes/ Axes}
- * <ko>{@link https://naver.github.io/egjs-axes/ Axes}의 {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:hold hold} 이벤트</ko>
- */
-export interface HoldStartEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["HOLD_START"], T> {
-  axesEvent: OnHold;
-}
-
-/**
- * Event that fires when user stopped dragging.
- * @ko 사용자가 드래그를 끝냈을 때 발생하는 이벤트
- * @event Flicking#holdEnd
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {object} axesEvent {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:release release} event of {@link https://naver.github.io/egjs-axes/ Axes}
- * <ko>{@link https://naver.github.io/egjs-axes/ Axes}의 {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:release release} 이벤트</ko>
- */
-export interface HoldEndEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["HOLD_END"], T> {
-  axesEvent: OnRelease;
-}
-
-/**
- * Event that fires once before first {@link Flicking#event:move move} event
- * @ko 첫 번째 {@link Flicking#event:move move} 이벤트 직전에 단 한번 발생하는 이벤트
- * @event Flicking#moveStart
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {function} stop Stop the event action and prevent user from dragging<ko>이벤트 동작을 멈추고, 사용자가 드래그하지 못하도록 막습니다.</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {boolean} holding Boolean that indicates whether the user is dragging the viewport element<ko>사용자가 현재 viewport 엘리먼트를 드래그하고있는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction relative to previous position of the camera<ko>이전 카메라 위치 대비 이동 방향</ko>
- * @property {object} axesEvent {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:change change} event of {@link https://naver.github.io/egjs-axes/ Axes}
- * <ko>{@link https://naver.github.io/egjs-axes/ Axes}의 {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:change change} 이벤트</ko>
- */
-export interface MoveStartEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["MOVE_START"], T> {
-  isTrusted: boolean;
-  holding: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-  axesEvent: OnChange;
-}
-
-/**
- * Event that fires for every movement
- * @ko 이동시마다 발생하는 이벤트
- * @event Flicking#move
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {function} stop Stop the event action and prevent user from dragging<ko>이벤트 동작을 멈추고, 사용자가 드래그하지 못하도록 막습니다.</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {boolean} holding Boolean that indicates whether the user is dragging the viewport element<ko>사용자가 현재 viewport 엘리먼트를 드래그하고있는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction relative to previous position of the camera<ko>이전 카메라 위치 대비 이동 방향</ko>
- * @property {object} axesEvent {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:change change} event of {@link https://naver.github.io/egjs-axes/ Axes}
- * <ko>{@link https://naver.github.io/egjs-axes/ Axes}의 {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:change change} 이벤트</ko>
- */
-export interface MoveEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["MOVE"], T> {
-  isTrusted: boolean;
-  holding: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-  axesEvent: OnChange;
-}
-
-/**
- * Event that fires when the movement is finished by user input release or animation end.
- * @ko 사용자 입력 중단/애니메이션 종료 등 이동이 끝났을 때 발생하는 이벤트
- * @event Flicking#moveEnd
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {boolean} holding Boolean that indicates whether the user is dragging the viewport element<ko>사용자가 현재 viewport 엘리먼트를 드래그하고있는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction relative to previous position of the camera<ko>이전 카메라 위치 대비 이동 방향</ko>
- * @property {object} axesEvent {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:finish finish} event of {@link https://naver.github.io/egjs-axes/ Axes}
- * <ko>{@link https://naver.github.io/egjs-axes/ Axes}의 {@link https://naver.github.io/egjs-axes/release/latest/doc/eg.Axes.html#event:finish finish} 이벤트</ko>
- */
-export interface MoveEndEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["MOVE_END"], T> {
-  isTrusted: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-  axesEvent: OnFinish;
-}
-
-/**
- * Event that fires when Flicking's active index will be changed. Index will be changed at the {@link Flicking#event:changed changed} event.
- * It can be triggered when user finished input, or flicking start to move by method.
- * Calling `stop()` in event will prevent index change and camera movement.
- * @ko Flicking의 인덱스가 변경될 것임을 나타내는 이벤트. 실제 인덱스는 {@link Flicking#event:changed changed} 이벤트에서 변경된다.
- * 사용자가 입력을 마쳤을 때, 혹은 메소드를 통해 이동을 시작했을 때 발생한다.
- * 이벤트의 stop()을 호출시 인덱스 변경 및 패널로의 이동을 막는다.
- * @event Flicking#willChange
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {function} stop Stop the event action and prevent user from dragging<ko>이벤트 동작을 멈추고, 사용자가 드래그하지 못하도록 막습니다.</ko>
- * @property {number} index New active index<ko>변경할 인덱스</ko>
- * @property {Panel} panel New active panel<ko>인덱스 변경 이후 활성화된 패널로 설정할 패널</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction from the active panel to the target panel<ko>현재 활성화된 패널로부터 이동하고자 하는 패널의 방향</ko>
- */
-export interface WillChangeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["WILL_CHANGE"], T> {
-  index: number;
-  panel: Panel;
-  isTrusted: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-}
-
-/**
- * Event that fires when Flicking's index is changed.
- * @event Flicking#changed
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {number} index New index<ko>새 인덱스</ko>
- * @property {Panel} panel New active panel<ko>새로 선택된 패널</ko>
- * @property {number} prevIndex Previous index<ko>이전 인덱스</ko>
- * @property {Panel | null} prevPanel Previous active panel<ko>이전 패널</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction from the active panel to the target panel<ko>현재 활성화된 패널로부터 이동하고자 하는 패널의 방향</ko>
- */
-export interface ChangedEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["CHANGED"], T> {
-  index: number;
-  panel: Panel;
-  prevIndex: number;
-  prevPanel: Panel | null;
-  isTrusted: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-}
-
-/**
- * Event fires when user drag amount not reached {@link Flicking#threshold threshold} and is returning to {@link Flicking#currentPanel currentPanel}
- * @ko 사용자가 드래그하여 이동한 거리가 {@link Flicking#threshold threshold}에 도달하지 못해, 기존 {@link Flicking#currentPanel currentPanel}로 돌아갈 것임을 나타내는 이벤트
- * @event Flicking#willRestore
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {function} stop Stop the event action and prevent user from dragging<ko>이벤트 동작을 멈추고, 사용자가 드래그하지 못하도록 막습니다</ko>
- * @property {number} index Index of the panel to restore<ko>복귀하고자 하는 패널의 인덱스</ko>
- * @property {Panel} panel Panel to restore<ko>복귀하고자 하는 패널</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- * @property {DIRECTION} direction Moving direction relative to previous position of the camera<ko>이전 카메라 위치 대비 이동 방향</ko>
- */
-export interface WillRestoreEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["WILL_RESTORE"], T> {
-  index: number;
-  panel: Panel;
-  isTrusted: boolean;
-  direction: ValueOf<typeof DIRECTION>;
-}
-
-/**
- * Event that fires when Flicking has returned to {@link Flicking#currentPanel currentPanel}
- * @ko Flicking이 {@link Flicking#currentPanel currentPanel}의 위치로 다시 돌아왔을 때 발생하는 이벤트
- * @event Flicking#restored
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {boolean} isTrusted Boolean that indicates whether the event was generated by a user action<ko>이벤트가 사용자 입력에 의하여 발생되었는지를 나타내는 값</ko>
- */
-export interface RestoredEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["RESTORED"], T> {
-  isTrusted: boolean;
-}
-
-/**
- * Event that fires when panel is statically click / touched
- * @ko 패널이 정적으로 클릭(혹은 터치)되었을 때 발생하는 이벤트
- * @event Flicking#select
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {number} index Selected panel's index<ko>선택된 패널의 인덱스</ko>
- * @property {Panel} panel Selected panel<ko>선택된 패널</ko>
- * @property {DIRECTION} direction Direction from current camera position to the selected panel's position<ko>현재 카메라 위치 대비 선택된 패널의 위치</ko>
- */
-export interface SelectEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["SELECT"], T> {
-  index: number;
-  panel: Panel;
-  direction: ValueOf<typeof DIRECTION> | null;
-}
-
-/**
- * Event that fires when an empty panel area is visible at the edge of viewport
- * You can set its threshold with {@link Flicking#needPanelThreshold needPanelThreshold}
- * @ko 빈 패널 영역이 뷰포트 끝에 도달했을 때 발생하는 이벤트
- * {@link Flicking#needPanelThreshold needPanelThreshold}를 이용해서 이벤트가 발생하는 지점을 조절할 수 있습니다
- * @event Flicking#needPanel
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {DIRECTION} direction Direction where new panel is needed. `DIRECTION.PREV` means panels should be {@link Flicking#prepend prepend}ed and `DIRECTION.NEXT` means panels should be {@link Flicking#append append}ed
- * <ko>패널이 필요한 방향. `DIRECTION.PREV`의 경우 패널이 {@link Flicking#prepend prepend}되어야 함을 의미하고, `DIRECTION.NEXT`는 패널이 {@link Flicking#append append}되어야 함을 의미한다</ko>
- */
-export interface NeedPanelEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["NEED_PANEL"], T> {
-  direction: Exclude<ValueOf<typeof DIRECTION>, null>;
-}
-
-/**
- * Event that fires when visible panel inside the viewport changes
- * @ko 현재 뷰포트 내에서 보이는 패널이 변경되었을 때 발생되는 이벤트
- * @event Flicking#visibleChange
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {Panel[]} added Panels that added from previous visible panels<ko>새로 보이는 패널의 배열</ko>
- * @property {Panel[]} removed Panels that removed from previous visible panels<ko>보이지 않게 된 패널의 배열</ko>
- * @property {Panel[]} visiblePanels Current visible panels<ko>현재 보이는 패널의 배열</ko>
- */
-export interface VisibleChangeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["VISIBLE_CHANGE"], T> {
-  added: Panel[];
-  removed: Panel[];
-  visiblePanels: Panel[];
-}
-
-/**
- * Event that fires when camera reaches the maximum/minimum range
- * @ko 카메라가 이동 가능한 영역의 끝에 도달했을 때 발생하는 이벤트
- * @event Flicking#reachEdge
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {DIRECTION} direction Direction indicates whether the camera's position is at the maximum range({@link DIRECTION DIRECTION.NEXT}) or minimum range({@link DIRECTION DIRECTION.PREV})
- * <ko>카메라의 위치가 이동 가능한 범위의 최대점({@link DIRECTION DIRECTION.NEXT}) 혹은 최소점({@link DIRECTION DIRECTION.PREV})에 도달했는지를 나타내는 값</ko>
- */
-export interface ReachEdgeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["REACH_EDGE"], T> {
-  direction: ValueOf<typeof DIRECTION>;
-}
-
-/**
- * Event that fires when a panel is added or removed
- * @ko 패널 추가/제거시에 발생하는 이벤트
- * @event Flicking#panelChange
- * @type {object}
- * @property {Flicking} currentTarget An Flicking instance that triggered this event<ko>이 이벤트를 트리거한 Flicking의 인스턴스</ko>
- * @property {string} eventType Name of the event<ko>이벤트명</ko>
- * @property {Panel[]} added An array of new panels added<ko>새로 추가된 패널의 배열</ko>
- * @property {Panel[]} removed An array of panels removed<ko>제거된 패널의 배열</ko>
- */
-export interface PanelChangeEvent<T extends Flicking = Flicking> extends ComponentEvent<{}, typeof EVENTS["PANEL_CHANGE"], T> {
-  added: Panel[];
-  removed: Panel[];
-}