@souscheflabs/reanimated-flashlist 0.1.7

package/lib/AnimatedFlashListItem.js

@@ -0,0 +1,155 @@
+"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.AnimatedFlashListItem = void 0;
+const react_1 = __importStar(require("react"));
+const react_native_reanimated_1 = __importStar(require("react-native-reanimated"));
+const hooks_1 = require("./hooks");
+const contexts_1 = require("./contexts");
+/**
+ * Internal item wrapper that provides all animation functionality.
+ *
+ * This component:
+ * 1. Sets up drag gesture and shift animations
+ * 2. Sets up entry/exit animations
+ * 3. Combines all animated styles
+ * 4. Passes everything to the consumer's renderItem function
+ *
+ * @internal
+ */
+function AnimatedFlashListItemInner({ item, index, totalItems, isDragEnabled, renderItem, onReorderByDelta, onHapticFeedback, }) {
+    // Animated ref for measuring item height on drag start
+    const containerRef = (0, react_native_reanimated_1.useAnimatedRef)();
+    // Track measured height for layout compensation
+    const measuredHeightRef = (0, react_1.useRef)(0);
+    // List animation context for subscription-triggered animations and layout compensation
+    const animationContext = (0, contexts_1.useListAnimationOptional)();
+    // === DRAG HOOKS ===
+    // Pan gesture for drag-to-reorder
+    const { panGesture, isDragging, translateY } = (0, hooks_1.useDragGesture)({
+        itemId: item.id,
+        index,
+        totalItems,
+        enabled: isDragEnabled,
+        containerRef,
+    }, {
+        onReorderByDelta,
+        onHapticFeedback,
+    });
+    // Shift animation for non-dragged items
+    const { shiftY } = (0, hooks_1.useDragShift)({ itemId: item.id, index });
+    // Handle index changes after cache updates (drop compensation)
+    (0, hooks_1.useDropCompensation)({ itemId: item.id, index, translateY, shiftY });
+    // Animated style for drag transforms
+    const { dragAnimatedStyle } = (0, hooks_1.useDragAnimatedStyle)(item.id, isDragging, translateY, shiftY);
+    // === ANIMATION HOOKS ===
+    // Callbacks for layout compensation (register/unregister exiting items)
+    const onExitStart = (0, react_1.useCallback)((exitIndex, height) => {
+        animationContext?.registerExitingItem(item.id, exitIndex, height);
+    }, [animationContext, item.id]);
+    const onExitComplete = (0, react_1.useCallback)(() => {
+        animationContext?.unregisterExitingItem(item.id);
+    }, [animationContext, item.id]);
+    // Exit animation for smooth slide-out (with layout compensation callbacks)
+    const { exitAnimatedStyle, triggerExit, resetAnimation } = (0, hooks_1.useListExitAnimation)(item.id, {
+        index,
+        measuredHeight: measuredHeightRef.current,
+        onExitStart,
+        onExitComplete,
+    });
+    // Entry animation for items appearing
+    const { entryAnimatedStyle } = (0, hooks_1.useListEntryAnimation)(item.id);
+    // Register exit animation trigger (O(1) direct calls from subscriptions)
+    (0, react_1.useLayoutEffect)(() => {
+        if (!animationContext)
+            return;
+        animationContext.registerAnimationTrigger(item.id, triggerExit);
+        return () => animationContext.unregisterAnimationTrigger(item.id);
+    }, [item.id, triggerExit, animationContext]);
+    // Track measured height for layout compensation
+    const handleLayout = (0, react_1.useCallback)((event) => {
+        measuredHeightRef.current = event.nativeEvent.layout.height;
+    }, []);
+    // Create combined animated style
+    const combinedAnimatedStyle = (0, react_1.useMemo)(() => {
+        // We can't directly combine animated styles here since they're worklet-based
+        // Instead, we'll let the consumer apply them via the render prop
+        return {};
+    }, []);
+    // Create drag handle props
+    const dragHandleProps = (0, react_1.useMemo)(() => isDragEnabled
+        ? {
+            gesture: panGesture,
+            isDragging,
+        }
+        : null, [isDragEnabled, panGesture, isDragging]);
+    // Trigger exit animation wrapper
+    const triggerExitAnimation = (0, react_1.useCallback)((direction, onComplete, preset) => {
+        triggerExit(direction, onComplete, preset);
+    }, [triggerExit]);
+    // Create render info
+    const renderInfo = (0, react_1.useMemo)(() => ({
+        item,
+        index,
+        totalItems,
+        animatedStyle: combinedAnimatedStyle,
+        dragHandleProps,
+        isDragging: false, // This is a SharedValue, consumer should use dragHandleProps.isDragging
+        isDragEnabled,
+        triggerExitAnimation,
+        resetExitAnimation: resetAnimation,
+    }), [
+        item,
+        index,
+        totalItems,
+        combinedAnimatedStyle,
+        dragHandleProps,
+        isDragEnabled,
+        triggerExitAnimation,
+        resetAnimation,
+    ]);
+    // Render the item with animations applied
+    // The consumer's renderItem gets wrapped in our animated container
+    const renderedItem = renderItem(renderInfo);
+    return (<react_native_reanimated_1.default.View ref={containerRef} onLayout={handleLayout} style={[
+            exitAnimatedStyle,
+            entryAnimatedStyle,
+            isDragEnabled && dragAnimatedStyle,
+        ]}>
+      {renderedItem}
+    </react_native_reanimated_1.default.View>);
+}
+// Memoize to prevent unnecessary re-renders
+exports.AnimatedFlashListItem = react_1.default.memo(AnimatedFlashListItemInner);

