react-change-highlight - npm Package Compare versions

Comparing version 1.1.1 to 1.1.2

build/index.js

@@ -7,2 +7,3 @@ 'use strict';
 var React__default = _interopDefault(React);
+require('http');
 
@@ -77,2 +78,3 @@ function _slicedToArray(arr, i) {
   var isInitialMount = React.useRef(true);
+  var listOfHighlightedElements = [];
 
@@ -88,5 +90,7 @@ var showHighlight = function showHighlight(element) {
         element.ref.current.className += ' ' + highlightStyle;
-        setTimeout(function () {
-          element.ref.current.className = classNames;
-        }, hideAfter);
+        listOfHighlightedElements.push({
+          element: element,
+          hideAfter: hideAfter
+        });
+        hideHighlight();
       }, showAfter);
@@ -99,2 +103,22 @@ } else {
 
+  var hideHighlight = function hideHighlight() {
+    var length = listOfHighlightedElements.length;
+
+    if (length) {
+      var _listOfHighlightedEle = listOfHighlightedElements[length - 1],
+          element = _listOfHighlightedEle.element,
+          _hideAfter = _listOfHighlightedEle.hideAfter;
+      setTimeout(function () {
+        var classNames = element.ref.current.className;
+
+        if (classNames.indexOf(highlightStyle) > -1) {
+          element.ref.current.className = classNames.substr(0, classNames.indexOf(highlightStyle)).trim();
+        }
+
+        listOfHighlightedElements.pop();
+        hideHighlight();
+      }, _hideAfter);
+    }
+  };
+
   var checkChangedChildren = function checkChangedChildren() {
@@ -101,0 +125,0 @@ React__default.Children.map(children, function (newChild, index1) {

build/index.min.js

@@ -1,1 +0,1 @@
-"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var React=require("react"),React__default=_interopDefault(React);function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_nonIterableRest()}function _arrayWithHoles(e){if(Array.isArray(e))return e}function _iterableToArrayLimit(e,t){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)){var r=[],n=!0,i=!1,a=void 0;try{for(var l,o=e[Symbol.iterator]();!(n=(l=o.next()).done)&&(r.push(l.value),!t||r.length!==t);n=!0);}catch(e){i=!0,a=e}finally{try{n||null==o.return||o.return()}finally{if(i)throw a}}return r}}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var highlightClassName="react-highlight",styles="\n  .".concat(highlightClassName," {\n    background-color: #f8ffb4;\n    transition: all 0.5s ease-in-out;\n  }\n"),styleSheet=document.createElement("style");styleSheet.type="text/css",styleSheet.innerText=styles,document.head.appendChild(styleSheet);var ChangeHighlight=function(e){function t(){React__default.Children.map(i,function(r,n){return React__default.Children.map(m,function(e,t){if(n===t&&r.props.children!==e.props.children&&(y(i),r.ref&&r.props.children))setTimeout(function(){!function e(t,r,n){var i=1<arguments.length&&void 0!==r?r:i,a=2<arguments.length&&void 0!==n?n:a,l=t.ref.current.className;t.ref.current.className.includes(u)?(t.ref.current.className=l.indexOf(u)&&l.substr(0,l.indexOf(u)).trim(),e(t,i,a)):setTimeout(function(){t.ref.current.className+=" "+u,setTimeout(function(){t.ref.current.className=l},a)},i)}(r,a,l)},300)}),r.props.children})}var i=e.children,r=e.showAfter,a=void 0===r?500:r,n=e.hideAfter,l=void 0===n?2500:n,o=e.containerClassName,c=void 0===o?"":o,s=e.highlightStyle,u=void 0===s?highlightClassName:s,f=e.disabled,h=void 0!==f&&f,d=_slicedToArray(React.useState(),2),m=d[0],y=d[1],g=React.useRef(!0);return React.useEffect(function(){h||(g.current?(g.current=!1,y(i)):t())}),React__default.createElement("div",{className:c},i)};module.exports=ChangeHighlight;
+"use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}var React=require("react"),React__default=_interopDefault(React);function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_nonIterableRest()}function _arrayWithHoles(e){if(Array.isArray(e))return e}function _iterableToArrayLimit(e,t){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e)){var r=[],n=!0,i=!1,a=void 0;try{for(var l,c=e[Symbol.iterator]();!(n=(l=c.next()).done)&&(r.push(l.value),!t||r.length!==t);n=!0);}catch(e){i=!0,a=e}finally{try{n||null==c.return||c.return()}finally{if(i)throw a}}return r}}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}require("http");var highlightClassName="react-highlight",styles="\n  .".concat(highlightClassName," {\n    background-color: #f8ffb4;\n    transition: all 0.5s ease-in-out;\n  }\n"),styleSheet=document.createElement("style");styleSheet.type="text/css",styleSheet.innerText=styles,document.head.appendChild(styleSheet);var ChangeHighlight=function(e){function t(){React__default.Children.map(i,function(r,n){return React__default.Children.map(m,function(e,t){if(n===t&&r.props.children!==e.props.children&&(p(i),r.ref&&r.props.children))setTimeout(function(){!function e(t,r,n){var i=1<arguments.length&&void 0!==r?r:i,a=2<arguments.length&&void 0!==n?n:a,l=t.ref.current.className;t.ref.current.className.includes(u)?(t.ref.current.className=l.indexOf(u)&&l.substr(0,l.indexOf(u)).trim(),e(t,i,a)):setTimeout(function(){t.ref.current.className+=" "+u,g.push({element:t,hideAfter:a}),v()},i)}(r,a,l)},300)}),r.props.children})}var i=e.children,r=e.showAfter,a=void 0===r?500:r,n=e.hideAfter,l=void 0===n?2500:n,c=e.containerClassName,o=void 0===c?"":c,s=e.highlightStyle,u=void 0===s?highlightClassName:s,f=e.disabled,h=void 0!==f&&f,d=_slicedToArray(React.useState(),2),m=d[0],p=d[1],y=React.useRef(!0),g=[],v=function t(){var e=g.length;if(e){var r=g[e-1],n=r.element,i=r.hideAfter;setTimeout(function(){var e=n.ref.current.className;-1<e.indexOf(u)&&(n.ref.current.className=e.substr(0,e.indexOf(u)).trim()),g.pop(),t()},i)}};return React.useEffect(function(){h||(y.current?(y.current=!1,p(i)):t())}),React__default.createElement("div",{className:o},i)};module.exports=ChangeHighlight;

package.json

@@ -19,3 +19,3 @@ {
   ],
-  "version": "1.1.1",
+  "version": "1.1.2",
   "peerDependencies": {
@@ -22,0 +22,0 @@ "react": "^16.8",

New alerts

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

10796

9.84%

Lines of code

138

16.95%

Worsened metrics

Number of medium supply chain risk alerts

2

Infinity%

No dependency changes