react-native-gesture-image-viewer 1.4.0 → 1.5.0

package/lib/typescript/src/types.d.ts

@@ -9,7 +9,7 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
     /**
      * When you want to efficiently manage multiple `GestureViewer` instances, you can use the `id` prop to use multiple `GestureViewer` components.
      * @remark `GestureViewer` automatically removes instances from memory when components are unmounted, so no manual memory management is required.
-     * @default 'default'
+     * @defaultValue 'default'
      */
     id?: string;
     /**
@@ -18,7 +18,7 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
     data: T[];
     /**
      * The index of the item to display in the `GestureViewer` when the component is mounted.
-     * @default 0
+     * @defaultValue 0
      */
     initialIndex?: number;
     /**
@@ -44,7 +44,7 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
     /**
      * The width of the `GestureViewer`.
      * @remark If you don't set this prop, the width of the `GestureViewer` will be the same as the width of the screen.
-     * @default screen width
+     * @defaultValue screen width
      */
     width?: number;
     /**
@@ -57,30 +57,30 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
      * **`true`**: Snap mode (`snapToInterval` auto-calculated)
      * - `snapToInterval` is automatically calculated based on `width` and `itemSpacing` values
      * - Use this option when you need item spacing
-     * @default false
+     * @defaultValue false
      *
      */
     useSnap?: boolean;
     /**
      * `dismissThreshold` controls when `onDismiss` is called by applying a threshold value during vertical gestures.
-     * @default 80
+     * @defaultValue 80
      */
     dismissThreshold?: number;
     /**
      * Calls `onDismiss` function when swiping down.
      * @remark Useful for closing modals with downward swipe gestures.
-     * @default true
+     * @defaultValue true
      */
     enableDismissGesture?: boolean;
     /**
      * Controls left/right swipe gestures.
      * @remark When `false`, horizontal gestures are disabled.
-     * @default true
+     * @defaultValue true
      */
     enableSwipeGesture?: boolean;
     /**
      * `resistance` controls the range of vertical movement by applying resistance during vertical gestures.
-     * @default 2
+     * @defaultValue 2
      */
     resistance?: number;
     /**
@@ -99,38 +99,179 @@ export interface GestureViewerProps<T = any, LC = typeof RNFlatList> {
     /**
      * By default, the background `opacity` gradually decreases from 1 to 0 during downward swipe gestures.
      * @remark When `false`, this animation is disabled.
-     * @default true
+     * @defaultValue true
      */
     animateBackdrop?: boolean;
     /**
      * Only works when zoom is active, allows moving item position when zoomed.
      * @remark When `false`, gesture movement is disabled during zoom.
-     * @default true
+     * @defaultValue true
      */
     enableZoomPanGesture?: boolean;
     /**
      * Controls two-finger pinch gestures.
      * @remark When `false`, two-finger zoom gestures are disabled.
-     * @default true
+     * @defaultValue true
      */
     enableZoomGesture?: boolean;
     /**
      * Controls double-tap zoom gestures.
      * @remark When `false`, double-tap zoom gestures are disabled.
-     * @default true
+     * @defaultValue true
      */
     enableDoubleTapGesture?: boolean;
     /**
      * The maximum zoom scale.
-     * @default 2
+     * @defaultValue 2
      */
     maxZoomScale?: number;
     /**
      * The spacing between items in pixels.
      * @remark Only applied when `useSnap` is `true`.
-     * @default 0
+     * @defaultValue 0
      */
     itemSpacing?: number;
 }