package/lib/__tests__/utils/test-utils.d.ts

@@ -0,0 +1,82 @@
+import { ReactElement } from 'react';
+import { render, RenderOptions } from '@testing-library/react-native';
+import type { DragConfig } from '../../types';
+/**
+ * Custom render options with context configuration
+ */
+interface CustomRenderOptions extends Omit<RenderOptions, 'wrapper'> {
+    dragConfig?: Partial<DragConfig>;
+    entryAnimationTimeout?: number;
+    layoutAnimationDuration?: number;
+}
+/**
+ * Custom render function that wraps components with all necessary providers
+ */
+declare const customRender: (ui: ReactElement, options?: CustomRenderOptions) => ReturnType<typeof render>;
+export * from '@testing-library/react-native';
+export { customRender as render };
+/**
+ * Create a mock list item with required id field
+ */
+export interface MockListItem {
+    id: string;
+    title?: string;
+    [key: string]: unknown;
+}
+/**
+ * Factory function to create a single mock item
+ */
+export declare const createMockItem: (id: string, overrides?: Partial<MockListItem>) => MockListItem;
+/**
+ * Factory function to create multiple mock items
+ */
+export declare const createMockItems: (count: number) => MockListItem[];
+/**
+ * Create a mock SharedValue-like object for testing
+ */
+export declare const createMockSharedValue: <T>(initialValue: T) => {
+    value: T;
+    addListener: jest.Mock<any, any, any>;
+    removeListener: jest.Mock<any, any, any>;
+    modify: jest.Mock<T, [modifier: (val: T) => T], any>;
+};
+/**
+ * Create a mock animated ref for testing
+ */
+export declare const createMockAnimatedRef: <T>(current?: T | null) => {
+    current: T | null;
+};
+/**
+ * Wait for animations to complete (mock version)
+ */
+export declare const waitForAnimations: (ms?: number) => Promise<void>;
+/**
+ * Mock gesture event data for testing drag operations
+ */
+export declare const createMockGestureEvent: (overrides?: Record<string, unknown>) => {
+    translationX: number;
+    translationY: number;
+    velocityX: number;
+    velocityY: number;
+    absoluteX: number;
+    absoluteY: number;
+    x: number;
+    y: number;
+    numberOfPointers: number;
+    state: number;
+};
+/**
+ * Mock FlashList ref for testing
+ */
+export declare const createMockFlashListRef: () => {
+    scrollToOffset: jest.Mock<any, any, any>;
+    scrollToIndex: jest.Mock<any, any, any>;
+    scrollToItem: jest.Mock<any, any, any>;
+    scrollToEnd: jest.Mock<any, any, any>;
+    getScrollOffset: jest.Mock<number, [], any>;
+    getScrollableNode: jest.Mock<null, [], any>;
+    recordInteraction: jest.Mock<any, any, any>;
+    flashScrollIndicators: jest.Mock<any, any, any>;
+    prepareForLayoutAnimationRender: jest.Mock<any, any, any>;
+};
+//# sourceMappingURL=test-utils.d.ts.map

