UNPKG

7.31 kBSource Map (JSON)View Raw
1{"version":3,"sources":["ViewPager.tsx"],"names":["ViewPager","React","Component","createRef","viewPager","current","getInnerViewNode","e","props","onPageScroll","Platform","OS","keyboardDismissMode","Keyboard","dismiss","onPageScrollStateChanged","isScrolling","nativeEvent","pageScrollState","onPageSelected","selectedPage","UIManager","dispatchViewManagerCommand","ReactNative","findNodeHandle","Commands","setPage","setPageWithoutAnimation","scrollEnabled","setScrollEnabled","componentDidMount","initialPage","render","style","_onPageScroll","_onPageScrollStateChanged","_onPageSelected","_onMoveShouldSetResponderCapture","children"],"mappings":"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","sourcesContent":["import React, { ReactElement } from 'react';\nimport { Platform, UIManager, Keyboard } from 'react-native';\nimport ReactNative from 'react-native';\nimport type {\n ViewPagerOnPageScrollEvent,\n ViewPagerOnPageSelectedEvent,\n PageScrollStateChangedNativeEvent,\n ViewPagerProps,\n} from './types';\n\nimport { childrenWithOverriddenStyle } from './utils';\nimport { getViewManagerConfig, ViewpagerViewManager } from './ViewPagerNative';\n\n/**\n * Container that allows to flip left and right between child views. Each\n * child view of the `ViewPager` will be treated as a separate page\n * and will be stretched to fill the `ViewPager`.\n *\n * It is important all children are `<View>`s and not composite components.\n * You can set style properties like `padding` or `backgroundColor` for each\n * child. It is also important that each child have a `key` prop.\n *\n * Example:\n *\n * ```\n * render: function() {\n * return (\n * <ViewPager\n * style={styles.viewPager}\n * initialPage={0}>\n * <View style={styles.pageStyle} key=\"1\">\n * <Text>First page</Text>\n * </View>\n * <View style={styles.pageStyle} key=\"2\">\n * <Text>Second page</Text>\n * </View>\n * </ViewPager>\n * );\n * }\n *\n * ...\n *\n * var styles = {\n * ...\n * viewPager: {\n * flex: 1\n * },\n * pageStyle: {\n * alignItems: 'center',\n * padding: 20,\n * }\n * }\n * ```\n */\n\nexport class ViewPager extends React.Component<ViewPagerProps> {\n private isScrolling = false;\n private viewPager = React.createRef<typeof ViewpagerViewManager>();\n\n componentDidMount() {\n // On iOS we do it directly on the native side\n if (Platform.OS === 'android') {\n if (this.props.initialPage != null) {\n this.setPageWithoutAnimation(this.props.initialPage);\n }\n }\n }\n\n public getInnerViewNode = (): ReactElement => {\n return this.viewPager.current!.getInnerViewNode();\n };\n\n private _onPageScroll = (e: ViewPagerOnPageScrollEvent) => {\n if (this.props.onPageScroll) {\n this.props.onPageScroll(e);\n }\n // Not implemented on iOS yet\n if (Platform.OS === 'android') {\n if (this.props.keyboardDismissMode === 'on-drag') {\n Keyboard.dismiss();\n }\n }\n };\n\n private _onPageScrollStateChanged = (\n e: PageScrollStateChangedNativeEvent\n ) => {\n if (this.props.onPageScrollStateChanged) {\n this.props.onPageScrollStateChanged(e);\n }\n this.isScrolling = e.nativeEvent.pageScrollState === 'dragging';\n };\n\n private _onPageSelected = (e: ViewPagerOnPageSelectedEvent) => {\n if (this.props.onPageSelected) {\n this.props.onPageSelected(e);\n }\n };\n\n /**\n * A helper function to scroll to a specific page in the ViewPager.\n * The transition between pages will be animated.\n */\n public setPage = (selectedPage: number) => {\n UIManager.dispatchViewManagerCommand(\n ReactNative.findNodeHandle(this),\n getViewManagerConfig().Commands.setPage,\n [selectedPage]\n );\n };\n\n /**\n * A helper function to scroll to a specific page in the ViewPager.\n * The transition between pages will *not* be animated.\n */\n public setPageWithoutAnimation = (selectedPage: number) => {\n UIManager.dispatchViewManagerCommand(\n ReactNative.findNodeHandle(this),\n getViewManagerConfig().Commands.setPageWithoutAnimation,\n [selectedPage]\n );\n };\n\n /**\n * A helper function to enable/disable scroll imperatively\n * The recommended way is using the scrollEnabled prop, however, there might be a case where a\n * imperative solution is more useful (e.g. for not blocking an animation)\n */\n public setScrollEnabled = (scrollEnabled: boolean) => {\n UIManager.dispatchViewManagerCommand(\n ReactNative.findNodeHandle(this),\n getViewManagerConfig().Commands.setScrollEnabled,\n [scrollEnabled]\n );\n };\n\n private _onMoveShouldSetResponderCapture = () => {\n return this.isScrolling;\n };\n\n render() {\n return (\n <ViewpagerViewManager\n {...this.props}\n ref={this.viewPager as any /** TODO: Fix ref type */}\n style={this.props.style}\n onPageScroll={this._onPageScroll}\n onPageScrollStateChanged={this._onPageScrollStateChanged}\n onPageSelected={this._onPageSelected}\n onMoveShouldSetResponderCapture={this._onMoveShouldSetResponderCapture}\n children={childrenWithOverriddenStyle(this.props.children)}\n />\n );\n }\n}\n"]}
\No newline at end of file