Socket
Socket
Sign inDemoInstall

react-modal-global

Package Overview
Dependencies
Maintainers
1
Versions
84
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

react-modal-global - npm Package Compare versions

Comparing version 1.2.3-rc1 to 1.2.3-rc2

4

dist/index.d.ts
import EventEmitter from 'eventemitter3';
import { ReactElement, ReactNode } from 'react';
import { ReactElement, Component, ReactNode } from 'react';
import { HasRequiredKeys } from 'type-fest';

@@ -8,3 +8,3 @@

*/
type ModalComponent<P = unknown> = ((props: P) => ReactElement | null) | (() => ReactElement | null);
type ModalComponent<P = unknown> = ((props: P) => ReactElement | null) | (() => ReactElement | null) | (new (props: P) => Component) | (new () => Component);
interface ModalParams {

@@ -11,0 +11,0 @@ /**

@@ -7,6 +7,6 @@ 'use strict';Object.defineProperty(exports,"__esModule",{value:!0});var EventEmitter=require("eventemitter3"),uuid=require("uuid"),jsxRuntime=require("react/jsx-runtime"),react=require("react");function _interopDefaultLegacy(a){return a&&"object"===typeof a&&"default"in a?a:{"default":a}}var EventEmitter__default=_interopDefaultLegacy(EventEmitter);

class ModalController{constructor(){_ModalController_isOpen.set(this,!1);this.windows=new Set;this.events=new EventEmitter__default["default"]}set isOpen(a){__classPrivateFieldSet(this,_ModalController_isOpen,a,"f")}get isOpen(){return __classPrivateFieldGet(this,_ModalController_isOpen,"f")}open(a,...[b]){let c=()=>{},d=new Promise(f=>c=f);b=Object.assign(Object.assign({},DEFAULT_PARAMS),b);let e={id:uuid.v5(serializeWindow(a,b),MODAL_UUID_NAMESPACE),component:a,params:b,close:()=>{this.remove(e);
c()},closed:!1,focused:!0};this.add(e);return Object.assign(Object.assign({},e),{then(f,h){return d.then(f,h)}})}replace(a,...[b]){let c=[...this.windows].at(-1);null!=c&&this.windows.delete(c);return this.open(a,b)}add(a){!1===this.isOpen&&0<this.windows.size&&this.windows.clear();this.isOpen=!0;this.windows.add(a);this.events.emit("add",a)}remove(a){if(this.windows.has(a)){if(1===this.windows.size&&(this.isOpen=!1,!a.params.weak)){this.events.emit("update");return}this.windows.delete(a);this.events.emit("remove",
a)}}findByComponent(a,b){return[...this.windows].filter(c=>c.component!==a?!1:null!=b?serialize(b)===serialize(c.params):!0)}findById(a){return[...this.windows].filter(b=>b.params.id===a)}closeByComponent(a,b){this.findByComponent(a,b).forEach(c=>c.close())}closeById(a){this.findById(a).forEach(b=>b.close())}closeAll(){this.isOpen=!1;this.events.emit("update")}observe(a){let b=()=>{const c={isOpen:this.isOpen,windows:[...this.windows]};a(c)};b();this.events.on("add",b);this.events.on("remove",b);
this.events.on("update",b);return()=>{this.events.off("add",b);this.events.off("remove",b);this.events.off("update",b)}}}_ModalController_isOpen=new WeakMap;let Modal=new ModalController,modalContext=react.createContext(null);function useModalContext(){let a=react.useContext(modalContext);if(!a)throw Error("ModalError: useModalContext must be used within a modalContext");return a}let DEFAULT_STATE={isOpen:!1,windows:[]};
function useModalState(a=Modal){let [b,c]=react.useState(DEFAULT_STATE);react.useEffect(()=>a.observe(c),[a]);return b}
c()},closed:!1,focused:!0};this.add(e);return Object.assign(Object.assign({},e),{then(f,h){return d.then(f,h)}})}replace(a,...[b]){let c=[...this.windows].at(-1);null!=c&&this.windows.delete(c);return this.open(a,b)}add(a){let b=[...this.windows].at(-1);(null===b||void 0===b?void 0:b.id)===a.id?(this.isOpen=!0,this.events.emit("update")):(!1===this.isOpen&&0<this.windows.size&&this.windows.clear(),this.isOpen=!0,this.windows.add(a),this.events.emit("add",a))}remove(a){if(this.windows.has(a)){if(1===
this.windows.size&&(this.isOpen=!1,!a.params.weak)){this.events.emit("update");return}this.windows.delete(a);this.events.emit("remove",a)}}findByComponent(a,b){return[...this.windows].filter(c=>c.component!==a?!1:null!=b?serialize(b)===serialize(c.params):!0)}findById(a){return[...this.windows].filter(b=>b.params.id===a)}closeByComponent(a,b){this.findByComponent(a,b).forEach(c=>c.close())}closeById(a){this.findById(a).forEach(b=>b.close())}closeAll(){this.isOpen=!1;this.events.emit("update")}observe(a){let b=
()=>{const c={isOpen:this.isOpen,windows:[...this.windows]};a(c)};b();this.events.on("add",b);this.events.on("remove",b);this.events.on("update",b);return()=>{this.events.off("add",b);this.events.off("remove",b);this.events.off("update",b)}}}_ModalController_isOpen=new WeakMap;let Modal=new ModalController,modalContext=react.createContext(null);
function useModalContext(){let a=react.useContext(modalContext);if(!a)throw Error("ModalError: useModalContext must be used within a modalContext");return a}let DEFAULT_STATE={isOpen:!1,windows:[]};function useModalState(a=Modal){let [b,c]=react.useState(DEFAULT_STATE);react.useEffect(()=>a.observe(c),[a]);return b}
function ModalContainer(a){var b,c;let d=useModalState(a.controller),e=a.className||"modal";a=a.template||react.Fragment;let f=d.windows.at(-1),h=(null===(b=null===f||void 0===f?void 0:f.params)||void 0===b?0:b.closable)?stopPropagation(f.close):void 0;b=f?Object.assign(Object.assign({},f),{closed:!d.isOpen,focused:!0}):null;return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",Object.assign({className:classWithModifiers(e,d.isOpen&&"active"),"aria-modal":!0,"aria-hidden":!d.isOpen},

@@ -13,0 +13,0 @@ {children:jsxRuntime.jsx("div",Object.assign({className:e+"__container",onClick:h},{children:jsxRuntime.jsx(modalContext.Provider,Object.assign({value:b},{children:jsxRuntime.jsx(a,{children:(null===f||void 0===f?void 0:f.component)&&react.createElement(f.component,Object.assign({},f.params,{key:null===(c=null===f||void 0===f?void 0:f.params)||void 0===c?void 0:c.id}))})}))}))})),[...d.windows].reverse().filter(g=>g.params.fork).map(g=>jsxRuntime.jsx("div",Object.assign({className:classWithModifiers(e,

{
"name": "react-modal-global",
"version": "1.2.3-rc1",
"version": "1.2.3-rc2",
"description": "Highly reusable React Modal that can be run from useEffect.",

@@ -5,0 +5,0 @@ "main": "dist/index.ts",

Sorry, the diff of this file is not supported yet

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