package/lib/__tests__/utils/test-utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"test-utils.d.ts","sourceRoot":"","sources":["../../../src/__tests__/utils/test-utils.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,+BAA+B,CAAC;AAGtE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AA+B9C;;GAEG;AACH,UAAU,mBAAoB,SAAQ,IAAI,CAAC,aAAa,EAAE,SAAS,CAAC;IAClE,UAAU,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;IACjC,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,uBAAuB,CAAC,EAAE,MAAM,CAAC;CAClC;AAED;;GAEG;AACH,QAAA,MAAM,YAAY,GAChB,IAAI,YAAY,EAChB,UAAU,mBAAmB,KAC5B,UAAU,CAAC,OAAO,MAAM,CAmB1B,CAAC;AAGF,cAAc,+BAA+B,CAAC;AAG9C,OAAO,EAAE,YAAY,IAAI,MAAM,EAAE,CAAC;AAElC;;GAEG;AACH,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACxB;AAED;;GAEG;AACH,eAAO,MAAM,cAAc,GACzB,IAAI,MAAM,EACV,YAAW,OAAO,CAAC,YAAY,CAAM,KACpC,YAID,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,eAAe,GAAI,OAAO,MAAM,KAAG,YAAY,EACc,CAAC;AAE3E;;GAEG;AACH,eAAO,MAAM,qBAAqB,GAAI,CAAC,EAAG,cAAc,CAAC;;;;0CAItB,CAAC,KAAK,CAAC;CACxC,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,qBAAqB,GAAI,CAAC,EAAG,UAAS,CAAC,GAAG,IAAW;;CAEhE,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,iBAAiB,GAAU,WAAQ,KAAG,OAAO,CAAC,IAAI,CAE9D,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,sBAAsB,GAAI,YAAW,MAAM,CAAC,MAAM,EAAE,OAAO,CAAM;;;;;;;;;;;CAY5E,CAAC;AAEH;;GAEG;AACH,eAAO,MAAM,sBAAsB;;;;;;;;;;CAUjC,CAAC"}

package/lib/__tests__/utils/test-utils.js

