New Case Study:See how Anthropic automated 95% of dependency reviews with Socket.Learn More โ†’
Socket
Sign inDemoInstall
Socket

react-cool-portal

Package Overview
Dependencies
Maintainers
1
Versions
57
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-cool-portal - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

2

dist/index.esm.js

@@ -1,1 +0,1 @@

import{useState as n,useEffect as t,useRef as e,useCallback as r,useMemo as o}from"react";import{createPortal as i}from"react-dom";function u(n,t){return function(n){if(Array.isArray(n))return n}(n)||function(n,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(n)))return;var e=[],r=!0,o=!1,i=void 0;try{for(var u,c=n[Symbol.iterator]();!(r=(u=c.next()).done)&&(e.push(u.value),!t||e.length!==t);r=!0);}catch(n){o=!0,i=n}finally{try{r||null==c.return||c.return()}finally{if(o)throw i}}return e}(n,t)||function(n,t){if(!n)return;if("string"==typeof n)return c(n,t);var e=Object.prototype.toString.call(n).slice(8,-1);"Object"===e&&n.constructor&&(e=n.constructor.name);if("Map"===e||"Set"===e)return Array.from(e);if("Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return c(n,t)}(n,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function c(n,t){(null==t||t>n.length)&&(t=n.length);for(var e=0,r=new Array(t);e<t;e++)r[e]=n[e];return r}var a=function(n){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100,e=setTimeout((function(){clearTimeout(e),n()}),t)},f=function(e,r,o,c){return function(f){var d=f.children,l=u(n(null),2),m=l[0],v=l[1];return t((function(){return v(document.getElementById(e)||function(n){var t=document.createElement("div");return t.setAttribute("id",n),document.body.appendChild(t),t}(e)),function(){m&&a((function(){""===m.innerHTML&&m.remove()}))}}),[m]),t((function(){if(r&&m){var n=function(n){m.contains(n.target)||o(n)},t=function(n){27===n.keyCode&&c(n)};return o&&document.addEventListener("click",n),c&&document.addEventListener("keydown",t),function(){o&&document.removeEventListener("click",n),c&&document.removeEventListener("keydown",t)}}}),[m]),r&&m&&i(d,m)}};export default function(){var i=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},c=i.containerId,d=void 0===c?"react-cool-portal":c,l=i.defaultShow,m=void 0===l||l,v=i.clickOutsideToHide,s=void 0===v||v,y=i.escToHide,h=void 0===y||y,p=i.internalShowHide,b=void 0===p||p,g=i.onShow,w=i.onHide,S=n(m),A=u(S,2),E=A[0],k=A[1],T=e(!1),H=e(null),I=e(null);t((function(){g&&(H.current=g)}),[g]),t((function(){w&&(I.current=w)}),[w]);var L=r((function(){s&&E&&(T.current=!0,a((function(){T.current=!1})))}),[s,E]),j=r((function(n){L(),E||(k(!0),g&&g(n))}),[L,E,g]),O=r((function(n){L(),E&&(k(!1),w&&w(n))}),[L,E,w]),C=r((function(n){E?O(n):j(n)}),[E,O,j]),x=r((function(n){T.current||O(n)}),[O]),M=o((function(){return f(d,!b||E,s&&x,h&&x)}),[d,b,E,s,h,x]);return{Portal:M,isShow:E,show:j,hide:O,toggle:C}}
import{useState as t,useEffect as n,useRef as e,useCallback as r}from"react";import{createPortal as o}from"react-dom";function i(t,n){return function(t){if(Array.isArray(t))return t}(t)||function(t,n){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(t)))return;var e=[],r=!0,o=!1,i=void 0;try{for(var u,c=t[Symbol.iterator]();!(r=(u=c.next()).done)&&(e.push(u.value),!n||e.length!==n);r=!0);}catch(t){o=!0,i=t}finally{try{r||null==c.return||c.return()}finally{if(o)throw i}}return e}(t,n)||function(t,n){if(!t)return;if("string"==typeof t)return u(t,n);var e=Object.prototype.toString.call(t).slice(8,-1);"Object"===e&&t.constructor&&(e=t.constructor.name);if("Map"===e||"Set"===e)return Array.from(e);if("Arguments"===e||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(e))return u(t,n)}(t,n)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function u(t,n){(null==n||n>t.length)&&(n=t.length);for(var e=0,r=new Array(n);e<n;e++)r[e]=t[e];return r}var c=function(t){var n=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100,e=setTimeout((function(){clearTimeout(e),t()}),n)},a=function(e,r,u,a){return function(l){var d=l.children,f=i(t(null),2),m=f[0],v=f[1];return n((function(){return v(document.getElementById(e)||function(t){var n=document.createElement("div");return n.setAttribute("id",t),document.body.appendChild(n),n}(e)),function(){m&&c((function(){""===m.innerHTML&&m.remove()}))}}),[m]),n((function(){if(r&&m){var t=function(t){m.contains(t.target)||u(t)},n=function(t){27===t.keyCode&&a(t)};return u&&document.addEventListener("click",t),a&&document.addEventListener("keydown",n),function(){u&&document.removeEventListener("click",t),a&&document.removeEventListener("keydown",n)}}}),[m]),r&&m&&o(d,m)}},l="react-cool-portal",d=!0;export default function(){var o=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},u=o.containerId,l=void 0===u?"react-cool-portal":u,d=o.defaultShow,f=void 0===d||d,m=o.clickOutsideToHide,v=void 0===m||m,s=o.escToHide,y=void 0===s||s,h=o.internalShowHide,p=void 0===h||h,b=o.onShow,g=o.onHide,w=t(f),S=i(w,2),A=S[0],E=S[1],k=e(!1),T=e(null),H=e(null);n((function(){b&&(T.current=b)}),[b]),n((function(){g&&(H.current=g)}),[g]);var I=r((function(){v&&A&&(k.current=!0,c((function(){k.current=!1})))}),[v,A]),L=r((function(t){I(),A||(E(!0),b&&b(t))}),[I,A,b]),j=r((function(t){I(),A&&(E(!1),g&&g(t))}),[I,A,g]),O=r((function(t){A?j(t):L(t)}),[A,j,L]),x=r((function(t){k.current||j(t)}),[j]),C=r(a(l,!p||A,v&&x,y&&x),[p&&A]);return{Portal:C,isShow:A,show:L,hide:j,toggle:O}}export{l as defaultContainerId,d as initShow};

