@souscheflabs/reanimated-flashlist 0.1.7

package/lib/contexts/DragStateContext.js

@@ -0,0 +1,148 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DragStateProvider = exports.useDragState = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_reanimated_1 = require("react-native-reanimated");
+const constants_1 = require("../constants");
+const DragStateContext = (0, react_1.createContext)(null);
+/**
+ * Hook to access shared drag state from context.
+ * Must be used within DragStateProvider.
+ */
+const useDragState = () => {
+    const context = (0, react_1.useContext)(DragStateContext);
+    if (!context) {
+        throw new Error('useDragState must be used within DragStateProvider');
+    }
+    return context;
+};
+exports.useDragState = useDragState;
+/**
+ * Provider that creates shared Reanimated values for drag state.
+ *
+ * These values are shared across all list items:
+ * - The dragged item writes to them during drag gestures
+ * - Non-dragged items read them to calculate their shift offset
+ * - Scroll state enables viewport-aware hover calculations
+ *
+ * Using SharedValues ensures animations run on the UI thread at 60fps.
+ */
+const DragStateProvider = ({ children, config: configOverrides, }) => {
+    // Merge config with defaults
+    const config = (0, react_1.useMemo)(() => ({ ...constants_1.DEFAULT_DRAG_CONFIG, ...configOverrides }), [configOverrides]);
+    // Shared values are created once and persist for the lifetime of the provider
+    const isDragging = (0, react_native_reanimated_1.useSharedValue)(false);
+    const draggedIndex = (0, react_native_reanimated_1.useSharedValue)(-1);
+    const draggedItemId = (0, react_native_reanimated_1.useSharedValue)('');
+    const currentTranslateY = (0, react_native_reanimated_1.useSharedValue)(0);
+    const draggedScale = (0, react_native_reanimated_1.useSharedValue)(1);
+    // Scroll state for viewport-aware calculations and autoscroll
+    const scrollOffset = (0, react_native_reanimated_1.useSharedValue)(0);
+    const dragStartScrollOffset = (0, react_native_reanimated_1.useSharedValue)(0);
+    const contentHeight = (0, react_native_reanimated_1.useSharedValue)(0);
+    const visibleHeight = (0, react_native_reanimated_1.useSharedValue)(0);
+    const listTopY = (0, react_native_reanimated_1.useSharedValue)(0);
+    // Counter to force useDerivedValue re-evaluation on every drag state change
+    const dragUpdateTrigger = (0, react_native_reanimated_1.useSharedValue)(0);
+    // Measured height of dragged item (0 = use fallback from config)
+    const measuredItemHeight = (0, react_native_reanimated_1.useSharedValue)(0);
+    // Flag to freeze shift values during drop transition
+    const isDropping = (0, react_native_reanimated_1.useSharedValue)(false);
+    // Ref to FlashList for autoscroll operations
+    const listRef = (0, react_1.useRef)(null);
+    // Register the FlashList ref
+    const setListRef = (0, react_1.useCallback)((ref) => {
+        listRef.current = ref;
+    }, []);
+    // Scroll to offset (called via scheduleOnRN from worklet for autoscroll)
+    const scrollToOffset = (0, react_1.useCallback)((offset, animated = false) => {
+        listRef.current?.scrollToOffset({ offset, animated });
+    }, []);
+    // Reset drag state after drop
+    const resetDragState = (0, react_1.useCallback)(() => {
+        isDragging.value = false;
+        draggedIndex.value = -1;
+        draggedItemId.value = '';
+        currentTranslateY.value = 0;
+        draggedScale.value = 1;
+        dragStartScrollOffset.value = 0;
+        measuredItemHeight.value = 0;
+        isDropping.value = false;
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    // Context value is stable since SharedValue references don't change
+    const value = (0, react_1.useMemo)(() => ({
+        isDragging,
+        draggedIndex,
+        draggedItemId,
+        currentTranslateY,
+        draggedScale,
+        scrollOffset,
+        dragStartScrollOffset,
+        contentHeight,
+        visibleHeight,
+        listTopY,
+        dragUpdateTrigger,
+        measuredItemHeight,
+        isDropping,
+        setListRef,
+        scrollToOffset,
+        resetDragState,
+        config,
+    }), [
+        isDragging,
+        draggedIndex,
+        draggedItemId,
+        currentTranslateY,
+        draggedScale,
+        scrollOffset,
+        dragStartScrollOffset,
+        contentHeight,
+        visibleHeight,
+        listTopY,
+        dragUpdateTrigger,
+        measuredItemHeight,
+        isDropping,
+        setListRef,
+        scrollToOffset,
+        resetDragState,
+        config,
+    ]);
+    return (<DragStateContext.Provider value={value}>
+      {children}
+    </DragStateContext.Provider>);
+};
+exports.DragStateProvider = DragStateProvider;

package/lib/contexts/ListAnimationContext.d.ts

@@ -0,0 +1,104 @@
+import React, { type ReactNode } from 'react';
+import { type SharedValue } from 'react-native-reanimated';
+import type { AnimationDirection, ExitAnimationTrigger, PendingEntryAnimation } from '../types';
+/**
+ * Context value for coordinating entry/exit animations across list items.
+ *
+ * This enables:
+ * 1. Direct O(1) animation triggers from subscription handlers
+ * 2. Entry animation coordination when items appear in new locations
+ * 3. Layout animation coordination when items are removed
+ * 4. Decoupled animation state from React render cycle
+ */
+export interface ListAnimationContextValue {
+    /**
+     * Register an exit animation trigger for an item.
+     * Called by useListExitAnimation on mount.
+     */
+    registerAnimationTrigger: (itemId: string, trigger: ExitAnimationTrigger) => void;
+    /**
+     * Unregister an exit animation trigger.
+     * Called by useListExitAnimation on unmount.
+     */
+    unregisterAnimationTrigger: (itemId: string) => void;
+    /**
+     * Trigger exit animation for a specific item.
+     * Returns true if animation was triggered, false if item not found.
+     */
+    triggerExitAnimation: (itemId: string, direction: AnimationDirection, onComplete: () => void) => boolean;
+    /**
+     * Queue an entry animation for an item that's about to appear.
+     * Call this before the item is added to the list.
+     */
+    queueEntryAnimation: (itemId: string, direction: AnimationDirection) => void;
+    /**
+     * Check and claim a pending entry animation for an item.
+     * Returns the animation info if found, null otherwise.
+     * Calling this consumes the pending animation.
+     */
+    claimEntryAnimation: (itemId: string) => PendingEntryAnimation | null;
+    /**
+     * Register an item that is currently exiting (for layout compensation).
+     * Called when exit animation starts.
+     */
+    registerExitingItem: (itemId: string, index: number, height: number) => void;
+    /**
+     * Unregister an exiting item (called when removal is complete).
+     */
+    unregisterExitingItem: (itemId: string) => void;
+    /**
+     * Get info about items currently exiting above a given index.
+     * Returns the total height of exiting items above.
+     */
+    getExitingHeightAbove: (index: number) => number;
+    /**
+     * SharedValue that increments when exiting items change.
+     * Used to trigger useDerivedValue re-evaluation.
+     */
+    exitingItemsVersion: SharedValue<number>;
+    /**
+     * Duration for layout animations (ms).
+     */
+    layoutAnimationDuration: number;
+}
+/**
+ * Hook to access list animation context.
+ * Throws if used outside ListAnimationProvider.
+ */
+export declare const useListAnimation: () => ListAnimationContextValue;
+/**
+ * Hook to optionally access list animation context.
+ * Returns null if used outside ListAnimationProvider.
+ * Useful for components that can work with or without animations.
+ */
+export declare const useListAnimationOptional: () => ListAnimationContextValue | null;
+interface ListAnimationProviderProps {
+    children: ReactNode;
+    /**
+     * How long pending entry animations are valid (ms)
+     * @default 5000
+     */
+    entryAnimationTimeout?: number;
+    /**
+     * Duration for layout animations when items are removed (ms)
+     * @default 200
+     */
+    layoutAnimationDuration?: number;
+    /**
+     * Whether to enable native LayoutAnimation for remaining items
+     * @default true
+     */
+    enableLayoutAnimation?: boolean;
+}
+/**
+ * Provider for coordinating entry/exit animations across list items.
+ *
+ * Features:
+ * - O(1) exit animation triggers via Map lookup
+ * - Entry animation queuing with automatic expiration
+ * - Layout animation coordination when items are removed
+ * - Decoupled from React render cycle for performance
+ */
+export declare const ListAnimationProvider: React.FC<ListAnimationProviderProps>;
+export {};
+//# sourceMappingURL=ListAnimationContext.d.ts.map

package/lib/contexts/ListAnimationContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListAnimationContext.d.ts","sourceRoot":"","sources":["../../src/contexts/ListAnimationContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAMZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AAEf,OAAO,EAAkB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,KAAK,EACV,kBAAkB,EAClB,oBAAoB,EACpB,qBAAqB,EAEtB,MAAM,UAAU,CAAC;AAElB;;;;;;;;GAQG;AACH,MAAM,WAAW,yBAAyB;IACxC;;;OAGG;IACH,wBAAwB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAElF;;;OAGG;IACH,0BAA0B,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAErD;;;OAGG;IACH,oBAAoB,EAAE,CACpB,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,kBAAkB,EAC7B,UAAU,EAAE,MAAM,IAAI,KACnB,OAAO,CAAC;IAEb;;;OAGG;IACH,mBAAmB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,kBAAkB,KAAK,IAAI,CAAC;IAE7E;;;;OAIG;IACH,mBAAmB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,qBAAqB,GAAG,IAAI,CAAC;IAEtE;;;OAGG;IACH,mBAAmB,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAE7E;;OAEG;IACH,qBAAqB,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IAEhD;;;OAGG;IACH,qBAAqB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAEjD;;;OAGG;IACH,mBAAmB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAEzC;;OAEG;IACH,uBAAuB,EAAE,MAAM,CAAC;CACjC;AAID;;;GAGG;AACH,eAAO,MAAM,gBAAgB,QAAO,yBAMnC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,wBAAwB,QAAO,yBAAyB,GAAG,IAEvE,CAAC;AAEF,UAAU,0BAA0B;IAClC,QAAQ,EAAE,SAAS,CAAC;IACpB;;;OAGG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B;;;OAGG;IACH,uBAAuB,CAAC,EAAE,MAAM,CAAC;IACjC;;;OAGG;IACH,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAED;;;;;;;;GAQG;AACH,eAAO,MAAM,qBAAqB,EAAE,KAAK,CAAC,EAAE,CAAC,0BAA0B,CA+JtE,CAAC"}

package/lib/contexts/ListAnimationContext.js

@@ -0,0 +1,184 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ListAnimationProvider = exports.useListAnimationOptional = exports.useListAnimation = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_1 = require("react-native");
+const react_native_reanimated_1 = require("react-native-reanimated");
+const ListAnimationContext = (0, react_1.createContext)(null);
+/**
+ * Hook to access list animation context.
+ * Throws if used outside ListAnimationProvider.
+ */
+const useListAnimation = () => {
+    const context = (0, react_1.useContext)(ListAnimationContext);
+    if (!context) {
+        throw new Error('useListAnimation must be used within ListAnimationProvider');
+    }
+    return context;
+};
+exports.useListAnimation = useListAnimation;
+/**
+ * Hook to optionally access list animation context.
+ * Returns null if used outside ListAnimationProvider.
+ * Useful for components that can work with or without animations.
+ */
+const useListAnimationOptional = () => {
+    return (0, react_1.useContext)(ListAnimationContext);
+};
+exports.useListAnimationOptional = useListAnimationOptional;
+/**
+ * Provider for coordinating entry/exit animations across list items.
+ *
+ * Features:
+ * - O(1) exit animation triggers via Map lookup
+ * - Entry animation queuing with automatic expiration
+ * - Layout animation coordination when items are removed
+ * - Decoupled from React render cycle for performance
+ */
+const ListAnimationProvider = ({ children, entryAnimationTimeout = 5000, layoutAnimationDuration = 200, enableLayoutAnimation = true, }) => {
+    // Map of itemId -> exit animation trigger function
+    const animationTriggersRef = (0, react_1.useRef)(new Map());
+    // Map of itemId -> pending entry animation
+    const pendingEntriesRef = (0, react_1.useRef)(new Map());
+    // Map of itemId -> exiting item info (for layout compensation)
+    const exitingItemsRef = (0, react_1.useRef)(new Map());
+    // SharedValue to trigger re-evaluation when exiting items change
+    const exitingItemsVersion = (0, react_native_reanimated_1.useSharedValue)(0);
+    const registerAnimationTrigger = (0, react_1.useCallback)((itemId, trigger) => {
+        animationTriggersRef.current.set(itemId, trigger);
+    }, []);
+    const unregisterAnimationTrigger = (0, react_1.useCallback)((itemId) => {
+        animationTriggersRef.current.delete(itemId);
+    }, []);
+    const triggerExitAnimation = (0, react_1.useCallback)((itemId, direction, onComplete) => {
+        const trigger = animationTriggersRef.current.get(itemId);
+        if (trigger) {
+            trigger(direction, onComplete);
+            return true;
+        }
+        return false;
+    }, []);
+    const queueEntryAnimation = (0, react_1.useCallback)((itemId, direction) => {
+        const entry = {
+            itemId,
+            direction,
+            timestamp: Date.now(),
+        };
+        pendingEntriesRef.current.set(itemId, entry);
+        // Auto-expire after timeout
+        setTimeout(() => {
+            const current = pendingEntriesRef.current.get(itemId);
+            if (current && current.timestamp === entry.timestamp) {
+                pendingEntriesRef.current.delete(itemId);
+            }
+        }, entryAnimationTimeout);
+    }, [entryAnimationTimeout]);
+    const claimEntryAnimation = (0, react_1.useCallback)((itemId) => {
+        const entry = pendingEntriesRef.current.get(itemId);
+        if (entry) {
+            pendingEntriesRef.current.delete(itemId);
+            // Check if still valid (not expired)
+            if (Date.now() - entry.timestamp < entryAnimationTimeout) {
+                return entry;
+            }
+        }
+        return null;
+    }, [entryAnimationTimeout]);
+    // Register an exiting item for layout compensation
+    const registerExitingItem = (0, react_1.useCallback)((itemId, index, height) => {
+        const info = {
+            itemId,
+            index,
+            height,
+            timestamp: Date.now(),
+        };
+        exitingItemsRef.current.set(itemId, info);
+        exitingItemsVersion.value = exitingItemsVersion.value + 1;
+        // Configure native LayoutAnimation for remaining items
+        if (enableLayoutAnimation) {
+            // Use custom config for smoother animation
+            react_native_1.LayoutAnimation.configureNext({
+                duration: layoutAnimationDuration,
+                update: {
+                    type: react_native_1.LayoutAnimation.Types.easeInEaseOut,
+                    property: react_native_1.LayoutAnimation.Properties.scaleY,
+                },
+            });
+        }
+    }, [enableLayoutAnimation, layoutAnimationDuration, exitingItemsVersion]);
+    // Unregister an exiting item
+    const unregisterExitingItem = (0, react_1.useCallback)((itemId) => {
+        exitingItemsRef.current.delete(itemId);
+        exitingItemsVersion.value = exitingItemsVersion.value + 1;
+    }, [exitingItemsVersion]);
+    // Get total height of exiting items above a given index
+    const getExitingHeightAbove = (0, react_1.useCallback)((index) => {
+        let totalHeight = 0;
+        exitingItemsRef.current.forEach(info => {
+            if (info.index < index) {
+                totalHeight += info.height;
+            }
+        });
+        return totalHeight;
+    }, []);
+    const value = (0, react_1.useMemo)(() => ({
+        registerAnimationTrigger,
+        unregisterAnimationTrigger,
+        triggerExitAnimation,
+        queueEntryAnimation,
+        claimEntryAnimation,
+        registerExitingItem,
+        unregisterExitingItem,
+        getExitingHeightAbove,
+        exitingItemsVersion,
+        layoutAnimationDuration,
+    }), [
+        registerAnimationTrigger,
+        unregisterAnimationTrigger,
+        triggerExitAnimation,
+        queueEntryAnimation,
+        claimEntryAnimation,
+        registerExitingItem,
+        unregisterExitingItem,
+        getExitingHeightAbove,
+        exitingItemsVersion,
+        layoutAnimationDuration,
+    ]);
+    return (<ListAnimationContext.Provider value={value}>
+      {children}
+    </ListAnimationContext.Provider>);
+};
+exports.ListAnimationProvider = ListAnimationProvider;

package/lib/contexts/index.d.ts

@@ -0,0 +1,5 @@
+export { DragStateProvider, useDragState } from './DragStateContext';
+export type { DragStateContextValue } from './DragStateContext';
+export { ListAnimationProvider, useListAnimation, useListAnimationOptional, } from './ListAnimationContext';
+export type { ListAnimationContextValue } from './ListAnimationContext';
+//# sourceMappingURL=index.d.ts.map

package/lib/contexts/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/contexts/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AACrE,YAAY,EAAE,qBAAqB,EAAE,MAAM,oBAAoB,CAAC;AAEhE,OAAO,EACL,qBAAqB,EACrB,gBAAgB,EAChB,wBAAwB,GACzB,MAAM,wBAAwB,CAAC;AAChC,YAAY,EAAE,yBAAyB,EAAE,MAAM,wBAAwB,CAAC"}

package/lib/contexts/index.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useListAnimationOptional = exports.useListAnimation = exports.ListAnimationProvider = exports.useDragState = exports.DragStateProvider = void 0;
+var DragStateContext_1 = require("./DragStateContext");
+Object.defineProperty(exports, "DragStateProvider", { enumerable: true, get: function () { return DragStateContext_1.DragStateProvider; } });
+Object.defineProperty(exports, "useDragState", { enumerable: true, get: function () { return DragStateContext_1.useDragState; } });
+var ListAnimationContext_1 = require("./ListAnimationContext");
+Object.defineProperty(exports, "ListAnimationProvider", { enumerable: true, get: function () { return ListAnimationContext_1.ListAnimationProvider; } });
+Object.defineProperty(exports, "useListAnimation", { enumerable: true, get: function () { return ListAnimationContext_1.useListAnimation; } });
+Object.defineProperty(exports, "useListAnimationOptional", { enumerable: true, get: function () { return ListAnimationContext_1.useListAnimationOptional; } });

package/lib/hooks/animations/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * Animation hooks for list items
+ *
+ * These hooks provide entry and exit animations for items
+ * being added to or removed from the list.
+ */
+export { useListExitAnimation } from './useListExitAnimation';
+export { useListEntryAnimation } from './useListEntryAnimation';
+//# sourceMappingURL=index.d.ts.map

package/lib/hooks/animations/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/hooks/animations/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC"}

package/lib/hooks/animations/index.js

@@ -0,0 +1,13 @@
+"use strict";
+/**
+ * Animation hooks for list items
+ *
+ * These hooks provide entry and exit animations for items
+ * being added to or removed from the list.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useListEntryAnimation = exports.useListExitAnimation = void 0;
+var useListExitAnimation_1 = require("./useListExitAnimation");
+Object.defineProperty(exports, "useListExitAnimation", { enumerable: true, get: function () { return useListExitAnimation_1.useListExitAnimation; } });
+var useListEntryAnimation_1 = require("./useListEntryAnimation");
+Object.defineProperty(exports, "useListEntryAnimation", { enumerable: true, get: function () { return useListEntryAnimation_1.useListEntryAnimation; } });

package/lib/hooks/animations/useListEntryAnimation.d.ts

@@ -0,0 +1,38 @@
+import type { EntryAnimationConfig } from '../../types';
+/**
+ * Hook for managing list item entry animations
+ *
+ * Provides coordinated slide and fade animations for items appearing
+ * in a new list (e.g., after being moved via subscription update).
+ *
+ * PERFORMANCE: Uses shared values with static defaults.
+ * Animation only triggers when an entry animation is claimed.
+ *
+ * IMPORTANT: This hook handles FlashList view recycling by accepting an itemId parameter.
+ * When the itemId changes (view recycled for a different item), animation state is reset.
+ *
+ * @param itemId - Unique identifier for the list item (used to detect view recycling)
+ * @param configOverrides - Optional animation configuration overrides
+ * @returns Animation styles for entry effect
+ *
+ * @example
+ * ```tsx
+ * const { entryAnimatedStyle } = useListEntryAnimation(item.id);
+ *
+ * <Animated.View style={[styles.container, entryAnimatedStyle]}>
+ *   {content}
+ * </Animated.View>
+ * ```
+ */
+export declare const useListEntryAnimation: (itemId: string, configOverrides?: Partial<EntryAnimationConfig>) => {
+    entryAnimatedStyle: {
+        opacity?: undefined;
+        transform?: undefined;
+    } | {
+        opacity: number;
+        transform: {
+            translateX: number;
+        }[];
+    };
+};
+//# sourceMappingURL=useListEntryAnimation.d.ts.map

package/lib/hooks/animations/useListEntryAnimation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useListEntryAnimation.d.ts","sourceRoot":"","sources":["../../../src/hooks/animations/useListEntryAnimation.ts"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,aAAa,CAAC;AAExD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,qBAAqB,GAChC,QAAQ,MAAM,EACd,kBAAkB,OAAO,CAAC,oBAAoB,CAAC;;;;;;;;;;CAmEhD,CAAC"}

package/lib/hooks/animations/useListEntryAnimation.js

@@ -0,0 +1,90 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useListEntryAnimation = void 0;
+const react_1 = require("react");
+const react_native_reanimated_1 = require("react-native-reanimated");
+const animations_1 = require("../../constants/animations");
+const ListAnimationContext_1 = require("../../contexts/ListAnimationContext");
+/**
+ * Hook for managing list item entry animations
+ *
+ * Provides coordinated slide and fade animations for items appearing
+ * in a new list (e.g., after being moved via subscription update).
+ *
+ * PERFORMANCE: Uses shared values with static defaults.
+ * Animation only triggers when an entry animation is claimed.
+ *
+ * IMPORTANT: This hook handles FlashList view recycling by accepting an itemId parameter.
+ * When the itemId changes (view recycled for a different item), animation state is reset.
+ *
+ * @param itemId - Unique identifier for the list item (used to detect view recycling)
+ * @param configOverrides - Optional animation configuration overrides
+ * @returns Animation styles for entry effect
+ *
+ * @example
+ * ```tsx
+ * const { entryAnimatedStyle } = useListEntryAnimation(item.id);
+ *
+ * <Animated.View style={[styles.container, entryAnimatedStyle]}>
+ *   {content}
+ * </Animated.View>
+ * ```
+ */
+const useListEntryAnimation = (itemId, configOverrides) => {
+    const animationContext = (0, ListAnimationContext_1.useListAnimationOptional)();
+    // Merge config with defaults
+    const config = {
+        fade: { ...animations_1.DEFAULT_ENTRY_ANIMATION.fade, ...configOverrides?.fade },
+        slide: { ...animations_1.DEFAULT_ENTRY_ANIMATION.slide, ...configOverrides?.slide },
+    };
+    // Shared values for entry animation - start at final position (no animation by default)
+    const translateX = (0, react_native_reanimated_1.useSharedValue)(0);
+    const opacity = (0, react_native_reanimated_1.useSharedValue)(1);
+    // Track if we've already checked for entry animation for this item
+    const hasCheckedRef = (0, react_1.useRef)(false);
+    const lastItemIdRef = (0, react_1.useRef)(itemId);
+    // Reset check flag when item ID changes (view recycled)
+    if (lastItemIdRef.current !== itemId) {
+        lastItemIdRef.current = itemId;
+        hasCheckedRef.current = false;
+        // Reset animation values for new item
+        translateX.value = 0;
+        opacity.value = 1;
+    }
+    // Check for pending entry animation on mount
+    (0, react_1.useEffect)(() => {
+        if (!animationContext || hasCheckedRef.current)
+            return;
+        hasCheckedRef.current = true;
+        const entry = animationContext.claimEntryAnimation(itemId);
+        if (entry) {
+            // Start from offset position (slide in from direction)
+            translateX.value = entry.direction * config.slide.distance;
+            opacity.value = 0;
+            // Animate to final position
+            translateX.value = (0, react_native_reanimated_1.withTiming)(0, {
+                duration: config.slide.duration,
+                easing: animations_1.standardEasing,
+            });
+            opacity.value = (0, react_native_reanimated_1.withTiming)(1, {
+                duration: config.fade.duration,
+                easing: animations_1.standardEasing,
+            });
+        }
+    }, [itemId, animationContext, translateX, opacity, config.slide, config.fade]);
+    // Animated style for entry effect
+    const entryAnimatedStyle = (0, react_native_reanimated_1.useAnimatedStyle)(() => {
+        // Fast path: no animation active (default state)
+        if (translateX.value === 0 && opacity.value === 1) {
+            return {};
+        }
+        return {
+            opacity: opacity.value,
+            transform: [{ translateX: translateX.value }],
+        };
+    });
+    return {
+        entryAnimatedStyle,
+    };
+};
+exports.useListEntryAnimation = useListEntryAnimation;