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

Comparing version 1.0.32 to 1.0.33

package.json

 {
   "name": "react-native-slider-picker",
-  "version": "1.0.32",
+  "version": "1.0.33",
   "description": "Custom range slide picker for React Native. 🚧 UNDER CONSTRUCTION 🚧",
@@ -21,3 +21,11 @@ "main": "src/index.js",
     "react-native-css-vh-vw": "^1.0.2"
-  }
+  },
+  "keywords": [
+    "react native",
+    "component",
+    "slider",
+    "slide picker",
+    "slider picker",
+    "range picker"
+  ]
 }

README.md

 ## React Native Slider Picker 
 
-React Native input component to select a single value from a range of 0 to a custom maximum. 
+A lean, custom React Native input component to select a single value on a scale from 0 to a maximum value of your choice.
 
@@ -13,11 +13,9 @@ ### 🚧 🚧 This package is currently under construction 🚧 🚧
 
-React Native Slider Picker relies on [react-native-css-vh-vw](https://github.com/graftonstudio/react-native-css-vh-vw) for height and width dimensions.
+React Native Slider Picker sole dependency is [react-native-css-vh-vw](https://github.com/graftonstudio/react-native-css-vh-vw), which is used for height and width dimensions.
 
-`npm install react-native-css-vh-vw`
-
 ## Usage 
 
-#### Props
+**Props:**
 
-**Note:** All props are optional and have default values. 
+_Note:_ All props are optional and have default values. 
 
@@ -47,2 +45,43 @@ | Name                       | Type     | Description                                                                                                                 | Default                                                                                              | Notes                                                                                                     |
 | `sliderInnerBorderStyles`    | Object   | An object of StyleSheet properties to set border-related styles of sliderInner View component.                              | `{ borderWidth: vw(1) / 2, borderColor: '#d9dce4', borderBottomColor: '#f1f4f5', borderRadius: 50 }` | If passed, the object is filtered to remove any key/value properties that are not for component's border. |
-| `widthPercentage`            | Number   | Percentage of device's viewport to set as component's width.                                                                | `85`                                                                                                 | Value passed to `vw()`                                                                                    |
+| `widthPercentage`            | Number   | Percentage of device's viewport to set as component's width.                                                                | `85`                                                                                                 | Value passed to `vw()`                                                                                    |
+
+**Basic, bare-bones usage:**
+
+```javascript
+import { SliderPicker } from 'react-native-slider-picker';
+
+<SliderPicker />
+```
+
+**Output:**
+![react-native-slider-picker Basic Usage](https://res.cloudinary.com/munsch-creative/image/upload/v1586991626/react-native-slider-picker-basic_d47l1y.png "react-native-slider-picker Basic Usage")
+
+**Usage with many props:**
+```javascript
+import { SliderPicker } from 'react-native-slider-picker';
+
+<SliderPicker 
+  minLabel={'Min'}
+  midLabel={'Mid'}
+  maxLabel={'Max'}
+  maxValue={100}
+  defaultValue={25}
+  labelFontColor={"#6c7682"}
+  labelFontWeight={'600'}
+  showFill={true}
+  fillColor={'red'}
+  labelFontWeight={'bold'}
+  showNumberScale={true}
+  showSeparatorScale={true}
+  buttonBackgroundColor={'#fff'}
+  buttonBorderColor={"#6c7682"}
+  buttonBorderWidth={1}
+  scaleNumberFontWeight={'300'}
+  buttonDimensionsPercentage={6}
+  heightPercentage={1}
+  widthPercentage={80}
+/>
+```
+
+**Output:**
+![react-native-slider-picker With Many Props](https://res.cloudinary.com/munsch-creative/image/upload/v1586991632/react-native-slider-picker-props_ag4lbz.png "react-native-slider-picker With Many Props")

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

46427

increased by2.85%

Number of lines in readme file

85

increased by84.78%

No dependency changes