react-click-away-listener - npm Package Compare versions

Comparing version 2.0.2 to 2.0.3

dist/index.d.ts

@@ -1,2 +0,2 @@
-import { ReactElement, FunctionComponent, HTMLAttributes } from 'react';
+import { ReactElement, HTMLAttributes, FunctionComponent } from 'react';
 declare type MouseEvents = 'click' | 'mousedown' | 'mouseup';
@@ -3,0 +3,0 @@ declare type TouchEvents = 'touchstart' | 'touchend';

dist/react-click-away-listener.es.js

@@ -1,2 +0,2 @@
-import n,{useRef as e,useEffect as t}from"react";function r(n,e,t){return e in n?Object.defineProperty(n,e,{value:t,enumerable:!0,configurable:!0,writable:!0}):n[e]=t,n}var o={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};export default function(u){var c,i=u.children,a=u.onClickAway,v=u.mouseEvent,f=void 0===v?"click":v,l=u.touchEvent,d=void 0===l?"touchend":l,m=e(null),s=e(null),p=e(!1);t((function(){return setTimeout((function(){p.current=!0}),0),function(){p.current=!1}}),[]);var h=function(n){var e=n.event,t=n.type;s.current=e.target;var r=null==i?void 0:i.props[t];r&&r(e)};return t((function(){var n=function(n){p.current&&(m.current&&m.current.contains(n.target)||s.current===n.target||a(n))};return document.addEventListener(f,n),document.addEventListener(d,n),function(){document.removeEventListener(f,n),document.removeEventListener(d,n)}}),[f,a,d]),n.Children.only(n.cloneElement(i,(r(c={ref:function(n){m.current=n;var e=i.ref;"function"==typeof e?e(n):e&&(e.current=n)}},o[f],(function(n){return h({type:o[f],event:n})})),r(c,o[d],(function(n){return h({type:o[d],event:n})})),c)))}
+import n,{useRef as t,useEffect as e,cloneElement as r}from"react";function o(n,t,e){return t in n?Object.defineProperty(n,t,{value:e,enumerable:!0,configurable:!0,writable:!0}):n[t]=e,n}var u={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};export default function(c){var i,a=c.children,d=c.onClickAway,f=c.mouseEvent,v=void 0===f?"click":f,l=c.touchEvent,m=void 0===l?"touchend":l,s=t(null),h=t(null),p=t(!1);e((function(){return setTimeout((function(){p.current=!0}),0),function(){p.current=!1}}),[]);var E=function(n){return function(t){h.current=t.target;var e=null==a?void 0:a.props[n];e&&e(t)}};e((function(){var n=function(n){p.current&&(s.current&&s.current.contains(n.target)||h.current===n.target||!document.contains(n.target)||d(n))};return document.addEventListener(v,n),document.addEventListener(m,n),function(){document.removeEventListener(v,n),document.removeEventListener(m,n)}}),[v,d,m]);var g=u[v],b=u[m];return n.Children.only(r(a,(o(i={ref:function(n){s.current=n;var t=a.ref;"function"==typeof t?t(n):t&&(t.current=n)}},g,E(g)),o(i,b,E(b)),i)))}
 //# sourceMappingURL=react-click-away-listener.es.js.map

dist/react-click-away-listener.js

@@ -1,2 +0,2 @@
-"use strict";var e=require("react");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=n(e);function r(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};module.exports=function(n){var o,c=n.children,i=n.onClickAway,f=n.mouseEvent,a=void 0===f?"click":f,l=n.touchEvent,v=void 0===l?"touchend":l,d=e.useRef(null),s=e.useRef(null),m=e.useRef(!1);e.useEffect((function(){return setTimeout((function(){m.current=!0}),0),function(){m.current=!1}}),[]);var p=function(e){var n=e.event,t=e.type;s.current=n.target;var r=null==c?void 0:c.props[t];r&&r(n)};return e.useEffect((function(){var e=function(e){m.current&&(d.current&&d.current.contains(e.target)||s.current===e.target||i(e))};return document.addEventListener(a,e),document.addEventListener(v,e),function(){document.removeEventListener(a,e),document.removeEventListener(v,e)}}),[a,i,v]),t.default.Children.only(t.default.cloneElement(c,(r(o={ref:function(e){d.current=e;var n=c.ref;"function"==typeof n?n(e):n&&(n.current=e)}},u[a],(function(e){return p({type:u[a],event:e})})),r(o,u[v],(function(e){return p({type:u[v],event:e})})),o)))};
+"use strict";var e=require("react");function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=n(e);function r(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};module.exports=function(n){var o,c=n.children,i=n.onClickAway,f=n.mouseEvent,a=void 0===f?"click":f,d=n.touchEvent,l=void 0===d?"touchend":d,s=e.useRef(null),v=e.useRef(null),m=e.useRef(!1);e.useEffect((function(){return setTimeout((function(){m.current=!0}),0),function(){m.current=!1}}),[]);var E=function(e){return function(n){v.current=n.target;var t=null==c?void 0:c.props[e];t&&t(n)}};e.useEffect((function(){var e=function(e){m.current&&(s.current&&s.current.contains(e.target)||v.current===e.target||!document.contains(e.target)||i(e))};return document.addEventListener(a,e),document.addEventListener(l,e),function(){document.removeEventListener(a,e),document.removeEventListener(l,e)}}),[a,i,l]);var h=u[a],p=u[l];return t.default.Children.only(e.cloneElement(c,(r(o={ref:function(e){s.current=e;var n=c.ref;"function"==typeof n?n(e):n&&(n.current=e)}},h,E(h)),r(o,p,E(p)),o)))};
 //# sourceMappingURL=react-click-away-listener.js.map

