react-native-slider-picker - npm Package Compare versions

Comparing version 1.0.21 to 1.0.22

package.json

		{
		"name": "react-native-slider-picker",
		"version": "1.0.21",
		"version": "1.0.22",
		"description": "Custom range slide picker for React Native. 🚧 UNDER CONSTRUCTION 🚧",
		@@ -5,0 +5,0 @@ "main": "src/index.js",

src/components/SliderPicker.js

		@@ -99,2 +99,3 @@ /**
		this.buttonBorderWidth = this.props.buttonBorderWidth ? this.props.buttonBorderWidth : 1;
		this.buttonDimensionsPercentage = this.props.buttonDimensionsPercentage ? this.props.buttonDimensionsPercentage : 6;
		this.callback = this.props.callback ? this.props.callback : () => {};
		@@ -182,2 +183,3 @@ this.defaultValue = this.defaultValueCheckHandler(this.props.defaultValue) ? this.props.defaultValue : 5;
		buttonBorderWidth={this.buttonBorderWidth}
		buttonDimensionsPercentage={this.buttonDimensionsPercentage}
		/>
		@@ -203,2 +205,5 @@ </View>

		/**
		* Helper method to set to set styles on labels and container and labels depending on props.
		*/
		setLabelAndLabelContainerStyles = () => {
		@@ -205,0 +210,0 @@ // If handleLabelCheck() returns true,

src/components/SliderPickerCursor.js

		@@ -21,11 +21,6 @@ /**
		import React, { Component } from "react";
		import { StyleSheet, PanResponder, Animated } from "react-native";
		import { Animated, PanResponder } from "react-native";
		import { vh, vw } from 'react-native-css-vh-vw';

		//------------------------------------------------------------------------------
		// Constants
		//------------------------------------------------------------------------------
		const CURSOR_RADIUS = vw(3);

		//------------------------------------------------------------------------------
		// Component
		@@ -41,2 +36,3 @@ //------------------------------------------------------------------------------
		this.buttonBorderWidth = this.props.buttonBorderWidth ? this.props.buttonBorderWidth : 1;
		this.buttonDimensionsPercentage = this.props.buttonDimensionsPercentage ? this.props.buttonDimensionsPercentage : 6;
		this.defaultValue = this.props.defaultValue ? this.props.defaultValue : 5;
		@@ -67,3 +63,3 @@ this.minOffset = this.props.minOffset ? this.props.minOffset : vw(12.5);
		// Initialize value to accomodate for width of button
		this.state.drag.setValue({ x: (this.startPosition * (this.defaultValue / 10) - (CURSOR_RADIUS)), y: 0 });
		this.state.drag.setValue({ x: (this.startPosition * (this.defaultValue / 10) - (vw(this.buttonDimensionsPercentage) * .5) ), y: 0 });

		@@ -96,4 +92,7 @@ // Create panResponder, which is responsible for the dragging
		//
		let circleStyles = Object.assign({}, styles.circle);

		// Initialize circle styles
		let circleStyles = {};

		// Set color and border width
		circleStyles['backgroundColor'] = this.buttonBackgroundColor;
		@@ -103,2 +102,7 @@ circleStyles['borderColor'] = this.buttonBorderColor;

		// Set dimensions and shape
		circleStyles['height'] = vw(this.buttonDimensionsPercentage);
		circleStyles['width'] = vw(this.buttonDimensionsPercentage);
		circleStyles['borderRadius'] = vw(this.buttonDimensionsPercentage) * .5; // TO DO: possibly make this more generic for custom shapes?

		return (
		@@ -226,3 +230,3 @@ <Animated.View
		// Move component to nearest (accommodate for width of component itself).
		this.state.drag.setValue({ x: nearestOffset - CURSOR_RADIUS, y: 0 });
		this.state.drag.setValue({ x: nearestOffset - (vw(this.buttonDimensionsPercentage) * .5), y: 0 });

		@@ -250,16 +254,2 @@ // Update latestPosition
		}
		}

		//------------------------------------------------------------------------------
		// Local Styles
		//------------------------------------------------------------------------------
		const styles = StyleSheet.create({
		circle: { // Draggable component visual
		backgroundColor: "#000",
		borderWidth: 1,
		borderColor: "#000",
		width: CURSOR_RADIUS * 2,
		height: CURSOR_RADIUS * 2,
		borderRadius: CURSOR_RADIUS,
		}
		});
		}

react-native-slider-picker - npm Package Compare versions

Improved metrics

Worsened metrics