@egjs/flicking 4.12.0-beta.3 → 4.12.0-beta.4

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 (78) hide show
  1. package/declaration/Flicking.d.ts +244 -244
  2. package/declaration/camera/Camera.d.ts +90 -89
  3. package/declaration/camera/index.d.ts +4 -4
  4. package/declaration/camera/mode/BoundCameraMode.d.ts +13 -13
  5. package/declaration/camera/mode/CameraMode.d.ts +20 -20
  6. package/declaration/camera/mode/CircularCameraMode.d.ts +19 -19
  7. package/declaration/camera/mode/LinearCameraMode.d.ts +9 -9
  8. package/declaration/camera/mode/index.d.ts +6 -6
  9. package/declaration/cfc/getDefaultCameraTransform.d.ts +3 -3
  10. package/declaration/cfc/getRenderingPanels.d.ts +4 -4
  11. package/declaration/cfc/index.d.ts +5 -5
  12. package/declaration/cfc/sync.d.ts +4 -4
  13. package/declaration/cfc/withFlickingMethods.d.ts +2 -2
  14. package/declaration/const/axes.d.ts +8 -8
  15. package/declaration/const/error.d.ts +34 -34
  16. package/declaration/const/external.d.ts +48 -54
  17. package/declaration/control/AxesController.d.ts +44 -44
  18. package/declaration/control/Control.d.ts +45 -45
  19. package/declaration/control/FreeControl.d.ts +14 -14
  20. package/declaration/control/SnapControl.d.ts +16 -16
  21. package/declaration/control/StateMachine.d.ts +14 -14
  22. package/declaration/control/StrictControl.d.ts +20 -20
  23. package/declaration/control/index.d.ts +14 -14
  24. package/declaration/control/states/AnimatingState.d.ts +9 -9
  25. package/declaration/control/states/DisabledState.d.ts +9 -9
  26. package/declaration/control/states/DraggingState.d.ts +8 -8
  27. package/declaration/control/states/HoldingState.d.ts +10 -10
  28. package/declaration/control/states/IdleState.d.ts +9 -9
  29. package/declaration/control/states/State.d.ts +47 -47
  30. package/declaration/core/AnchorPoint.d.ts +15 -15
  31. package/declaration/core/AutoResizer.d.ts +16 -16
  32. package/declaration/core/FlickingError.d.ts +5 -5
  33. package/declaration/core/ResizeWatcher.d.ts +33 -33
  34. package/declaration/core/Viewport.d.ts +25 -25
  35. package/declaration/core/VirtualManager.d.ts +37 -37
  36. package/declaration/core/index.d.ts +6 -6
  37. package/declaration/core/panel/Panel.d.ts +89 -89
  38. package/declaration/core/panel/VirtualPanel.d.ts +19 -19
  39. package/declaration/core/panel/index.d.ts +5 -5
  40. package/declaration/core/panel/provider/ElementProvider.d.ts +8 -8
  41. package/declaration/core/panel/provider/VanillaElementProvider.d.ts +12 -12
  42. package/declaration/core/panel/provider/VirtualElementProvider.d.ts +15 -15
  43. package/declaration/core/panel/provider/index.d.ts +5 -5
  44. package/declaration/index.cjs.d.ts +3 -3
  45. package/declaration/index.d.ts +13 -14
  46. package/declaration/index.umd.d.ts +2 -2
  47. package/declaration/renderer/ExternalRenderer.d.ts +7 -7
  48. package/declaration/renderer/Renderer.d.ts +59 -59
  49. package/declaration/renderer/VanillaRenderer.d.ts +10 -10
  50. package/declaration/renderer/index.d.ts +6 -6
  51. package/declaration/renderer/strategy/NormalRenderingStrategy.d.ts +23 -23
  52. package/declaration/renderer/strategy/RenderingStrategy.d.ts +15 -15
  53. package/declaration/renderer/strategy/VirtualRenderingStrategy.d.ts +17 -17
  54. package/declaration/renderer/strategy/index.d.ts +5 -5
  55. package/declaration/type/event.d.ts +88 -88
  56. package/declaration/type/external.d.ts +31 -31
  57. package/declaration/type/internal.d.ts +13 -13
  58. package/declaration/utils.d.ts +45 -47
  59. package/dist/flicking.cjs.js +15 -324
  60. package/dist/flicking.cjs.js.map +1 -1
  61. package/dist/flicking.esm.js +15 -316
  62. package/dist/flicking.esm.js.map +1 -1
  63. package/dist/flicking.js +15 -325
  64. package/dist/flicking.js.map +1 -1
  65. package/dist/flicking.min.js +2 -2
  66. package/dist/flicking.min.js.map +1 -1
  67. package/dist/flicking.pkgd.js +775 -1092
  68. package/dist/flicking.pkgd.js.map +1 -1
  69. package/dist/flicking.pkgd.min.js +2 -2
  70. package/dist/flicking.pkgd.min.js.map +1 -1
  71. package/package.json +2 -2
  72. package/src/camera/Camera.ts +9 -0
  73. package/src/const/external.ts +0 -14
  74. package/src/index.ts +0 -2
  75. package/src/index.umd.ts +0 -2
  76. package/src/utils.ts +0 -21
  77. package/declaration/CrossFlicking.d.ts +0 -35
  78. package/src/CrossFlicking.ts +0 -356
