react-native-reanimated-carousel 3.1.0 → 3.1.2

package/lib/typescript/layouts/parallax.d.ts

@@ -1,30 +1,30 @@
-import type { IComputedDirectionTypes } from '../types';
-declare type TBaseConfig = {
+import type { IComputedDirectionTypes } from "../types";
+interface TBaseConfig {
     size: number;
     vertical: boolean;
-};
+}
 export interface ILayoutConfig {
     /**
-     * control prev/next item offset.
-     * @default 100
-     */
+       * control prev/next item offset.
+       * @default 100
+       */
     parallaxScrollingOffset?: number;
     /**
-     * control prev/current/next item offset.
-     * @default 0.8
-     */
+       * control prev/current/next item offset.
+       * @default 0.8
+       */
     parallaxScrollingScale?: number;
     /**
-     * control prev/next item offset.
-     * @default Math.pow(parallaxScrollingScale, 2)
-     */
+       * control prev/next item offset.
+       * @default Math.pow(parallaxScrollingScale, 2)
+       */
     parallaxAdjacentItemScale?: number;
 }
 export declare type TParallaxModeProps = IComputedDirectionTypes<{
     /**
-     * Carousel Animated transitions.
-     */
-    mode?: 'parallax';
+       * Carousel Animated transitions.
+       */
+    mode?: "parallax";
     modeConfig?: ILayoutConfig;
 }>;
 export declare function parallaxLayout(baseConfig: TBaseConfig, modeConfig?: ILayoutConfig): (value: number) => {

package/lib/typescript/layouts/stack.d.ts

@@ -1,5 +1,5 @@
-import { ViewStyle } from 'react-native';
-import type { IComputedDirectionTypes, CustomConfig } from '../types';
+import type { ViewStyle } from "react-native";
+import type { IComputedDirectionTypes, CustomConfig } from "../types";
 export interface ILayoutConfig {
     showLength?: number;
     moveSize?: number;
@@ -7,23 +7,23 @@ export interface ILayoutConfig {
     scaleInterval?: number;
     opacityInterval?: number;
     rotateZDeg?: number;
-    snapDirection?: 'left' | 'right';
+    snapDirection?: "left" | "right";
 }
 export declare type TStackModeProps = IComputedDirectionTypes<{
     /**
-     * Carousel Animated transitions.
-     */
-    mode?: 'horizontal-stack' | 'vertical-stack';
+       * Carousel Animated transitions.
+       */
+    mode?: "horizontal-stack" | "vertical-stack";
     /**
-     * Stack animation style.
-     * @default
-     *     mode: 'vertical',
-     *     snapDirection: 'right',
-     *     moveSize: window.width,
-     *     stackInterval: 30,
-     *     scaleInterval: 0.08,
-     *     rotateZDeg: 135,
-     */
+       * Stack animation style.
+       * @default
+       *     mode: 'vertical',
+       *     snapDirection: 'right',
+       *     moveSize: window.width,
+       *     stackInterval: 30,
+       *     scaleInterval: 0.08,
+       *     rotateZDeg: 135,
+       */
     modeConfig?: ILayoutConfig;
 }>;
 export declare function horizontalStackLayout(modeConfig?: ILayoutConfig): (_value: number) => ViewStyle;

package/lib/typescript/store/index.d.ts

@@ -1,5 +1,5 @@
-import React from 'react';
-import type { TInitializeCarouselProps } from '../hooks/useInitProps';
+import React from "react";
+import type { TInitializeCarouselProps } from "../hooks/useInitProps";
 export interface IContext {
     props: TInitializeCarouselProps<any>;
     common: {

package/lib/typescript/types.d.ts

@@ -1,193 +1,193 @@
 /// <reference types="react" />
-import type { StyleProp, ViewStyle } from 'react-native';
-import type { PanGestureHandlerProps } from 'react-native-gesture-handler';
-import type { AnimatedStyleProp, SharedValue, WithSpringConfig, WithTimingConfig } from 'react-native-reanimated';
-import type Animated from 'react-native-reanimated';
-import type { TParallaxModeProps } from './layouts/parallax';
-import type { TStackModeProps } from './layouts/stack';
+import type { StyleProp, ViewStyle } from "react-native";
+import type { PanGestureHandlerProps } from "react-native-gesture-handler";
+import type { AnimatedStyleProp, SharedValue, WithSpringConfig, WithTimingConfig } from "react-native-reanimated";
+import type Animated from "react-native-reanimated";
+import type { TParallaxModeProps } from "./layouts/parallax";
+import type { TStackModeProps } from "./layouts/stack";
 export declare type IComputedDirectionTypes<T, VP = {}, HP = {}> = (T & VP & {
     /**
-     * Layout items vertically instead of horizontally
-     */
+             * Layout items vertically instead of horizontally
+             */
     vertical: true;
     /**
-     * Layout items vertically instead of horizontally
-     */
+             * Layout items vertically instead of horizontally
+             */
     /**
-     * Specified carousel container width.
-     */
+             * Specified carousel container width.
+             */
     width?: number;
     height: number;
 }) | (T & HP & {
     /**
-     * Layout items vertically instead of horizontally
-     */
+             * Layout items vertically instead of horizontally
+             */
     vertical?: false;
     /**
-     * Layout items vertically instead of horizontally
-     */
+             * Layout items vertically instead of horizontally
+             */
     /**
-     * Specified carousel container width.
-     */
+             * Specified carousel container width.
+             */
     width: number;
     height?: number;
 });
-export declare type CustomConfig = {
-    type?: 'negative' | 'positive';
+export interface CustomConfig {
+    type?: "negative" | "positive";
     viewCount?: number;
-};
-export declare type WithSpringAnimation = {
-    type: 'spring';
+}
+export interface WithSpringAnimation {
+    type: "spring";
     config: WithSpringConfig;
-};
-export declare type WithTimingAnimation = {
-    type: 'timing';
+}
+export interface WithTimingAnimation {
+    type: "timing";
     config: WithTimingConfig;
-};
+}
 export declare type WithAnimation = WithSpringAnimation | WithTimingAnimation;
 export declare type TCarouselProps<T = any> = {
     ref?: React.Ref<ICarouselInstance>;
     /**
-     * The default animated value of the carousel.
-     */
+       * The default animated value of the carousel.
+       */
     defaultScrollOffsetValue?: SharedValue<number>;
     /**
-     * Carousel loop playback.
-     * @default true
-     */
+       * Carousel loop playback.
+       * @default true
+       */
     loop?: boolean;
     /**
-     * Carousel items data set.
-     */
+       * Carousel items data set.
+       */
     data: T[];
     /**
-     * Auto fill data array to allow loop playback when the loop props is true.
-     * @default true
-     * @example
-     * [1] => [1, 1, 1]
-     * [1, 2] => [1, 2, 1, 2]
-     */
+       * Auto fill data array to allow loop playback when the loop props is true.
+       * @default true
+       * @example
+       * [1] => [1, 1, 1]
+       * [1, 2] => [1, 2, 1, 2]
+       */
     autoFillData?: boolean;
     /**
-     * Default index
-     * @default 0
-     */
+       * Default index
+       * @default 0
+       */
     defaultIndex?: number;
     /**
-     * Auto play
-     */
+       * Auto play
+       */
     autoPlay?: boolean;
     /**
-     * Auto play
-     * @description reverse playback
-     */
+       * Auto play
+       * @description reverse playback
+       */
     autoPlayReverse?: boolean;
     /**
-     * Auto play
-     * @description playback interval
-     */
+       * Auto play
+       * @description playback interval
+       */
     autoPlayInterval?: number;
     /**
-     * Time a scroll animation takes to finish
-     * @default 500 (ms)
-     */
+       * Time a scroll animation takes to finish
+       * @default 500 (ms)
+       */
     scrollAnimationDuration?: number;
     /**
-     * Carousel container style
-     */
+       * Carousel container style
+       */
     style?: StyleProp<ViewStyle>;
     /**
-     * PanGestureHandler props
-     */
-    panGestureHandlerProps?: Partial<Omit<PanGestureHandlerProps, 'onHandlerStateChange' | 'enabled'>>;
+       * PanGestureHandler props
+       */
+    panGestureHandlerProps?: Partial<Omit<PanGestureHandlerProps, "onHandlerStateChange" | "enabled">>;
     /**
-     * Determines the maximum number of items will respond to pan gesture events,
-     * windowSize={11} will active visible item plus up to 5 items above and 5 below the viewpor,
-     * Reducing this number will reduce the calculation of the animation value and may improve performance.
-     * @default 0 all items will respond to pan gesture events.
-     */
+       * Determines the maximum number of items will respond to pan gesture events,
+       * windowSize={11} will active visible item plus up to 5 items above and 5 below the viewpor,
+       * Reducing this number will reduce the calculation of the animation value and may improve performance.
+       * @default 0 all items will respond to pan gesture events.
+       */
     windowSize?: number;
     /**
-     * When true, the scroll view stops on multiples of the scroll view's size when scrolling.
-     * @default true
-     */
+       * When true, the scroll view stops on multiples of the scroll view's size when scrolling.
+       * @default true
+       */
     pagingEnabled?: boolean;
     /**
-     * If enabled, releasing the touch will scroll to the nearest item.
-     * valid when pagingEnabled=false
-     * @deprecated please use snapEnabled instead
-     */
+       * If enabled, releasing the touch will scroll to the nearest item.
+       * valid when pagingEnabled=false
+       * @deprecated please use snapEnabled instead
+       */
     enableSnap?: boolean;
     /**
-     * If enabled, releasing the touch will scroll to the nearest item.
-     * valid when pagingEnabled=false
-     * @default true
-     */
+       * If enabled, releasing the touch will scroll to the nearest item.
+       * valid when pagingEnabled=false
+       * @default true
+       */
     snapEnabled?: boolean;
     /**
-     * If false, Carousel will not respond to any gestures.
-     * @default true
-     */
+       * If false, Carousel will not respond to any gestures.
+       * @default true
+       */
     enabled?: boolean;
     /**
-     * Specifies the scrolling animation effect.
-     */
+       * Specifies the scrolling animation effect.
+       */
     withAnimation?: WithAnimation;
     /**
-     * Used to locate this view in end-to-end tests.
-     */
+       * Used to locate this view in end-to-end tests.
+       */
     testID?: string;
     /**
-     * Custom carousel config.
-     */
+       * Custom carousel config.
+       */
     customConfig?: () => CustomConfig;
     /**
-     * Custom animations.
-     * Must use `worklet`, Details: https://docs.swmansion.com/react-native-reanimated/docs/2.2.0/worklets/
-     */
+       * Custom animations.
+       * Must use `worklet`, Details: https://docs.swmansion.com/react-native-reanimated/docs/2.2.0/worklets/
+       */
     customAnimation?: (value: number) => AnimatedStyleProp<ViewStyle>;
     /**
-     * Render carousel item.
-     */
+       * Render carousel item.
+       */
     renderItem: CarouselRenderItem<T>;
     /**
-     * Callback fired when navigating to an item.
-     */
+       * Callback fired when navigating to an item.
+       */
     onSnapToItem?: (index: number) => void;
     /**
-     * On scroll begin
-     */
+       * On scroll begin
+       */
     onScrollBegin?: () => void;
     /**
-     * On scroll end
-     */
+       * On scroll end
+       */
     onScrollEnd?: (index: number) => void;
     /**
-     * On progress change
-     * @param offsetProgress Total of offset distance (0 390 780 ...)
-     * @param absoluteProgress Convert to index (0 1 2 ...)
-     */
+       * On progress change
+       * @param offsetProgress Total of offset distance (0 390 780 ...)
+       * @param absoluteProgress Convert to index (0 1 2 ...)
+       */
     onProgressChange?: (offsetProgress: number, absoluteProgress: number) => void;
 } & (TParallaxModeProps | TStackModeProps);
 export interface ICarouselInstance {
     /**
-     * Scroll to previous item, it takes one optional argument (count),
-     * which allows you to specify how many items to cross
-     */
-    prev: (opts?: Omit<TCarouselActionOptions, 'index'>) => void;
+       * Scroll to previous item, it takes one optional argument (count),
+       * which allows you to specify how many items to cross
+       */
+    prev: (opts?: Omit<TCarouselActionOptions, "index">) => void;
     /**
-     * Scroll to next item, it takes one optional argument (count),
-     * which allows you to specify how many items to cross
-     */
-    next: (opts?: Omit<TCarouselActionOptions, 'index'>) => void;
+       * Scroll to next item, it takes one optional argument (count),
+       * which allows you to specify how many items to cross
+       */
+    next: (opts?: Omit<TCarouselActionOptions, "index">) => void;
     /**
-     * Get current item index
-     */
+       * Get current item index
+       */
     getCurrentIndex: () => number;
     /**
-     * Use value to scroll to a position where relative to the current position,
-     * scrollTo(-2) is equivalent to prev(2), scrollTo(2) is equivalent to next(2)
-     */
+       * Use value to scroll to a position where relative to the current position,
+       * scrollTo(-2) is equivalent to prev(2), scrollTo(2) is equivalent to next(2)
+       */
     scrollTo: (opts?: TCarouselActionOptions) => void;
 }
 export interface CarouselRenderItemInfo<ItemT> {

package/lib/typescript/utils/dealWithAnimation.d.ts

@@ -1,2 +1,2 @@
-import type { WithAnimation } from '../types';
+import type { WithAnimation } from "../types";
 export declare function dealWithAnimation(withAnimation: WithAnimation): (value: number, cb: (isFinished: boolean) => void) => number;

package/lib/typescript/utils/handlerOffsetDirection.d.ts

@@ -0,0 +1,2 @@
+import type { SharedValue } from "react-native-reanimated";
+export declare function handlerOffsetDirection(handlerOffset: SharedValue<number>): -1 | 1;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "react-native-reanimated-carousel",
-    "version": "3.1.0",
+    "version": "3.1.2",
     "description": "Simple carousel component.fully implemented using Reanimated 2.Infinitely scrolling, very smooth.",
     "main": "lib/commonjs/index",
     "react-native": "src/index.tsx",
@@ -22,9 +22,11 @@
     ],
     "scripts": {
         "gif": "node scripts/makegif.js ./scripts/gif-works-directory",
-        "test": "jest",
+        "test": "vitest run src/**/*",
+        "test:dev": "vitest dev src/**/*",
         "typescript": "tsc --noEmit",
         "lint": "eslint \"src/**/*.{js,ts,tsx}\"",
+        "lint:fix": "eslint \"src/**/*.{js,ts,tsx}\" --fix",
         "dev": "yarn watch 'yarn prepare' ./src",
         "prepare": "bob build",
         "release": "yarn prepare && dotenv release-it --no-git.requireUpstream",
@@ -57,6 +59,7 @@
     "devDependencies": {
         "@babel/plugin-syntax-dynamic-import": "^7.8.3",
         "@commitlint/config-conventional": "^11.0.0",
+        "@dohooo/eslint-config": "^0.0.7",
         "@react-native-community/eslint-config": "^2.0.0",
         "@release-it/conventional-changelog": "^2.0.0",
         "@types/jest": "^26.0.0",
@@ -68,7 +71,7 @@
         "commitlint": "^11.0.0",
         "cz-conventional-changelog": "^3.3.0",
         "dotenv-cli": "^5.1.0",
-        "eslint": "^7.2.0",
+        "eslint": "^8.26.0",
         "eslint-config-prettier": "^7.0.0",
         "eslint-plugin-prettier": "^3.1.3",
         "gifify": "^2.4.3",
@@ -83,7 +86,8 @@
         "react-native-reanimated": "2.8.0",
         "release-it": "^14.2.2",
         "sponsorkit": "^0.1.3",
-        "typescript": "^4.0.8"
+        "typescript": "^4.0.8",
+        "vitest": "^0.24.3"
     },
     "peerDependencies": {
         "react": ">=16.8.0",
@@ -102,7 +106,7 @@
     "husky": {
         "hooks": {
             "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
-            "pre-commit": "yarn lint && yarn typescript"
+            "pre-commit": "yarn test && yarn lint && yarn typescript"
         }
     },
     "commitlint": {