dist/react-click-away-listener.umd.js

@@ -1,2 +0,2 @@
-!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n(require("react")):"function"==typeof define&&define.amd?define(["react"],n):(e="undefined"!=typeof globalThis?globalThis:e||self)["react-click-away-listener"]=n(e.react)}(this,(function(e){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=n(e);function r(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};return function(n){var o,c=n.children,i=n.onClickAway,f=n.mouseEvent,a=void 0===f?"click":f,d=n.touchEvent,l=void 0===d?"touchend":d,s=e.useRef(null),v=e.useRef(null),p=e.useRef(!1);e.useEffect((function(){return setTimeout((function(){p.current=!0}),0),function(){p.current=!1}}),[]);var m=function(e){var n=e.event,t=e.type;v.current=n.target;var r=null==c?void 0:c.props[t];r&&r(n)};return e.useEffect((function(){var e=function(e){p.current&&(s.current&&s.current.contains(e.target)||v.current===e.target||i(e))};return document.addEventListener(a,e),document.addEventListener(l,e),function(){document.removeEventListener(a,e),document.removeEventListener(l,e)}}),[a,i,l]),t.default.Children.only(t.default.cloneElement(c,(r(o={ref:function(e){s.current=e;var n=c.ref;"function"==typeof n?n(e):n&&(n.current=e)}},u[a],(function(e){return m({type:u[a],event:e})})),r(o,u[l],(function(e){return m({type:u[l],event:e})})),o)))}}));
+!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?module.exports=n(require("react")):"function"==typeof define&&define.amd?define(["react"],n):(e="undefined"!=typeof globalThis?globalThis:e||self)["react-click-away-listener"]=n(e.react)}(this,(function(e){"use strict";function n(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var t=n(e);function r(e,n,t){return n in e?Object.defineProperty(e,n,{value:t,enumerable:!0,configurable:!0,writable:!0}):e[n]=t,e}var u={click:"onClick",mousedown:"onMouseDown",mouseup:"onMouseUp",touchstart:"onTouchStart",touchend:"onTouchEnd"};return function(n){var o,c=n.children,i=n.onClickAway,f=n.mouseEvent,a=void 0===f?"click":f,d=n.touchEvent,l=void 0===d?"touchend":d,s=e.useRef(null),v=e.useRef(null),m=e.useRef(!1);e.useEffect((function(){return setTimeout((function(){m.current=!0}),0),function(){m.current=!1}}),[]);var p=function(e){return function(n){v.current=n.target;var t=null==c?void 0:c.props[e];t&&t(n)}};e.useEffect((function(){var e=function(e){m.current&&(s.current&&s.current.contains(e.target)||v.current===e.target||!document.contains(e.target)||i(e))};return document.addEventListener(a,e),document.addEventListener(l,e),function(){document.removeEventListener(a,e),document.removeEventListener(l,e)}}),[a,i,l]);var h=u[a],y=u[l];return t.default.Children.only(e.cloneElement(c,(r(o={ref:function(e){s.current=e;var n=c.ref;"function"==typeof n?n(e):n&&(n.current=e)}},h,p(h)),r(o,y,p(y)),o)))}}));
 //# sourceMappingURL=react-click-away-listener.umd.js.map

package.json

 {
 	"name": "react-click-away-listener",
-	"version": "2.0.2",
+	"version": "2.0.3",
 	"description": "A simple click away listener built with React Hooks",
@@ -32,32 +32,32 @@ "main": "dist/react-click-away-listener.js",
 	"devDependencies": {
-		"@babel/preset-env": "^7.3.1",
-		"@babel/preset-react": "^7.0.0",
-		"@babel/preset-typescript": "^7.10.4",
-		"@rollup/plugin-babel": "^5.2.0",
-		"@rollup/plugin-node-resolve": "^11.1.0",
-		"@semantic-release/npm": "^7.1.0",
-		"@testing-library/react": "^9.3.1",
-		"@testing-library/react-hooks": "^5.0.3",
-		"@types/jest": "^24.0.21",
-		"@types/react": "^16.9.11",
-		"@typescript-eslint/parser": "^3.2.0",
+		"@babel/preset-env": "^7.14.1",
+		"@babel/preset-react": "^7.13.13",
+		"@babel/preset-typescript": "^7.13.0",
+		"@rollup/plugin-babel": "^5.3.0",
+		"@rollup/plugin-node-resolve": "^13.0.0",
+		"@semantic-release/npm": "^7.1.3",
+		"@testing-library/react": "^11.2.6",
+		"@testing-library/react-hooks": "^5.1.2",
+		"@types/jest": "^26.0.23",
+		"@types/react": "^17.0.5",
+		"@typescript-eslint/parser": "^4.23.0",
 		"coveralls": "^3.1.0",
-		"cz-conventional-changelog": "3.3.0",
-		"eslint": "^5.13.0",
-		"eslint-config-prettier": "^6.11.0",
-		"eslint-plugin-import": "^2.16.0",
-		"eslint-plugin-jsx-a11y": "^6.2.0",
-		"eslint-plugin-prettier": "^3.1.4",
-		"eslint-plugin-react": "^7.12.4",
-		"eslint-plugin-react-hooks": "^1.6.0",
+		"cz-conventional-changelog": "^3.3.0",
+		"eslint": "^7.26.0",
+		"eslint-config-prettier": "^8.3.0",
+		"eslint-plugin-import": "^2.22.1",
+		"eslint-plugin-jsx-a11y": "^6.4.1",
+		"eslint-plugin-prettier": "^3.4.0",
+		"eslint-plugin-react": "^7.23.2",
+		"eslint-plugin-react-hooks": "^4.2.0",
 		"ghooks": "^2.0.4",
 		"jest": "^26.6.3",
 		"npm-run-all": "^4.1.5",
-		"prettier": "^2.0.5",
+		"prettier": "^2.3.0",
 		"react": "^17.0.2",
 		"react-dom": "^17.0.2",
 		"rimraf": "^3.0.2",
-		"rollup": "^2.38.0",
-		"rollup-plugin-terser": "^7.0.0",
-		"typescript": "^4.2.3"
+		"rollup": "^2.47.0",
+		"rollup-plugin-terser": "^7.0.2",
+		"typescript": "^4.2.4"
 	},
@@ -64,0 +64,0 @@ "peerDependencies": {

README.md

@@ -23,3 +23,3 @@ <p align="center">
 - It supports both Mouse and Touch Events.
-- It works with Portals.
+- It works with Portals (>= v2).
 
@@ -33,3 +33,3 @@ ## Usage
 	const handleClickAway = () => {
-		console.log('Hey, you can close the Popup now');
+		console.log('Maybe close the popup');
 	};
@@ -40,5 +40,4 @@
 			<ClickAwayListener onClickAway={handleClickAway}>
-				<div> Some Popup, Nav or anything </div>
+				<div> Triggers whenever a click event is registered outside this div element </div>
 			</ClickAwayListener>
-			<div id="something-else">Hola, mi amigos</div>
 		</div>
@@ -55,8 +54,7 @@ );
 
-| Prop        | Default value | Description                                               |
-| ----------- | ------------- |---------------------------------------------------------- |
-| onClickAway | undefined     | Fires when a user clicks outside the click away component |
-| as          | div           | The rendered element type                                 |
-| mouseEvent  | click         | The mouse event type that gets fired on ClickAway         |
-| touchEvent  | touchend      | The touch event type that gets fired on ClickAway         |
+| Name        | Type                              | Default       | Description                                               |
+| ----------- | ----------------------------------| ------------- |---------------------------------------------------------- |
+| onClickAway | (event) => void                   |               | Fires when a user clicks outside the click away component |
+| mouseEvent  | 'click' \|<br/>'mousedown' \|<br/>'mouseup'| 'click'     | The mouse event type that gets fired on ClickAway          |
+| touchEvent  | 'touchstart' \|<br/>'touchend'         | 'touchend'  | The touch event type that gets fired on ClickAway          |
 
@@ -63,0 +61,0 @@ ## Examples

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

24426

increased by0.4%

Worsened metrics

Number of lines in readme file

64

decreased by-3.03%

No dependency changes