@@ -1,47 +1,45 @@
1
- import Flicking, { FlickingOptions } from "./Flicking";
2
- import { ALIGN, DIRECTION } from "./const/external";
3
- import { LiteralUnion, Merged, ValueOf } from "./type/internal";
4
- import { ElementLike } from "./type/external";
5
- export declare const merge: <From extends object, To extends object>(target: From, ...sources: To[]) => Merged<From, To>;
6
- export declare const getElement: (el: HTMLElement | string | null, parent?: HTMLElement) => HTMLElement;
7
- export declare const checkExistence: (value: any, nameOnErrMsg: string) => void;
8
- export declare const clamp: (x: number, min: number, max: number) => number;
9
- export declare const getFlickingAttached: (val: Flicking | null) => Flicking;
10
- export declare const toArray: <T>(iterable: ArrayLike<T>) => T[];
11
- export declare const parseAlign: (align: LiteralUnion<ValueOf<typeof ALIGN>> | number, size: number) => number;
12
- export declare const parseBounce: (bounce: FlickingOptions["bounce"], size: number) => number[];
13
- export declare const parseArithmeticSize: (cssValue: number | string, base: number) => number | null;
14
- export declare const parseArithmeticExpression: (cssValue: number | string) => {
15
- percentage: number;
16
- absolute: number;
17
- } | null;
18
- export declare const parseCSSSizeValue: (val: string | number) => string;
19
- export declare const parsePanelAlign: (align: FlickingOptions["align"]) => string | number;
20
- export declare const getDirection: (start: number, end: number) => ValueOf<typeof DIRECTION>;
21
- export declare const parseElement: (element: ElementLike | ElementLike[]) => HTMLElement[];
22
- export declare const getMinusCompensatedIndex: (idx: number, max: number) => number;
23
- export declare const includes: <T>(array: T[], target: any) => target is T;
24
- export declare const isString: (val: any) => val is string;
25
- export declare const circulatePosition: (pos: number, min: number, max: number) => number;
26
- export declare const find: <T>(array: T[], checker: (val: T) => boolean) => T;
27
- export declare const findRight: <T>(array: T[], checker: (val: T) => boolean) => T;
28
- export declare const findIndex: <T>(array: T[], checker: (val: T) => boolean) => number;
29
- export declare const getProgress: (pos: number, prev: number, next: number) => number;
30
- export declare const getStyle: (el: HTMLElement) => CSSStyleDeclaration;
31
- export declare const setSize: (el: HTMLElement, { width, height }: Partial<{
32
- width: number | string;
33
- height: number | string;
34
- }>) => void;
35
- export declare const isBetween: (val: number, min: number, max: number) => boolean;
36
- export declare const circulateIndex: (index: number, max: number) => number;
37
- export declare const range: (end: number) => number[];
38
- export declare const getElementSize: ({ el, horizontal, useFractionalSize, useOffset, style }: {
39
- el: HTMLElement;
40
- horizontal: boolean;
41
- useFractionalSize: boolean;
42
- useOffset: boolean;
43
- style: CSSStyleDeclaration;
44
- }) => number;
45
- export declare const setPrototypeOf: (o: any, proto: object) => any;
46
- export declare const camelize: (str: string) => string;
47
- export declare const getDataAttributes: (element: HTMLElement, attributePrefix: string) => Record<string, string>;
1
+ import Flicking, { FlickingOptions } from "./Flicking";
2
+ import { ALIGN, DIRECTION } from "./const/external";
3
+ import { LiteralUnion, Merged, ValueOf } from "./type/internal";
4
+ import { ElementLike } from "./type/external";
5
+ export declare const merge: <From extends object, To extends object>(target: From, ...sources: To[]) => Merged<From, To>;
6
+ export declare const getElement: (el: HTMLElement | string | null, parent?: HTMLElement) => HTMLElement;
7
+ export declare const checkExistence: (value: any, nameOnErrMsg: string) => void;
8
+ export declare const clamp: (x: number, min: number, max: number) => number;
9
+ export declare const getFlickingAttached: (val: Flicking | null) => Flicking;
10
+ export declare const toArray: <T>(iterable: ArrayLike<T>) => T[];
11
+ export declare const parseAlign: (align: LiteralUnion<ValueOf<typeof ALIGN>> | number, size: number) => number;
12
+ export declare const parseBounce: (bounce: FlickingOptions["bounce"], size: number) => number[];
13
+ export declare const parseArithmeticSize: (cssValue: number | string, base: number) => number | null;
14
+ export declare const parseArithmeticExpression: (cssValue: number | string) => {
15
+ percentage: number;
16
+ absolute: number;
17
+ } | null;
18
+ export declare const parseCSSSizeValue: (val: string | number) => string;
19
+ export declare const parsePanelAlign: (align: FlickingOptions["align"]) => string | number;
20
+ export declare const getDirection: (start: number, end: number) => ValueOf<typeof DIRECTION>;
21
+ export declare const parseElement: (element: ElementLike | ElementLike[]) => HTMLElement[];
22
+ export declare const getMinusCompensatedIndex: (idx: number, max: number) => number;
23
+ export declare const includes: <T>(array: T[], target: any) => target is T;
24
+ export declare const isString: (val: any) => val is string;
25
+ export declare const circulatePosition: (pos: number, min: number, max: number) => number;
26
+ export declare const find: <T>(array: T[], checker: (val: T) => boolean) => T;
27
+ export declare const findRight: <T>(array: T[], checker: (val: T) => boolean) => T;
28
+ export declare const findIndex: <T>(array: T[], checker: (val: T) => boolean) => number;
29
+ export declare const getProgress: (pos: number, prev: number, next: number) => number;
30
+ export declare const getStyle: (el: HTMLElement) => CSSStyleDeclaration;
31
+ export declare const setSize: (el: HTMLElement, { width, height }: Partial<{
32
+ width: number | string;
33
+ height: number | string;
34
+ }>) => void;
35
+ export declare const isBetween: (val: number, min: number, max: number) => boolean;
36
+ export declare const circulateIndex: (index: number, max: number) => number;
37
+ export declare const range: (end: number) => number[];
38
+ export declare const getElementSize: ({ el, horizontal, useFractionalSize, useOffset, style }: {
39
+ el: HTMLElement;
40
+ horizontal: boolean;
41
+ useFractionalSize: boolean;
42
+ useOffset: boolean;
43
+ style: CSSStyleDeclaration;
44
+ }) => number;
45
+ export declare const setPrototypeOf: (o: any, proto: object) => any;
@@ -4,7 +4,7 @@ name: @egjs/flicking
4
4
  license: MIT