@@ -1,1 +0,1 @@

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-dom");function n(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var n=[],r=!0,o=!1,u=void 0;try{for(var i,c=e[Symbol.iterator]();!(r=(i=c.next()).done)&&(n.push(i.value),!t||n.length!==t);r=!0);}catch(e){o=!0,u=e}finally{try{r||null==c.return||c.return()}finally{if(o)throw u}}return n}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(n);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return r(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var o=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100,n=setTimeout((function(){clearTimeout(n),e()}),t)},u=function(r,u,i,c){return function(a){var l=a.children,f=n(e.useState(null),2),d=f[0],s=f[1];return e.useEffect((function(){return s(document.getElementById(r)||function(e){var t=document.createElement("div");return t.setAttribute("id",e),document.body.appendChild(t),t}(r)),function(){d&&o((function(){""===d.innerHTML&&d.remove()}))}}),[d]),e.useEffect((function(){if(u&&d){var e=function(e){d.contains(e.target)||i(e)},t=function(e){27===e.keyCode&&c(e)};return i&&document.addEventListener("click",e),c&&document.addEventListener("keydown",t),function(){i&&document.removeEventListener("click",e),c&&document.removeEventListener("keydown",t)}}}),[d]),u&&d&&t.createPortal(l,d)}};exports.default=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=t.containerId,i=void 0===r?"react-cool-portal":r,c=t.defaultShow,a=void 0===c||c,l=t.clickOutsideToHide,f=void 0===l||l,d=t.escToHide,s=void 0===d||d,v=t.internalShowHide,m=void 0===v||v,y=t.onShow,b=t.onHide,h=e.useState(a),p=n(h,2),g=p[0],S=p[1],k=e.useRef(!1),w=e.useRef(null),E=e.useRef(null);e.useEffect((function(){y&&(w.current=y)}),[y]),e.useEffect((function(){b&&(E.current=b)}),[b]);var C=e.useCallback((function(){f&&g&&(k.current=!0,o((function(){k.current=!1})))}),[f,g]),A=e.useCallback((function(e){C(),g||(S(!0),y&&y(e))}),[C,g,y]),T=e.useCallback((function(e){C(),g&&(S(!1),b&&b(e))}),[C,g,b]),j=e.useCallback((function(e){g?T(e):A(e)}),[g,T,A]),H=e.useCallback((function(e){k.current||T(e)}),[T]),I=e.useMemo((function(){return u(i,!m||g,f&&H,s&&H)}),[i,m,g,f,s,H]);return{Portal:I,isShow:g,show:A,hide:T,toggle:j}};
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react"),t=require("react-dom");function n(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){if("undefined"==typeof Symbol||!(Symbol.iterator in Object(e)))return;var n=[],r=!0,o=!1,u=void 0;try{for(var i,c=e[Symbol.iterator]();!(r=(i=c.next()).done)&&(n.push(i.value),!t||n.length!==t);r=!0);}catch(e){o=!0,u=e}finally{try{r||null==c.return||c.return()}finally{if(o)throw u}}return n}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return r(e,t);var n=Object.prototype.toString.call(e).slice(8,-1);"Object"===n&&e.constructor&&(n=e.constructor.name);if("Map"===n||"Set"===n)return Array.from(n);if("Arguments"===n||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n))return r(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function r(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var o=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:100,n=setTimeout((function(){clearTimeout(n),e()}),t)},u=function(r,u,i,c){return function(a){var l=a.children,f=n(e.useState(null),2),d=f[0],s=f[1];return e.useEffect((function(){return s(document.getElementById(r)||function(e){var t=document.createElement("div");return t.setAttribute("id",e),document.body.appendChild(t),t}(r)),function(){d&&o((function(){""===d.innerHTML&&d.remove()}))}}),[d]),e.useEffect((function(){if(u&&d){var e=function(e){d.contains(e.target)||i(e)},t=function(e){27===e.keyCode&&c(e)};return i&&document.addEventListener("click",e),c&&document.addEventListener("keydown",t),function(){i&&document.removeEventListener("click",e),c&&document.removeEventListener("keydown",t)}}}),[d]),u&&d&&t.createPortal(l,d)}};exports.default=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},r=t.containerId,i=void 0===r?"react-cool-portal":r,c=t.defaultShow,a=void 0===c||c,l=t.clickOutsideToHide,f=void 0===l||l,d=t.escToHide,s=void 0===d||d,v=t.internalShowHide,m=void 0===v||v,y=t.onShow,b=t.onHide,h=e.useState(a),p=n(h,2),S=p[0],g=p[1],k=e.useRef(!1),w=e.useRef(null),E=e.useRef(null);e.useEffect((function(){y&&(w.current=y)}),[y]),e.useEffect((function(){b&&(E.current=b)}),[b]);var C=e.useCallback((function(){f&&S&&(k.current=!0,o((function(){k.current=!1})))}),[f,S]),A=e.useCallback((function(e){C(),S||(g(!0),y&&y(e))}),[C,S,y]),I=e.useCallback((function(e){C(),S&&(g(!1),b&&b(e))}),[C,S,b]),T=e.useCallback((function(e){S?I(e):A(e)}),[S,I,A]),j=e.useCallback((function(e){k.current||I(e)}),[I]),x=e.useCallback(u(i,!m||S,f&&j,s&&j),[m&&S]);return{Portal:x,isShow:S,show:A,hide:I,toggle:T}},exports.defaultContainerId="react-cool-portal",exports.initShow=!0;
{
"name": "react-cool-portal",
"version": "0.1.4",
"version": "0.1.5",
"description": "React hook for Portals, which renders modals, dropdowns, tooltips etc. to <body> or else.",

@@ -232,3 +232,3 @@ "license": "MIT",

"npm-run-all": "^4.1.5",
"prettier": "^1.19.1",
"prettier": "^2.0.1",
"react": "^16.13.1",

@@ -235,0 +235,0 @@ "react-dom": "^16.13.1",

@@ -101,2 +101,4 @@ # React Cool Portal

[![Edit usePortal](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/useportal-v8voh?fontsize=14&hidenavigation=1&theme=dark)
```js

@@ -152,2 +154,4 @@ import React from 'react';

[![Edit usePortal with Animation](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/useportal-with-animation-eorc2?fontsize=14&hidenavigation=1&theme=dark)
```js

@@ -296,7 +300,2 @@ import React from 'react';

## To Do
- [ ] Unit testing
- [ ] Demo code
## Contributors โœจ

@@ -303,0 +302,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with โšก๏ธ by Socket Inc