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

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 +27 -328
  60. package/dist/flicking.cjs.js.map +1 -1
  61. package/dist/flicking.esm.js +27 -320
  62. package/dist/flicking.esm.js.map +1 -1
  63. package/dist/flicking.js +27 -329
  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 +785 -1094
  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 +24 -4
  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.5
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
  }
@@ -4290,8 +4261,8 @@ var Camera = /*#__PURE__*/function () {
4290
4261
  return this;
4291
4262
  };
4292
4263
  /**
4293
- * Update Viewport's height to active panel's height
4294
- * @ko 현재 선택된 패널의 높이와 동일하도록 뷰포트의 높이를 업데이트합니다
4264
+ * Update Viewport's height to visible panel's max height
4265
+ * @ko 현재 활성화된 패널과 보이는 패널의 최대 높이와 동일하도록 뷰포트의 높이를 업데이트합니다
4295
4266
  * @throws {FlickingError}
4296
4267
  * {@link ERROR_CODE NOT_ATTACHED_TO_FLICKING} When {@link Camera#init init} is not called before
4297
4268
  * <ko>{@link ERROR_CODE NOT_ATTACHED_TO_FLICKING} {@link Camera#init init}이 이전에 호출되지 않은 경우</ko>
@@ -4301,9 +4272,17 @@ var Camera = /*#__PURE__*/function () {
4301
4272
  __proto.updateAdaptiveHeight = function () {
4302
4273
  var flicking = getFlickingAttached(this._flicking);
4303
4274
  var activePanel = flicking.control.activePanel;
4304
- if (!flicking.horizontal || !flicking.adaptive || !activePanel) return;
4275
+ var visiblePanels = flicking.visiblePanels;
4276
+ var selectedPanels = __spread(visiblePanels);
4277
+ if (activePanel) {
4278
+ selectedPanels.push(activePanel);
4279
+ }
4280
+ if (!flicking.horizontal || !flicking.adaptive || !selectedPanels.length) return;
4281
+ var maxHeight = Math.max.apply(Math, __spread(selectedPanels.map(function (panel) {
4282
+ return panel.height;
4283
+ })));
4305
4284
  flicking.viewport.setSize({
4306
- height: activePanel.height
4285
+ height: maxHeight
4307
4286
  });
4308
4287
  };
4309
4288
  /**
@@ -4374,6 +4353,7 @@ var Camera = /*#__PURE__*/function () {
4374
4353
  };
4375
4354
  __proto._resetInternalValues = function () {
4376
4355
  this._position = 0;
4356
+ this._lookedOffset = 0;
4377
4357
  this._alignPos = 0;
4378
4358
  this._offset = 0;
4379
4359
  this._circularOffset = 0;
@@ -7895,283 +7875,10 @@ var Flicking = /*#__PURE__*/function (_super) {
7895
7875
  * Flicking.VERSION; // ex) 4.0.0
7896
7876
  * ```
7897
7877
  */
7898
- Flicking.VERSION = "4.12.0-beta.3";
7878
+ Flicking.VERSION = "4.12.0-beta.5";
7899
7879
  return Flicking;
7900
7880
  }(Component);
7901
7881
 
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
7882
  /**
8176
7883
  * Decorator that makes the method of flicking available in the framework.
8177
7884
  * @ko 프레임워크에서 플리킹의 메소드를 사용할 수 있게 하는 데코레이터.
@@ -8389,7 +8096,6 @@ var parseAlign = function (alignVal) {
8389
8096
  var modules = {
8390
8097
  __proto__: null,
8391
8098
  'default': Flicking,
8392
- CrossFlicking: CrossFlicking,
8393
8099
  VanillaElementProvider: VanillaElementProvider,
8394
8100
  VirtualElementProvider: VirtualElementProvider,
8395
8101
  Panel: Panel,
@@ -8427,7 +8133,6 @@ var modules = {
8427
8133
  CLASS: CLASS,
8428
8134
  CIRCULAR_FALLBACK: CIRCULAR_FALLBACK,
8429
8135
  ORDER: ORDER,
8430
- MOVE_DIRECTION: MOVE_DIRECTION,
8431
8136
  withFlickingMethods: withFlickingMethods,
8432
8137
  sync: sync,
8433
8138
  getRenderingPanels: getRenderingPanels,
@@ -8460,9 +8165,7 @@ var modules = {
8460
8165
  circulateIndex: circulateIndex,
8461
8166
  range: range,
8462
8167
  getElementSize: getElementSize,
8463
- setPrototypeOf: setPrototypeOf,
8464
- camelize: camelize,
8465
- getDataAttributes: getDataAttributes
8168
+ setPrototypeOf: setPrototypeOf
8466
8169
  };
8467
8170
 
8468
8171
  /*
@@ -8484,7 +8187,6 @@ exports.CLASS = CLASS;
8484
8187
  exports.Camera = Camera;
8485
8188
  exports.CircularCameraMode = CircularCameraMode;
8486
8189
  exports.Control = Control;
8487
- exports.CrossFlicking = CrossFlicking;
8488
8190
  exports.DIRECTION = DIRECTION;
8489
8191
  exports.DisabledState = DisabledState;
8490
8192
  exports.DraggingState = DraggingState;
@@ -8496,7 +8198,6 @@ exports.FreeControl = FreeControl;
8496
8198
  exports.HoldingState = HoldingState;
8497
8199
  exports.IdleState = IdleState;
8498
8200
  exports.LinearCameraMode = LinearCameraMode;
8499
- exports.MOVE_DIRECTION = MOVE_DIRECTION;
8500
8201
  exports.MOVE_TYPE = MOVE_TYPE;
8501
8202
  exports.NormalRenderingStrategy = NormalRenderingStrategy;
8502
8203
  exports.ORDER = ORDER;
@@ -8513,7 +8214,6 @@ exports.VirtualElementProvider = VirtualElementProvider;
8513
8214
  exports.VirtualManager = VirtualManager;
8514
8215
  exports.VirtualPanel = VirtualPanel;
8515
8216
  exports.VirtualRenderingStrategy = VirtualRenderingStrategy;
8516
- exports.camelize = camelize;
8517
8217
  exports.checkExistence = checkExistence;
8518
8218
  exports.circulateIndex = circulateIndex;
8519
8219
  exports.circulatePosition = circulatePosition;
@@ -8522,7 +8222,6 @@ exports["default"] = Flicking;
8522
8222
  exports.find = find;
8523
8223
  exports.findIndex = findIndex;
8524
8224
  exports.findRight = findRight;
8525
- exports.getDataAttributes = getDataAttributes;
8526
8225
  exports.getDefaultCameraTransform = getDefaultCameraTransform;
8527
8226
  exports.getDirection = getDirection;
8528
8227
  exports.getElement = getElement;