From 32bc7850f917e1f68df57ee68d122ba54bd8acab Mon Sep 17 00:00:00 2001
From: malangfox <ahn3407@naver.com>
Date: Fri, 29 Nov 2024 16:35:59 +0900
Subject: [PATCH] feat: add sideIndex to changed, willchange event

---
 src/CrossFlicking.ts | 19 +++++++++++++++++++
 1 file changed, 19 insertions(+)

diff --git a/src/CrossFlicking.ts b/src/CrossFlicking.ts
index 965f19e90c..22938a8cd6 100644
--- a/src/CrossFlicking.ts
+++ b/src/CrossFlicking.ts
@@ -61,6 +61,14 @@ export interface SideState {
   element: HTMLElement;
 }
 
+interface CrossFlickingChangedEvent extends ChangedEvent {
+  sideIndex?: number;
+}
+
+interface CrossFlickingWillChangeEvent extends WillChangeEvent {
+  sideIndex?: number;
+}
+
 export class CrossFlicking extends Flicking {
   // Core components
   private _sideFlicking: Flicking[];
@@ -82,6 +90,10 @@ export class CrossFlicking extends Flicking {
     return this._sideFlicking;
   }
 
+  public get sideIndex() {
+    return this._sideFlicking.map(i => i.index);
+  }
+
   public get sideState() {
     return this._sideState;
   }
@@ -155,6 +167,9 @@ export class CrossFlicking extends Flicking {
     this.on(EVENTS.HOLD_START, this._onHorizontalHoldStart);
     this.on(EVENTS.MOVE, this._onHorizontalMove);
     this.on(EVENTS.MOVE_END, this._onHorizontalMoveEnd);
+    [EVENTS.CHANGED, EVENTS.WILL_CHANGE].forEach((event) => {
+      this.on(event, this._addSideIndex);
+    });
 
     this._sideFlicking.forEach((flicking, mainIndex) => {
       flicking.on(EVENTS.HOLD_START, this._onSideHoldStart);
@@ -377,6 +392,10 @@ export class CrossFlicking extends Flicking {
     });
   };
 
+  private _addSideIndex = (e: ChangedEvent | WillChangeEvent): void => {
+    (e as CrossFlickingChangedEvent | CrossFlickingWillChangeEvent).sideIndex = this._sideFlicking[e.index].index;
+  };
+
   private _onHorizontalHoldStart = (): void => {
     this._setDraggable(MOVE_DIRECTION.HORIZONTAL, true);
     this._moveDirection = null;