5
5
  author: NAVER Corp.
6
6
  repository: https://github.com/naver/egjs-flicking
7
- version: 4.12.0-beta.3
7
+ version: 4.12.0-beta.4
8
8
  */
9
9
  'use strict';
10
10
 
@@ -12,7 +12,7 @@ var Component = require('@egjs/component');
12
12
  var Axes = require('@egjs/axes');
13
13
  var ImReady = require('@egjs/imready');
14
14
 
15
- /******************************************************************************
15
+ /*! *****************************************************************************
16
16
  Copyright (c) Microsoft Corporation.
17
17
 
18
18
  Permission to use, copy, modify, and/or distribute this software for any
@@ -26,7 +26,7 @@ LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
26
26
  OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
27
27
  PERFORMANCE OF THIS SOFTWARE.
28
28
  ***************************************************************************** */
29
- /* global Reflect, Promise, SuppressedError, Symbol */
29
+ /* global Reflect, Promise */
30
30
 
31
31
  var extendStatics = function (d, b) {
32
32
  extendStatics = Object.setPrototypeOf || {
@@ -111,7 +111,7 @@ function __generator(thisArg, body) {
111
111
  }
112
112
  function step(op) {
113
113
  if (f) throw new TypeError("Generator is already executing.");
114
- while (g && (g = 0, op[0] && (_ = 0)), _) try {
114
+ while (_) try {
115
115
  if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
116
116
  if (y = 0, t) op = [op[0] & 2, t.value];
117
117
  switch (op[0]) {
@@ -215,10 +215,6 @@ function __spread() {
215
215
  for (var ar = [], i = 0; i < arguments.length; i++) ar = ar.concat(__read(arguments[i]));
216
216
  return ar;
217
217
  }
218
- typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
219
- var e = new Error(message);
220
- return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
221
- };
222
218
 
223
219
  /*
224
220
  * Copyright (c) 2015 NAVER Corp.
@@ -387,8 +383,6 @@ var MOVE_TYPE = {
387
383
  STRICT: "strict"
388
384
  };
389
385
  var CLASS = {
390
- VIEWPORT: "flicking-viewport",
391
- CAMERA: "flicking-camera",
392
386
  VERTICAL: "vertical",
393
387
  HIDDEN: "flicking-hidden",
394
388
  DEFAULT_VIRTUAL: "flicking-panel"
@@ -415,17 +409,6 @@ var ORDER = {
415
409
  LTR: "ltr",
416
410
  RTL: "rtl"
417
411
  };
418
- /**
419
- * An object that contains the direction that {@link Flicking} is moving
420
- * @ko {@link Flicking}이 움직이는 방향을 담고 있는 객체
421
- * @type {object}
422
- * @property {"horizontal"} HORIZONTAL horizontal<ko>수평 방향</ko>
423
- * @property {"vertical"} VERTICAL vertical<ko>수직 방향</ko>
424
- */
425
- var MOVE_DIRECTION = {
426
- HORIZONTAL: "horizontal",
427
- VERTICAL: "vertical"
428
- };
429
412
 
430
413
  // eslint-disable-next-line @typescript-eslint/ban-types
431
414
  var merge = function (target) {
@@ -740,26 +723,6 @@ var setPrototypeOf = Object.setPrototypeOf || function (obj, proto) {
740
723
  obj.__proto__ = proto;
741
724
  return obj;
742
725
  };
743
- var camelize = function (str) {
744
- return str.replace(/[\s-_]([a-z])/g, function (all, letter) {
745
- return letter.toUpperCase();
746
- });
747
- };
748
- var getDataAttributes = function (element, attributePrefix) {
749
- var dataAttributes = {};
750
- var attributes = element.attributes;
751
- var length = attributes.length;
752
- for (var i = 0; i < length; ++i) {
753
- var attribute = attributes[i];
754
- var name_1 = attribute.name,
755
- value = attribute.value;
756
- if (name_1.indexOf(attributePrefix) === -1) {
757
- continue;
758
- }
759
- dataAttributes[camelize(name_1.replace(attributePrefix, ""))] = value;
760
- }
761
- return dataAttributes;
762
- };
763
726
 
764
727
  /*
765
728
  * Copyright (c) 2015 NAVER Corp.
@@ -3746,6 +3709,7 @@ var Camera = /*#__PURE__*/function () {
3746
3709
  var _this = this;
3747
3710
  var _b = (_a === void 0 ? {} : _a).align,
3748
3711
  align = _b === void 0 ? ALIGN.CENTER : _b;
3712
+ this._lookedOffset = 0;
3749
3713
  this._checkTranslateSupport = function () {
3750
3714
  var e_1, _a;
3751
3715
  var transforms = ["webkitTransform", "msTransform", "MozTransform", "OTransform", "transform"];
@@ -4105,6 +4069,8 @@ var Camera = /*#__PURE__*/function () {
4105
4069
  */
4106
4070
  __proto.lookAt = function (pos) {
4107
4071
  var _this = this;
4072
+ var prevOffset = this._offset;
4073
+ var isChangedOffset = this._lookedOffset !== prevOffset;
4108
4074
  var flicking = getFlickingAttached(this._flicking);
4109
4075
  var prevPos = this._position;
4110
4076
  this._position = pos;
@@ -4115,7 +4081,12 @@ var Camera = /*#__PURE__*/function () {
4115
4081
  if (toggled) {
4116
4082
  void flicking.renderer.render().then(function () {
4117
4083
  _this.updateOffset();
4084
+ _this._lookedOffset = _this._offset;
4118
4085
  });
4086
+ } else if (isChangedOffset) {
4087
+ // sync offset for renderOnlyVisible on resize
4088
+ this.updateOffset();
4089
+ this._lookedOffset = this._offset;
4119
4090
  } else {
4120
4091
  this.applyTransform();
4121
4092
  }
@@ -4374,6 +4345,7 @@ var Camera = /*#__PURE__*/function () {
4374
4345
  };
4375
4346
  __proto._resetInternalValues = function () {
4376
4347
  this._position = 0;
4348
+ this._lookedOffset = 0;
4377
4349
  this._alignPos = 0;
4378
4350
  this._offset = 0;
4379
4351
  this._circularOffset = 0;
@@ -7895,283 +7867,10 @@ var Flicking = /*#__PURE__*/function (_super) {
7895
7867
  * Flicking.VERSION; // ex) 4.0.0
7896
7868
  * ```
7897
7869
  */
7898
- Flicking.VERSION = "4.12.0-beta.3";
7870
+ Flicking.VERSION = "4.12.0-beta.4";
7899
7871
  return Flicking;
7900
7872
  }(Component);
7901
7873
 
7902
- /*
7903
- * Copyright (c) 2015 NAVER Corp.
7904
- * egjs projects are licensed under the MIT license
7905
- */
7906
- /**
7907
- * @extends Component
7908
- * @support {"ie": "9+(with polyfill)", "ch" : "latest", "ff" : "latest", "sf" : "latest", "edge" : "latest", "ios" : "7+", "an" : "4.X+"}
7909
- * @requires {@link https://github.com/naver/egjs-component|@egjs/component}
7910
- * @requires {@link https://github.com/naver/egjs-axes|@egjs/axes}
7911
- */
7912
- var CrossFlicking = /*#__PURE__*/function (_super) {
7913
- __extends(CrossFlicking, _super);
7914
- // Options Setter
7915
- // public set align(val: FlickingOptions["align"]) {
7916
- // this._align = val;
7917
- // }
7918
- function CrossFlicking(root, _a) {
7919
- var _b = (_a === void 0 ? {} : _a).verticalOptions,
7920
- verticalOptions = _b === void 0 ? undefined : _b;
7921
- var _this = _super.call(this, root) || this;
7922
- _this._onHorizontalHoldStart = function () {
7923
- _this.dragThreshold = 10;
7924
- _this._moveDirection = null;
7925
- };
7926
- _this._onHorizontalMove = function (e) {
7927
- if (e.isTrusted && !_this._moveDirection) {
7928
- _this._verticalFlicking.forEach(function (child) {
7929
- child.dragThreshold = Infinity;
7930
- });
7931
- _this._moveDirection = MOVE_DIRECTION.HORIZONTAL;
7932
- }
7933
- };
7934
- _this._onHorizontalMoveEnd = function (e) {
7935
- var visiblePanels = _this.visiblePanels;
7936
- _this._verticalFlicking.forEach(function (child) {
7937
- child.dragThreshold = 10;
7938
- });
7939
- _this._moveDirection = null;
7940
- if (visiblePanels.length > 1) {
7941
- _this._nextIndex = e.direction === "NEXT" ? visiblePanels[1].index : visiblePanels[0].index;
7942
- } else {
7943
- _this._nextIndex = visiblePanels[0].index;
7944
- }
7945
- _this._verticalFlicking.forEach(function (child, i) {
7946
- if (_this._nextIndex !== i) {
7947
- var _a = _this._verticalState[i],
7948
- start = _a.start,
7949
- end = _a.end;
7950
- if (child.index < start) {
7951
- child.stopAnimation();
7952
- void child.moveTo(start, 0);
7953
- } else if (child.index > end) {
7954
- child.stopAnimation();
7955
- void child.moveTo(end, 0);
7956
- }
7957
- }
7958
- });
7959
- if (e.isTrusted) {
7960
- _this._syncToCategory(_this._verticalFlicking[_this._nextIndex].index, _this._nextIndex);
7961
- }
7962
- };
7963
- _this._onVerticalHoldStart = function () {
7964
- _this._verticalFlicking.forEach(function (child) {
7965
- child.dragThreshold = 10;
7966
- });
7967
- _this._moveDirection = null;
7968
- };
7969
- _this._onVerticalMove = function (e) {
7970
- if (e.isTrusted && !_this._moveDirection) {
7971
- _this.dragThreshold = Infinity;
7972
- _this._moveDirection = MOVE_DIRECTION.VERTICAL;
7973
- }
7974
- };
7975
- _this._onVerticalMoveEnd = function () {
7976
- _this.dragThreshold = 10;
7977
- _this._moveDirection = null;
7978
- };
7979
- _this._onVerticalChanged = function (e) {
7980
- // this.visiblePanels.length 가 2보다 크다면 가로 방향 Flicking이 조작 중이라는 것을 의미합니다.
7981
- // 이 경우 가로 방향 Flicking의 이동이 완전히 끝난 뒤 _onHorizontalMoveEnd 에서 syncToCategory할 것이므로 여기서는 하지 않습니다.
7982
- if (_this.visiblePanels.length < 2 && _this._verticalFlicking[_this.index] === e.currentTarget) {
7983
- _this._syncToCategory(e.index, _this.index);
7984
- }
7985
- };
7986
- // Internal states
7987
- _this._verticalState = _this._createVerticalState();
7988
- _this._moveDirection = null;
7989
- _this._nextIndex = 0;
7990
- // Bind options
7991
- _this._verticalOptions = verticalOptions;
7992
- // Create core components
7993
- _this._verticalFlicking = _this._createVerticalFlicking();
7994
- return _this;
7995
- }
7996
- var __proto = CrossFlicking.prototype;
7997
- Object.defineProperty(__proto, "verticalFlicking", {
7998
- // Components
7999
- /**
8000
- * {@link Control} instance of the Flicking
8001
- * @ko 현재 Flicking에 활성화된 {@link Control} 인스턴스
8002
- * @type {Control}
8003
- * @default SnapControl
8004
- * @readonly
8005
- * @see Control
8006
- * @see SnapControl
8007
- * @see FreeControl
8008
- */
8009
- get: function () {
8010
- return this._verticalFlicking;
8011
- },
8012
- enumerable: false,
8013
- configurable: true
8014
- });
8015
- Object.defineProperty(__proto, "verticalState", {
8016
- // Internal States
8017
- /**
8018
- * Whether Flicking's {@link Flicking#init init()} is called.
8019
- * This is `true` when {@link Flicking#init init()} is called, and is `false` after calling {@link Flicking#destroy destroy()}.
8020
- * @ko Flicking의 {@link Flicking#init init()}이 호출되었는지를 나타내는 멤버 변수.
8021
- * 이 값은 {@link Flicking#init init()}이 호출되었으면 `true`로 변하고, {@link Flicking#destroy destroy()}호출 이후에 다시 `false`로 변경됩니다.
8022
- * @type {boolean}
8023
- * @default false
8024
- * @readonly
8025
- */
8026
- get: function () {
8027
- return this._verticalState;
8028
- },
8029
- enumerable: false,
8030
- configurable: true
8031
- });
8032
- Object.defineProperty(__proto, "verticalOptions", {
8033
- // Options Getter
8034
- /**
8035
- * Change active panel index on mouse/touch hold while animating.
8036
- * `index` of the `willChange`/`willRestore` event will be used as new index.
8037
- * @ko 애니메이션 도중 마우스/터치 입력시 현재 활성화된 패널의 인덱스를 변경합니다.
8038
- * `willChange`/`willRestore` 이벤트의 `index`값이 새로운 인덱스로 사용될 것입니다.
8039
- * @type {FlickingOptions}
8040
- * @default undefined
8041
- * @see {@link https://naver.github.io/egjs-flicking/Options#changeonhold changeOnHold ( Options )}
8042
- */
8043
- get: function () {
8044
- return this._verticalOptions;
8045
- },
8046
- enumerable: false,
8047
- configurable: true
8048
- });
8049
- /**
8050
- * Initialize Flicking and move to the default index
8051
- * This is automatically called on Flicking's constructor when `autoInit` is true(default)
8052
- * @ko Flicking을 초기화하고, 디폴트 인덱스로 이동합니다
8053
- * 이 메소드는 `autoInit` 옵션이 true(default)일 경우 Flicking이 생성될 때 자동으로 호출됩니다
8054
- * @fires Flicking#ready
8055
- * @return {Promise<void>}
8056
- */
8057
- __proto.init = function () {
8058
- var _this = this;
8059
- return _super.prototype.init.call(this).then(function () {
8060
- return _this._addComponentEvents();
8061
- });
8062
- };
8063
- __proto._addComponentEvents = function () {
8064
- var _this = this;
8065
- this.on(EVENTS.HOLD_START, this._onHorizontalHoldStart);
8066
- this.on(EVENTS.MOVE, this._onHorizontalMove);
8067
- this.on(EVENTS.MOVE_END, this._onHorizontalMoveEnd);
8068
- this._verticalFlicking.forEach(function (flicking) {
8069
- flicking.on(EVENTS.HOLD_START, _this._onVerticalHoldStart);
8070
- flicking.on(EVENTS.MOVE, _this._onVerticalMove);
8071
- flicking.on(EVENTS.MOVE_END, _this._onVerticalMoveEnd);
8072
- flicking.on(EVENTS.CHANGED, _this._onVerticalChanged);
8073
- });
8074
- };
8075
- __proto._createVerticalState = function () {
8076
- var _this = this;
8077
- // data-index로 분류하기 전에 임시로 모든 children에 대해 vertical flicking으로 해보자.
8078
- // panels에 data-attributes가 붙어있을 때와 안 붙어있을 때를 다르게 처리
8079
- // 붙어있다면 가상의 viewport들을 index 갯수만큼 만들어줘야 한다
8080
- var cameraEl = this.camera.element;
8081
- var panels = toArray(cameraEl.children);
8082
- var verticalState;
8083
- var verticalPanels = "";
8084
- // check data attribute exists
8085
- var groupKeys = [];
8086
- var groupPanels = {};
8087
- var verticalCamera = document.createElement("div");
8088
- verticalCamera.classList.add(CLASS.CAMERA);
8089
- panels.forEach(function (panel) {
8090
- var groupKey = getDataAttributes(panel, "data-flicking-").groupkey;
8091
- if (groupKey && !includes(groupKeys, groupKey)) {
8092
- groupKeys.push(groupKey);
8093
- groupPanels[groupKey] = [panel];
8094
- } else if (groupKey) {
8095
- groupPanels[groupKey].push(panel);
8096
- }
8097
- return groupKey;
8098
- });
8099
- if (groupKeys.length) {
8100
- panels.forEach(function () {
8101
- return _this.remove(0);
8102
- });
8103
- verticalState = groupKeys.reduce(function (state, key) {
8104
- var start = state.length ? +state[state.length - 1].end + 1 : 0;
8105
- var element = groupPanels[key].reduce(function (el, panel) {
8106
- verticalPanels += panel.outerHTML;
8107
- el.appendChild(panel);
8108
- return el;
8109
- }, document.createElement("div"));
8110
- return __spread(state, [{
8111
- key: key,
8112
- start: start,
8113
- end: start + groupPanels[key].length - 1,
8114
- element: element
8115
- }]);
8116
- }, []);
8117
- verticalCamera.innerHTML = verticalPanels;
8118
- cameraEl.innerHTML = "";
8119
- groupKeys.forEach(function () {
8120
- var panel = document.createElement("div");
8121
- panel.classList.add(CLASS.VIEWPORT, CLASS.VERTICAL);
8122
- panel.innerHTML = verticalCamera.outerHTML;
8123
- _this.append(panel);
8124
- });
8125
- } else {
8126
- verticalState = panels.reduce(function (state, panel, i) {
8127
- var start = state.length ? +state[state.length - 1].end + 1 : 0;
8128
- verticalPanels += panel.innerHTML;
8129
- return __spread(state, [{
8130
- key: i.toString(),
8131
- start: start,
8132
- end: start + panel.children.length - 1,
8133
- element: panel
8134
- }]);
8135
- }, []);
8136
- verticalCamera.innerHTML = verticalPanels;
8137
- panels.forEach(function (panel) {
8138
- [CLASS.VIEWPORT, CLASS.VERTICAL].forEach(function (className) {
8139
- if (!panel.classList.contains(className)) {
8140
- panel.classList.add(className);
8141
- }
8142
- });
8143
- panel.innerHTML = verticalCamera.outerHTML;
8144
- });
8145
- }
8146
- return verticalState;
8147
- };
8148
- __proto._createVerticalFlicking = function () {
8149
- var _this = this;
8150
- return this.camera.children.map(function (panel, i) {
8151
- return new Flicking(panel, __assign(__assign({}, _this.verticalOptions), {
8152
- horizontal: false,
8153
- panelsPerView: 1,
8154
- defaultIndex: _this._verticalState[i].start
8155
- }));
8156
- });
8157
- };
8158
- __proto._syncToCategory = function (index, outerIndex) {
8159
- var _this = this;
8160
- this.stopAnimation();
8161
- this._verticalFlicking.forEach(function (child, i) {
8162
- var _a = _this._verticalState[i],
8163
- start = _a.start,
8164
- end = _a.end;
8165
- if (start <= index && end >= index && outerIndex !== i) {
8166
- child.stopAnimation();
8167
- void child.moveTo(index, 0);
8168
- void _this.moveTo(i, 0);
8169
- }
8170
- });
8171
- };
8172
- return CrossFlicking;
8173
- }(Flicking);
8174
-
8175
7874
  /**
8176
7875
  * Decorator that makes the method of flicking available in the framework.
8177
7876
  * @ko 프레임워크에서 플리킹의 메소드를 사용할 수 있게 하는 데코레이터.
@@ -8389,7 +8088,6 @@ var parseAlign = function (alignVal) {
8389
8088
  var modules = {
8390
8089
  __proto__: null,
8391
8090
  'default': Flicking,
8392
- CrossFlicking: CrossFlicking,
8393
8091
  VanillaElementProvider: VanillaElementProvider,
8394
8092
  VirtualElementProvider: VirtualElementProvider,
8395
8093
  Panel: Panel,
@@ -8427,7 +8125,6 @@ var modules = {
8427
8125
  CLASS: CLASS,
8428
8126
  CIRCULAR_FALLBACK: CIRCULAR_FALLBACK,
8429
8127
  ORDER: ORDER,
8430
- MOVE_DIRECTION: MOVE_DIRECTION,
8431
8128
  withFlickingMethods: withFlickingMethods,
8432
8129
  sync: sync,
8433
8130
  getRenderingPanels: getRenderingPanels,
@@ -8460,9 +8157,7 @@ var modules = {
8460
8157
  circulateIndex: circulateIndex,
8461
8158
  range: range,
8462
8159
  getElementSize: getElementSize,
8463
- setPrototypeOf: setPrototypeOf,
8464
- camelize: camelize,
8465
- getDataAttributes: getDataAttributes
8160
+ setPrototypeOf: setPrototypeOf
8466
8161
  };
8467
8162
 
8468
8163
  /*
@@ -8484,7 +8179,6 @@ exports.CLASS = CLASS;
8484
8179
  exports.Camera = Camera;
8485
8180
  exports.CircularCameraMode = CircularCameraMode;
8486
8181
  exports.Control = Control;
8487
- exports.CrossFlicking = CrossFlicking;
8488
8182
  exports.DIRECTION = DIRECTION;
8489
8183
  exports.DisabledState = DisabledState;
8490
8184
  exports.DraggingState = DraggingState;
@@ -8496,7 +8190,6 @@ exports.FreeControl = FreeControl;
8496
8190
  exports.HoldingState = HoldingState;
8497
8191
  exports.IdleState = IdleState;
8498
8192
  exports.LinearCameraMode = LinearCameraMode;
8499
- exports.MOVE_DIRECTION = MOVE_DIRECTION;
8500
8193
  exports.MOVE_TYPE = MOVE_TYPE;
8501
8194
  exports.NormalRenderingStrategy = NormalRenderingStrategy;
8502
8195
  exports.ORDER = ORDER;
@@ -8513,7 +8206,6 @@ exports.VirtualElementProvider = VirtualElementProvider;
8513
8206
  exports.VirtualManager = VirtualManager;
8514
8207
  exports.VirtualPanel = VirtualPanel;
8515
8208
  exports.VirtualRenderingStrategy = VirtualRenderingStrategy;
8516
- exports.camelize = camelize;
8517
8209
  exports.checkExistence = checkExistence;
8518
8210
  exports.circulateIndex = circulateIndex;
8519
8211
  exports.circulatePosition = circulatePosition;
@@ -8522,7 +8214,6 @@ exports["default"] = Flicking;
8522
8214
  exports.find = find;
8523
8215
  exports.findIndex = findIndex;
8524
8216
  exports.findRight = findRight;
8525
- exports.getDataAttributes = getDataAttributes;
8526
8217
  exports.getDefaultCameraTransform = getDefaultCameraTransform;
8527
8218
  exports.getDirection = getDirection;
8528
8219
  exports.getElement = getElement;