+/**
+ * Supported rotation angles in degrees.
+ */
+export type RotationAngle = 0 | 90 | 180 | 270 | 360;
+/**
+ * Controller for managing gesture-based image/content viewer interactions.
+ * Provides navigation, zoom, and rotation capabilities with state management.
+ */
+export type GestureViewerController = {
+    /**
+     * Navigates to the specified index in the viewer.
+     * Updates the currentIndex in the controller state.
+     *
+     * @param index - The target index (must be between 0 and totalCount - 1)
+     * @throws Will throw an error if index is out of bounds
+     *
+     * @example
+     * ```typescript
+     * controller.goToIndex(0); // Go to first item
+     * controller.goToIndex(controller.totalCount - 1); // Go to last item
+     * ```
+     */
+    goToIndex: (index: number) => void;
+    /**
+     * Navigates to the previous item in the sequence.
+     * If already at the first item, behavior depends on implementation (may wrap or do nothing).
+     * Updates currentIndex in the controller state.
+     */
+    goToPrevious: () => void;
+    /**
+     * Navigates to the next item in the sequence.
+     * If already at the last item, behavior depends on implementation (may wrap or do nothing).
+     * Updates currentIndex in the controller state.
+     */
+    goToNext: () => void;
+    /**
+     * Zooms in by the specified multiplier.
+     *
+     * @param multiplier - The zoom multiplier (0.01 - 1.0). Higher values zoom in more.
+     * @defaultValue 0.25
+     *
+     * @example
+     * ```typescript
+     * controller.zoomIn(); // Zoom in by 25%
+     * controller.zoomIn(0.5); // Zoom in by 50%
+     * ```
+     */
+    zoomIn: (multiplier?: number) => void;
+    /**
+     * Zooms out by the specified multiplier.
+     *
+     * @param multiplier - The zoom multiplier (0.01 - 1.0). Higher values zoom out more.
+     * @defaultValue 0.25
+     *
+     * @example
+     * ```typescript
+     * controller.zoomOut(); // Zoom out by 25%
+     * controller.zoomOut(0.1); // Zoom out by 10%
+     * ```
+     */
+    zoomOut: (multiplier?: number) => void;
+    /**
+     * Resets the zoom level to the specified scale.
+     *
+     * @param scale - The scale to reset to (1.0 = original size)
+     * @defaultValue 1.0
+     *
+     * @example
+     * ```typescript
+     * controller.resetZoom(); // Reset to original size
+     * controller.resetZoom(0.5); // Reset to 50% of original size
+     * ```
+     */
+    resetZoom: (scale?: number) => void;
+    /**
+     * Rotates the content by the specified angle.
+     *
+     * @param angle - Rotation angle in degrees. Must be one of: 0, 90, 180, 270, 360
+     * @param clockwise - Direction of rotation when angle is not 0 or 360
+     * @defaultValue angle: `90`, clockwise: `true`
+     *
+     * @remarks
+     * - Angle 0 or 360 resets rotation regardless of clockwise parameter
+     * - The clockwise parameter only affects rotation when angle is 90, 180, or 270
+     * - Rotation is cumulative and affects the current orientation
+     *
+     * @example
+     * ```typescript
+     * controller.rotate(); // Rotate 90 degrees clockwise
+     * controller.rotate(0); // Reset rotation
+     * controller.rotate(90, false); // Rotate 90 degrees counter-clockwise
+     * controller.rotate(180); // Rotate 180 degrees (clockwise by default)
+     * controller.rotate(270, false); // Rotate 270 degrees counter-clockwise
+     * controller.rotate(360); // Reset rotation (same as 0)
+     * ```
+     */
+    rotate: (angle?: RotationAngle, clockwise?: boolean) => void;
+} & GestureViewerControllerState;
+/**
+ * State information for the gesture viewer controller.
+ * Contains read-only properties that reflect the current state.
+ */
+export type GestureViewerControllerState = {
+    /**
+     * The current index of the active item in the viewer.
+     *
+     * @remarks
+     * This value is automatically updated when navigation methods are called.
+     *
+     * @example
+     * ```typescript
+     * console.log(`Currently viewing item ${controller.currentIndex + 1} of ${controller.totalCount}`);
+     * ```
+     */
+    readonly currentIndex: number;
+    /**
+     * The total number of items available in the viewer.
+     *
+     * @remarks
+     * This value determines the valid range for currentIndex (0 to totalCount - 1).
+     *
+     * @example
+     * ```typescript
+     * const hasNext = controller.currentIndex < controller.totalCount - 1;
+     * const hasPrevious = controller.currentIndex > 0;
+     * ```
+     */
+    readonly totalCount: number;
+};
+export type GestureViewerEventType = 'zoomChange' | 'rotationChange';
+export type GestureViewerEventData = {
+    zoomChange: {
+        scale: number;
+        previousScale: number | null;
+    };
+    rotationChange: {
+        rotation: number;
+        previousRotation: number | null;
+    };
+};
+export type GestureViewerEventCallback<T extends GestureViewerEventType> = (data: GestureViewerEventData[T]) => void;
 export {};
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,QAAQ,IAAI,UAAU,EAAE,UAAU,IAAI,YAAY,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC7G,OAAO,KAAK,EAAE,QAAQ,IAAI,UAAU,EAAE,UAAU,IAAI,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAEvG,MAAM,MAAM,iBAAiB,GAAG,OAAO,UAAU,GAAG,OAAO,UAAU,CAAC;AACtE,MAAM,MAAM,mBAAmB,GAAG,OAAO,YAAY,GAAG,OAAO,YAAY,CAAC;AAE5E,KAAK,iBAAiB,CAAC,CAAC,IAAI,CAAC,SAAS,KAAK,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAE/E,KAAK,oBAAoB,CAAC,EAAE,IAAI,EAAE,SAAS,iBAAiB,GACxD,KAAK,CAAC,cAAc,CAAC,EAAE,CAAC,GACxB,EAAE,SAAS,mBAAmB,GAC5B,KAAK,CAAC,cAAc,CAAC,EAAE,CAAC,GACxB,iBAAiB,CAAC,EAAE,CAAC,CAAC;AAE5B,MAAM,WAAW,kBAAkB,CAAC,CAAC,GAAG,GAAG,EAAE,EAAE,GAAG,OAAO,UAAU;IACjE;;;;OAIG;IACH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB;;OAEG;IACH,UAAU,EAAE,CAAC,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,YAAY,CAAC;IAC3D;;OAEG;IACH,eAAe,CAAC,EAAE,CAAC,QAAQ,EAAE,KAAK,CAAC,YAAY,KAAK,KAAK,CAAC,YAAY,CAAC;IACvE;;OAEG;IACH,aAAa,EAAE,EAAE,CAAC;IAClB;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;;;;;;;;;;;OAYG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAG1B;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,OAAO,CAAC;IAC7B;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,EAAE,CAAC,CAAC,CAAC;IAC9C;;OAEG;IACH,aAAa,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IACtC;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAC;IAC/B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B;;;;OAIG;IACH,sBAAsB,CAAC,EAAE,OAAO,CAAC;IACjC;;;OAGG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"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"}

