react-modal-global - npm Package Compare versions

Comparing version 2.22.2023-alpha to 2.22.2023-alpha-1

dist/index.d.ts

 import EventEmitter from 'eventemitter3';
-import { ReactElement, Component, ReactNode, ComponentLifecycle } from 'react';
+import { ReactElement, ReactNode, ComponentLifecycle } from 'react';
 import { HasRequiredKeys } from 'type-fest';
@@ -164,19 +164,5 @@
 }
-interface ModalContainerState<P = unknown> {
-    active: boolean;
-    queue: ModalWindow<P>[];
-    forkedQueue: ModalWindow<P>[];
-}
-/**
- * Modal container component. Renders modal windows.
- *
- * Can be used multiple times to render modals in different places.
- */
-declare class ModalContainer extends Component<ModalContainerProps, ModalContainerState> {
-    state: ModalContainerState;
-    get className(): string;
-    render(): JSX.Element;
-    renderForks(): JSX.Element[];
-}
 
+declare function ModalContainer(props: ModalContainerProps): JSX.Element;
+
 /**
@@ -183,0 +169,0 @@ * Used inside a modal component to access the modal context (`ModalWindow`).

dist/index.ts

 'use strict';Object.defineProperty(exports,"__esModule",{value:!0});var EventEmitter=require("eventemitter3"),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);
-function __classPrivateFieldGet(a,b,c,e){if("a"===c&&!e)throw new TypeError("Private accessor was defined without a getter");if("function"===typeof b?a!==b||!e:!b.has(a))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===c?e:"a"===c?e.call(a):e?e.value:b.get(a)}
-function __classPrivateFieldSet(a,b,c,e,d){if("m"===e)throw new TypeError("Private method is not writable");if("a"===e&&!d)throw new TypeError("Private accessor was defined without a setter");if("function"===typeof b?a!==b||!d:!b.has(a))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===e?d.call(a,c):d?d.value=c:b.set(a,c),c}
-function classWithModifiers(a,...b){b=b.filter(Boolean);if(!b.length)return a;b=b.map(c=>a+"--"+c);return a+" "+b.join(" ")}function serialize(a){function b(){let c=new WeakSet;return(e,d)=>{if("object"===typeof d&&null!==d){if(c.has(d))return;c.add(d)}return d}}return null==a?String(a):JSON.stringify(a,function(c,e){e=b()(c,e);c=e instanceof Function?e.name===c?e.toString():e.name:e;return c})}
+function __classPrivateFieldGet(a,b,c,d){if("a"===c&&!d)throw new TypeError("Private accessor was defined without a getter");if("function"===typeof b?a!==b||!d:!b.has(a))throw new TypeError("Cannot read private member from an object whose class did not declare it");return"m"===c?d:"a"===c?d.call(a):d?d.value:b.get(a)}
+function __classPrivateFieldSet(a,b,c,d,e){if("m"===d)throw new TypeError("Private method is not writable");if("a"===d&&!e)throw new TypeError("Private accessor was defined without a setter");if("function"===typeof b?a!==b||!e:!b.has(a))throw new TypeError("Cannot write private member to an object whose class did not declare it");return"a"===d?e.call(a,c):e?e.value=c:b.set(a,c),c}
+function classWithModifiers(a,...b){b=b.filter(Boolean);if(!b.length)return a;b=b.map(c=>a+"--"+c);return a+" "+b.join(" ")}function serialize(a){function b(){let c=new WeakSet;return(d,e)=>{if("object"===typeof e&&null!==e){if(c.has(e))return;c.add(e)}return e}}return null==a?String(a):JSON.stringify(a,function(c,d){d=b()(c,d);c=d instanceof Function?d.name===c?d.toString():d.name:d;return c})}
 function stopPropagation(a){return({target:b,currentTarget:c})=>{b instanceof Element&&c instanceof Element&&b!==c||(null===a||void 0===a?void 0:a())}}var _ModalController_isOpen;let DEFAULT_PARAMS={id:0,closable:!0,weak:!1,fork:!1};
-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=()=>{},e=new Promise(f=>c=f);b=Object.assign(Object.assign({},DEFAULT_PARAMS),b);let d={component:a,params:b,close:()=>{this.remove(d);c()},isClosed:!1};this.add(d);return Object.assign(Object.assign({},
-d),{then(f,g){return e.then(f,g)}})}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=>
+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(g=>c=g);b=Object.assign(Object.assign({},DEFAULT_PARAMS),b);let e={component:a,params:b,close:()=>{this.remove(e);c()},isClosed:!1};this.add(e);return Object.assign(Object.assign({},
+e),{then(g,k){return d.then(g,k)}})}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)};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);
-class ModalContainer extends react.Component{constructor(){super(...arguments);this.state={active:!1,queue:[],forkedQueue:[]}}get className(){return this.props.className||"modal"}render(){var a,b;let {active:c,queue:e}=this.state,d=e.at(-1),f=(null===(a=null===d||void 0===d?void 0:d.params)||void 0===a?0:a.closable)?stopPropagation(d.close):void 0;a=this.props.template||react.Fragment;let g=d?Object.assign(Object.assign({},d),{isClosed:!c}):null;return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",
-Object.assign({className:classWithModifiers(this.className,c&&"active"),"aria-modal":!0,"aria-hidden":!c},{children:jsxRuntime.jsx("div",Object.assign({className:this.className+"__container",onClick:f},{children:jsxRuntime.jsx(modalContext.Provider,Object.assign({value:g},{children:jsxRuntime.jsx(a,{children:(null===d||void 0===d?void 0:d.component)&&react.createElement(d.component,Object.assign({},d.params,{key:null===(b=null===d||void 0===d?void 0:d.params)||void 0===b?void 0:b.id}))})}))}))})),
-this.renderForks()]})}renderForks(){return this.state.forkedQueue.map(a=>{var b;return jsxRuntime.jsx("div",Object.assign({className:classWithModifiers(this.className,"active"),"aria-modal":!0},{children:jsxRuntime.jsx("div",Object.assign({className:this.className+"__container",onClick:(null===(b=a.params)||void 0===b?0:b.closable)?stopPropagation(a.close):void 0},{children:jsxRuntime.jsx(modalContext.Provider,Object.assign({value:a},{children:jsxRuntime.jsx(a.component,Object.assign({},a.params))}))}))}),
-a.params.id)})}}function useModalContext(){let a=react.useContext(modalContext);if(!a)throw Error("ModalError: useModalContext must be used within a modalContext");return a}exports.Modal=Modal;exports.ModalContainer=ModalContainer;exports.ModalController=ModalController;exports.useModalContext=useModalContext
+this.events.off("remove",b);this.events.off("update",b)}}}_ModalController_isOpen=new WeakMap;let Modal=new ModalController,modalContext=react.createContext(null),DEFAULT_STATE={isOpen:!1,windows:[]};
+function ModalContainer(a){var b,c;let [d,e]=react.useState(DEFAULT_STATE);react.useEffect(()=>(a.controller||Modal).observe(e),[a.controller]);let g=a.className||"modal",k=a.template||react.Fragment,f=d.windows.at(-1),l=(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),{isClosed:!d.isOpen}):null;return jsxRuntime.jsxs(jsxRuntime.Fragment,{children:[jsxRuntime.jsx("div",Object.assign({className:classWithModifiers(g,
+d.isOpen&&"active"),"aria-modal":!0,"aria-hidden":!d.isOpen},{children:jsxRuntime.jsx("div",Object.assign({className:g+"__container",onClick:l},{children:jsxRuntime.jsx(k,{children:jsxRuntime.jsx(modalContext.Provider,Object.assign({value:b},{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(h=>h.params.fork).map(h=>
+jsxRuntime.jsx("div",Object.assign({className:classWithModifiers(g,"active"),"aria-modal":!0},{children:jsxRuntime.jsx("div",Object.assign({className:g+"__container",onClick:h.params.closable?stopPropagation(h.close):void 0},{children:jsxRuntime.jsx(modalContext.Provider,Object.assign({value:h},{children:jsxRuntime.jsx(h.component,Object.assign({},h.params))}))}))}),h.params.id))]})}
+function useModalContext(){let a=react.useContext(modalContext);if(!a)throw Error("ModalError: useModalContext must be used within a modalContext");return a}exports.Modal=Modal;exports.ModalContainer=ModalContainer;exports.ModalController=ModalController;exports.useModalContext=useModalContext

package.json

 {
   "name": "react-modal-global",
-  "version": "2.22.2023-alpha",
+  "version": "2.22.2023-alpha-1",
   "description": "Highly reusable React Modal that can be run from useEffect.",
@@ -5,0 +5,0 @@ "main": "dist/index.ts",

No alert changes

Worsened metrics

Total package byte prevSize

24997

decreased by-2.07%

Lines of code

196

decreased by-7.11%

No dependency changes