react-scroll-progress-bar - npm Package Compare versions

Comparing version 1.2.3 to 2.0.0

package.json

 {
   "name": "react-scroll-progress-bar",
-  "version": "1.2.3",
+  "version": "2.0.0",
   "description": "A scroll progress bar component for React",
-  "main": "build/index.js",
-  "peerDependencies": {
-    "react": "^17.0.1"
+  "type": "module",
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "main": "./dist/react-scroll-progress-bar.umd.js",
+  "module": "./dist/react-scroll-progress-bar.es.js",
+  "exports": {
+    ".": {
+      "import": "./dist/react-scroll-progress-bar.es.js",
+      "require": "./dist/react-scroll-progress-bar.umd.js"
+    }
   },
   "scripts": {
-    "dev": "webpack-dev-server --mode development --open",
-    "build": "webpack --mode production",
-    "test": "echo \"No test specified\""
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/ad1tyara0/react-scroll-progress-bar.git"
+    "url": "git+https://github.com/thisisaditya/react-scroll-progress-bar.git"
   },
@@ -24,23 +33,19 @@ "keywords": [
   "author": {
-    "name": "Aditya Rao",
-    "url": "https://www.adityarao.in/"
+    "name": "Aditya Rao"
   },
   "license": "MIT",
   "bugs": {
-    "url": "https://github.com/ad1tyara0/react-scroll-progress-bar/issues"
+    "url": "https://github.com/thisisaditya/react-scroll-progress-bar/issues"
   },
-  "homepage": "https://github.com/ad1tyara0/react-scroll-progress-bar#readme",
+  "homepage": "https://github.com/thisisaditya/react-scroll-progress-bar#readme",
+  "peerDependencies": {
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0"
+  },
   "devDependencies": {
-    "@babel/core": "^7.12.16",
-    "@babel/preset-env": "^7.12.16",
-    "@babel/preset-react": "^7.12.13",
-    "webpack": "^5.22.0",
-    "webpack-cli": "^4.5.0",
-    "webpack-dev-server": "^3.11.2"
-  },
-  "dependencies": {
-    "prop-types": "^15.7.2",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1"
+    "@types/react": "^18.2.66",
+    "@types/react-dom": "^18.2.22",
+    "@vitejs/plugin-react": "^4.2.1",
+    "vite": "^5.2.0"
   }
 }

README.md

@@ -17,17 +17,17 @@ # react-scroll-progress-bar
 import React from "react";
-import ProgressBar from "react-scroll-progress-bar"; //Add this line
+import ProgressBar from "react-scroll-progress-bar"; //Add this line to import the component
 
 export default class App extends React.Component {
-    render() {
-        return (
-            <div>
-                <ProgressBar />
-                //This is all you need to get the default view working
-            </div>
-        );
-    }
+  render() {
+    return (
+      <div>
+        <ProgressBar />
+        //This is all you need to get the default view working
+      </div>
+    );
+  }
 }
 ```
 
-----
+---
 
@@ -41,16 +41,16 @@ ### Custom Progress Bar:
 export default class App extends React.Component {
-    render() {
-        return (
-            <div>
-                <ProgressBar height="6" bgcolor="#000" duration="0.2" />
-                  // Here you can add any react component or jsx
-                  // Add ProgressBar at your top level component or Root component.
-                  // Change height and background-color by setting respective props.
-            </div>
-        );
-    }
+  render() {
+    return (
+      <div>
+        <ProgressBar height="6" bgcolor="#000" duration="0.2" />
+        // Here you can add any react component or jsx // Add ProgressBar at your
+        top level component or Root component. // Change height and background-color
+        by setting respective props.
+      </div>
+    );
+  }
 }
 ```
 
-----
+---
 
@@ -60,15 +60,13 @@ ### Configuration:
 ```javascript
-    <ProgressBar
-      height="3"
-      bgcolor="#F43059"
-      duration="1"
-    />
+<ProgressBar height="8" bgcolor="#F43059" duration="1" />
 ```
 
-**height** -- Set height of progress bar. Default height is `3px`. Pass the number not the unit. Unit is `px`
+**height** - Set height of progress bar. Default height is `8px`. Pass the number not the unit. Unit is `px`
 
-**bgcolor** -- Set background-color of progress bar. Default background-color is `#F43059`.
+**bgcolor** - Set background-color of progress bar. Default background-color is `#F43059`.
 
-**duration** -- Set timing-duration for transition property. Default is `1s`. Pass the number not the unit. Unit is `s`
+**duration** - Set timing-duration for transition property. Default is `1s`. Pass the number not the unit. Unit is `s`(seconds)
 
-----
+> NOTE: To remove transition animation on progress bar, simply pass `duration="0"` to ProgressBar component.
+
+---

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

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

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

Found 1 instance in 1 package

No bug tracker

Maintenance

Package does not have a linked bug tracker in package.json.

Found 1 instance in 1 package

No website

Quality

Package does not have a website.

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

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

Minified code

Quality

This package contains minified code. This may be harmless in some cases where minified code is included in packaged libraries, however packages on npm should not minify code.

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

Improved metrics

Total package byte prevSize

41765

increased by348.17%

Dependency count

2

decreased by-50%

Dev dependency count

4

decreased by-33.33%

Lines of code

760

increased by1125.81%

Is type module

Yes

Worsened metrics

Number of low maintenance alerts

1

increased byInfinity%

Number of lines in readme file

70

decreased by-2.78%

Number of low supply chain risk alerts

4

increased byInfinity%

Dependency changes

• + Addedreact@18.3.1(transitive)

• + Addedreact-dom@18.3.1(transitive)

• + Addedscheduler@0.23.2(transitive)

• - Removedprop-types@^15.7.2

• - Removedreact@^17.0.1

• - Removedreact-dom@^17.0.1

• - Removedobject-assign@4.1.1(transitive)

• - Removedprop-types@15.8.1(transitive)

• - Removedreact@17.0.2(transitive)

• - Removedreact-dom@17.0.2(transitive)

• - Removedreact-is@16.13.1(transitive)

• - Removedscheduler@0.20.2(transitive)