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

Comparing version 1.0.22 to 1.0.23

package.json

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

src/components/SliderPicker.js

@@ -107,3 +107,3 @@ /**
     this.maxLabel = this.props.maxLabel ?  this.labelGenerator(this.props.maxLabel, 'right') : this.emptyLabel;
-    this.maxValue = this.props.maxValue ?  this.maxValue : 10;
+    this.maxValue = this.props.maxValue ?  this.props.maxValue : 10;
     this.maxLabel = this.props.maxLabel ?  this.labelGenerator(this.props.maxLabel, 'right') : this.emptyLabel;
@@ -184,2 +184,3 @@ this.midLabel = this.props.midLabel ?  this.labelGenerator(this.props.midLabel, 'center') : this.emptyLabel;
             buttonDimensionsPercentage={this.buttonDimensionsPercentage}
+            maxValue={this.maxValue}
           />
@@ -227,3 +228,3 @@ </View>
     // If value passed is not a number or if it's out of range.
-    if (isNaN(value) || value > 10 || value < 0) {
+    if (isNaN(value) || value > this.maxValue || value < 0) {
       // Set to default
@@ -242,5 +243,5 @@ return false;
   handleSeparatorStyle = (index) => {
-    // If index is 0 or 10, or if separator is for currently active set border 
+    // If index is 0 or this.maxValue, or if separator is for currently active set border 
     // to transparent so it's not visible
-    if (index === 0 || index === 10 || index === this.state.currentValue) {
+    if (index === 0 || index === this.maxValue || index === this.state.currentValue) {
       return { borderLeftColor: 'transparent' };
@@ -271,3 +272,3 @@ }
   handleSelectionFillWidth = () => {
-    return (vw(this.widthPercentage) * (this.state.currentValue / 10)) - (vh(1) * .5)
+    return (vw(this.widthPercentage) * (this.state.currentValue / this.maxValue)) - (vh(1) * .5)
   }
@@ -340,5 +341,5 @@
 
-    // For 0 through 10, push a styled separator into separators array via helper
+    // For 0 through this.maxValue, push a styled separator into separators array via helper
     // method, this.separatorGenerator(). Will be rendered in JSX below.
-    for (let i = 0; i <= 10; i++) {
+    for (let i = 0; i <= this.maxValue; i++) {
       separators.push(this.separatorGenerator(i));
@@ -373,9 +374,9 @@ }
     if (this.showNumberScale) {
-      // For 0 through 10, push a styled button into numbers. 
+      // For 0 through this.maxValue, push a styled button into numbers. 
       // Will be rendered in JSX below.
-      for (let i = 0; i <= 10; i++) {
+      for (let i = 0; i <= this.maxValue; i++) {
 
         // Initialize width variable to set the width of each TouchableHighlight.
-        // Default value is the rounded down - numbersContainers width divided by 10.
-        let width = Math.floor(vw(this.widthPercentage) / 10)
+        // Default value is the rounded down - numbersContainers width divided by this.maxValue.
+        let width = Math.floor(vw(this.widthPercentage) / this.maxValue)
         
@@ -391,3 +392,3 @@ // If first TouchableHighlight, add extra width to account for the width of separatorLine.
           >
-            <Text style={numberStyle}>{i !== 10 ? i : `${i}+`}</Text>
+            <Text style={numberStyle}>{i}</Text>
           </TouchableHighlight>
@@ -451,3 +452,2 @@ )
     position: 'absolute',
-    // top: vw(5),
     top: vh(2) * 1.1,
@@ -454,0 +454,0 @@ paddingVertical: vw(4),

src/components/SliderPickerCursor.js

@@ -39,2 +39,3 @@ /**
     this.maxOffset = this.props.maxOffset ? this.props.maxOffset : vw(85);
+    this.maxValue = this.props.maxValue ?  this.props.maxValue : 10;
     this.releaseCallback = this.props.releaseCallback ? this.props.releaseCallback : () => {};
@@ -49,4 +50,4 @@
     // Get x-axis positioning of each number/separator
-    for (let i = 0; i <= 10; i++) {
-      this.numberOffsets.push(vw(85) * (i / 10));
+    for (let i = 0; i <= this.maxValue; i++) {
+      this.numberOffsets.push(vw(85) * (i / this.maxValue));
     }
@@ -59,7 +60,7 @@
       // used to reference latestPosition of draggable view. Updated onPanResponderRelease.
-      latestPosition: this.startPosition * (this.defaultValue / 10)
+      latestPosition: this.startPosition * (this.defaultValue / this.maxValue)
     };
 
     // Initialize value to accomodate for width of button
-    this.state.drag.setValue({ x: (this.startPosition * (this.defaultValue / 10) - (vw(this.buttonDimensionsPercentage) * .5) ), y: 0 });
+    this.state.drag.setValue({ x: (this.startPosition * (this.defaultValue / this.maxValue) - (vw(this.buttonDimensionsPercentage) * .5) ), y: 0 });
 
@@ -66,0 +67,0 @@ // Create panResponder, which is responsible for the dragging

No alert changes

Improved metrics

Total package byte prevSize

31733

increased by0.72%

Lines of code

646

increased by0.16%

No dependency changes