package/lib/typescript/src/useGestureViewer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAE1B,MAAM,cAAc,CAAC;AActB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGlD,KAAK,qBAAqB,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CACxC,kBAAkB,CAAC,CAAC,CAAC,EACrB,YAAY,GAAG,iBAAiB,GAAG,eAAe,GAAG,WAAW,GAAG,gBAAgB,GAAG,eAAe,CACtG,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,CAAC,GAAG,GAAG,EAAE,yQAoBvC,qBAAqB,CAAC,CAAC,CAAC;;;;;;;;;iCA8If,oBAAoB,CAAC,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4QlD,CAAC"}
+{"version":3,"file":"useGestureViewer.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewer.ts"],"names":[],"mappings":"AACA,OAAO,EAEL,KAAK,iBAAiB,EACtB,KAAK,oBAAoB,EAE1B,MAAM,cAAc,CAAC;AActB,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAGlD,KAAK,qBAAqB,CAAC,CAAC,GAAG,GAAG,IAAI,IAAI,CACxC,kBAAkB,CAAC,CAAC,CAAC,EACrB,YAAY,GAAG,iBAAiB,GAAG,eAAe,GAAG,WAAW,GAAG,gBAAgB,GAAG,eAAe,CACtG,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,CAAC,GAAG,GAAG,EAAE,yQAoBvC,qBAAqB,CAAC,CAAC,CAAC;;;;;;;;;iCAoKf,oBAAoB,CAAC,iBAAiB,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4QlD,CAAC"}

package/lib/typescript/src/useGestureViewerController.d.ts

