@r0b0t3d/react-native-carousel 3.4.0 → 3.4.4

package/lib/module/components/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Carousel.tsx"],"names":["React","useState","useRef","useEffect","useCallback","useMemo","View","Dimensions","StyleSheet","Platform","useInterval","Animated","useSharedValue","useAnimatedScrollHandler","runOnJS","PageItem","findNearestPage","generateOffsets","useCarouselContext","useInternalCarouselContext","width","wWidth","get","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","currentPage","animatedScroll","value","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","renderPage","styles","container","paddingHorizontal","create","flex"],"mappings":";;AAAA;AACA,OAAOA,KAAP,IACEC,QADF,EAEEC,MAFF,EAGEC,SAHF,EAIEC,WAJF,EAKEC,OALF,QAMO,OANP;AAOA,SAASC,IAAT,EAAeC,UAAf,EAA2BC,UAA3B,EAAuCC,QAAvC,QAAuD,cAAvD;AACA,SAASC,WAAT,QAA4B,6BAA5B;AACA,OAAOC,QAAP,IACEC,cADF,EAEEC,wBAFF,EAGEC,OAHF,QAIO,yBAJP;AAMA,OAAOC,QAAP,MAAqB,YAArB;AACA,SAASC,eAAT,EAA0BC,eAA1B,QAAiD,UAAjD;AACA,SAASC,kBAAT,QAAmC,sBAAnC;AACA,SAASC,0BAAT,QAA2C,8BAA3C;AAEA,MAAM;AAAEC,EAAAA,KAAK,EAAEC;AAAT,IAAoBd,UAAU,CAACe,GAAX,CAAe,QAAf,CAA1B;;AAEA,SAASC,QAAT,CAAyB;AACvBC,EAAAA,KADuB;AAEvBC,EAAAA,IAFuB;AAGvBC,EAAAA,WAAW,GAAG,CAHS;AAIvBC,EAAAA,IAAI,GAAG,KAJgB;AAKvBC,EAAAA,sBAAsB,GAAG,CALF;AAMvBC,EAAAA,QAAQ,GAAG,KANY;AAOvBC,EAAAA,QAAQ,GAAG,IAPY;AAQvBC,EAAAA,SARuB;AASvBC,EAAAA,WAAW,GAAGX,MATS;AAUvBY,EAAAA,SAAS,GAAGZ,MAVW;AAWvBa,EAAAA,kBAAkB,GAAG,QAXE;AAYvBC,EAAAA,eAAe,GAAG,CAZK;AAavBC,EAAAA,aAAa,GAAG,CAbO;AAcvBC,EAAAA,YAAY,GAAG,CAdQ;AAevBC,EAAAA,aAAa,GAAG,CAfO;AAgBvBC,EAAAA,UAhBuB;AAiBvBC,EAAAA,YAjBuB;AAkBvBC,EAAAA,eAAe,GAAG,EAlBK;AAmBvBC,EAAAA;AAnBuB,CAAzB,EAoByB;AACvB,QAAMC,WAAW,GAAG/B,cAAc,CAAC,CAAD,CAAlC;AACA,QAAMgC,cAAc,GAAGhC,cAAc,CAAC+B,WAAW,CAACE,KAAZ,GAAoBb,WAArB,CAArC;AACA,QAAMc,MAAM,GAAGlC,cAAc,CAACe,IAAD,CAA7B;AACA,QAAM,CAACoB,UAAD,EAAaC,WAAb,IAA4B/C,QAAQ,CAAC,KAAD,CAA1C;AACA,QAAMgD,gBAAgB,GAAG/C,MAAM,CAAC,CAAC,CAAF,CAA/B;AACA,QAAMgD,UAAU,GAAGhD,MAAM,CAAyB,EAAzB,CAAzB;AACA,QAAM;AAAEyC,IAAAA,WAAW,EAAEQ,YAAf;AAA6BC,IAAAA;AAA7B,MAA2ClC,kBAAkB,EAAnE;AAEA,QAAMmC,iBAAiB,GAAGhD,OAAO,CAAC,MAAM;AACtC,UAAMiD,OAAO,GAAG,CAACtB,WAAW,GAAGC,SAAf,IAA4B,CAA5C;AACA,WAAOC,kBAAkB,KAAK,QAAvB,IAAmCP,IAAnC,GAA0C2B,OAA1C,GAAoDhB,aAA3D;AACD,GAHgC,EAG9B,CAACN,WAAD,EAAcC,SAAd,EAAyBC,kBAAzB,EAA6CP,IAA7C,EAAmDW,aAAnD,CAH8B,CAAjC;AAKA,QAAMiB,aAAa,GAAGrD,MAAM,CAAM,IAAN,CAA5B;AAEA,QAAMsD,OAAO,GAAGnD,OAAO,CAAC,MAAM;AAC5B,WAAOY,eAAe,CAAC;AACrBe,MAAAA,WADqB;AAErBC,MAAAA,SAFqB;AAGrBwB,MAAAA,SAAS,EAAEhC,IAAI,CAACiC,MAAL,IAAe/B,IAAI,GAAGC,sBAAsB,GAAG,CAA5B,GAAgC,CAAnD,CAHU;AAIrByB,MAAAA;AAJqB,KAAD,CAAtB;AAMD,GAPsB,EAOpB,CAACrB,WAAD,EAAcC,SAAd,EAAyBR,IAAzB,EAA+B4B,iBAA/B,CAPoB,CAAvB;AASA,QAAMM,SAAS,GAAGtD,OAAO,CAAC,MAAM;AAC9B,QAAI,CAACoB,IAAL,EAAW;AACT,aAAO,EAAP;AACD;;AACD2B,IAAAA,SAAS,CAACP,KAAV,GAAkBpB,IAAI,CAACiC,MAAvB;;AACA,QAAI/B,IAAJ,EAAU;AACR,YAAMiC,SAAS,GAAGnC,IAAI,CAACoC,KAAL,CAChBpC,IAAI,CAACiC,MAAL,GAAc9B,sBADE,EAEhBH,IAAI,CAACiC,MAFW,CAAlB;AAIA,YAAMI,SAAS,GAAGrC,IAAI,CAACoC,KAAL,CAAW,CAAX,EAAcjC,sBAAd,CAAlB;AACA,YAAMmC,QAAQ,GAAG,CAAC,GAAGH,SAAJ,EAAe,GAAGnC,IAAlB,EAAwB,GAAGqC,SAA3B,CAAjB;;AACA,WAAK,IAAIE,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGD,QAAQ,CAACL,MAA7B,EAAqCM,CAAC,EAAtC,EAA0C;AACxCd,QAAAA,UAAU,CAACe,OAAX,CAAmBD,CAAnB,IACE,CAACvC,IAAI,CAACiC,MAAL,GAAc9B,sBAAd,GAAuCoC,CAAxC,IAA6CvC,IAAI,CAACiC,MADpD;AAED;;AACD,aAAOK,QAAP;AACD,KAZD,MAYO;AACL,WAAK,IAAIC,CAAC,GAAG,CAAb,EAAgBA,CAAC,GAAGvC,IAAI,CAACiC,MAAzB,EAAiCM,CAAC,EAAlC,EAAsC;AACpCd,QAAAA,UAAU,CAACe,OAAX,CAAmBD,CAAnB,IAAwBA,CAAxB;AACD;;AACD,aAAOvC,IAAP;AACD;AACF,GAvBwB,EAuBtB,CAACA,IAAD,EAAOE,IAAP,CAvBsB,CAAzB;AAyBA,QAAMuC,aAAa,GAAG9D,WAAW,CAAE+D,IAAD,IAAkB;AAClD,WAAOjB,UAAU,CAACe,OAAX,CAAmBE,IAAnB,CAAP;AACD,GAFgC,EAE9B,EAF8B,CAAjC;AAIA,QAAMC,MAAM,GAAGhE,WAAW,CAAC,MAAM;AAC/B,QAAI,CAACmD,aAAa,CAACU,OAAnB,EAA4B;;AAC5B,QAAIV,aAAa,CAACU,OAAd,CAAsBI,QAA1B,EAAoC;AAClC,aAAOd,aAAa,CAACU,OAArB;AACD;;AACD,WAAOV,aAAa,CAACU,OAAd,CAAsBK,OAAtB,EAAP;AACD,GANyB,EAMvB,EANuB,CAA1B;AAQA,QAAMC,cAAc,GAAGnE,WAAW,CAChC,CAAC+D,IAAD,EAAeK,QAAQ,GAAG,IAA1B,KAAmC;AACjC,QAAIJ,MAAM,EAAV,EAAc;AACZA,MAAAA,MAAM,GAAGC,QAAT,CAAkB;AAAEI,QAAAA,CAAC,EAAEjB,OAAO,CAACW,IAAD,CAAZ;AAAoBO,QAAAA,CAAC,EAAE,CAAvB;AAA0BF,QAAAA;AAA1B,OAAlB;AACD;AACF,GAL+B,EAMhC,CAACJ,MAAD,EAASZ,OAAT,CANgC,CAAlC;AASA,QAAMmB,MAAM,GAAGvE,WAAW,CACxB,CAAC+D,IAAD,EAAeS,KAAK,GAAG,GAAvB,KAA+B;AAC7B3B,IAAAA,gBAAgB,CAACgB,OAAjB,GAA2BE,IAA3B;;AACA,QAAI1D,QAAQ,CAACoE,EAAT,KAAgB,SAApB,EAA+B;AAC7B/B,MAAAA,MAAM,CAACD,KAAP,GAAe,IAAf;AACD;;AACDiC,IAAAA,UAAU,CAAC,MAAM;AACflC,MAAAA,cAAc,CAACC,KAAf,GAAuBW,OAAO,CAACW,IAAD,CAA9B;AACAI,MAAAA,cAAc,CAACJ,IAAD,EAAO,KAAP,CAAd;AACD,KAHS,EAGPS,KAHO,CAAV;AAID,GAVuB,EAWxB,CAACL,cAAD,EAAiB3B,cAAjB,EAAiCE,MAAjC,CAXwB,CAA1B;AAcA,QAAMiC,MAAM,GAAG3E,WAAW,CAAC,MAAM;AAC/B,UAAM4E,IAAI,GAAGrC,WAAW,CAACE,KAAZ,GAAoB,CAAjC;AACA0B,IAAAA,cAAc,CAACS,IAAD,CAAd;AACD,GAHyB,EAGvB,CAACT,cAAD,CAHuB,CAA1B;AAKA,QAAMU,MAAM,GAAG7E,WAAW,CAAC,MAAM;AAC/B,UAAM8E,IAAI,GAAGvC,WAAW,CAACE,KAAZ,GAAoB,CAAjC;AACA0B,IAAAA,cAAc,CAACW,IAAD,CAAd;AACD,GAHyB,EAGvB,CAACX,cAAD,CAHuB,CAA1B;AAKA,QAAMY,UAAU,GAAG/E,WAAW,CAC5B,CAACgF,KAAD,EAAgBZ,QAAQ,GAAG,IAA3B,KAAoC;AAClC,QAAIY,KAAK,GAAG,CAAR,IAAaA,KAAK,IAAI3D,IAAI,CAACiC,MAA/B,EAAuC;AACrC2B,MAAAA,OAAO,CAACC,KAAR,CAAe,mBAAkBF,KAAM,EAAvC;AACA;AACD;;AACD,QAAIG,SAAS,GAAGH,KAAhB;;AACA,QAAIzD,IAAJ,EAAU;AACR,YAAM6D,OAAiB,GAAGC,MAAM,CAACC,IAAP,CAAYxC,UAAU,CAACe,OAAvB,EACvB0B,MADuB,CACfC,GAAD,IAAS1C,UAAU,CAACe,OAAX,CAAmB4B,MAAM,CAACD,GAAD,CAAzB,MAAoCR,KAD7B,EAEvBU,GAFuB,CAElBF,GAAD,IAASC,MAAM,CAACD,GAAD,CAFI,CAA1B;AAGA,YAAMG,OAAO,GAAG/E,eAAe,CAAC2B,WAAW,CAACE,KAAb,EAAoB2C,OAApB,EAA6B,EAA7B,CAA/B;AACAD,MAAAA,SAAS,GAAGC,OAAO,CAACO,OAAD,CAAnB;AACD;;AACDxB,IAAAA,cAAc,CAACgB,SAAD,EAAYf,QAAZ,CAAd;AACD,GAf2B,EAgB5B,CAACD,cAAD,CAhB4B,CAA9B;AAmBA,QAAM;AAAEyB,IAAAA;AAAF,MAA0B7E,0BAA0B,EAA1D;AAEAhB,EAAAA,SAAS,CAAC,MAAM;AACd,QAAI6F,mBAAJ,EAAyB;AACvBA,MAAAA,mBAAmB,CAAC;AAClBjB,QAAAA,MADkB;AAElBE,QAAAA,MAFkB;AAGlBE,QAAAA;AAHkB,OAAD,CAAnB;AAKD;AACF,GARQ,EAQN,CAACJ,MAAD,EAASE,MAAT,EAAiBE,UAAjB,EAA6Ba,mBAA7B,CARM,CAAT;AAUA,QAAMC,gBAAgB,GAAG7F,WAAW,CACjC+D,IAAD,IAAkB;AAChB,UAAM+B,UAAU,GAAGhC,aAAa,CAACC,IAAD,CAAhC;AACAhB,IAAAA,YAAY,CAACN,KAAb,GAAqBqD,UAArB;;AACA,QAAI1D,YAAJ,EAAkB;AAChBA,MAAAA,YAAY,CAAC0D,UAAD,CAAZ;AACD;;AACD,QAAI,CAACvE,IAAL,EAAW;;AACX,QAAIwC,IAAI,KAAKR,SAAS,CAACD,MAAV,GAAmB,CAAhC,EAAmC;AACjCiB,MAAAA,MAAM,CAAC/C,sBAAsB,GAAG,CAAzB,GAA6B,CAA9B,CAAN;AACD,KAFD,MAEO,IAAIuC,IAAI,KAAK,CAAb,EAAgB;AACrBQ,MAAAA,MAAM,CAAChB,SAAS,CAACD,MAAV,GAAmB9B,sBAAsB,GAAG,CAA7C,CAAN;AACD;AACF,GAbiC,EAclC,CAACY,YAAD,EAAeb,IAAf,EAAqBuC,aAArB,EAAoCS,MAApC,EAA4ChB,SAA5C,CAdkC,CAApC;AAiBA,QAAMwC,WAAW,GAAG/F,WAAW,CAC5BgG,MAAD,IAAY;AACV;;AACA,UAAMC,OAAO,GAAGrF,eAAe,CAACoF,MAAD,EAAS5C,OAAT,EAAkB,EAAlB,CAA/B;;AACA,QAAI6C,OAAO,KAAK,CAAC,CAAjB,EAAoB;AAClB;AACD;;AACD,QAAIA,OAAO,KAAK1D,WAAW,CAACE,KAA5B,EAAmC;AACjC,UAAII,gBAAgB,CAACgB,OAAjB,KAA6BoC,OAAjC,EAA0C;AACxCvD,QAAAA,MAAM,CAACD,KAAP,GAAe,KAAf;AACD;;AACDF,MAAAA,WAAW,CAACE,KAAZ,GAAoBwD,OAApB;AACAvF,MAAAA,OAAO,CAACmF,gBAAD,CAAP,CAA0BI,OAA1B;AACD;AACF,GAd4B,EAe7B,CAACtD,UAAD,EAAaS,OAAb,EAAsByC,gBAAtB,CAf6B,CAA/B;AAkBAvF,EAAAA,WAAW,CACT,MAAM;AACJqE,IAAAA,MAAM;AACP,GAHQ,EAIT,CAAClD,QAAD,IAAa,CAACF,IAAd,IAAsBoB,UAAtB,GAAmC,CAAC,CAApC,GAAwCjB,QAJ/B,CAAX;AAOA3B,EAAAA,SAAS,CAAC,MAAM;AACd,QAAIuB,WAAW,GAAG,CAAd,IAAmBA,WAAW,IAAID,IAAI,CAACiC,MAA3C,EAAmD;AACjD2B,MAAAA,OAAO,CAACC,KAAR,CAAe,uBAAsB5D,WAAY,EAAjD;AACA;AACD;;AACD,QAAI6D,SAAS,GAAG7D,WAAhB;;AACA,QAAIC,IAAJ,EAAU;AACR4D,MAAAA,SAAS,GAAG7D,WAAW,GAAGE,sBAA1B;AACD;;AACD,QAAIe,WAAW,CAACE,KAAZ,KAAsB0C,SAA1B,EAAqC;AACnCT,MAAAA,UAAU,CAAC,MAAM;AACfP,QAAAA,cAAc,CAACgB,SAAD,EAAY,KAAZ,CAAd;AACAzC,QAAAA,MAAM,CAACD,KAAP,GAAe,KAAf;AACD,OAHS,CAAV;AAID;AACF,GAfQ,EAeN,EAfM,CAAT;AAiBA,QAAMyD,SAAS,GAAGlG,WAAW,CAAC,MAAM;AAClC,QAAIyB,QAAJ,EAAc;AACZmB,MAAAA,WAAW,CAAC,IAAD,CAAX;AACD;AACF,GAJ4B,EAI1B,CAACnB,QAAD,CAJ0B,CAA7B;AAMA,QAAM0E,OAAO,GAAGnG,WAAW,CAAC,MAAM;AAChC,QAAIyB,QAAJ,EAAc;AACZiD,MAAAA,UAAU,CAAC,MAAM9B,WAAW,CAAC,KAAD,CAAlB,EAA2B,GAA3B,CAAV;AACD;AACF,GAJ0B,EAIxB,CAACnB,QAAD,CAJwB,CAA3B;AAMA,QAAM2E,UAAU,GAAGpG,WAAW,CAC5B,CAACqG,IAAD,EAAcrB,KAAd,KAAwC;AACtC,QAAI1C,YAAJ,EAAkB;AAChB,aAAQ,GAAEA,YAAY,CAAC+D,IAAD,EAAOrB,KAAP,CAAc,IAAGA,KAAM,EAA7C;AACD;;AACD,QAAKqB,IAAD,CAAcC,EAAlB,EAAsB;AACpB,aAAQ,GAAGD,IAAD,CAAcC,EAAG,IAAGtB,KAAM,EAApC;AACD;;AACDC,IAAAA,OAAO,CAACC,KAAR,CAAc,iCAAd;AACA,WAAO,EAAP;AACD,GAV2B,EAW5B,CAAC5C,YAAD,CAX4B,CAA9B;AAcA,QAAMiE,aAAa,GAAG9F,wBAAwB,CAC5C;AACE+F,IAAAA,QAAQ,EAAGC,KAAD,IAAW;AACnBjE,MAAAA,cAAc,CAACC,KAAf,GAAuBgE,KAAK,CAACC,aAAN,CAAoBrC,CAA3C;AACA0B,MAAAA,WAAW,CAACvD,cAAc,CAACC,KAAhB,CAAX;AACD,KAJH;AAKEkE,IAAAA,WAAW,EAAGC,EAAD,IAAQ;AACnBlG,MAAAA,OAAO,CAACwF,SAAD,CAAP;AACD,KAPH;AAQEW,IAAAA,SAAS,EAAGD,EAAD,IAAQ;AACjBlG,MAAAA,OAAO,CAACyF,OAAD,CAAP;AACD;AAVH,GAD4C,EAa5C,CAACD,SAAD,EAAYC,OAAZ,EAAqBJ,WAArB,CAb4C,CAA9C;AAgBA,QAAMe,cAAc,GAAG9G,WAAW,CAC/BgF,KAAD,IAAmB;AACjB,QAAIlD,kBAAkB,KAAK,OAA3B,EAAoC;AAClC,aAAO;AACLiF,QAAAA,WAAW,EAAE/B,KAAK,KAAK,CAAV,GAAc,CAAd,GAAkB/C,YAAY,GAAG,CADzC;AAEL+E,QAAAA,YAAY,EAAEhC,KAAK,KAAK3D,IAAI,CAACiC,MAAL,GAAc,CAAxB,GAA4B,CAA5B,GAAgCrB,YAAY,GAAG;AAFxD,OAAP;AAID;;AACD,WAAO;AACL8E,MAAAA,WAAW,EAAE9E,YAAY,GAAG,CADvB;AAEL+E,MAAAA,YAAY,EAAE/E,YAAY,GAAG;AAFxB,KAAP;AAID,GAZ+B,EAahC,CAACA,YAAD,EAAeH,kBAAf,CAbgC,CAAlC;;AAgBA,WAASmF,UAAT,CAAoBZ,IAApB,EAAiCzC,CAAjC,EAA4C;AAC1C,wBACE,oBAAC,QAAD;AACE,MAAA,GAAG,EAAEwC,UAAU,CAACC,IAAD,EAAOzC,CAAP,CADjB;AAEE,MAAA,cAAc,EAAEkD,cAAc,CAAClD,CAAD,CAFhC;AAGE,MAAA,IAAI,EAAEyC,IAHR;AAIE,MAAA,KAAK,EAAEzC,CAJT;AAKE,MAAA,MAAM,EAAER,OAAO,CAACQ,CAAD,CALjB;AAME,MAAA,SAAS,EAAE/B,SANb;AAOE,MAAA,aAAa,EAAEW,cAPjB;AAQE,MAAA,SAAS,EAAEb,SARb;AASE,MAAA,UAAU,EAAEQ,UATd;AAUE,MAAA,MAAM,EAAEO,MAVV;AAWE,MAAA,eAAe,EAAEX,eAXnB;AAYE,MAAA,aAAa,EAAEC;AAZjB,MADF;AAgBD;;AAED,sBACE,oBAAC,IAAD;AAAM,IAAA,KAAK,EAAE,CAACZ,KAAD;AAAb,kBACE,oBAAC,QAAD,CAAU,UAAV;AACE,IAAA,GAAG,EAAE+B;AADP,KAEMd,eAFN;AAGE,IAAA,KAAK,EAAE6E,MAAM,CAACC,SAHhB;AAIE,IAAA,UAAU,MAJZ;AAKE,IAAA,6BAA6B,MAL/B;AAME,IAAA,uBAAuB,MANzB;AAOE,IAAA,8BAA8B,EAAE,KAPlC;AAQE,IAAA,aAAa,EAAE/D,OARjB;AASE,IAAA,WAAW,MATb;AAUE,IAAA,SAAS,MAVX;AAWE,IAAA,gBAAgB,EAAC,MAXnB;AAYE,IAAA,mBAAmB,EAAE,EAZvB;AAaE,IAAA,QAAQ,EAAEmD,aAbZ;AAcE,IAAA,OAAO,EAAE,KAdX;AAeE,IAAA,qBAAqB,EAAE;AACrBa,MAAAA,iBAAiB,EAAEnE;AADE;AAfzB,MAmBGM,SAAS,CAACmC,GAAV,CAAcuB,UAAd,CAnBH,CADF,CADF;AAyBD;;AAED,eAAe9F,QAAf;AAEA,MAAM+F,MAAM,GAAG9G,UAAU,CAACiH,MAAX,CAAkB;AAC/BF,EAAAA,SAAS,EAAE;AAAEG,IAAAA,IAAI,EAAE;AAAR;AADoB,CAAlB,CAAf","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n  useSharedValue,\n  useAnimatedScrollHandler,\n  runOnJS,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst { width: wWidth } = Dimensions.get('screen');\n\nfunction Carousel<TData>({\n  style,\n  data,\n  initialPage = 0,\n  loop = false,\n  additionalPagesPerSide = 2,\n  autoPlay = false,\n  duration = 1000,\n  animation,\n  sliderWidth = wWidth,\n  itemWidth = wWidth,\n  firstItemAlignment = 'center',\n  inactiveOpacity = 1,\n  inactiveScale = 1,\n  spaceBetween = 0,\n  spaceHeadTail = 0,\n  renderItem,\n  onPageChange,\n  scrollViewProps = {},\n  keyExtractor,\n}: CarouselProps<TData>) {\n  const currentPage = useSharedValue(0);\n  const animatedScroll = useSharedValue(currentPage.value * sliderWidth);\n  const freeze = useSharedValue(loop);\n  const [isDragging, setDragging] = useState(false);\n  const expectedPosition = useRef(-1);\n  const pageMapper = useRef<Record<number, number>>({});\n  const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n  const horizontalPadding = useMemo(() => {\n    const padding = (sliderWidth - itemWidth) / 2;\n    return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n  }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n  const scrollViewRef = useRef<any>(null);\n\n  const offsets = useMemo(() => {\n    return generateOffsets({\n      sliderWidth,\n      itemWidth,\n      itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n      horizontalPadding,\n    });\n  }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n  const pageItems = useMemo(() => {\n    if (!data) {\n      return [];\n    }\n    totalPage.value = data.length;\n    if (loop) {\n      const headItems = data.slice(\n        data.length - additionalPagesPerSide,\n        data.length\n      );\n      const tailItems = data.slice(0, additionalPagesPerSide);\n      const newItems = [...headItems, ...data, ...tailItems];\n      for (let i = 0; i < newItems.length; i++) {\n        pageMapper.current[i] =\n          (data.length - additionalPagesPerSide + i) % data.length;\n      }\n      return newItems;\n    } else {\n      for (let i = 0; i < data.length; i++) {\n        pageMapper.current[i] = i;\n      }\n      return data;\n    }\n  }, [data, loop]);\n\n  const getActualPage = useCallback((page: number) => {\n    return pageMapper.current[page];\n  }, []);\n\n  const getRef = useCallback(() => {\n    if (!scrollViewRef.current) return;\n    if (scrollViewRef.current.scrollTo) {\n      return scrollViewRef.current;\n    }\n    return scrollViewRef.current.getNode();\n  }, []);\n\n  const handleScrollTo = useCallback(\n    (page: number, animated = true) => {\n      if (getRef()) {\n        getRef().scrollTo({ x: offsets[page], y: 0, animated });\n      }\n    },\n    [getRef, offsets]\n  );\n\n  const jumpTo = useCallback(\n    (page: number, delay = 200) => {\n      expectedPosition.current = page;\n      if (Platform.OS === 'android') {\n        freeze.value = true;\n      }\n      setTimeout(() => {\n        animatedScroll.value = offsets[page];\n        handleScrollTo(page, false);\n      }, delay);\n    },\n    [handleScrollTo, animatedScroll, freeze]\n  );\n\n  const goNext = useCallback(() => {\n    const next = currentPage.value + 1;\n    handleScrollTo(next);\n  }, [handleScrollTo]);\n\n  const goPrev = useCallback(() => {\n    const prev = currentPage.value - 1;\n    handleScrollTo(prev);\n  }, [handleScrollTo]);\n\n  const snapToItem = useCallback(\n    (index: number, animated = true) => {\n      if (index < 0 || index >= data.length) {\n        console.error(`Index not valid ${index}`);\n        return;\n      }\n      let pageIndex = index;\n      if (loop) {\n        const indices: number[] = Object.keys(pageMapper.current)\n          .filter((idx) => pageMapper.current[Number(idx)] === index)\n          .map((idx) => Number(idx));\n        const toIndex = findNearestPage(currentPage.value, indices, 10);\n        pageIndex = indices[toIndex];\n      }\n      handleScrollTo(pageIndex, animated);\n    },\n    [handleScrollTo]\n  );\n\n  const { setCarouselHandlers } = useInternalCarouselContext();\n\n  useEffect(() => {\n    if (setCarouselHandlers) {\n      setCarouselHandlers({\n        goNext,\n        goPrev,\n        snapToItem,\n      });\n    }\n  }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n  const handlePageChange = useCallback(\n    (page: number) => {\n      const actualPage = getActualPage(page);\n      animatedPage.value = actualPage;\n      if (onPageChange) {\n        onPageChange(actualPage);\n      }\n      if (!loop) return;\n      if (page === pageItems.length - 1) {\n        jumpTo(additionalPagesPerSide * 2 - 1);\n      } else if (page === 0) {\n        jumpTo(pageItems.length - additionalPagesPerSide * 2);\n      }\n    },\n    [onPageChange, loop, getActualPage, jumpTo, pageItems]\n  );\n\n  const refreshPage = useCallback(\n    (offset) => {\n      'worklet';\n      const pageNum = findNearestPage(offset, offsets, 20);\n      if (pageNum === -1) {\n        return;\n      }\n      if (pageNum !== currentPage.value) {\n        if (expectedPosition.current === pageNum) {\n          freeze.value = false;\n        }\n        currentPage.value = pageNum;\n        runOnJS(handlePageChange)(pageNum);\n      }\n    },\n    [isDragging, offsets, handlePageChange]\n  );\n\n  useInterval(\n    () => {\n      goNext();\n    },\n    !autoPlay || !loop || isDragging ? -1 : duration\n  );\n\n  useEffect(() => {\n    if (initialPage < 0 || initialPage >= data.length) {\n      console.error(`Invalid initialPage ${initialPage}`);\n      return;\n    }\n    let pageIndex = initialPage;\n    if (loop) {\n      pageIndex = initialPage + additionalPagesPerSide;\n    }\n    if (currentPage.value !== pageIndex) {\n      setTimeout(() => {\n        handleScrollTo(pageIndex, false);\n        freeze.value = false;\n      });\n    }\n  }, []);\n\n  const beginDrag = useCallback(() => {\n    if (autoPlay) {\n      setDragging(true);\n    }\n  }, [autoPlay]);\n\n  const endDrag = useCallback(() => {\n    if (autoPlay) {\n      setTimeout(() => setDragging(false), 200);\n    }\n  }, [autoPlay]);\n\n  const getItemKey = useCallback(\n    (item: TData, index: number): string => {\n      if (keyExtractor) {\n        return `${keyExtractor(item, index)}-${index}`;\n      }\n      if ((item as any).id) {\n        return `${(item as any).id}-${index}`;\n      }\n      console.error('You need implement keyExtractor');\n      return '';\n    },\n    [keyExtractor]\n  );\n\n  const scrollHandler = useAnimatedScrollHandler(\n    {\n      onScroll: (event) => {\n        animatedScroll.value = event.contentOffset.x;\n        refreshPage(animatedScroll.value);\n      },\n      onBeginDrag: (_e) => {\n        runOnJS(beginDrag)();\n      },\n      onEndDrag: (_e) => {\n        runOnJS(endDrag)();\n      },\n    },\n    [beginDrag, endDrag, refreshPage]\n  );\n\n  const containerStyle = useCallback(\n    (index: number) => {\n      if (firstItemAlignment === 'start') {\n        return {\n          paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n          paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n        };\n      }\n      return {\n        paddingLeft: spaceBetween / 2,\n        paddingRight: spaceBetween / 2,\n      };\n    },\n    [spaceBetween, firstItemAlignment]\n  );\n\n  function renderPage(item: TData, i: number) {\n    return (\n      <PageItem\n        key={getItemKey(item, i)}\n        containerStyle={containerStyle(i)}\n        item={item}\n        index={i}\n        offset={offsets[i]}\n        itemWidth={itemWidth}\n        animatedValue={animatedScroll}\n        animation={animation}\n        renderItem={renderItem}\n        freeze={freeze}\n        inactiveOpacity={inactiveOpacity}\n        inactiveScale={inactiveScale}\n      />\n    );\n  }\n\n  return (\n    <View style={[style]}>\n      <Animated.ScrollView\n        ref={scrollViewRef}\n        {...scrollViewProps}\n        style={styles.container}\n        horizontal\n        disableScrollViewPanResponder\n        disableIntervalMomentum\n        showsHorizontalScrollIndicator={false}\n        snapToOffsets={offsets}\n        snapToStart\n        snapToEnd\n        decelerationRate=\"fast\"\n        scrollEventThrottle={16}\n        onScroll={scrollHandler}\n        bounces={false}\n        contentContainerStyle={{\n          paddingHorizontal: horizontalPadding,\n        }}\n      >\n        {pageItems.map(renderPage)}\n      </Animated.ScrollView>\n    </View>\n  );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n  container: { flex: 1 },\n});\n"]}
+{"version":3,"sources":["Carousel.tsx"],"names":["React","useState","useRef","useEffect","useCallback","useMemo","View","Dimensions","StyleSheet","Platform","useInterval","Animated","useSharedValue","useAnimatedScrollHandler","runOnJS","useAnimatedRef","PageItem","findNearestPage","generateOffsets","useCarouselContext","useInternalCarouselContext","width","wWidth","get","Carousel","style","data","initialPage","loop","additionalPagesPerSide","autoPlay","duration","animation","sliderWidth","itemWidth","firstItemAlignment","inactiveOpacity","inactiveScale","spaceBetween","spaceHeadTail","renderItem","onPageChange","scrollViewProps","keyExtractor","currentPage","animatedScroll","value","freeze","isDragging","setDragging","expectedPosition","pageMapper","animatedPage","totalPage","horizontalPadding","padding","scrollViewRef","offsets","itemCount","length","pageItems","headItems","slice","tailItems","newItems","i","current","getActualPage","page","getRef","scrollTo","getNode","handleScrollTo","animated","x","y","jumpTo","delay","OS","setTimeout","goNext","next","goPrev","prev","snapToItem","index","console","error","pageIndex","indices","Object","keys","filter","idx","Number","map","toIndex","setCarouselHandlers","handlePageChange","actualPage","refreshPage","offset","pageNum","beginDrag","endDrag","getItemKey","item","id","scrollHandler","onScroll","event","contentOffset","onBeginDrag","_e","onEndDrag","containerStyle","paddingLeft","paddingRight","renderPage","styles","container","paddingHorizontal","create","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, {\n  useState,\n  useRef,\n  useEffect,\n  useCallback,\n  useMemo,\n} from 'react';\nimport { View, Dimensions, StyleSheet, Platform } from 'react-native';\nimport { useInterval } from '@r0b0t3d/react-native-hooks';\nimport Animated, {\n  useSharedValue,\n  useAnimatedScrollHandler,\n  runOnJS,\n  useAnimatedRef,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\nimport PageItem from './PageItem';\nimport { findNearestPage, generateOffsets } from '../utils';\nimport { useCarouselContext } from './useCarouselContext';\nimport { useInternalCarouselContext } from './useInternalCarouselContext';\n\nconst { width: wWidth } = Dimensions.get('screen');\n\nfunction Carousel<TData>({\n  style,\n  data,\n  initialPage = 0,\n  loop = false,\n  additionalPagesPerSide = 2,\n  autoPlay = false,\n  duration = 1000,\n  animation,\n  sliderWidth = wWidth,\n  itemWidth = wWidth,\n  firstItemAlignment = 'center',\n  inactiveOpacity = 1,\n  inactiveScale = 1,\n  spaceBetween = 0,\n  spaceHeadTail = 0,\n  renderItem,\n  onPageChange,\n  scrollViewProps = {},\n  keyExtractor,\n}: CarouselProps<TData>) {\n  const currentPage = useSharedValue(0);\n  const animatedScroll = useSharedValue(currentPage.value * sliderWidth);\n  const freeze = useSharedValue(false);\n  const [isDragging, setDragging] = useState(false);\n  const expectedPosition = useSharedValue(-1);\n  const pageMapper = useRef<Record<number, number>>({});\n  const { currentPage: animatedPage, totalPage } = useCarouselContext();\n\n  const horizontalPadding = useMemo(() => {\n    const padding = (sliderWidth - itemWidth) / 2;\n    return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;\n  }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);\n\n  const scrollViewRef = useAnimatedRef<any>();\n\n  const offsets = useMemo(() => {\n    return generateOffsets({\n      sliderWidth,\n      itemWidth,\n      itemCount: data.length + (loop ? additionalPagesPerSide * 2 : 0),\n      horizontalPadding,\n    });\n  }, [sliderWidth, itemWidth, data, horizontalPadding]);\n\n  const pageItems = useMemo(() => {\n    if (!data) {\n      return [];\n    }\n    totalPage.value = data.length;\n    if (loop) {\n      const headItems = data.slice(\n        data.length - additionalPagesPerSide,\n        data.length\n      );\n      const tailItems = data.slice(0, additionalPagesPerSide);\n      const newItems = [...headItems, ...data, ...tailItems];\n      for (let i = 0; i < newItems.length; i++) {\n        pageMapper.current[i] =\n          (data.length - additionalPagesPerSide + i) % data.length;\n      }\n      return newItems;\n    } else {\n      for (let i = 0; i < data.length; i++) {\n        pageMapper.current[i] = i;\n      }\n      return data;\n    }\n  }, [data, loop]);\n\n  const getActualPage = useCallback((page: number) => {\n    return pageMapper.current[page];\n  }, []);\n\n  const getRef = useCallback(() => {\n    if (!scrollViewRef.current) return;\n    if (scrollViewRef.current.scrollTo) {\n      return scrollViewRef.current;\n    }\n    return scrollViewRef.current.getNode();\n  }, []);\n\n  const handleScrollTo = useCallback(\n    (page: number, animated = true) => {\n      if (getRef()) {\n        getRef().scrollTo({ x: offsets[page], y: 0, animated });\n      }\n    },\n    [getRef, offsets]\n  );\n\n  const jumpTo = useCallback(\n    (page: number, delay = 200) => {\n      expectedPosition.value = page;\n      if (Platform.OS === 'android') {\n        freeze.value = true;\n      }\n      setTimeout(() => {\n        animatedScroll.value = offsets[page];\n        handleScrollTo(page, false);\n      }, delay);\n    },\n    [handleScrollTo, animatedScroll, freeze]\n  );\n\n  const goNext = useCallback(() => {\n    const next = currentPage.value + 1;\n    handleScrollTo(next);\n  }, [handleScrollTo]);\n\n  const goPrev = useCallback(() => {\n    const prev = currentPage.value - 1;\n    handleScrollTo(prev);\n  }, [handleScrollTo]);\n\n  const snapToItem = useCallback(\n    (index: number, animated = true) => {\n      if (index < 0 || index >= data.length) {\n        console.error(`Index not valid ${index}`);\n        return;\n      }\n      let pageIndex = index;\n      if (loop) {\n        const indices: number[] = Object.keys(pageMapper.current)\n          .filter((idx) => pageMapper.current[Number(idx)] === index)\n          .map((idx) => Number(idx));\n        const toIndex = findNearestPage(currentPage.value, indices, 10);\n        pageIndex = indices[toIndex];\n      }\n      handleScrollTo(pageIndex, animated);\n    },\n    [handleScrollTo]\n  );\n\n  const { setCarouselHandlers } = useInternalCarouselContext();\n\n  useEffect(() => {\n    if (setCarouselHandlers) {\n      setCarouselHandlers({\n        goNext,\n        goPrev,\n        snapToItem,\n      });\n    }\n  }, [goNext, goPrev, snapToItem, setCarouselHandlers]);\n\n  const handlePageChange = useCallback(\n    (page: number) => {\n      const actualPage = getActualPage(page);\n      animatedPage.value = actualPage;\n      if (onPageChange) {\n        onPageChange(actualPage);\n      }\n      if (!loop) return;\n      if (page === pageItems.length - 1) {\n        jumpTo(additionalPagesPerSide * 2 - 1);\n      } else if (page === 0) {\n        jumpTo(pageItems.length - additionalPagesPerSide * 2);\n      }\n    },\n    [onPageChange, loop, getActualPage, jumpTo, pageItems]\n  );\n\n  const refreshPage = useCallback(\n    (offset) => {\n      'worklet';\n      const pageNum = findNearestPage(offset, offsets, 20);     \n      if (pageNum === -1) {\n        return;\n      }\n      if (pageNum !== currentPage.value) {\n        if (expectedPosition.value === pageNum) {\n          freeze.value = false;\n        }\n        currentPage.value = pageNum;\n        runOnJS(handlePageChange)(pageNum);\n      }\n    },\n    [isDragging, offsets, handlePageChange]\n  );\n\n  useInterval(\n    () => {\n      goNext();\n    },\n    !autoPlay || !loop || isDragging ? -1 : duration\n  );\n\n  useEffect(() => {\n    if (initialPage < 0 || initialPage >= data.length) {\n      console.error(`Invalid initialPage ${initialPage}`);\n      return;\n    }\n    let pageIndex = initialPage;\n    if (loop) {\n      pageIndex = initialPage + additionalPagesPerSide;\n    }\n    if (currentPage.value !== pageIndex) {\n      setTimeout(() => {\n        handleScrollTo(pageIndex, false);\n        freeze.value = false;\n      });\n    }\n  }, []);\n\n  const beginDrag = useCallback(() => {\n    if (autoPlay) {\n      setDragging(true);\n    }\n  }, [autoPlay]);\n\n  const endDrag = useCallback(() => {\n    if (autoPlay) {\n      setTimeout(() => setDragging(false), 200);\n    }\n  }, [autoPlay]);\n\n  const getItemKey = useCallback(\n    (item: TData, index: number): string => {\n      if (keyExtractor) {\n        return `${keyExtractor(item, index)}-${index}`;\n      }\n      if ((item as any).id) {\n        return `${(item as any).id}-${index}`;\n      }\n      console.error('You need implement keyExtractor');\n      return '';\n    },\n    [keyExtractor]\n  );\n\n  const scrollHandler = useAnimatedScrollHandler(\n    {\n      onScroll: (event) => {\n        animatedScroll.value = event.contentOffset.x;\n        refreshPage(animatedScroll.value);\n      },\n      onBeginDrag: (_e) => {\n        runOnJS(beginDrag)();\n      },\n      onEndDrag: (_e) => {\n        runOnJS(endDrag)();\n      },\n    },\n    [beginDrag, endDrag, refreshPage]\n  );\n\n  const containerStyle = useCallback(\n    (index: number) => {\n      if (firstItemAlignment === 'start') {\n        return {\n          paddingLeft: index === 0 ? 0 : spaceBetween / 2,\n          paddingRight: index === data.length - 1 ? 0 : spaceBetween / 2,\n        };\n      }\n      return {\n        paddingLeft: spaceBetween / 2,\n        paddingRight: spaceBetween / 2,\n      };\n    },\n    [spaceBetween, firstItemAlignment]\n  );\n\n  function renderPage(item: TData, i: number) {\n    return (\n      <PageItem\n        key={getItemKey(item, i)}\n        containerStyle={containerStyle(i)}\n        item={item}\n        index={i}\n        offset={offsets[i]}\n        itemWidth={itemWidth}\n        animatedValue={animatedScroll}\n        animation={animation}\n        renderItem={renderItem}\n        freeze={freeze}\n        inactiveOpacity={inactiveOpacity}\n        inactiveScale={inactiveScale}\n      />\n    );\n  }\n\n  return (\n    <View style={style}>\n      <Animated.ScrollView\n        {...scrollViewProps}\n        ref={scrollViewRef}\n        style={styles.container}\n        horizontal\n        disableScrollViewPanResponder\n        disableIntervalMomentum\n        showsHorizontalScrollIndicator={false}\n        snapToOffsets={offsets}\n        snapToStart\n        snapToEnd\n        decelerationRate=\"fast\"\n        scrollEventThrottle={4}\n        onScroll={scrollHandler}\n        bounces={false}\n        contentContainerStyle={{\n          paddingHorizontal: horizontalPadding,\n        }}\n      >\n        {pageItems.map(renderPage)}\n      </Animated.ScrollView>\n    </View>\n  );\n}\n\nexport default Carousel;\n\nconst styles = StyleSheet.create({\n  container: { flex: 1 },\n});\n"]}

package/lib/module/components/PageItem.js

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 import React from 'react';
 import { Image, StyleSheet, View } from 'react-native';
-import Animated, { interpolate, useAnimatedStyle } from 'react-native-reanimated';
+import Animated, { interpolate, useAnimatedStyle, useDerivedValue } from 'react-native-reanimated';
 export default function PageItem({
   item,
   index,
@@ -15,27 +15,38 @@ export default function PageItem({
   inactiveScale,
   containerStyle
 }) {
-  // @ts-ignore
-  const animatedStyle = useAnimatedStyle(() => {
+  const scale = useDerivedValue(() => {
+    const inputRange = [offset - itemWidth, offset, offset + itemWidth];
+    const scaleOutputRange = [inactiveScale, 1, inactiveScale];
+    return interpolate(animatedValue.value, inputRange, scaleOutputRange);
+  }, []);
+  const translateX = useDerivedValue(() => {
     const inputRange = [offset - itemWidth, offset, offset + itemWidth];
-    const scaleOutputRange = freeze.value ? [1, 1, 1] : [inactiveScale, 1, inactiveScale];
-    const opacityOutputRange = freeze.value ? [1, 1, 1] : [inactiveOpacity, 1, inactiveOpacity];
     const parallaxOutputRange = freeze.value ? [0, 0, 0] : [-itemWidth / 2, 0, itemWidth / 4];
+    return interpolate(animatedValue.value, inputRange, parallaxOutputRange);
+  }, []);
+  const opacity = useDerivedValue(() => {
+    const inputRange = [offset - itemWidth, offset, offset + itemWidth];
+    const opacityOutputRange = freeze.value ? [1, 1, 1] : [inactiveOpacity, 1, inactiveOpacity];
+    return interpolate(animatedValue.value, inputRange, opacityOutputRange);
+  }, []); // @ts-ignore
+
+  const animatedStyle = useAnimatedStyle(() => {
     const transform = [{
-      scale: interpolate(animatedValue.value, inputRange, scaleOutputRange)
+      scale: scale.value
     }];
 
     if (animation === 'parallax') {
       transform.push({
-        translateX: interpolate(animatedValue.value, inputRange, parallaxOutputRange)
+        translateX: translateX.value
       });
     }
 
     return {
-      opacity: interpolate(animatedValue.value, inputRange, opacityOutputRange),
+      opacity: opacity.value,
       transform
     };
-  }, [inactiveScale, inactiveOpacity, animation, itemWidth, offset]);
+  }, []);
 
   function renderContent() {
     if (renderItem) {

package/lib/module/components/PageItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PageItem.tsx"],"names":["React","Image","StyleSheet","View","Animated","interpolate","useAnimatedStyle","PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","animatedStyle","inputRange","scaleOutputRange","value","opacityOutputRange","parallaxOutputRange","transform","scale","push","translateX","opacity","renderContent","scrollPosition","source","absoluteFillObject","height","undefined","width","console","error","overflow","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport Animated, {\n  interpolate,\n  useAnimatedStyle,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n  item: TData;\n  index: number;\n  offset: number;\n  renderItem: CarouselProps['renderItem'];\n  animatedValue: Animated.SharedValue<number>;\n  animation?: 'parallax';\n  freeze: Animated.SharedValue<boolean>;\n  itemWidth: number;\n  inactiveOpacity: number;\n  inactiveScale: number;\n  containerStyle: StyleProp<ViewStyle>;\n};\n\nexport default function PageItem<TData = any>({\n  item,\n  index,\n  offset,\n  renderItem,\n  animatedValue,\n  animation,\n  freeze,\n  itemWidth,\n  inactiveOpacity,\n  inactiveScale,\n  containerStyle,\n}: Props<TData>) {\n  // @ts-ignore\n  const animatedStyle = useAnimatedStyle(() => {\n    const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n    const scaleOutputRange = freeze.value\n      ? [1, 1, 1]\n      : [inactiveScale, 1, inactiveScale];\n    const opacityOutputRange = freeze.value\n      ? [1, 1, 1]\n      : [inactiveOpacity, 1, inactiveOpacity];\n    const parallaxOutputRange = freeze.value\n      ? [0, 0, 0]\n      : [-itemWidth / 2, 0, itemWidth / 4];\n\n    const transform: ViewStyle['transform'] = [\n      {\n        scale: interpolate(animatedValue.value, inputRange, scaleOutputRange),\n      },\n    ];\n    if (animation === 'parallax') {\n      transform.push({\n        translateX: interpolate(\n          animatedValue.value,\n          inputRange,\n          parallaxOutputRange\n        ),\n      });\n    }\n    return {\n      opacity: interpolate(animatedValue.value, inputRange, opacityOutputRange),\n      transform,\n    };\n  }, [inactiveScale, inactiveOpacity, animation, itemWidth, offset]);\n\n  function renderContent() {\n    if (renderItem) {\n      return renderItem({ item, index }, { scrollPosition: animatedValue, offset });\n    }\n    if (typeof item === 'object' && (item as any).source) {\n      return (\n        <Image\n          source={(item as any).source}\n          style={{\n            ...StyleSheet.absoluteFillObject,\n            height: undefined,\n            width: undefined,\n          }}\n          resizeMode=\"cover\"\n        />\n      );\n    }\n    console.error('You need implement renderItem');\n    return null;\n  }\n\n  return (\n    <View\n      collapsable={false}\n      style={[\n        {\n          width: itemWidth,\n          overflow: 'hidden',\n        },\n        containerStyle,\n      ]}\n    >\n      <Animated.View style={[{ flex: 1 }, animatedStyle]}>\n        {renderContent()}\n      </Animated.View>\n    </View>\n  );\n}\n"]}
+{"version":3,"sources":["PageItem.tsx"],"names":["React","Image","StyleSheet","View","Animated","interpolate","useAnimatedStyle","useDerivedValue","PageItem","item","index","offset","renderItem","animatedValue","animation","freeze","itemWidth","inactiveOpacity","inactiveScale","containerStyle","scale","inputRange","scaleOutputRange","value","translateX","parallaxOutputRange","opacity","opacityOutputRange","animatedStyle","transform","push","renderContent","scrollPosition","source","absoluteFillObject","height","undefined","width","console","error","overflow","flex"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React from 'react';\nimport { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';\nimport Animated, {\n  interpolate,\n  useAnimatedStyle,\n  useDerivedValue,\n} from 'react-native-reanimated';\nimport type { CarouselProps } from '../types';\n\ntype Props<TData> = {\n  item: TData;\n  index: number;\n  offset: number;\n  renderItem: CarouselProps['renderItem'];\n  animatedValue: Animated.SharedValue<number>;\n  animation?: 'parallax';\n  freeze: Animated.SharedValue<boolean>;\n  itemWidth: number;\n  inactiveOpacity: number;\n  inactiveScale: number;\n  containerStyle: StyleProp<ViewStyle>;\n};\n\nexport default function PageItem<TData = any>({\n  item,\n  index,\n  offset,\n  renderItem,\n  animatedValue,\n  animation,\n  freeze,\n  itemWidth,\n  inactiveOpacity,\n  inactiveScale,\n  containerStyle,\n}: Props<TData>) {\n  const scale = useDerivedValue(() => {\n    const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n    const scaleOutputRange = [inactiveScale, 1, inactiveScale];\n    return interpolate(animatedValue.value, inputRange, scaleOutputRange);\n  }, []);\n\n  const translateX = useDerivedValue(() => {\n    const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n    const parallaxOutputRange = freeze.value\n      ? [0, 0, 0]\n      : [-itemWidth / 2, 0, itemWidth / 4];\n\n    return interpolate(animatedValue.value, inputRange, parallaxOutputRange);\n  }, []);\n\n  const opacity = useDerivedValue(() => {\n    const inputRange = [offset - itemWidth, offset, offset + itemWidth];\n    const opacityOutputRange = freeze.value\n      ? [1, 1, 1]\n      : [inactiveOpacity, 1, inactiveOpacity];\n    return interpolate(animatedValue.value, inputRange, opacityOutputRange);\n  }, []);\n  // @ts-ignore\n  const animatedStyle = useAnimatedStyle(() => {\n    const transform: ViewStyle['transform'] = [\n      {\n        scale: scale.value,\n      },\n    ];\n    if (animation === 'parallax') {\n      transform.push({\n        translateX: translateX.value,\n      });\n    }\n    return {\n      opacity: opacity.value,\n      transform,\n    };\n  }, []);\n\n  function renderContent() {\n    if (renderItem) {\n      return renderItem(\n        { item, index },\n        { scrollPosition: animatedValue, offset }\n      );\n    }\n    if (typeof item === 'object' && (item as any).source) {\n      return (\n        <Image\n          source={(item as any).source}\n          style={{\n            ...StyleSheet.absoluteFillObject,\n            height: undefined,\n            width: undefined,\n          }}\n          resizeMode=\"cover\"\n        />\n      );\n    }\n    console.error('You need implement renderItem');\n    return null;\n  }\n\n  return (\n    <View\n      collapsable={false}\n      style={[\n        {\n          width: itemWidth,\n          overflow: 'hidden',\n        },\n        containerStyle,\n      ]}\n    >\n      <Animated.View style={[{ flex: 1 }, animatedStyle]}>\n        {renderContent()}\n      </Animated.View>\n    </View>\n  );\n}\n"]}

package/lib/module/components/PaginationIndicator.js

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/ban-ts-comment */
-import React, { useCallback, useMemo } from 'react';
+import React, { useMemo } from 'react';
 import { View, StyleSheet } from 'react-native';
-import Animated, { useAnimatedStyle, useDerivedValue, useSharedValue, withSpring } from 'react-native-reanimated';
+import Animated, { useAnimatedStyle, useDerivedValue, withSpring } from 'react-native-reanimated';
 import { useCarouselContext } from './useCarouselContext';
 const defaultIndicatorConfigs = {
   indicatorColor: 'gray',
@@ -10,19 +10,6 @@ const defaultIndicatorConfigs = {
   indicatorSelectedWidth: 6,
   spaceBetween: 3
 };
-const styles = StyleSheet.create({
-  container: {
-    flexDirection: 'row',
-    alignItems: 'center'
-  },
-  dotContainer: {
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  dotSelectedStyle: {
-    position: 'absolute'
-  }
-});
 const defaultSpringConfig = {
   stiffness: 1000,
   damping: 500,
@@ -32,15 +19,15 @@ const defaultSpringConfig = {
   restSpeedThreshold: 0.01
 };
 export default function PaginationIndicator({
-  // totalPage,
   containerStyle,
   indicatorStyle,
   activeIndicatorStyle,
   indicatorConfigs
 }) {
-  const carouselContext = useCarouselContext();
-  const page = useSharedValue(0);
-  const currentPage = carouselContext.currentPage || page;
+  const {
+    currentPage,
+    totalPage
+  } = useCarouselContext();
   const configs = useMemo(() => {
     return { ...defaultIndicatorConfigs,
       ...indicatorConfigs
@@ -56,7 +43,8 @@ export default function PaginationIndicator({
       }]
     };
   }, []);
-  const renderItem = useCallback(pageNumber => {
+
+  function renderItem(pageNumber) {
     // @ts-ignore
     if (activeIndicatorStyle !== null && activeIndicatorStyle !== void 0 && activeIndicatorStyle.width) {
       console.error('Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead');
@@ -67,35 +55,19 @@ export default function PaginationIndicator({
       console.error('Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead');
     }
 
-    const dotContainerStyle = StyleSheet.flatten([styles.dotContainer, {
-      width: configs.indicatorSelectedWidth,
-      height: configs.indicatorWidth,
-      marginEnd: configs.spaceBetween
-    }, activeIndicatorStyle, {
-      // Disable backgroundColor in activeIndicatorStyle
-      backgroundColor: undefined
-    }]);
-    const dotStyle = StyleSheet.flatten([{
-      width: configs.indicatorWidth,
-      height: configs.indicatorWidth,
-      borderRadius: configs.indicatorWidth / 2,
-      backgroundColor: configs.indicatorColor
-    }, indicatorStyle]);
-    const aStyle = useAnimatedStyle(() => {
-      return {
-        width: withSpring(currentPage.value === pageNumber ? configs.indicatorSelectedWidth : configs.indicatorWidth, defaultSpringConfig)
-      };
-    }, []);
-    return /*#__PURE__*/React.createElement(Animated.View, {
+    return /*#__PURE__*/React.createElement(IndicatorItem, {
       key: `index${pageNumber}`,
-      style: [dotContainerStyle, aStyle]
-    }, /*#__PURE__*/React.createElement(View, {
-      style: dotStyle
-    }));
-  }, []);
+      currentPage: currentPage,
+      pageNumber: pageNumber,
+      configs: configs,
+      indicatorStyle: indicatorStyle,
+      activeIndicatorStyle: activeIndicatorStyle
+    });
+  }
+
   return /*#__PURE__*/React.createElement(View, {
     style: [styles.container, containerStyle]
-  }, [...Array(carouselContext.totalPage.value).keys()].map(renderItem), /*#__PURE__*/React.createElement(Animated.View, {
+  }, [...Array(totalPage.value).keys()].map(renderItem), /*#__PURE__*/React.createElement(Animated.View, {
     style: [styles.dotSelectedStyle, {
       width: configs.indicatorSelectedWidth,
       height: configs.indicatorWidth,
@@ -104,4 +76,54 @@ export default function PaginationIndicator({
     }, activeIndicatorStyle, animatedStyle]
   }));
 }
+
+function IndicatorItem({
+  currentPage,
+  pageNumber,
+  configs,
+  activeIndicatorStyle,
+  indicatorStyle
+}) {
+  const dotContainerStyle = useMemo(() => [styles.dotContainer, {
+    width: configs.indicatorSelectedWidth,
+    height: configs.indicatorWidth,
+    marginEnd: configs.spaceBetween
+  }, activeIndicatorStyle, {
+    // Disable backgroundColor in activeIndicatorStyle
+    backgroundColor: undefined
+  }], [activeIndicatorStyle]);
+  const dotStyle = useMemo(() => [{
+    width: configs.indicatorWidth,
+    height: configs.indicatorWidth,
+    borderRadius: configs.indicatorWidth / 2,
+    backgroundColor: configs.indicatorColor
+  }, indicatorStyle], [indicatorStyle]);
+  const animatedWidth = useDerivedValue(() => {
+    return withSpring(currentPage.value === pageNumber ? configs.indicatorSelectedWidth : configs.indicatorWidth, defaultSpringConfig);
+  });
+  const aStyle = useAnimatedStyle(() => {
+    return {
+      width: animatedWidth.value
+    };
+  }, []);
+  return /*#__PURE__*/React.createElement(Animated.View, {
+    style: [dotContainerStyle, aStyle]
+  }, /*#__PURE__*/React.createElement(View, {
+    style: dotStyle
+  }));
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'center'
+  },
+  dotContainer: {
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  dotSelectedStyle: {
+    position: 'absolute'
+  }
+});
 //# sourceMappingURL=PaginationIndicator.js.map

package/lib/module/components/PaginationIndicator.js.map

@@ -1 +1 @@
-{"version":3,"sources":["PaginationIndicator.tsx"],"names":["React","useCallback","useMemo","View","StyleSheet","Animated","useAnimatedStyle","useDerivedValue","useSharedValue","withSpring","useCarouselContext","defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","styles","create","container","flexDirection","alignItems","dotContainer","justifyContent","dotSelectedStyle","position","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","carouselContext","page","currentPage","configs","translateX","value","animatedStyle","transform","renderItem","pageNumber","width","console","error","dotContainerStyle","flatten","height","marginEnd","backgroundColor","undefined","dotStyle","borderRadius","aStyle","Array","totalPage","keys","map"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useCallback, useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle } from 'react-native';\nimport Animated, {\n  useAnimatedStyle,\n  useDerivedValue,\n  useSharedValue,\n  withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n  indicatorColor: 'gray',\n  indicatorWidth: 6,\n  indicatorSelectedColor: 'blue',\n  indicatorSelectedWidth: 6,\n  spaceBetween: 3,\n};\n\nconst styles = StyleSheet.create({\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  dotContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  dotSelectedStyle: {\n    position: 'absolute',\n  },\n});\n\nconst defaultSpringConfig = {\n  stiffness: 1000,\n  damping: 500,\n  mass: 3,\n  overshootClamping: true,\n  restDisplacementThreshold: 0.01,\n  restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n  // totalPage,\n  containerStyle,\n  indicatorStyle,\n  activeIndicatorStyle,\n  indicatorConfigs,\n}: PaginationProps) {\n  const carouselContext = useCarouselContext();\n  const page = useSharedValue(0);\n  const currentPage = carouselContext.currentPage || page;\n\n  const configs = useMemo(() => {\n    return {\n      ...defaultIndicatorConfigs,\n      ...indicatorConfigs,\n    };\n  }, [indicatorConfigs]);\n\n  const translateX = useDerivedValue(() => {\n    return withSpring(\n      currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n      defaultSpringConfig\n    );\n  }, []);\n\n  const animatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [\n        {\n          translateX: translateX.value,\n        },\n      ],\n    };\n  }, []);\n\n  const renderItem = useCallback((pageNumber: number) => {\n    // @ts-ignore\n    if (activeIndicatorStyle?.width) {\n      console.error(\n        'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n      );\n    }\n    // @ts-ignore\n    if (indicatorStyle?.width) {\n      console.error(\n        'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n      );\n    }\n    const dotContainerStyle: ViewStyle = StyleSheet.flatten([\n      styles.dotContainer,\n      {\n        width: configs.indicatorSelectedWidth,\n        height: configs.indicatorWidth,\n        marginEnd: configs.spaceBetween,\n      },\n      activeIndicatorStyle,\n      {\n        // Disable backgroundColor in activeIndicatorStyle\n        backgroundColor: undefined,\n      },\n    ]);\n    const dotStyle: ViewStyle = StyleSheet.flatten([\n      {\n        width: configs.indicatorWidth,\n        height: configs.indicatorWidth,\n        borderRadius: configs.indicatorWidth! / 2,\n        backgroundColor: configs.indicatorColor,\n      },\n      indicatorStyle,\n    ]);\n\n    const aStyle = useAnimatedStyle(() => {\n      return {\n        width: withSpring(\n          currentPage.value === pageNumber\n            ? configs.indicatorSelectedWidth!\n            : configs.indicatorWidth!,\n          defaultSpringConfig\n        ),\n      };\n    }, []);\n    return (\n      <Animated.View\n        key={`index${pageNumber}`}\n        style={[dotContainerStyle, aStyle]}\n      >\n        <View style={dotStyle} />\n      </Animated.View>\n    );\n  }, []);\n\n  return (\n    <View style={[styles.container, containerStyle]}>\n      {[...Array(carouselContext.totalPage.value).keys()].map(renderItem)}\n      <Animated.View\n        style={[\n          styles.dotSelectedStyle,\n          {\n            width: configs.indicatorSelectedWidth,\n            height: configs.indicatorWidth,\n            borderRadius: configs.indicatorWidth! / 2,\n            backgroundColor: configs.indicatorSelectedColor,\n          },\n          activeIndicatorStyle,\n          animatedStyle,\n        ]}\n      />\n    </View>\n  );\n}\n"]}
+{"version":3,"sources":["PaginationIndicator.tsx"],"names":["React","useMemo","View","StyleSheet","Animated","useAnimatedStyle","useDerivedValue","withSpring","useCarouselContext","defaultIndicatorConfigs","indicatorColor","indicatorWidth","indicatorSelectedColor","indicatorSelectedWidth","spaceBetween","defaultSpringConfig","stiffness","damping","mass","overshootClamping","restDisplacementThreshold","restSpeedThreshold","PaginationIndicator","containerStyle","indicatorStyle","activeIndicatorStyle","indicatorConfigs","currentPage","totalPage","configs","translateX","value","animatedStyle","transform","renderItem","pageNumber","width","console","error","styles","container","Array","keys","map","dotSelectedStyle","height","borderRadius","backgroundColor","IndicatorItem","dotContainerStyle","dotContainer","marginEnd","undefined","dotStyle","animatedWidth","aStyle","create","flexDirection","alignItems","justifyContent","position"],"mappings":"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","sourcesContent":["/* eslint-disable @typescript-eslint/ban-ts-comment */\nimport React, { useMemo } from 'react';\nimport { View, StyleSheet, ViewStyle, StyleProp } from 'react-native';\nimport Animated, {\n  useAnimatedStyle,\n  useDerivedValue,\n  withSpring,\n} from 'react-native-reanimated';\nimport type { IndicatorConfigs, PaginationProps } from '../types';\nimport { useCarouselContext } from './useCarouselContext';\n\nconst defaultIndicatorConfigs: IndicatorConfigs = {\n  indicatorColor: 'gray',\n  indicatorWidth: 6,\n  indicatorSelectedColor: 'blue',\n  indicatorSelectedWidth: 6,\n  spaceBetween: 3,\n};\n\nconst defaultSpringConfig = {\n  stiffness: 1000,\n  damping: 500,\n  mass: 3,\n  overshootClamping: true,\n  restDisplacementThreshold: 0.01,\n  restSpeedThreshold: 0.01,\n};\n\nexport default function PaginationIndicator({\n  containerStyle,\n  indicatorStyle,\n  activeIndicatorStyle,\n  indicatorConfigs,\n}: PaginationProps) {\n  const { currentPage, totalPage } = useCarouselContext();\n\n  const configs = useMemo(() => {\n    return {\n      ...defaultIndicatorConfigs,\n      ...indicatorConfigs,\n    };\n  }, [indicatorConfigs]);\n\n  const translateX = useDerivedValue(() => {\n    return withSpring(\n      currentPage.value * (configs.indicatorWidth! + configs.spaceBetween!),\n      defaultSpringConfig\n    );\n  }, []);\n\n  const animatedStyle = useAnimatedStyle(() => {\n    return {\n      transform: [\n        {\n          translateX: translateX.value,\n        },\n      ],\n    };\n  }, []);\n\n  function renderItem(pageNumber: number) {\n    // @ts-ignore\n    if (activeIndicatorStyle?.width) {\n      console.error(\n        'Do not use activeIndicatorStyle: { width }. Please use indicatorConfigs: { indicatorSelectedWidth } instead'\n      );\n    }\n    // @ts-ignore\n    if (indicatorStyle?.width) {\n      console.error(\n        'Do not use indicatorStyle: { width }. Please use indicatorConfigs: { indicatorWidth } instead'\n      );\n    }\n    return (\n      <IndicatorItem\n        key={`index${pageNumber}`}\n        currentPage={currentPage}\n        pageNumber={pageNumber}\n        configs={configs}\n        indicatorStyle={indicatorStyle}\n        activeIndicatorStyle={activeIndicatorStyle}\n      />\n    );\n  }\n\n  return (\n    <View style={[styles.container, containerStyle]}>\n      {[...Array(totalPage.value).keys()].map(renderItem)}\n      <Animated.View\n        style={[\n          styles.dotSelectedStyle,\n          {\n            width: configs.indicatorSelectedWidth,\n            height: configs.indicatorWidth,\n            borderRadius: configs.indicatorWidth! / 2,\n            backgroundColor: configs.indicatorSelectedColor,\n          },\n          activeIndicatorStyle,\n          animatedStyle,\n        ]}\n      />\n    </View>\n  );\n}\n\nfunction IndicatorItem({\n  currentPage,\n  pageNumber,\n  configs,\n  activeIndicatorStyle,\n  indicatorStyle,\n}: {\n  currentPage: Animated.SharedValue<number>;\n  pageNumber: number;\n  configs: IndicatorConfigs;\n  activeIndicatorStyle?: StyleProp<ViewStyle>;\n  indicatorStyle?: StyleProp<ViewStyle>;\n}) {\n  const dotContainerStyle: StyleProp<ViewStyle> = useMemo(()=> [\n    styles.dotContainer,\n    {\n      width: configs.indicatorSelectedWidth,\n      height: configs.indicatorWidth,\n      marginEnd: configs.spaceBetween,\n    },\n    activeIndicatorStyle,\n    {\n      // Disable backgroundColor in activeIndicatorStyle\n      backgroundColor: undefined,\n    },\n  ], [activeIndicatorStyle]);\n\n  const dotStyle: StyleProp<ViewStyle> = useMemo(() => [\n    {\n      width: configs.indicatorWidth,\n      height: configs.indicatorWidth,\n      borderRadius: configs.indicatorWidth! / 2,\n      backgroundColor: configs.indicatorColor,\n    },\n    indicatorStyle,\n  ], [indicatorStyle]);\n\n  const animatedWidth = useDerivedValue(() => {\n    return withSpring(\n      currentPage.value === pageNumber\n        ? configs.indicatorSelectedWidth!\n        : configs.indicatorWidth!,\n      defaultSpringConfig\n    );\n  });\n\n  const aStyle = useAnimatedStyle(() => {\n    return {\n      width: animatedWidth.value,\n    };\n  }, []);\n\n  return (\n    <Animated.View style={[dotContainerStyle, aStyle]}>\n      <View style={dotStyle} />\n    </Animated.View>\n  );\n}\n\nconst styles = StyleSheet.create({\n  container: {\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  dotContainer: {\n    alignItems: 'center',\n    justifyContent: 'center',\n  },\n  dotSelectedStyle: {\n    position: 'absolute',\n  },\n});"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@r0b0t3d/react-native-carousel",
-  "version": "3.4.0",
+  "version": "3.4.4",
   "description": "React Native Carousel",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",

package/src/components/Carousel.tsx

@@ -12,6 +12,7 @@ import Animated, {
   useSharedValue,
   useAnimatedScrollHandler,
   runOnJS,
+  useAnimatedRef,
 } from 'react-native-reanimated';
 import type { CarouselProps } from '../types';
 import PageItem from './PageItem';
@@ -44,9 +45,9 @@ function Carousel<TData>({
 }: CarouselProps<TData>) {
   const currentPage = useSharedValue(0);
   const animatedScroll = useSharedValue(currentPage.value * sliderWidth);
-  const freeze = useSharedValue(loop);
+  const freeze = useSharedValue(false);
   const [isDragging, setDragging] = useState(false);
-  const expectedPosition = useRef(-1);
+  const expectedPosition = useSharedValue(-1);
   const pageMapper = useRef<Record<number, number>>({});
   const { currentPage: animatedPage, totalPage } = useCarouselContext();
 
@@ -55,7 +56,7 @@ function Carousel<TData>({
     return firstItemAlignment === 'center' || loop ? padding : spaceHeadTail;
   }, [sliderWidth, itemWidth, firstItemAlignment, loop, spaceHeadTail]);
 
-  const scrollViewRef = useRef<any>(null);
+  const scrollViewRef = useAnimatedRef<any>();
 
   const offsets = useMemo(() => {
     return generateOffsets({
@@ -114,7 +115,7 @@ function Carousel<TData>({
 
   const jumpTo = useCallback(
     (page: number, delay = 200) => {
-      expectedPosition.current = page;
+      expectedPosition.value = page;
       if (Platform.OS === 'android') {
         freeze.value = true;
       }
@@ -187,12 +188,12 @@ function Carousel<TData>({
   const refreshPage = useCallback(
     (offset) => {
       'worklet';
-      const pageNum = findNearestPage(offset, offsets, 20);
+      const pageNum = findNearestPage(offset, offsets, 20);     
       if (pageNum === -1) {
         return;
       }
       if (pageNum !== currentPage.value) {
-        if (expectedPosition.current === pageNum) {
+        if (expectedPosition.value === pageNum) {
           freeze.value = false;
         }
         currentPage.value = pageNum;
@@ -304,10 +305,10 @@ function Carousel<TData>({
   }
 
   return (
-    <View style={[style]}>
+    <View style={style}>
       <Animated.ScrollView
-        ref={scrollViewRef}
         {...scrollViewProps}
+        ref={scrollViewRef}
         style={styles.container}
         horizontal
         disableScrollViewPanResponder
@@ -317,7 +318,7 @@ function Carousel<TData>({
         snapToStart
         snapToEnd
         decelerationRate="fast"
-        scrollEventThrottle={16}
+        scrollEventThrottle={4}
         onScroll={scrollHandler}
         bounces={false}
         contentContainerStyle={{

package/src/components/PageItem.tsx

@@ -4,6 +4,7 @@ import { Image, StyleProp, StyleSheet, View, ViewStyle } from 'react-native';
 import Animated, {
   interpolate,
   useAnimatedStyle,
+  useDerivedValue,
 } from 'react-native-reanimated';
 import type { CarouselProps } from '../types';
 
@@ -34,42 +35,52 @@ export default function PageItem<TData = any>({
   inactiveScale,
   containerStyle,
 }: Props<TData>) {
-  // @ts-ignore
-  const animatedStyle = useAnimatedStyle(() => {
+  const scale = useDerivedValue(() => {
+    const inputRange = [offset - itemWidth, offset, offset + itemWidth];
+    const scaleOutputRange = [inactiveScale, 1, inactiveScale];
+    return interpolate(animatedValue.value, inputRange, scaleOutputRange);
+  }, []);
+
+  const translateX = useDerivedValue(() => {
     const inputRange = [offset - itemWidth, offset, offset + itemWidth];
-    const scaleOutputRange = freeze.value
-      ? [1, 1, 1]
-      : [inactiveScale, 1, inactiveScale];
-    const opacityOutputRange = freeze.value
-      ? [1, 1, 1]
-      : [inactiveOpacity, 1, inactiveOpacity];
     const parallaxOutputRange = freeze.value
       ? [0, 0, 0]
       : [-itemWidth / 2, 0, itemWidth / 4];
 
+    return interpolate(animatedValue.value, inputRange, parallaxOutputRange);
+  }, []);
+
+  const opacity = useDerivedValue(() => {
+    const inputRange = [offset - itemWidth, offset, offset + itemWidth];
+    const opacityOutputRange = freeze.value
+      ? [1, 1, 1]
+      : [inactiveOpacity, 1, inactiveOpacity];
+    return interpolate(animatedValue.value, inputRange, opacityOutputRange);
+  }, []);
+  // @ts-ignore
+  const animatedStyle = useAnimatedStyle(() => {
     const transform: ViewStyle['transform'] = [
       {
-        scale: interpolate(animatedValue.value, inputRange, scaleOutputRange),
+        scale: scale.value,
       },
     ];
     if (animation === 'parallax') {
       transform.push({
-        translateX: interpolate(
-          animatedValue.value,
-          inputRange,
-          parallaxOutputRange
-        ),
+        translateX: translateX.value,
       });
     }
     return {
-      opacity: interpolate(animatedValue.value, inputRange, opacityOutputRange),
+      opacity: opacity.value,
       transform,
     };
-  }, [inactiveScale, inactiveOpacity, animation, itemWidth, offset]);
+  }, []);
 
   function renderContent() {
     if (renderItem) {
-      return renderItem({ item, index }, { scrollPosition: animatedValue, offset });
+      return renderItem(
+        { item, index },
+        { scrollPosition: animatedValue, offset }
+      );
     }
     if (typeof item === 'object' && (item as any).source) {
       return (