@@ -0,0 +1,115 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createMockFlashListRef = exports.createMockGestureEvent = exports.waitForAnimations = exports.createMockAnimatedRef = exports.createMockSharedValue = exports.createMockItems = exports.createMockItem = exports.render = void 0;
+const react_1 = __importDefault(require("react"));
+const react_native_1 = require("@testing-library/react-native");
+const DragStateContext_1 = require("../../contexts/DragStateContext");
+const ListAnimationContext_1 = require("../../contexts/ListAnimationContext");
+/**
+ * Wrapper component that provides all required contexts for testing
+ */
+const AllProviders = ({ children, dragConfig, entryAnimationTimeout, layoutAnimationDuration, }) => {
+    return (<ListAnimationContext_1.ListAnimationProvider entryAnimationTimeout={entryAnimationTimeout} layoutAnimationDuration={layoutAnimationDuration}>
+      <DragStateContext_1.DragStateProvider config={dragConfig}>{children}</DragStateContext_1.DragStateProvider>
+    </ListAnimationContext_1.ListAnimationProvider>);
+};
+/**
+ * Custom render function that wraps components with all necessary providers
+ */
+const customRender = (ui, options) => {
+    const { dragConfig, entryAnimationTimeout, layoutAnimationDuration, ...renderOptions } = options ?? {};
+    const Wrapper = ({ children }) => (<AllProviders dragConfig={dragConfig} entryAnimationTimeout={entryAnimationTimeout} layoutAnimationDuration={layoutAnimationDuration}>
+      {children}
+    </AllProviders>);
+    return (0, react_native_1.render)(ui, { wrapper: Wrapper, ...renderOptions });
+};
+exports.render = customRender;
+// Re-export everything
+__exportStar(require("@testing-library/react-native"), exports);
+/**
+ * Factory function to create a single mock item
+ */
+const createMockItem = (id, overrides = {}) => ({
+    id,
+    title: `Item ${id}`,
+    ...overrides,
+});
+exports.createMockItem = createMockItem;
+/**
+ * Factory function to create multiple mock items
+ */
+const createMockItems = (count) => Array.from({ length: count }, (_, i) => (0, exports.createMockItem)(`item-${i + 1}`));
+exports.createMockItems = createMockItems;
+/**
+ * Create a mock SharedValue-like object for testing
+ */
+const createMockSharedValue = (initialValue) => ({
+    value: initialValue,
+    addListener: jest.fn(),
+    removeListener: jest.fn(),
+    modify: jest.fn((modifier) => modifier(initialValue)),
+});
+exports.createMockSharedValue = createMockSharedValue;
+/**
+ * Create a mock animated ref for testing
+ */
+const createMockAnimatedRef = (current = null) => ({
+    current,
+});
+exports.createMockAnimatedRef = createMockAnimatedRef;
+/**
+ * Wait for animations to complete (mock version)
+ */
+const waitForAnimations = async (ms = 300) => {
+    await new Promise((resolve) => setTimeout(resolve, ms));
+};
+exports.waitForAnimations = waitForAnimations;
+/**
+ * Mock gesture event data for testing drag operations
+ */
+const createMockGestureEvent = (overrides = {}) => ({
+    translationX: 0,
+    translationY: 0,
+    velocityX: 0,
+    velocityY: 0,
+    absoluteX: 0,
+    absoluteY: 0,
+    x: 0,
+    y: 0,
+    numberOfPointers: 1,
+    state: 4, // ACTIVE
+    ...overrides,
+});
+exports.createMockGestureEvent = createMockGestureEvent;
+/**
+ * Mock FlashList ref for testing
+ */
+const createMockFlashListRef = () => ({
+    scrollToOffset: jest.fn(),
+    scrollToIndex: jest.fn(),
+    scrollToItem: jest.fn(),
+    scrollToEnd: jest.fn(),
+    getScrollOffset: jest.fn(() => 0),
+    getScrollableNode: jest.fn(() => null),
+    recordInteraction: jest.fn(),
+    flashScrollIndicators: jest.fn(),
+    prepareForLayoutAnimationRender: jest.fn(),
+});
+exports.createMockFlashListRef = createMockFlashListRef;

package/lib/constants/animations.d.ts

@@ -0,0 +1,39 @@
+import type { ExitAnimationConfig, EntryAnimationConfig } from '../types';
+/**
+ * Standard cubic bezier easing function for smooth animations
+ * Equivalent to CSS ease-in-out with custom curve
+ */
+export declare const standardEasing: import("react-native-reanimated").EasingFunctionFactory;
+/**
+ * Default exit animation configuration
+ * Used when items are removed/toggled from the list
+ *
+ * Timeline (300ms total):
+ * - 0-300ms: Slide (300px in direction)
+ * - 50-300ms: Scale to 0.95
+ * - 100-300ms: Fade out
+ */
+export declare const DEFAULT_EXIT_ANIMATION: ExitAnimationConfig;
+/**
+ * Fast exit animation for quick actions (checkbox toggles)
+ *
+ * Timeline (200ms total):
+ * - 0-200ms: Slide (200px in direction)
+ * - 0-200ms: Fade out (starts immediately)
+ * - 0-200ms: Scale to 0.97
+ */
+export declare const FAST_EXIT_ANIMATION: ExitAnimationConfig;
+/**
+ * Default entry animation configuration
+ * Used when items appear in the list
+ */
+export declare const DEFAULT_ENTRY_ANIMATION: EntryAnimationConfig;
+/**
+ * Get exit animation config by preset
+ */
+export declare function getExitAnimationConfig(preset?: 'default' | 'fast', overrides?: Partial<ExitAnimationConfig>): ExitAnimationConfig;
+/**
+ * Create a merged entry animation config from defaults and overrides
+ */
+export declare function createEntryAnimationConfig(overrides?: Partial<EntryAnimationConfig>): EntryAnimationConfig;
+//# sourceMappingURL=animations.d.ts.map

