react-slider - npm Package Compare versions

Comparing version 0.11.2 to 1.0.0-0

package.json

 {
   "name": "react-slider",
-  "version": "0.11.2",
+  "version": "1.0.0-0",
   "description": "Slider component for React",
-  "main": "react-slider.js",
+  "main": "lib/components/ReactSlider/ReactSlider.js",
+  "module": "es/components/ReactSlider/ReactSlider.js",
+  "sideEffects": false,
+  "files": [
+    "es",
+    "lib"
+  ],
   "keywords": [
@@ -13,2 +19,45 @@ "react-component",
   "author": "Michał Powaga <[e-mail]>",
+  "scripts": {
+    "build": "create-react-styleguide script build",
+    "build:watch": "create-react-styleguide script build:watch",
+    "build:styleguide": "create-react-styleguide script build:styleguide",
+    "clean": "create-react-styleguide script clean",
+    "eslint": "create-react-styleguide script eslint",
+    "eslint:fix": "create-react-styleguide script eslint:fix",
+    "start": "create-react-styleguide script start",
+    "test": "create-react-styleguide script test",
+    "test:coverage": "create-react-styleguide script test:coverage",
+    "test:update": "create-react-styleguide script test:update",
+    "test:watch": "create-react-styleguide script test:watch",
+    "prepublishOnly": "create-react-styleguide script prepublishOnly",
+    "predeploy": "npm run build:styleguide",
+    "deploy": "gh-pages -d styleguide",
+    "release": "standard-version"
+  },
+  "husky": {
+    "hooks": {
+      "pre-commit": "npm run eslint && npm run test"
+    }
+  },
+  "dependencies": {},
+  "peerDependencies": {
+    "react": "16.x",
+    "prop-types": "^15.6"
+  },
+  "devDependencies": {
+    "babel-plugin-styled-components": "^1.10.0",
+    "babel-preset-zillow": "^4.0.3",
+    "create-react-styleguide": "^4.0.3",
+    "eslint-plugin-jest": "^22.4.1",
+    "eslint-plugin-zillow": "^3.1.0",
+    "gh-pages": "^2.0.1",
+    "husky": "^1.3.1",
+    "jest-styled-components": "^6.3.1",
+    "prop-types": "^15.7.2",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6",
+    "react-test-renderer": "^16.8.6",
+    "standard-version": "^5.0.2",
+    "styled-components": "^4.2.0"
+  },
   "contributors": [
@@ -22,17 +71,14 @@ {
       "email": "[e-mail]"
+    },
+    {
+      "name": "Brian Stone",
+      "email": "[e-mail]"
     }
   ],
+  "homepage": "https://github.com/zillow/react-slider",
   "license": "MIT",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
   "repository": {
     "type": "git",
-    "url": "https://github.com/mpowaga/react-slider.git"
-  },
-  "peerDependencies": {
-    "react": "^16.2",
-    "prop-types": "^15.6",
-    "create-react-class": "^15.6"
+    "url": "https://github.com/zillow/react-slider.git"
   }
 }

README.md

 # React Slider
 
+[![npm version](https://badge.fury.io/js/react-slider.svg)](https://badge.fury.io/js/react-slider)
+
 CSS agnostic slider component for React.
 
-See demo: [https://mpowaga.github.io/react-slider/](https://mpowaga.github.io/react-slider/)
-
 ### Installation
@@ -13,152 +13,10 @@
 
-### Overview
+### API Documentation
 
-#### Single slider:
+For component props, methods, and living examples, see the demo:
 
-Similar to `<input type="range" defaultValue={50} />`
+https://zillow.github.io/react-slider/
 
-```javascript
-React.render(<ReactSlider defaultValue={50} />, document.body);
-```
-
-#### Double slider (with bars between the handles):
-
-```javascript
-React.render(<ReactSlider defaultValue={[0, 100]} withBars />, document.body);
-```
-
-#### Multi slider:
-
-```javascript
-React.render(<ReactSlider defaultValue={[0, 33, 67, 100]} withBars />, document.body);
-```
-
-#### Provide custom handles:
-
-```javascript
-React.render(
-  <ReactSlider withBars>
-    <div className="my-handle">1</div>
-    <div className="my-handle">2</div>
-    <div className="my-handle">3</div>
-  </ReactSlider>,
-  document.body
-);
-```
-
-Now you can style it as you want. Checkout the `index.html` example to see how.
-
-### Properties
-
-##### min {number} default: 0
-
-The minimum value of the slider.
-
-##### max {number} default: 100
-
-The maximum value of the slider.
-
-##### step {number} default: 1
-
-Value to be added or subtracted on each step the slider makes.
-Must be greater than zero.
-`max - min` should be evenly divisible by the step value.
-
-##### minDistance {number} default: 0
-
-The minimal distance between any pair of handles.
-Zero means they can sit on top of each other.
-
-##### defaultValue {oneOfType([number, arrayOf(number)])} default: 0
-
-Determines the initial positions of the handles and the number of handles if the component has no children.
-
-If a number is passed a slider with one handle will be rendered.
-If an array is passed each value will determine the position of one handle.
-The values in the array must be sorted.
-If the component has children, the length of the array must match the number of children.
-
-##### value {oneOfType([number, arrayOf(number)])} default: 0
-
-Like `defaultValue` but for [controlled components](http://facebook.github.io/react/docs/forms.html#controlled-components).
-
-##### orientation {oneOf(['horizontal', 'vertical'])} default: 'horizontal'
-
-Determines whether the slider moves horizontally (from left to right) or vertically (from top to bottom).
-
-##### className {string} default: 'slider'
-
-The css class set on the slider node.
-
-##### handleClassName {string} default: 'handle'
-
-The css class set on each handle node.
-In addition each handle will receive a numbered css class of the form `${handleClassName}-${i}`,
-e.g. `handle-0`, `handle-1`, ...
-
-##### handleActiveClassName {string} default: 'active'
-
-The css class set on the handle that is currently being moved.
-
-##### withBars {boolean} default: false
-
-If `true` bars between the handles will be rendered.
-
-##### barClassName {string} default: 'bar'
-
-The css class set on the bars between the handles.
-In addition bar fragment will receive a numbered css class of the form `${barClassName}-${i}`,
-e.g. `bar-0`, `bar-1`, ...
-
-##### pearling {bool} default: false
-
-If `true` the active handle will push other handles within the constraints of `min`, `max`, `step` and `minDistance`.
-
-##### disabled {bool} default: false
-
-If `true` the handles can't be moved.
-
-##### snapDragDisabled {bool} default: false
-
-Disables handle move when clicking the slider bar.
-
-##### invert {bool} default: false
-
-Inverts the slider.
-
-##### onBeforeChange {func}
-
-Callback called before starting to move a handle.
-
-##### onChange {func}
-
-Callback called on every value change.
-
-##### onAfterChange {func}
-
-Callback called only after moving a handle has ended or when a new value is set by clicking on the slider.
-
-##### onSliderClick {func}
-
-Callback called when the the slider is clicked (handle or bars). Receives the value at the clicked position as argument.
-
-##### ariaLabel {oneOfType([string, arrayOf(string)])}
-
-aria-label for screen-readers to apply to the handles.
-Use an array for more than one handle.
-The length of the array must match the number of handles in the value array.
-
-##### ariaValuetext {string}
-
-aria-valuetext for screen-readers
-
-### Methods
-
-##### getValue
-
-Returns the current value of the slider, which is a number in the case of a single slider,
-or an array of numbers in case of a multi slider.
-
 ### License
 
 See the [License](LICENSE) file.

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 1 instance in 1 package

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

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

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

81643

increased by116.71%

Dependency count

2

decreased by-33.33%

Number of package files

14

increased by180%

Lines of code

1814

increased by144.8%

Number of low quality alerts

1

decreased by-66.67%

Worsened metrics

Dev dependency count

14

increased byInfinity%

Number of lines in readme file

22

decreased by-86.59%

Number of low supply chain risk alerts

4

increased byInfinity%

Number of medium supply chain risk alerts

2

increased byInfinity%

No dependency changes