@momo-kits/carousel 0.89.4 → 0.89.6-rc.1

package/index.tsx

@@ -10,18 +10,15 @@ import {
   View,
   ViewStyle,
 } from 'react-native';
-import {defaultScrollInterpolator} from './animation';
+import {defaultAnimatedStyles, defaultScrollInterpolator} from './animation';
 import {CarouselProps, CarouselRef, CarouselState, Position} from './types';
-import {scaleSize, Spacing} from '@momo-kits/foundation';
+import {Spacing} from '@momo-kits/foundation';
 
 const IS_ANDROID = Platform.OS === 'android';
 const IS_IOS = Platform.OS === 'ios';
 const screenWidth = Dimensions.get('window').width;
 
-class Carousel extends React.PureComponent<
-  CarouselProps,
-  CarouselState
-> {
+class Carousel extends React.PureComponent<CarouselProps, CarouselState> {
   static defaultProps = {
     activeSlideAlignment: 'start',
     activeSlideOffset: 20,
@@ -69,6 +66,7 @@ class Carousel extends React.PureComponent<
   _autoplayInterval?: NodeJS.Timeout;
   _carouselRef: any;
   _onLayoutInitDone?: boolean;
+
   constructor(props: CarouselProps) {
     super(props);
 
@@ -441,7 +439,7 @@ class Carousel extends React.PureComponent<
       } else {
         let interpolator = defaultScrollInterpolator(
           _index,
-          this.state.itemWidth,
+          this.state.itemWidth
         );
 
         animatedValue = this._scrollPos.interpolate({
@@ -576,9 +574,7 @@ class Carousel extends React.PureComponent<
       this.props.visibleItem === 1
         ? screenWidth - Spacing.M * 2
         : Math.ceil(
-            scaleSize(
-              (containerWidth * 0.9 - visibleItem * Spacing.S) / visibleItem,
-            ),
+            (containerWidth * 0.9 - visibleItem * Spacing.S) / visibleItem
           );
     if (this.props.itemWidth) {
       itemWidth = this.props.itemWidth;
@@ -601,7 +597,7 @@ class Carousel extends React.PureComponent<
     index: number,
     animated = true,
     fireCallback = true,
-    forceScrollTo = false,
+    forceScrollTo = false
   ) {
     const {onSnapToItem} = this.props;
     const itemsLength = this._getCustomDataLength();
@@ -670,15 +666,15 @@ class Carousel extends React.PureComponent<
     if (full) {
       spacingStyle = {};
     }
-
+    const animatedStyle = defaultAnimatedStyles(animatedValue, this.props);
     return (
       <Component
         style={[
           mainDimension,
-          slideStyle,
-          // animatedStyle,
+          animatedStyle,
           {overflow: 'hidden'},
           spacingStyle,
+          slideStyle,
         ]}
         pointerEvents="box-none">
         {this.props.renderItem({
@@ -764,8 +760,9 @@ class Carousel extends React.PureComponent<
       style,
       disableIntervalMomentum,
       enableSnap,
+      contentContainerStyle,
     } = this.props;
-    const {hideCarousel, containerWidth} = this.state;
+    const {hideCarousel} = this.state;
 
     const initialNumPerSide = this._enableLoop() ? loopClonesPerSide : 2;
     const initialNumToRender =
@@ -792,7 +789,9 @@ class Carousel extends React.PureComponent<
         {...specificProps}
         ref={c => (this._carouselRef = c)}
         overScrollMode={'never'}
-        snapToInterval={snapToInterval}
+        snapToInterval={
+          this.props.snapToInterval ? this.props.snapToInterval : snapToInterval
+        }
         disableIntervalMomentum={disableIntervalMomentum}
         pointerEvents={hideCarousel ? 'none' : 'auto'}
         decelerationRate={'fast'}
@@ -804,6 +803,7 @@ class Carousel extends React.PureComponent<
         ]}
         automaticallyAdjustContentInsets={false}
         directionalLockEnabled
+        contentContainerStyle={contentContainerStyle}
         disableScrollViewPanResponder={false}
         pinchGestureEnabled={false}
         scrollsToTop={false}
@@ -826,5 +826,5 @@ class Carousel extends React.PureComponent<
   }
 }
 
-export {Carousel}
+export {Carousel};
 export type {CarouselProps, CarouselRef};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@momo-kits/carousel",
-    "version": "0.89.4",
+    "version": "0.89.6-rc.1",
     "private": false,
     "main": "index.tsx",
     "peerDependencies": {
@@ -16,4 +16,4 @@
     "dependencies": {
         "moment": "^2.24.0"
     }
-}
+}

package/publish.sh

@@ -1,29 +1,27 @@
 #!/bin/bash
+
+# Prepare dist files
 rm -rf dist
 mkdir dist
-
-cp . ./dist
-
-# GET VERSION from mck_package.json
-VERSIONSTRING=( v$(jq .version package.json) )
-VERSION=(${VERSIONSTRING//[\"]/})
-echo VERSION: $VERSION
-
-rsync -r --verbose --exclude '*.mdx' --exclude '*Demo.js'  --exclude 'props-type.js' --exclude 'prop-types.js' ./* dist
-
-# #babel component to dist
-#babel ./dist -d dist --copy-files
-
-#copy option
-#cp -r ./src/ dist
-
-
-#npm login
-#publish dist to npm
+rsync -r --exclude=/dist ./* dist
 cd dist
-npm publish --tag beta --access=public
+
+if [ "$1" == "stable" ]; then
+  npm version $(npm view @momo-kits/foundation@stable version)
+  npm version patch
+  npm publish --tag stable --access=public
+elif [ "$1" == "latest" ]; then
+  npm version $(npm view @momo-kits/foundation@latest version)
+  npm publish --tag latest --access=public
+else
+  npm version $(npm view @momo-kits/carousel@beta version)
+  npm version prerelease --preid=beta
+  npm publish --tag beta --access=public
+fi
+
+PACKAGE_NAME=$(npm pkg get name)
+NEW_PACKAGE_VERSION=$(npm pkg get version)
+
+# Clean up
 cd ..
 rm -rf dist
-
-
-##curl -X POST -H 'Content-Type: application/json' 'https://chat.googleapis.com/v1/spaces/AAAAbP8987c/messages?key=AIzaSyDdI0hCZtE6vySjMm-WEfRq3CPzqKqqsHI&token=UGSFRvk_oYb9uGsAgs31bVvMm6jDkmD8zihGm3eyaQA%3D&threadKey=JoaXTEYaNNkl' -d '{"text": "@momo-kits/calendar new version release: '*"$VERSION"*' https://www.npmjs.com/package/@momo-kits/calendar"}'

package/types.ts

@@ -1,4 +1,10 @@
-import {NativeScrollEvent, NativeSyntheticEvent, ViewStyle} from 'react-native';
+import {
+  Animated,
+  NativeScrollEvent,
+  NativeSyntheticEvent,
+  StyleProp,
+  ViewStyle,
+} from 'react-native';
 
 export type CarouselProps = {
   activeSlideOffset?: number;
@@ -13,35 +19,37 @@ export type CarouselProps = {
   loop?: boolean;
   loopClonesPerSide?: number;
   scrollEnabled?: boolean;
-  slideStyle?: object;
+  slideStyle?: StyleProp<ViewStyle>;
   disableIntervalMomentum?: boolean;
   itemWidth?: number;
   data: any[];
-  renderItem: (info: {item: any; index: number}) => React.ReactNode;
+  renderItem: (info: { item: any; index: number }) => React.ReactNode;
   onScroll?: any;
   onScrollIndexChanged?: (index: number) => void;
   onSnapToItem?: (index: number) => void;
   onTouchStart?: (event: any) => void;
   onTouchEnd?: (event: any) => void;
   onMomentumScrollEnd?: (
-    event: NativeSyntheticEvent<NativeScrollEvent>,
+    event: NativeSyntheticEvent<NativeScrollEvent>
   ) => void;
   onLayout?: (event: any) => void;
   keyExtractor?: (item: any, index: number) => string;
   getItemLayout?: (
     data: any,
-    index: number,
-  ) => {length: number; offset: number; index: number};
+    index: number
+  ) => { length: number; offset: number; index: number };
   style?: ViewStyle;
   visibleItem?: number;
+  contentContainerStyle?: StyleProp<ViewStyle>;
   full?: boolean;
+  snapToInterval?: number | Animated.Value | Animated.AnimatedInterpolation | undefined
 };
 
 export type CarouselRef = {
   snapToItem: (
     index: number,
     animated?: boolean,
-    fireCallback?: boolean,
+    fireCallback?: boolean
   ) => void;
   snapToNext: (animated?: boolean, fireCallback?: boolean) => void;
   snapToPrev: (animated?: boolean, fireCallback?: boolean) => void;