package/lib/constants/animations.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"animations.d.ts","sourceRoot":"","sources":["../../src/constants/animations.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,UAAU,CAAC;AAE1E;;;GAGG;AACH,eAAO,MAAM,cAAc,yDAAoC,CAAC;AAEhE;;;;;;;;GAQG;AACH,eAAO,MAAM,sBAAsB,EAAE,mBAkBpC,CAAC;AAEF;;;;;;;GAOG;AACH,eAAO,MAAM,mBAAmB,EAAE,mBAkBjC,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,uBAAuB,EAAE,oBAGrC,CAAC;AAEF;;GAEG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,GAAE,SAAS,GAAG,MAAe,EACnC,SAAS,CAAC,EAAE,OAAO,CAAC,mBAAmB,CAAC,GACvC,mBAAmB,CAWrB;AAED;;GAEG;AACH,wBAAgB,0BAA0B,CACxC,SAAS,CAAC,EAAE,OAAO,CAAC,oBAAoB,CAAC,GACxC,oBAAoB,CAOtB"}

package/lib/constants/animations.js

@@ -0,0 +1,100 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_ENTRY_ANIMATION = exports.FAST_EXIT_ANIMATION = exports.DEFAULT_EXIT_ANIMATION = exports.standardEasing = void 0;
+exports.getExitAnimationConfig = getExitAnimationConfig;
+exports.createEntryAnimationConfig = createEntryAnimationConfig;
+const react_native_reanimated_1 = require("react-native-reanimated");
+/**
+ * Standard cubic bezier easing function for smooth animations
+ * Equivalent to CSS ease-in-out with custom curve
+ */
+exports.standardEasing = react_native_reanimated_1.Easing.bezier(0.25, 0.1, 0.25, 1);
+/**
+ * Default exit animation configuration
+ * Used when items are removed/toggled from the list
+ *
+ * Timeline (300ms total):
+ * - 0-300ms: Slide (300px in direction)
+ * - 50-300ms: Scale to 0.95
+ * - 100-300ms: Fade out
+ */
+exports.DEFAULT_EXIT_ANIMATION = {
+    slide: {
+        duration: 300,
+        distance: 300,
+    },
+    fade: {
+        delay: 100,
+        duration: 200,
+    },
+    scale: {
+        delay: 50,
+        duration: 250,
+        toValue: 0.95,
+    },
+    removalDelay: 300,
+    layoutAnimation: {
+        duration: 200,
+    },
+};
+/**
+ * Fast exit animation for quick actions (checkbox toggles)
+ *
+ * Timeline (200ms total):
+ * - 0-200ms: Slide (200px in direction)
+ * - 0-200ms: Fade out (starts immediately)
+ * - 0-200ms: Scale to 0.97
+ */
+exports.FAST_EXIT_ANIMATION = {
+    slide: {
+        duration: 200,
+        distance: 200,
+    },
+    fade: {
+        delay: 0,
+        duration: 200,
+    },
+    scale: {
+        delay: 0,
+        duration: 200,
+        toValue: 0.97,
+    },
+    removalDelay: 200,
+    layoutAnimation: {
+        duration: 150,
+    },
+};
+/**
+ * Default entry animation configuration
+ * Used when items appear in the list
+ */
+exports.DEFAULT_ENTRY_ANIMATION = {
+    fade: { duration: 250 },
+    slide: { distance: 50, duration: 300 },
+};
+/**
+ * Get exit animation config by preset
+ */
+function getExitAnimationConfig(preset = 'fast', overrides) {
+    const base = preset === 'fast' ? exports.FAST_EXIT_ANIMATION : exports.DEFAULT_EXIT_ANIMATION;
+    if (!overrides)
+        return base;
+    return {
+        slide: { ...base.slide, ...overrides.slide },
+        fade: { ...base.fade, ...overrides.fade },
+        scale: { ...base.scale, ...overrides.scale },
+        removalDelay: overrides.removalDelay ?? base.removalDelay,
+        layoutAnimation: { ...base.layoutAnimation, ...overrides.layoutAnimation },
+    };
+}
+/**
+ * Create a merged entry animation config from defaults and overrides
+ */
+function createEntryAnimationConfig(overrides) {
+    if (!overrides)
+        return exports.DEFAULT_ENTRY_ANIMATION;
+    return {
+        fade: { ...exports.DEFAULT_ENTRY_ANIMATION.fade, ...overrides.fade },
+        slide: { ...exports.DEFAULT_ENTRY_ANIMATION.slide, ...overrides.slide },
+    };
+}