@@ -1,12 +1,55 @@
-export declare const useGestureViewerController: (id?: string) => {
-    goToIndex: (index: number) => void;
-    goToPrevious: () => void;
-    goToNext: () => void;
-    zoomIn: (multiplier?: number) => void;
-    zoomOut: (multiplier?: number) => void;
-    resetZoom: (scale?: number) => void;
-    rotate: (angle?: 0 | 90 | 180 | 270 | 360, clockwise?: boolean) => void;
-    currentIndex: number;
-    totalCount: number;
-};
+import type { GestureViewerController } from './types';
+/**
+ * Hook to control the gesture viewer programmatically.
+ *
+ * @param id - Viewer instance identifier (default: 'default')
+ * @returns Methods and state for controlling the viewer
+ *
+ * **Available methods:**
+ * - `goToIndex(index: number)` - Navigate to specific index (0 to totalCount-1)
+ * - `goToPrevious()` - Navigate to previous item
+ * - `goToNext()` - Navigate to next item
+ * - `zoomIn(multiplier?: number)` - Zoom in (default: 0.25)
+ * - `zoomOut(multiplier?: number)` - Zoom out (default: 0.25)
+ * - `resetZoom(scale?: number)` - Reset zoom level (default: 1.0)
+ * - `rotate(angle?: 0|90|180|270|360, clockwise?: boolean)` - Rotate content (default: 90° clockwise)
+ *
+ * **Available state:**
+ * - `currentIndex: number` - Current active index (read-only)
+ * - `totalCount: number` - Total number of items (read-only)
+ *
+ * @example
+ * ```tsx
+ * const { goToIndex, goToNext, goToPrevious, zoomIn, zoomOut, resetZoom, rotate, currentIndex, totalCount } = useGestureViewerController();
+ *
+ * // Navigate to specific index
+ * goToIndex(2);
+ *
+ * // Go to next image
+ * goToNext();
+ *
+ * // Zoom in by 25%
+ * zoomIn();
+ *
+ * // Zoom out by 50%
+ * zoomOut(0.5);
+ *
+ * // Reset to original size
+ * resetZoom();
+ *
+ * // Rotate 90 degrees clockwise
+ * rotate();
+ *
+ * // Rotate 180 degrees
+ * rotate(180);
+ *
+ * // Check current state
+ * console.log(`Image ${currentIndex + 1} of ${totalCount}`);
+ *
+ * // Check navigation availability
+ * const canGoNext = currentIndex < totalCount - 1;
+ * const canGoPrevious = currentIndex > 0;
+ * ```
+ */
+export declare const useGestureViewerController: (id?: string) => GestureViewerController;
 //# sourceMappingURL=useGestureViewerController.d.ts.map

package/lib/typescript/src/useGestureViewerController.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGestureViewerController.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerController.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,0BAA0B,GAAI,WAAc;;;;;;;;;;CA8CxD,CAAC"}
+{"version":3,"file":"useGestureViewerController.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerController.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,uBAAuB,EAAgC,MAAM,SAAS,CAAC;AAErF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmDG;AACH,eAAO,MAAM,0BAA0B,GAAI,WAAc,KAAG,uBA6C3D,CAAC"}

package/lib/typescript/src/useGestureViewerEvent.d.ts

