react-native-scrollpageviewtest 0.0.1-security → 1.5.5

package/GestureScrollView.js

@@ -0,0 +1,509 @@
+import React, { PureComponent } from 'react';
+import type {GesturePropType} from "./GesturePageViewPropType";
+import {setScrollEnable} from "./GestureCommon/CommonLottieScroller";
+import {
+	Animated,
+	Dimensions,
+	findNodeHandle,
+	Keyboard,
+	NativeModules,
+	Platform,
+	StyleSheet,
+	UIManager,
+	View
+} from "react-native";
+
+export class GestureScrollView extends PureComponent<GesturePropType> {
+	_contentOffset: Offset = { x: 0, y: 0 };
+	_keyboardHeight: number;
+	_refreshHeader;
+	_loadingFooter;
+	_width: number;
+	_height: number;
+	_scrollView: View;
+	_indicatorOpacity: Animated.Value = new Animated.Value(1);
+	_contentHeight: number;
+	_contentWidth: number;
+	_refreshStatus: GestureHeaderStatus = "waiting";
+	_loadingStatus: FooterStatus = "waiting";
+	_indicatorAnimation;
+	_scrollEventAttachment;
+	_nativeOffset;
+	_touching = false;
+	_dragging = false;
+	_sizeChangeInterval = 0;
+
+	_renderRefreshHeader() {
+		const { onRefresh, refreshHeader: Refresh } = this.props;
+		const measured =
+			this._height !== undefined && this._contentHeight !== undefined;
+		if (!measured) return null;
+		return (
+			onRefresh && (
+				<Animated.View style={this._getRefreshHeaderStyle()}>
+					<Refresh
+						ref={(ref) => (this._refreshHeader = ref)}
+						offset={this._nativeOffset.y}
+						maxHeight={Refresh.height}
+					/>
+				</Animated.View>
+			)
+		);
+	}
+
+	_renderLoadingFooter() {
+		const { onLoading, loadingFooter: Footer } = this.props;
+		const measured =
+			this._height !== undefined && this._contentHeight !== undefined;
+		if (!measured) return null;
+		return (
+			onLoading && (
+				<Animated.View style={this._getLoadingFooterStyle()}>
+					<Footer
+						ref={(ref) => (this._loadingFooter = ref)}
+						offset={this._nativeOffset.y}
+						maxHeight={Footer.height}
+						bottomOffset={this._contentHeight - this._height}
+					/>
+				</Animated.View>
+			)
+		);
+	}
+
+	_renderVerticalIndicator() {
+		if (Platform.OS === "ios") return null;
+		const { showsVerticalScrollIndicator } = this.props;
+		const measured =
+			this._height !== undefined && this._contentHeight !== undefined;
+		if (!measured) return null;
+		return (
+			showsVerticalScrollIndicator &&
+			this._contentHeight > this._height && (
+				<Animated.View style={this._getVerticalIndicatorStyle()} />
+			)
+		);
+	}
+
+	_renderHorizontalIndicator() {
+		if (Platform.OS === "ios") return null;
+		const { showsHorizontalScrollIndicator } = this.props;
+		const measured =
+			this._height !== undefined && this._contentHeight !== undefined;
+		if (!measured) return null;
+		return (
+			showsHorizontalScrollIndicator &&
+			this._contentWidth > this._width && (
+				<Animated.View style={this._getHorizontalIndicatorStyle()} />
+			)
+		);
+	}
+
+	async componentDidMount() {
+		this._nativeOffset = {
+			x: new Animated.Value(0),
+			y: new Animated.Value(0)
+		};
+		setScrollEnable(false);
+		this._nativeOffset.x.setValue(this.props.initialContentOffset.y);
+		this._nativeOffset.y.setValue(this.props.initialContentOffset.y);
+		this._width = Dimensions.get('window').width;
+		this._height = Dimensions.get('window').height;
+	}
+
+	scrollToBegin(animated: boolean) {
+		return this.scrollTo({ x: this._contentOffset.x, y: 0 }, animated);
+	}
+
+	scrollToEnd(animated: boolean = true) {
+		let toOffsetY = this._contentHeight - this._height;
+		if (toOffsetY < 0) toOffsetY = 0;
+		return this.scrollTo({ x: this._contentOffset.x, y: toOffsetY }, animated);
+	}
+
+	scrollTo(offset: Offset, animated: boolean = true) {
+		if (Platform.OS === "ios") {
+			NativeModules.SpringScrollView.scrollTo(
+				findNodeHandle(this._scrollView),
+				offset.x,
+				offset.y,
+				animated
+			);
+		} else if (Platform.OS === "android") {
+			UIManager.dispatchViewManagerCommand(
+				findNodeHandle(this._scrollView),
+				"10002",
+				[offset.x, offset.y, animated]
+			);
+		}
+		return new Promise((resolve, reject) => {
+			if (animated) setTimeout(resolve, 500);
+			else resolve();
+		});
+	}
+
+	scroll(offset: Offset, animated: boolean = true) {
+		return this.scrollTo(
+			{
+				x: offset.x + this._contentOffset.x,
+				y: offset.y + this._contentOffset.y
+			},
+			animated
+		);
+	}
+
+	beginRefresh() {
+		if (!this.props.loadingFooter || this.props.loadingFooter.height <= 0)
+			return Promise.reject(
+				"SpringScrollView: call beginRefresh without loadingFooter or loadingFooter height"
+			);
+		return this.scrollTo({
+			x: this._contentOffset.x,
+			y: -this.props.loadingFooter.height - 1,
+		});
+	}
+
+	endRefresh() {
+		if (Platform.OS === "ios") {
+			NativeModules.SpringScrollView.endRefresh(
+				findNodeHandle(this._scrollView)
+			);
+		} else if (Platform.OS === "android") {
+			UIManager.dispatchViewManagerCommand(
+				findNodeHandle(this._scrollView),
+				"10000",
+				[]
+			);
+		}
+	}
+
+	endLoading(rebound: boolean = false) {
+		if (Platform.OS === "ios") {
+			NativeModules.SpringScrollView.endLoading(
+				findNodeHandle(this._scrollView),
+				rebound
+			);
+		} else if (Platform.OS === "android") {
+			UIManager.dispatchViewManagerCommand(
+				findNodeHandle(this._scrollView),
+				"10001",
+				[rebound]
+			);
+		}
+	}
+
+	_onKeyboardWillShow = (evt) => {
+		this._touching = false;
+		this.props.textInputRefs.every((input) => {
+			if (idx(() => input.current.isFocused())) {
+				input.current.measureInWindow((x, y, w, h, l, t) => {
+					this._keyboardHeight =
+						-evt.endCoordinates.screenY + this.props.inputToolBarHeight + y + h;
+					this._keyboardHeight > 0 &&
+					this.scroll({ x: 0, y: this._keyboardHeight });
+				});
+				return false;
+			}
+			return true;
+		});
+	};
+
+	_onKeyboardWillHide = () => {
+		if (this._keyboardHeight > 0) {
+			!this._touching && this.scroll({ x: 0, y: -this._keyboardHeight });
+			this._keyboardHeight = 0;
+		}
+	};
+
+	_beginIndicatorDismissAnimation() {
+		this._indicatorOpacity.setValue(1);
+		this._indicatorAnimation && this._indicatorAnimation.stop();
+		this._indicatorAnimation = Animated.timing(this._indicatorOpacity, {
+			toValue: 0,
+			delay: 500,
+			duration: 500,
+			useNativeDriver: true,
+		});
+		this._indicatorAnimation.start(({ finished }) => {
+			if (!finished) {
+				this._indicatorOpacity.setValue(1);
+			}
+			this._indicatorAnimation = null;
+		});
+	}
+
+	_onScroll = (e) => {
+		const {
+			contentOffset: { x, y },
+			refreshStatus,
+			loadingStatus,
+		} = e.nativeEvent;
+		this._contentOffset = { x, y };
+		if (this._refreshStatus !== refreshStatus) {
+			this._toRefreshStatus(refreshStatus);
+			this.props.onRefresh &&
+			refreshStatus === "refreshing" &&
+			this.props.onRefresh();
+		}
+		if (this._loadingStatus !== loadingStatus) {
+			this._toLoadingStatus(loadingStatus);
+			this.props.onLoading &&
+			loadingStatus === "loading" &&
+			this.props.onLoading();
+		}
+		this.props.onScroll && this.props.onScroll(e);
+		if (!this._indicatorAnimation) {
+			this._indicatorOpacity.setValue(1);
+		}
+	};
+
+	_toRefreshStatus(status: GestureHeaderStatus) {
+		this._refreshStatus = status;
+		idx(() => this._refreshHeader.changeToState(status));
+	}
+
+	_toLoadingStatus(status: FooterStatus) {
+		this._loadingStatus = status;
+		idx(() => this._loadingFooter.changeToState(status));
+	}
+
+	_getVerticalIndicatorStyle() {
+		const indicatorHeight = (this._height / this._contentHeight) * this._height;
+		return {
+			position: "absolute",
+			top: 0,
+			right: 2,
+			height: indicatorHeight,
+			width: 3,
+			borderRadius: 3,
+			opacity: this._indicatorOpacity,
+			backgroundColor: "#A8A8A8",
+			transform: [
+				{
+					translateY: Animated.multiply(
+						this._nativeOffset.y,
+						this._height / this._contentHeight
+					),
+				},
+			],
+		};
+	}
+
+	_getHorizontalIndicatorStyle() {
+		const indicatorWidth = (this._width / this._contentWidth) * this._width;
+		return {
+			position: "absolute",
+			bottom: 2,
+			left: 0,
+			height: 3,
+			width: indicatorWidth,
+			borderRadius: 3,
+			opacity: this._indicatorOpacity,
+			backgroundColor: "#A8A8A8",
+			transform: [
+				{
+					translateX: Animated.multiply(
+						this._nativeOffset.x,
+						this._width / this._contentWidth
+					),
+				},
+			],
+		};
+	}
+
+	_getRefreshHeaderStyle() {
+		const rHeight = this.props.refreshHeader.height;
+		const style = this.props.refreshHeader.style;
+		let transform = [];
+		if (style === "topping") {
+			transform = [
+				{
+					translateY: this._nativeOffset.y.interpolate({
+						inputRange: [-rHeight - 1, -rHeight, 0, 1],
+						outputRange: [-1, 0, rHeight, rHeight],
+					}),
+				},
+			];
+		} else if (style === "stickyScrollView") {
+			transform = [
+				{
+					translateY: this._nativeOffset.y.interpolate({
+						inputRange: [-rHeight - 1, -rHeight, 0, 1],
+						outputRange: [-1, 0, 0, 0],
+					}),
+				},
+			];
+		} else if (style !== "stickyContent") {
+			console.warn(
+				"unsupported value: '",
+				style,
+				"' in SpringScrollView, " +
+				"select one in 'topping','stickyScrollView','stickyContent' please"
+			);
+		}
+		if (this.props.inverted) transform.push({ scaleY: -1 });
+		return {
+			position: "absolute",
+			top: -rHeight,
+			right: 0,
+			height: rHeight,
+			left: 0,
+			transform,
+		};
+	}
+
+	_getLoadingFooterStyle() {
+		const fHeight = this.props.loadingFooter.height;
+		const maxOffset = this._contentHeight - this._height;
+		const style = this.props.loadingFooter.style;
+		let transform = [];
+		if (style === "bottoming") {
+			transform = [
+				{
+					translateY: this._nativeOffset.y.interpolate({
+						inputRange: [
+							maxOffset - 1,
+							maxOffset,
+							maxOffset + fHeight,
+							maxOffset + fHeight + 1,
+						],
+						outputRange: [-fHeight, -fHeight, 0, 1],
+					}),
+				},
+			];
+		} else if (style === "stickyScrollView") {
+			transform = [
+				{
+					translateY: this._nativeOffset.y.interpolate({
+						inputRange: [
+							maxOffset - 1,
+							maxOffset,
+							maxOffset + fHeight,
+							maxOffset + fHeight + 1,
+						],
+						outputRange: [0, 0, 0, 1],
+					}),
+				},
+			];
+		} else if (style !== "stickyContent") {
+			console.warn(
+				"unsupported value: '",
+				style,
+				"' in SpringScrollView, " +
+				"select one in 'bottoming','stickyScrollView' and 'stickyContent' please!"
+			);
+		}
+		if (this.props.inverted) transform.push({ scaleY: -1 });
+		return {
+			position: "absolute",
+			right: 0,
+			top:
+				this._height > this._contentHeight ? this._height : this._contentHeight,
+			height: fHeight,
+			left: 0,
+			transform,
+		};
+	}
+
+	_onWrapperLayoutChange = ({
+								  nativeEvent: {
+									  layout: { x, y, width, height },
+								  },
+							  }) => {
+		if (this._height !== height || this._width !== width) {
+			this.props.onSizeChange && this.props.onSizeChange({ width, height });
+			this._height = height;
+			this._width = width;
+			this._startSizeChangeInterval();
+		}
+	};
+
+	_onContentLayoutChange = ({
+								  nativeEvent: {
+									  layout: { x, y, width, height },
+								  },
+							  }) => {
+		if (this._contentHeight !== height || this._contentWidth !== width) {
+			this.props.onContentSizeChange &&
+			this.props.onContentSizeChange({ width, height });
+			this._contentHeight = height;
+			this._contentWidth = width;
+			this._startSizeChangeInterval();
+		}
+	};
+
+	_startSizeChangeInterval = () => {
+		if (this._sizeChangeInterval) clearInterval(this._sizeChangeInterval);
+		this._sizeChangeInterval = setInterval(() => {
+			if (!this._height || !this._contentHeight) return;
+			if (this._contentHeight < this._height)
+				this._contentHeight = this._height;
+			let { x: maxX, y: maxY } = this._contentOffset;
+			if (this._contentOffset.y > this._contentHeight - this._height) {
+				maxY = this._contentHeight - this._height;
+				if (maxY < 0) maxY = 0;
+			}
+			if (this._contentOffset.x > this._contentWidth - this._width) {
+				maxX = this._contentWidth - this._width;
+				if (maxX < 0) maxX = 0;
+			}
+			if (maxX !== this._contentOffset.x || maxY !== this._contentOffset.y) {
+				Platform.OS === "android" && this.scrollTo({ x: maxX, y: maxY }, false);
+			}
+			this.forceUpdate();
+			clearInterval(this._sizeChangeInterval);
+			this._sizeChangeInterval = 0;
+		}, Platform.select({ ios: 10, android: 30 }));
+	};
+
+	render() {
+		return (
+			<View/>
+		);
+	};
+
+	_onTouchBegin = (e) => {
+		this._touching = true;
+		this.props.onTouchBegin && this.props.onTouchBegin(e);
+	};
+
+	_onTouchEnd = (e) => {
+		this._touching = false;
+		this.props.onTouchEnd && this.props.onTouchEnd(e);
+	};
+
+	_onMomentumScrollEnd = () => {
+		this._touching = false;
+		this._dragging = false;
+		this._beginIndicatorDismissAnimation();
+		this.props.onMomentumScrollEnd && this.props.onMomentumScrollEnd();
+	};
+
+	_onScrollBeginDrag = () => {
+		this._dragging = true;
+		if (this.props.dragToHideKeyboard) Keyboard.dismiss();
+		this.props.onScrollBeginDrag && this.props.onScrollBeginDrag();
+	};
+
+	_onScrollEndDrag = () => {
+		this._dragging = false;
+		this.props.onScrollEndDrag && this.props.onScrollEndDrag();
+	};
+
+	static defaultProps = {
+		bounces: true,
+		showHeader: false,
+		showFooter: false,
+		textInputRefs: [],
+		decelerationRate: 0.997,
+		inputToolBarHeight: 44,
+		dragToHideKeyboard: true,
+		keyboardShouldPersistTaps: "handled",
+		showsVerticalScrollIndicator: true,
+		showsHorizontalScrollIndicator: true,
+		initialContentOffset: { x: 0, y: 0 },
+		alwaysBounceVertical: true,
+		pagingEnabled: false,
+		pageWidth: Dimensions.get('window').width,
+		scrollEnabled: true
+	};
+}