package/lib/constants/drag.d.ts

@@ -0,0 +1,11 @@
+import type { DragConfig } from '../types';
+/**
+ * Default drag configuration
+ * All values can be overridden via AnimatedFlashList config prop
+ */
+export declare const DEFAULT_DRAG_CONFIG: DragConfig;
+/**
+ * Create a merged drag config from defaults and overrides
+ */
+export declare function createDragConfig(overrides?: Partial<DragConfig>): DragConfig;
+//# sourceMappingURL=drag.d.ts.map

package/lib/constants/drag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drag.d.ts","sourceRoot":"","sources":["../../src/constants/drag.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAE3C;;;GAGG;AACH,eAAO,MAAM,mBAAmB,EAAE,UAoCjC,CAAC;AAEF;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,GAAG,UAAU,CAG5E"}

package/lib/constants/drag.js

@@ -0,0 +1,47 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DEFAULT_DRAG_CONFIG = void 0;
+exports.createDragConfig = createDragConfig;
+/**
+ * Default drag configuration
+ * All values can be overridden via AnimatedFlashList config prop
+ */
+exports.DEFAULT_DRAG_CONFIG = {
+    /**
+     * Fixed height for list items used in drag calculations.
+     * Override this to match your item height + margins
+     */
+    itemHeight: 95,
+    /**
+     * Scale factor applied to dragged item for visual feedback
+     */
+    dragScale: 1.03,
+    /**
+     * Shadow opacity for dragged item (increases from 0.1 to this value)
+     */
+    dragShadowOpacity: 0.25,
+    /**
+     * Vertical margin per item (total margin = 2 * itemVerticalMargin)
+     */
+    itemVerticalMargin: 8,
+    /**
+     * Duration (ms) to hold drag handle before drag activates
+     */
+    longPressDuration: 200,
+    /**
+     * Pixels from viewport edge to trigger autoscroll
+     */
+    edgeThreshold: 80,
+    /**
+     * Maximum scroll speed in pixels per frame at edge
+     */
+    maxScrollSpeed: 10,
+};
+/**
+ * Create a merged drag config from defaults and overrides
+ */
+function createDragConfig(overrides) {
+    if (!overrides)
+        return exports.DEFAULT_DRAG_CONFIG;
+    return { ...exports.DEFAULT_DRAG_CONFIG, ...overrides };
+}

package/lib/constants/index.d.ts

@@ -0,0 +1,3 @@
+export * from './drag';
+export * from './animations';
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/constants/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC"}

package/lib/constants/index.js

@@ -0,0 +1,18 @@
+"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 __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./drag"), exports);
+__exportStar(require("./animations"), exports);

package/lib/contexts/DragStateContext.d.ts