@@ -0,0 +1,50 @@
+import type { GestureViewerEventCallback, GestureViewerEventType } from './types';
+/**
+ * Hook for subscribing to GestureViewer events on the default instance.
+ *
+ * This hook allows you to listen to specific events from the default GestureViewer instance
+ * (with ID 'default'), such as zoom changes or rotation changes. Events are automatically
+ * throttled to prevent excessive callback invocations during gestures.
+ *
+ * @param eventType - The type of event to listen for
+ * @param callback - Function to call when the event occurs
+ *
+ * @example
+ * ```tsx
+ * // Listen to zoom changes on the default instance (ID: 'default')
+ * useGestureViewerEvent('zoomChange', (data) => {
+ *   console.log(`Zoom changed from ${data.previousScale} to ${data.scale}`);
+ * });
+ *
+ * // Listen to rotation changes on the default instance (ID: 'default')
+ * useGestureViewerEvent('rotationChange', (data) => {
+ *   console.log(`Rotation changed from ${data.previousRotation}° to ${data.rotation}°`);
+ * });
+ * ```
+ */
+export declare function useGestureViewerEvent<T extends GestureViewerEventType>(eventType: T, callback: GestureViewerEventCallback<T>): void;
+/**
+ * Hook for subscribing to GestureViewer events with a specific instance ID.
+ *
+ * Use this overload when you have multiple GestureViewer instances and need
+ * to listen to events from a specific one.
+ *
+ * @param id - The unique identifier of the GestureViewer instance
+ * @param eventType - The type of event to listen for
+ * @param callback - Function to call when the event occurs
+ *
+ * @example
+ * ```tsx
+ * // Listen to zoom changes on a specific instance
+ * useGestureViewerEvent('gallery', 'zoomChange', (data) => {
+ *   console.log(`Gallery zoom: ${data.scale}x`);
+ * });
+ *
+ * // Listen to rotation changes on a modal viewer
+ * useGestureViewerEvent('modal-viewer', 'rotationChange', (data) => {
+ *   updateRotationIndicator(data.rotation);
+ * });
+ * ```
+ */
+export declare function useGestureViewerEvent<T extends GestureViewerEventType>(id: string, eventType: T, callback: GestureViewerEventCallback<T>): void;
+//# sourceMappingURL=useGestureViewerEvent.d.ts.map

package/lib/typescript/src/useGestureViewerEvent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useGestureViewerEvent.d.ts","sourceRoot":"","sources":["../../../src/useGestureViewerEvent.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,0BAA0B,EAAE,sBAAsB,EAAE,MAAM,SAAS,CAAC;AAElF;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,sBAAsB,EACpE,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,0BAA0B,CAAC,CAAC,CAAC,GACtC,IAAI,CAAC;AAER;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,wBAAgB,qBAAqB,CAAC,CAAC,SAAS,sBAAsB,EACpE,EAAE,EAAE,MAAM,EACV,SAAS,EAAE,CAAC,EACZ,QAAQ,EAAE,0BAA0B,CAAC,CAAC,CAAC,GACtC,IAAI,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gesture-image-viewer",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "🖼️ A highly customizable and easy-to-use React Native image viewer with gesture support and external controls",
   "main": "./lib/module/index.js",
   "types": "./lib/typescript/src/index.d.ts",

package/src/GestureViewerManager.ts

@@ -1,11 +1,12 @@
 import { type SharedValue, withTiming } from 'react-native-reanimated';
+import type {
+  GestureViewerControllerState,
+  GestureViewerEventCallback,
+  GestureViewerEventData,
+  GestureViewerEventType,
+} from './types';
 import { createBoundsConstraint } from './utils';
 
