diff --git a/types/react-native-snap-carousel/index.d.ts b/types/react-native-snap-carousel/index.d.ts index 3c34c8c230..d7592ca07e 100644 --- a/types/react-native-snap-carousel/index.d.ts +++ b/types/react-native-snap-carousel/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-native-snap-carousel 2.1 +// Type definitions for react-native-snap-carousel 2.2 // Project: https://github.com/archriss/react-native-snap-carousel // Definitions by: jnbt // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped @@ -7,6 +7,7 @@ import * as React from 'react'; import { Animated, + LayoutChangeEvent, NativeSyntheticEvent, NativeScrollEvent, ScrollViewProperties, @@ -19,12 +20,24 @@ export interface CarouselProps extends React.Props { /** * Width in pixels of your slides, must be the same for all of them + * Note: Required with horizontal carousel */ - itemWidth: number; + itemWidth?: number; + /** + * Height in pixels of carousel's items, must be the same for all of them + * Note: Required with vertical carousel + */ + itemHeight?: number; /** * Width in pixels of your slider + * Note: Required with horizontal carousel */ - sliderWidth: number; + sliderWidth?: number; + /** + * Height in pixels of the carousel itself + * Note: Required with vertical carousel + */ + sliderHeight?: number; // Behavior @@ -46,18 +59,36 @@ export interface CarouselProps extends React.Props { * Index of the first item to display */ firstItem?: number; + /** + * When momentum is disabled, this throttle helps smoothing slides' snapping by + * providing a bit of inertia when touch is released. + * Note that this will delay callback's execution. + */ + scrollEndDragThrottleValue?: number; /** * Whether to implement a shouldComponentUpdate strategy to minimize updates */ shouldOptimizeUpdates?: boolean; /** - * Snapping on android is kinda choppy, especially when swiping quickly so you can disable it + * This defines the timeframe during which multiple callback calls should be + * "grouped" into a single one. + * Note that this will delay callback's execution. + */ + snapCallbackDebounceValue?: number; + /** + * Snapping on android is kinda choppy, especially when swiping quickly so you + * can disable it. + * Warning: this prop can't be changed dynamically. */ snapOnAndroid?: boolean; /** * Delta x when swiping to trigger the snap */ swipeThreshold?: number; + /* + * Layout slides vertically instead of horizontally + */ + vertical?: boolean; // Autoplay @@ -111,8 +142,18 @@ export interface CarouselProps extends React.Props { slideStyle?: ViewStyle; // Callbacks + /** + * Exposed View callback; invoked on mount and layout changes + */ + onLayout?(event: LayoutChangeEvent): void; /** + * Exposed ScrollView callback; fired while scrolling + */ + onScroll?(event: NativeSyntheticEvent): void; + + /** + * @deprecated: use onScroll instead * Callback fired while scrolling; direct equivalent of ScrollView's onScroll * Since onScroll is overriden by plugin's implementation, you should use prop onScrollViewScroll * if you need a callback while scrolling. @@ -129,7 +170,7 @@ export interface CarouselStatic extends React.ComponentClass { currentIndex: number; startAutoplay(instantly?: boolean): void; stopAutoplay(): void; - snapToItem(index: number, animated?: boolean): void; + snapToItem(index: number, animated?: boolean, fireCallback?: boolean, initial?: boolean): void; snapToNext(animated?: boolean): void; snapToPrev(animated?: boolean): void; } diff --git a/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx b/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx index 815beb0656..9f0d29792a 100644 --- a/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx +++ b/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import { + LayoutChangeEvent, NativeSyntheticEvent, NativeScrollEvent, StyleSheet, @@ -25,7 +26,9 @@ class SnapCarouselTest extends React.Component<{}, {}> { enableMomentum={true} keyboardDismissMode='interactive' onSnapToItem={this.onSnapToItem} - onScrollViewScroll={this.onScroll} + onScroll={this.onScroll} + onLayout={this.onLayout} + vertical={false} > { Item #1 + ); } @@ -44,6 +52,10 @@ class SnapCarouselTest extends React.Component<{}, {}> { private onScroll = (event: NativeSyntheticEvent) => { console.log("Scrolled: ", event); } + + private onLayout = (event: LayoutChangeEvent) => { + console.log("Layout: ", event); + } } const styles = StyleSheet.create({