@@ -0,0 +1,73 @@
+import React, { type ReactNode } from 'react';
+import { type SharedValue } from 'react-native-reanimated';
+import type { FlashListRef } from '@shopify/flash-list';
+import type { DragConfig } from '../types';
+/**
+ * Centralized drag state for coordinating animations across list items.
+ * All animation values are Reanimated SharedValues for 60fps UI thread performance.
+ *
+ * Architecture:
+ * - Single source of truth for all drag state (no per-item local state)
+ * - Dragged item identified by draggedIndex, reads/writes centralized values
+ * - Non-dragged items read draggedIndex/currentTranslateY to calculate shift
+ * - Scroll state enables viewport-aware hover calculations and autoscroll
+ */
+export interface DragStateContextValue {
+    /** Is any item currently being dragged? */
+    isDragging: SharedValue<boolean>;
+    /** Original index of the item being dragged (-1 if not dragging) */
+    draggedIndex: SharedValue<number>;
+    /** ID of the item being dragged (for stable identity across FlashList recycling) */
+    draggedItemId: SharedValue<string>;
+    /** Current Y translation of the dragged item (for calculating hover position) */
+    currentTranslateY: SharedValue<number>;
+    /** Scale of the dragged item (1.0 = normal, configured = dragging) */
+    draggedScale: SharedValue<number>;
+    /** Current scroll offset of the list (updated via onScroll) */
+    scrollOffset: SharedValue<number>;
+    /** Scroll offset when drag started (for scroll delta calculation during autoscroll) */
+    dragStartScrollOffset: SharedValue<number>;
+    /** Total content height of the list (updated via onContentSizeChange) */
+    contentHeight: SharedValue<number>;
+    /** Visible viewport height (updated via onLayout) */
+    visibleHeight: SharedValue<number>;
+    /** Y position of FlashList top on screen (for autoscroll coordinate conversion) */
+    listTopY: SharedValue<number>;
+    /** Counter incremented on every drag state change to force useDerivedValue re-evaluation */
+    dragUpdateTrigger: SharedValue<number>;
+    /** Measured height of the dragged item (for dynamic height calculations) */
+    measuredItemHeight: SharedValue<number>;
+    /** Flag to freeze shift values during drop transition */
+    isDropping: SharedValue<boolean>;
+    /** Register the FlashList ref for autoscroll operations */
+    setListRef: (ref: FlashListRef<unknown> | null) => void;
+    /** Scroll the list to a specific offset (for autoscroll during drag) */
+    scrollToOffset: (offset: number, animated?: boolean) => void;
+    /** Reset drag state after drop animation completes */
+    resetDragState: () => void;
+    /** Current drag configuration */
+    config: DragConfig;
+}
+/**
+ * Hook to access shared drag state from context.
+ * Must be used within DragStateProvider.
+ */
+export declare const useDragState: () => DragStateContextValue;
+interface DragStateProviderProps {
+    children: ReactNode;
+    /** Optional drag configuration overrides */
+    config?: Partial<DragConfig>;
+}
+/**
+ * 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.
+ */
+export declare const DragStateProvider: React.FC<DragStateProviderProps>;
+export {};
+//# sourceMappingURL=DragStateContext.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DragStateContext.d.ts","sourceRoot":"","sources":["../../src/contexts/DragStateContext.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAMZ,KAAK,SAAS,EACf,MAAM,OAAO,CAAC;AACf,OAAO,EAAkB,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAC3E,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAG3C;;;;;;;;;GASG;AACH,MAAM,WAAW,qBAAqB;IACpC,2CAA2C;IAC3C,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IACjC,oEAAoE;IACpE,YAAY,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,oFAAoF;IACpF,aAAa,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,iFAAiF;IACjF,iBAAiB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACvC,sEAAsE;IACtE,YAAY,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,+DAA+D;IAC/D,YAAY,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAClC,uFAAuF;IACvF,qBAAqB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC3C,yEAAyE;IACzE,aAAa,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,qDAAqD;IACrD,aAAa,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACnC,mFAAmF;IACnF,QAAQ,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IAC9B,4FAA4F;IAC5F,iBAAiB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACvC,4EAA4E;IAC5E,kBAAkB,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;IACxC,yDAAyD;IACzD,UAAU,EAAE,WAAW,CAAC,OAAO,CAAC,CAAC;IACjC,2DAA2D;IAC3D,UAAU,EAAE,CAAC,GAAG,EAAE,YAAY,CAAC,OAAO,CAAC,GAAG,IAAI,KAAK,IAAI,CAAC;IACxD,wEAAwE;IACxE,cAAc,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7D,sDAAsD;IACtD,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,iCAAiC;IACjC,MAAM,EAAE,UAAU,CAAC;CACpB;AAID;;;GAGG;AACH,eAAO,MAAM,YAAY,QAAO,qBAM/B,CAAC;AAEF,UAAU,sBAAsB;IAC9B,QAAQ,EAAE,SAAS,CAAC;IACpB,4CAA4C;IAC5C,MAAM,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAC;CAC9B;AAED;;;;;;;;;GASG;AACH,eAAO,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA0G9D,CAAC"}