package/README.md

@@ -1,5 +1,45 @@
-# Security holding package
 
-This package contained malicious code and was removed from the registry by the npm security team. A placeholder was published to ensure users are not affected in the future.
+# react-native-scrollpageviewtest
 
-Please refer to www.npmjs.com/advisories?search=react-native-scrollpageviewtest for more information.
+## Getting started
+
+`$ npm install react-native-scrollpageviewtest --save`
+
+### Mostly automatic installation
+
+`$ react-native link react-native-scrollpageviewtest`
+
+### Manual installation
+
+
+#### iOS
+
+1. In XCode, in the project navigator, right click `Libraries` ➜ `Add Files to [your project's name]`
+2. Go to `node_modules` ➜ `react-native-scrollpageviewtest` and add `RNScrollpageviewtest.xcodeproj`
+3. In XCode, in the project navigator, select your project. Add `libRNScrollpageviewtest.a` to your project's `Build Phases` ➜ `Link Binary With Libraries`
+4. Run your project (`Cmd+R`)<
+
+#### Android
+
+1. Open up `android/app/src/main/java/[...]/MainActivity.java`
+  - Add `import com.rncomp.scrollpageviewtest.RNScrollpageviewtestPackage;` to the imports at the top of the file
+  - Add `new RNScrollpageviewtestPackage()` to the list returned by the `getPackages()` method
+2. Append the following lines to `android/settings.gradle`:
+  	```
+  	include ':react-native-scrollpageviewtest'
+  	project(':react-native-scrollpageviewtest').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-scrollpageviewtest/android')
+  	```
+3. Insert the following lines inside the dependencies block in `android/app/build.gradle`:
+  	```
+      compile project(':react-native-scrollpageviewtest')
+  	```
+
+
+## Usage
+```javascript
+import RNScrollpageviewtest from 'react-native-scrollpageviewtest';
+
+// TODO: What to do with the module?
+RNScrollpageviewtest;
+```
+  