-export type GestureViewerManagerState = {
-  currentIndex: number;
-  dataLength: number;
-};
-
 class GestureViewerManager {
   private currentIndex = 0;
   private dataLength = 0;
@@ -17,8 +18,9 @@ class GestureViewerManager {
   private maxZoomScale = 2;
   private listRef: any | null = null;
   private enableSwipeGesture = true;
-  private listeners = new Set<(state: GestureViewerManagerState) => void>();
+  private listeners = new Set<(state: GestureViewerControllerState) => void>();
   private rotation: SharedValue<number> | null = null;
+  private eventListeners = new Map<GestureViewerEventType, Set<(data: any) => void>>();
 
   private notifyListeners() {
     const state = this.getState();
@@ -26,7 +28,7 @@ class GestureViewerManager {
     this.listeners.forEach((listener) => listener(state));
   }
 
-  subscribe(listener: (state: GestureViewerManagerState) => void) {
+  subscribe(listener: (state: GestureViewerControllerState) => void) {
     this.listeners.add(listener);
 
     return () => {
@@ -34,10 +36,46 @@ class GestureViewerManager {
     };
   }
 
+  addEventListener<T extends GestureViewerEventType>(eventType: T, callback: GestureViewerEventCallback<T>) {
+    if (!this.eventListeners.has(eventType)) {
+      this.eventListeners.set(eventType, new Set());
+    }
+
+    this.eventListeners.get(eventType)?.add(callback);
+
+    return () => {
+      const listeners = this.eventListeners.get(eventType);
+
+      if (listeners) {
+        listeners.delete(callback);
+
+        if (listeners.size === 0) {
+          this.eventListeners.delete(eventType);
+        }
+      }
+    };
+  }
+
+  private emitEvent<T extends GestureViewerEventType>(eventType: T, data: GestureViewerEventData[T]) {
+    const listeners = this.eventListeners.get(eventType);
+
+    if (listeners) {
+      listeners.forEach((callback) => callback(data));
+    }
+  }
+
+  emitZoomChange = (scale: number, previousScale: number | null) => {
+    this.emitEvent('zoomChange', { scale, previousScale });
+  };
+
+  emitRotationChange = (rotation: number, previousRotation: number | null) => {
+    this.emitEvent('rotationChange', { rotation, previousRotation });
+  };
+
   getState() {
     return {
       currentIndex: this.currentIndex,
-      dataLength: this.dataLength,
+      totalCount: this.dataLength,
     };
   }
 
@@ -87,20 +125,6 @@ class GestureViewerManager {
     this.rotation = rotation;
   }
 
-  /**
-   * @param angle - The angle to rotate.
-   * @default 90 (0, 90, 180, 270, 360)
-   * @param clockwise - The direction to rotate.
-   * @default true (clockwise)
-   *
-   * @example
-   * rotate(0) // reset rotation
-   * rotate(number, false) // rotate {number} degrees counter-clockwise
-   * rotate(90) // rotate 90 degrees clockwise
-   * rotate(180) // rotate 180 degrees clockwise
-   * rotate(270) // rotate 270 degrees clockwise
-   * rotate(360) // rotate 360 degrees clockwise
-   */
   rotate = (angle: 0 | 90 | 180 | 270 | 360 = 90, clockwise = true) => {
     const MAX_ANGLE = 360;
 
@@ -130,11 +154,6 @@ class GestureViewerManager {
     this.rotation.value = withTiming(nextAngle);
   };
 
-  /**
-   * @param multiplier - The multiplier to zoom in.
-   * @range 0.01 - 1
-   * @default 0.25
-   */
   zoomIn = (multiplier = 0.25) => {
     if (!this.scale || !this.translateX || !this.translateY || multiplier < 0.01 || multiplier > 1) {
       return;
@@ -157,11 +176,6 @@ class GestureViewerManager {
     this.translateY.value = withTiming(translateY);
   };
 
-  /**
-   * @param multiplier - The multiplier to zoom out.
-   * @range 0.01 - 1
-   * @default 0.25
-   */
   zoomOut = (multiplier = 0.25) => {
     if (!this.scale || !this.translateX || !this.translateY || multiplier < 0.01 || multiplier > 1) {
       return;
@@ -190,10 +204,6 @@ class GestureViewerManager {
     this.translateY.value = withTiming(translateY);
   };
 
-  /**
-   * @param scale - The scale to reset to.
-   * @default 1
-   */
   resetZoom = (scale = 1) => {
     if (!this.scale || !this.translateX || !this.translateY || scale <= 0 || scale > this.maxZoomScale) {
       return;
@@ -244,6 +254,7 @@ class GestureViewerManager {
     this.translateX = null;
     this.translateY = null;
     this.rotation = null;
+    this.eventListeners.clear();
   }
 }
 

package/src/index.tsx

@@ -1,3 +1,11 @@
 export { GestureViewer } from './GestureViewer';
-export type { GestureViewerProps } from './types';
+export type {
+  GestureViewerController,
+  GestureViewerControllerState,
+  GestureViewerEventCallback,
+  GestureViewerEventData,
+  GestureViewerEventType,
+  GestureViewerProps,
+} from './types';
 export { useGestureViewerController } from './useGestureViewerController';
+export { useGestureViewerEvent } from './useGestureViewerEvent';