reactanimationonscreen - npm Package Compare versions

Comparing version 0.5.0 to 0.6.0

lib/index.d.ts

@@ -1,3 +0,3 @@
-declare function useOnScreen(className: string, classNameAnimation: string, offset?: number, useDebounce?: boolean): void;
+declare function useOnScreen(className: string, animationClassName: string, offset?: number, useDebounce?: boolean): void;
 export default useOnScreen;
 //# sourceMappingURL=index.d.ts.map

lib/index.d.ts.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAgBA,iBAAS,WAAW,CAClB,SAAS,EAAE,MAAM,EACjB,kBAAkB,EAAE,MAAM,EAC1B,MAAM,SAAI,EACV,WAAW,CAAC,EAAE,OAAO,QAoCtB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAgBA,iBAAS,WAAW,CAClB,SAAS,EAAE,MAAM,EACjB,kBAAkB,EAAE,MAAM,EAC1B,MAAM,SAAI,EACV,WAAW,CAAC,EAAE,OAAO,QAqCtB;AAED,eAAe,WAAW,CAAC"}

lib/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 function debounce(func, wait, immediate) {
-    var timeout;
+    let timeout;
     return () => {
-        var context = this, args = arguments;
-        var later = function () {
+        let context = this;
+        let args = arguments;
+        let later = () => {
             timeout = null;
@@ -12,3 +13,3 @@ if (!immediate)
         };
-        var callNow = immediate && !timeout;
+        let callNow = immediate && !timeout;
         clearTimeout(timeout);
@@ -20,3 +21,3 @@ timeout = setTimeout(later, wait);
 }
-function useOnScreen(className, classNameAnimation, offset = 0, useDebounce) {
+function useOnScreen(className, animationClassName, offset = 0, useDebounce) {
     window.onload = () => {
@@ -28,6 +29,6 @@ let elements = [...document.getElementsByClassName(className)];
                     elements.forEach((element) => {
-                        if (element.classList.contains(classNameAnimation)) {
+                        if (element.classList.contains(animationClassName)) {
                             if (element.getBoundingClientRect().top <
                                 window.innerHeight - offset) {
-                                element.classList.add(classNameAnimation);
+                                element.classList.add(animationClassName);
                             }
@@ -40,6 +41,6 @@ }
                 elements.forEach((element) => {
-                    if (element.classList.contains(classNameAnimation)) {
+                    if (element.classList.contains(animationClassName)) {
                         if (element.getBoundingClientRect().top <
                             window.innerHeight - offset) {
-                            element.classList.add(classNameAnimation);
+                            element.classList.add(animationClassName);
                         }
@@ -50,2 +51,3 @@ }
         };
+        return { trackedElements: elements };
     };
@@ -52,0 +54,0 @@ }

lib/index.js.map

@@ -1,1 +0,1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;AAAA,SAAS,QAAQ,CAAa,IAAS,EAAE,IAAY,EAAE,SAAkB;IACvE,IAAI,OAAY,CAAC;IACjB,OAAO,GAAG,EAAE;QACV,IAAI,OAAO,GAAG,IAAI,EAChB,IAAI,GAAG,SAAS,CAAC;QACnB,IAAI,KAAK,GAAG;YACV,OAAO,GAAG,IAAI,CAAC;YACf,IAAI,CAAC,SAAS;gBAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;QAC5C,CAAC,CAAC;QACF,IAAI,OAAO,GAAG,SAAS,IAAI,CAAC,OAAO,CAAC;QACpC,YAAY,CAAC,OAAO,CAAC,CAAC;QACtB,OAAO,GAAG,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QAClC,IAAI,OAAO;YAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACzC,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAClB,SAAiB,EACjB,kBAA0B,EAC1B,MAAM,GAAG,CAAC,EACV,WAAqB;IAErB,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;QACnB,IAAI,QAAQ,GAAG,CAAC,GAAG,QAAQ,CAAC,sBAAsB,CAAC,SAAS,CAAC,CAAC,CAAC;QAC/D,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC7B,IAAI,WAAW,EAAE;gBACf,QAAQ,CACN,CAAC,GAAG,EAAE;oBACJ,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;wBAC3B,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;4BAClD,IACE,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG;gCACnC,MAAM,CAAC,WAAW,GAAG,MAAM,EAC3B;gCACA,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;6BAC3C;yBACF;oBACH,CAAC,CAAC,CAAC;gBACL,CAAC,CAAC,EAAE,EACJ,GAAG,EACH,KAAK,CACN,CAAC;aACH;iBAAM;gBACL,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;oBAC3B,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;wBAClD,IACE,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG;4BACnC,MAAM,CAAC,WAAW,GAAG,MAAM,EAC3B;4BACA,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;yBAC3C;qBACF;gBACH,CAAC,CAAC,CAAC;aACJ;QACH,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAED,kBAAe,WAAW,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;AAAA,SAAS,QAAQ,CAAa,IAAS,EAAE,IAAY,EAAE,SAAkB;IACvE,IAAI,OAAY,CAAC;IACjB,OAAO,GAAG,EAAE;QACV,IAAI,OAAO,GAAG,IAAI,CAAC;QACnB,IAAI,IAAI,GAAG,SAAS,CAAC;QACrB,IAAI,KAAK,GAAG,GAAG,EAAE;YACf,OAAO,GAAG,IAAI,CAAC;YACf,IAAI,CAAC,SAAS;gBAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;QAC5C,CAAC,CAAC;QACF,IAAI,OAAO,GAAG,SAAS,IAAI,CAAC,OAAO,CAAC;QACpC,YAAY,CAAC,OAAO,CAAC,CAAC;QACtB,OAAO,GAAG,UAAU,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QAClC,IAAI,OAAO;YAAE,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACzC,CAAC,CAAC;AACJ,CAAC;AAED,SAAS,WAAW,CAClB,SAAiB,EACjB,kBAA0B,EAC1B,MAAM,GAAG,CAAC,EACV,WAAqB;IAErB,MAAM,CAAC,MAAM,GAAG,GAAG,EAAE;QACnB,IAAI,QAAQ,GAAG,CAAC,GAAG,QAAQ,CAAC,sBAAsB,CAAC,SAAS,CAAC,CAAC,CAAC;QAC/D,MAAM,CAAC,QAAQ,GAAG,CAAC,CAAQ,EAAE,EAAE;YAC7B,IAAI,WAAW,EAAE;gBACf,QAAQ,CACN,CAAC,GAAG,EAAE;oBACJ,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;wBAC3B,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;4BAClD,IACE,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG;gCACnC,MAAM,CAAC,WAAW,GAAG,MAAM,EAC3B;gCACA,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;6BAC3C;yBACF;oBACH,CAAC,CAAC,CAAC;gBACL,CAAC,CAAC,EAAE,EACJ,GAAG,EACH,KAAK,CACN,CAAC;aACH;iBAAM;gBACL,QAAQ,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;oBAC3B,IAAI,OAAO,CAAC,SAAS,CAAC,QAAQ,CAAC,kBAAkB,CAAC,EAAE;wBAClD,IACE,OAAO,CAAC,qBAAqB,EAAE,CAAC,GAAG;4BACnC,MAAM,CAAC,WAAW,GAAG,MAAM,EAC3B;4BACA,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;yBAC3C;qBACF;gBACH,CAAC,CAAC,CAAC;aACJ;QACH,CAAC,CAAC;QACF,OAAO,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC;IACvC,CAAC,CAAC;AACJ,CAAC;AAED,kBAAe,WAAW,CAAC"}

package.json

 {
   "name": "reactanimationonscreen",
-  "version": "0.5.0",
+  "version": "0.6.0",
   "description": "React Animation On Screen is a custom hook to track if an element is on screen and apply some CSS to it.",
@@ -16,6 +16,14 @@ "main": "lib/index.js",
   },
-  "keywords": [],
+  "keywords": [
+    "react",
+    "css",
+    "animation",
+    "on screen",
+    "transition",
+    "lnardon"
+  ],
   "author": "github.com/lnardon",
   "license": "MIT",
   "devDependencies": {
+    "@types/node": "^14.14.6",
     "@types/react-dom": "^16.9.8",
@@ -29,6 +37,3 @@ "@types/react-test-renderer": "^16.9.3",
   },
-  "dependencies": {
-    "@types/node": "^14.11.10",
-    "@types/react": "^16.9.53"
-  }
+  "dependencies": {}
 }

src/index.ts

@@ -19,3 +19,3 @@ function debounce(this: void, func: any, wait: number, immediate: boolean) {
   className: string,
-  classNameAnimation: string,
+  animationClassName: string,
   offset = 0,
@@ -31,3 +31,3 @@ useDebounce?: boolean
             elements.forEach((element) => {
-              if (element.classList.contains(classNameAnimation)) {
+              if (element.classList.contains(animationClassName)) {
                 if (
@@ -37,3 +37,3 @@ element.getBoundingClientRect().top <
                 ) {
-                  element.classList.add(classNameAnimation);
+                  element.classList.add(animationClassName);
                 }
@@ -48,3 +48,3 @@ }
         elements.forEach((element) => {
-          if (element.classList.contains(classNameAnimation)) {
+          if (element.classList.contains(animationClassName)) {
             if (
@@ -54,3 +54,3 @@ element.getBoundingClientRect().top <
             ) {
-              element.classList.add(classNameAnimation);
+              element.classList.add(animationClassName);
             }
@@ -61,2 +61,3 @@ }
     };
+    return { trackedElements: elements };
   };
@@ -63,0 +64,0 @@ }

No alert changes

Improved metrics

Total package byte prevSize

7706

2.84%

Dependency count

0

-100%

Lines of code

131

2.34%

Worsened metrics

Dev dependency count

8

14.29%

Dependency changes

• - Removed

  @types/node@^14.11.10

• - Removed

  @types/react@^16.9.53

• - Removed

  @types/node@14.18.63
  (transitive)

• - Removed

  @types/prop-types@15.7.15
  (transitive)

• - Removed

  @types/react@16.14.69
  (transitive)

• - Removed

  @types/scheduler@0.16.8
  (transitive)

• - Removed

  csstype@3.2.3
  (transitive)