package/ScrollPageViewPropType.js

@@ -0,0 +1,70 @@
+import {Animated, ViewProps, ViewStyle} from 'react-native';
+import PropTypes from "prop-types";
+import {PanGestureHandlerGestureEvent} from "react-native-gesture-handler";
+// import {RefreshHeader} from './RefreshHeader';
+// import {LoadingFooter} from './LoadingFooter';
+
+export interface PageIndexPath {
+	section: number;
+	row: number;
+}
+
+export interface PageOffset {
+	x: number;
+	y: number;
+}
+
+export interface PageNativeContentOffset {
+	x?: Animated.Value;
+	y?: Animated.Value;
+}
+
+export type RefreshStyle = 'topping' | 'stickyScrollView' | 'stickyContent';
+
+export type LoadingStyle = 'bottoming' | 'stickyScrollView' | 'stickyContent';
+
+export interface PageScrollEvent {
+	nativeEvent: {
+		contentOffset: {
+			x: number,
+			y: number,
+		},
+	};
+}
+
+export interface ScrollPageViewPropType extends ViewProps {
+	style?: ViewStyle;
+	contentStyle?: ViewStyle;
+	bounces?: boolean;
+	pagingEnabled?: boolean;
+	decelerationRate?: number;
+	directionalLockEnabled?: boolean;
+	initialContentOffset?: Offset;
+	showsVerticalScrollIndicator?: boolean;
+	showsHorizontalScrollIndicator?: boolean;
+	onRefresh?: () => any;
+	onLoading?: () => any;
+	allLoaded?: boolean;
+	textInputRefs?: any[];
+	inputToolBarHeight?: number;
+	tapToHideKeyboard?: boolean;
+	onTouchBegin?: () => any;
+	onTouchEnd?: () => any;
+	inverted?: boolean;
+	onScroll?: (evt: ScrollEvent) => any;
+	keyboardShouldPersistTaps?: 'always' | 'never' | 'handled';
+	onNativeContentOffsetExtract?: NativeContentOffset;
+	onSizeChange?: ({width: number, height: number}) => any;
+	onContentSizeChange?: ({width: number, height: number}) => any;
+	pageWidth?: number;
+	children: any;
+	pageSize?: number;
+	onMomentumScrollEnd?: () => any;
+	onMomentumScrollBegin?: () => any;
+	onMomentumScrollActive?: () => any;
+	onStateChange: () => any;
+	onGestureEvent?: any;
+	scrollEnabled?: boolean;
+	activeOffset: number;
+	activeVelocity: number;
+}

package/index.js

@@ -0,0 +1,7 @@
+export * from "./GesturePageView";
+export * from "./GesturePropType";
+export * from "./GestureRefreshHeader";
+export * from "./GestureLoadingFooter";
+export * from "./GestureNormalHeader";
+export * from "./GestureNormalFooter";
+export * from "./GestureScrollView";

package/package.json

@@ -1,6 +1,17 @@
 {
   "name": "react-native-scrollpageviewtest",
-  "version": "0.0.1-security",
-  "description": "security holding package",
-  "repository": "npm/security-holder"
+  "version": "1.5.5",
+  "description": "",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "keywords": [
+    "react-native"
+  ],
+  "author": "",
+  "license": "",
+  "peerDependencies": {
+    "react-native": "^0.41.2"
+  }
 }

package/styles.js

@@ -0,0 +1,13 @@
+import { StyleSheet } from "react-native";
+
+export const styles = StyleSheet.create({
+  wrapperStyle: {
+    flexGrow: 1,
+    flexShrink: 1,
+    overflow: "scroll"
+  },
+
+  contentStyle: {
+    flexGrow: 1
+  }
+});