aio-popup - npm Package Compare versions

Comparing version 4.0.1 to 4.1.0

index.js

@@ -1,11 +0,11 @@
-import t,{Component as e,createRef as o,useEffect as i,useState as r,createContext as a,useContext as n,useRef as l,forwardRef as d,useImperativeHandle as s}from"react";import*as p from"react-dom/server";import{Icon as c}from"@mdi/react";import{mdiClose as u}from"@mdi/js";import _ from"jquery";import"./index.css";import{AddToAttrs as m}from"aio-utils";import{jsx as h}from"react/jsx-runtime";import{Fragment as $}from"react/jsx-runtime";import{jsxs as f}from"react/jsx-runtime";import{createElement as g}from"react";function _defineProperty(t,e,o){return(e=_toPropertyKey(e))in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}function _toPropertyKey(t){var e=_toPrimitive(t,"string");return"symbol"==typeof e?e:String(e)}function _toPrimitive(t,e){if("object"!=typeof t||null===t)return t;var o=t[Symbol.toPrimitive];if(void 0!==o){var i=o.call(t,e||"default");if("object"!=typeof i)return i;throw TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}export default class v{constructor(t){_defineProperty(this,"rtl",void 0),_defineProperty(this,"render",void 0),_defineProperty(this,"addModal",void 0),_defineProperty(this,"addAlert",void 0),_defineProperty(this,"removeModal",void 0),_defineProperty(this,"addSnackebar",void 0),_defineProperty(this,"getModals",void 0),_defineProperty(this,"addConfirm",void 0),_defineProperty(this,"addPrompt",void 0),_defineProperty(this,"popupId",void 0),_defineProperty(this,"popupsRef",void 0);let{rtl:e=!1}=t||{};this.rtl=e,this.addSnackebar=()=>{},this.popupsRef=o(),this.getModals=()=>{let t=this.popupsRef.current;return null===t?[]:t.getModals()||[]},this.addModal=t=>{let e=this.popupsRef.current;null!==e&&e.addModal(t)},this.removeModal=t=>{let e=this.popupsRef.current;null!==e&&e.removeModal(t)},this.render=()=>{let t={rtl:e,getActions:({add:t})=>this.addSnackebar=t};return f($,{children:[h(Popups,{rtl:e,ref:this.popupsRef}),h(Snackebar,{...t})]})},this.addAlert=t=>Alert(t),this.addConfirm=t=>{let{title:e,subtitle:o,text:i,submitText:r="Yes",canselText:a="No",onSubmit:n,onCansel:l=()=>{},setAttrs:d=()=>({})}=t,s={position:"center",setAttrs(t){let e=d(t);return"modal"===t?m(e,{className:"aio-popup-confirm"}):e},header:{title:e,subtitle:o},body:()=>i,footer:()=>f($,{children:[h("button",{type:"button",onClick:()=>{l(),this.removeModal()},children:a}),h("button",{type:"button",className:"active",onClick:async()=>{if(n)!1!==await n()&&this.removeModal()},children:r})]})};this.addModal(s)},this.addPrompt=t=>{let{title:e,subtitle:o,text:i,submitText:r="تایید",canselText:a="بستن",onSubmit:n,onCansel:l=()=>{},setAttrs:d=()=>({})}=t,s={position:"center",setAttrs(t){let e=d(t);return"modal"===t?m(e,{className:"aio-popup-prompt"}):e},state:{temp:""},header:{title:e,subtitle:o},body:({state:t,setState:e})=>h("textarea",{placeholder:i,value:t.temp,onChange(t){e&&e({temp:t.target.value})}}),footer:({state:t,setState:e})=>f($,{children:[h("button",{type:"button",onClick:()=>{l(),this.removeModal()},children:a}),h("button",{type:"button",className:"active",onClick:async()=>{if(n)!1!==await n(t.temp)?this.removeModal():e({temp:""})},disabled:!t.temp,children:r})]})};this.addModal(s)}}};let Popups=d((t,e)=>{let[o,i]=r([]),a=l(o);a.current=o;let{rtl:n}=t;function d(t){void 0===t.id&&(t.id="popup"+Math.round(1e6*Math.random()));let e=t;i(o=>[...o.filter(({id:e})=>e!==t.id),e])}async function p(t="last"){if("all"===t){i([]);return}if(!a.current.length)return;"last"===t&&(t=a.current[a.current.length-1].id);let e=a.current.find(e=>e.id===t);e&&(_(`[data-id=${t}]`).addClass("not-mounted"),setTimeout(()=>{"function"==typeof e.onClose&&e.onClose(),i(e=>e.filter(e=>e.id!==t))},300))}function c(){return a.current.map((t,e)=>h(Popup,{modal:t,rtl:n,isLast:e===a.current.length-1,onClose:()=>p(t.id)},t.id))}s(e,()=>({addModal:d,removeModal:p,getModals:()=>a.current}));let u=c();return u.length?h($,{children:u}):null}),CTX=a({});function Popup(t){let{modal:e,rtl:a,onClose:n,isLast:d}=t,{setAttrs:s=()=>({}),id:p,position:c="fullscreen",body:u,getTarget:$,maxHeight:g,fixStyle:v=t=>t,fitTo:b}=e,[y]=r({dom:o(),backdropDom:o(),dui:void 0,isDown:!1}),[k,C]=r({}),[M,w]=r(e.state),L=s("modal")||{},x=s("backdrop")||{},P=l(!1);async function N(){n()}function A(t){if(!y.dui)return;let e=_(t.target);"popover"===c&&e.attr("data-id")!==y.dui&&!e.parents(`[data-id=${y.dui}]`).length&&N()}i(()=>()=>{_(window).unbind("click",A)}),i(()=>{let t="popover"===c?function t(){if(!$)return{};let o=$();if(!o||!o.length)return{};let i={dom:_(y.dom.current),target:o,fitHorizontal:e.fitHorizontal,fixStyle:v,pageSelector:e.pageSelector,limitTo:e.limitTo,fitTo:b,attrs:L,rtl:a},r={...Align(i),position:"absolute"};return g&&(r.maxHeight=g),r}():{};if(console.log("updatedStyle.top",t.top),C(t),$){y.dui="a"+Math.round(1e7*Math.random());$().attr("data-id",y.dui)}setTimeout(()=>{let t=_(y.dom.current);t.removeClass("not-mounted"),_(y.backdropDom.current).removeClass("not-mounted"),t.focus()},0),_(window).unbind("click",A),_(window).bind("click",A)},[]);function H(t){if(d)27===t.keyCode&&n()}function S(){setTimeout(()=>y.isDown=!1,0)}let D,R,T,B;return h(CTX.Provider,{value:{close:N,state:M,setState:w},children:h("div",{...(D="aio-popup-backdrop",D+=` aio-popup-position-${c}`,D+=a?" rtl":" ltr",P&&(D+=" not-mounted"),m(x,{className:D,attrs:{ref:y.backdropDom,onKeyDown:H,tabIndex:0,"data-id":p,onClick:x.onClick?x.onClick:function t(e){if(!y.isDown){e.stopPropagation();_(e.target).hasClass("aio-popup-backdrop")&&N()}}}})),children:f("div",{...(R={...k,...L.style},T="ontouchstart"in document.documentElement?"onTouchStart":"onMouseDown",{...L,ref:y.dom,"data-id":e.id,tabIndex:0,onKeyDown:H,[T]:function t(e){_(window).unbind("mouseup",S),_(window).bind("mouseup",S),y.isDown=!0},className:(B="aio-popup",B+=a?" rtl":" ltr",P&&(B+=" not-mounted"),L.className&&(B+=" "+L.className),B),style:{...R}}),children:[!!e.header&&h(ModalHeader,{modal:e}),h(ModalBody,{modal:e}),!!e.footer&&h("div",{...m(s("footer"),{className:"aio-popup-footer"}),children:e.footer({state:M,setState:w,close:N})})]})})})}let ModalHeader=t=>{let e=n(CTX),{modal:o}=t,{state:i,setState:r}=e,{setAttrs:a=()=>({})}=o,l=a("modal")||{};if("function"==typeof o.header)return o.header({close:e.close,state:i,setState:r});if("object"!=typeof o.header)return null;let d="aio-popup-header",{title:s,subtitle:p,onClose:_,before:$,after:g}=o.header;function v(t){t.stopPropagation(),t.preventDefault(),"function"==typeof _?_({state:i,setState:r}):e.close()}function b(){return p?f("div",{style:{display:"flex",flexDirection:"column",justifyContent:"center",flex:1},children:[h("div",{className:`${d}-title`,children:s}),h("div",{className:`${d}-subtitle`,children:p})]}):h("div",{className:`${d}-title`,style:{display:"flex",alignItems:"center",flex:1},children:s})}return f("div",{...m(l,{className:d}),children:[void 0!==$&&h("div",{className:`${d}-before`,onClick:t=>v(t),children:$}),!!s&&b(),void 0!==g&&h("div",{className:`${d}-after`,onClick:t=>v(t),children:g}),!1!==_&&h("div",{className:`${d}-close-button`,onClick:t=>v(t),children:h(c,{path:u,size:.8})})]})},ModalBody=t=>{let{state:e,setState:o,close:i}=n(CTX),{modal:r}=t,{body:a=()=>null,setAttrs:l=()=>({})}=r,d=l("body")||{},s=a({close:i,state:e,setState:o});return s&&null!==s?h("div",{...m(d,{className:"aio-popup-body aio-popup-scroll"}),children:s}):null};function Alert(t){let{icon:e,type:o="",text:i="",subtext:r="",time:a=10,className:n,closeText:l="بستن",position:d="center",onClose:s}=t,c={id:"",time:0,getId:()=>"aa"+Math.round(1e8*Math.random()),getBarRender:()=>`<div class='aio-popup-time-bar' style="width:${c.time}%;"></div>`,updateBarRender(){_(`.aio-popup-alert-container.${c.id} .aio-popup-time`).html(c.getBarRender())},getRender:()=>`
-      <div class='aio-popup-alert-container not-mounted ${c.id} aio-popup-alert-container-${d}'>
+import t,{Component as e,createRef as o,useEffect as i,useState as r,createContext as a,useContext as n,useRef as l,forwardRef as d,useImperativeHandle as s,createElement as p}from"react";import*as c from"react-dom/server";import{Icon as u}from"@mdi/react";import{mdiClose as _}from"@mdi/js";import m from"jquery";import"./index.css";import{AddToAttrs as h}from"aio-utils";import{jsx as $,Fragment as f,jsxs as g}from"react/jsx-runtime";function _defineProperty(t,e,o){return(e=_toPropertyKey(e))in t?Object.defineProperty(t,e,{value:o,enumerable:!0,configurable:!0,writable:!0}):t[e]=o,t}function _toPropertyKey(t){var e=_toPrimitive(t,"string");return"symbol"==typeof e?e:e+""}function _toPrimitive(t,e){if("object"!=typeof t||!t)return t;var o=t[Symbol.toPrimitive];if(void 0!==o){var i=o.call(t,e||"default");if("object"!=typeof i)return i;throw TypeError("@@toPrimitive must return a primitive value.")}return("string"===e?String:Number)(t)}export default class v{constructor(t){_defineProperty(this,"rtl",void 0),_defineProperty(this,"render",void 0),_defineProperty(this,"addModal",void 0),_defineProperty(this,"addAlert",void 0),_defineProperty(this,"removeModal",void 0),_defineProperty(this,"addSnackebar",void 0),_defineProperty(this,"getModals",void 0),_defineProperty(this,"addConfirm",void 0),_defineProperty(this,"addPrompt",void 0),_defineProperty(this,"popupId",void 0),_defineProperty(this,"popupsRef",void 0);let{rtl:e=!1}=t||{};this.rtl=e,this.addSnackebar=()=>{},this.popupsRef=o(),this.getModals=()=>{let t=this.popupsRef.current;return null===t?[]:t.getModals()||[]},this.addModal=t=>{let e=this.popupsRef.current;null!==e&&e.addModal(t)},this.removeModal=t=>{let e=this.popupsRef.current;null!==e&&e.removeModal(t)},this.render=()=>{let t={rtl:e,getActions:({add:t})=>this.addSnackebar=t};return g(f,{children:[$(Popups,{rtl:e,ref:this.popupsRef}),$(Snackebar,{...t})]})},this.addAlert=t=>Alert(t),this.addConfirm=t=>{let{title:e,subtitle:o,text:i,submitText:r="Yes",canselText:a="No",onSubmit:n,onCansel:l=()=>{},setAttrs:d=()=>({})}=t,s={position:"center",setAttrs(t){let e=d(t);return"modal"===t?h(e,{className:"aio-popup-confirm"}):e},header:{title:e,subtitle:o},body:()=>i,footer:()=>g(f,{children:[$("button",{type:"button",onClick:()=>{l(),this.removeModal()},children:a}),$("button",{type:"button",className:"active",onClick:async()=>{if(n)!1!==await n()&&this.removeModal()},children:r})]})};this.addModal(s)},this.addPrompt=t=>{let{title:e,subtitle:o,text:i,submitText:r="تایید",canselText:a="بستن",onSubmit:n,onCansel:l=()=>{},setAttrs:d=()=>({})}=t,s={position:"center",setAttrs(t){let e=d(t);return"modal"===t?h(e,{className:"aio-popup-prompt"}):e},state:{temp:""},header:{title:e,subtitle:o},body:({state:t,setState:e})=>$("textarea",{placeholder:i,value:t.temp,onChange(t){e&&e({temp:t.target.value})}}),footer:({state:t,setState:e})=>g(f,{children:[$("button",{type:"button",onClick:()=>{l(),this.removeModal()},children:a}),$("button",{type:"button",className:"active",onClick:async()=>{if(n)!1!==await n(t.temp)?this.removeModal():e({temp:""})},disabled:!t.temp,children:r})]})};this.addModal(s)}}};let Popups=d((t,e)=>{let[o,i]=r([]),a=l(o);a.current=o;let{rtl:n}=t;function d(t){void 0===t.id&&(t.id="popup"+Math.round(1e6*Math.random()));let e=t;i(o=>[...o.filter(({id:e})=>e!==t.id),e])}async function p(t="last"){if("all"===t){i([]);return}if(!a.current.length)return;"last"===t&&(t=a.current[a.current.length-1].id);let e=a.current.find(e=>e.id===t);e&&(m(`[data-id=${t}]`).addClass("not-mounted"),setTimeout(()=>{"function"==typeof e.onClose&&e.onClose(),i(e=>e.filter(e=>e.id!==t))},300))}function c(){return a.current.map((t,e)=>$(Popup,{modal:t,rtl:n,isLast:e===a.current.length-1,onClose:()=>p(t.id)},t.id))}s(e,()=>({addModal:d,removeModal:p,getModals:()=>a.current}));let u=c();return u.length?$(f,{children:u}):null}),CTX=a({});function Popup(t){let{modal:e,rtl:a,onClose:n,isLast:d}=t,{setAttrs:s=()=>({}),id:p,position:c="fullscreen",body:u,getTarget:_,maxHeight:f,fixStyle:v=t=>t,fitTo:b}=e,[y]=r({dom:o(),backdropDom:o(),dui:void 0,isDown:!1}),[k,C]=r({}),[M,w]=r(e.state),L=s("modal")||{},P=s("backdrop")||{},x=l(!1);async function N(){n()}function A(t){if(!y.dui)return;let e=m(t.target);"popover"===c&&e.attr("data-id")!==y.dui&&!e.parents(`[data-id=${y.dui}]`).length&&N()}i(()=>()=>{m(window).unbind("click",A)}),i(()=>{let t="popover"===c?function t(){if(!_)return{};let o=_();if(!o||!o.length)return{};let i={dom:m(y.dom.current),target:o,fitHorizontal:e.fitHorizontal,fixStyle:v,pageSelector:e.pageSelector,limitTo:e.limitTo,fitTo:b,attrs:L,rtl:a},r={...Align(i),position:"absolute"};return f&&(r.maxHeight=f),r}():{};if(console.log("updatedStyle.top",t.top),C(t),_){y.dui="a"+Math.round(1e7*Math.random());_().attr("data-id",y.dui)}setTimeout(()=>{let t=m(y.dom.current);t.removeClass("not-mounted"),m(y.backdropDom.current).removeClass("not-mounted"),t.focus()},0),m(window).unbind("click",A),m(window).bind("click",A)},[]);function H(t){if(d)27===t.keyCode&&n()}function S(){setTimeout(()=>y.isDown=!1,0)}let D,R,T,B;return $(CTX.Provider,{value:{close:N,state:M,setState:w},children:$("div",{...(D="aio-popup-backdrop",D+=` aio-popup-position-${c}`,D+=a?" rtl":" ltr",x&&(D+=" not-mounted"),h(P,{className:D,attrs:{ref:y.backdropDom,onKeyDown:H,tabIndex:0,"data-id":p,onClick:P.onClick?P.onClick:function t(e){if(!y.isDown){e.stopPropagation();m(e.target).hasClass("aio-popup-backdrop")&&N()}}}})),children:g("div",{...(R={...k,...L.style},T="ontouchstart"in document.documentElement?"onTouchStart":"onMouseDown",{...L,ref:y.dom,"data-id":e.id,tabIndex:0,onKeyDown:H,[T]:function t(e){m(window).unbind("mouseup",S),m(window).bind("mouseup",S),y.isDown=!0},className:(B="aio-popup",B+=a?" rtl":" ltr",x&&(B+=" not-mounted"),L.className&&(B+=" "+L.className),B),style:{...R}}),children:[!!e.header&&$(ModalHeader,{modal:e}),$(ModalBody,{modal:e}),!!e.footer&&$("div",{...h(s("footer"),{className:"aio-popup-footer"}),children:e.footer({state:M,setState:w,close:N})})]})})})}let ModalHeader=t=>{let e=n(CTX),{modal:o}=t,{state:i,setState:r}=e,{setAttrs:a=()=>({})}=o,l=a("modal")||{};if("function"==typeof o.header)return o.header({close:e.close,state:i,setState:r});if("object"!=typeof o.header)return null;let d="aio-popup-header",{title:s,subtitle:p,onClose:c,before:m,after:f}=o.header;function v(t){t.stopPropagation(),t.preventDefault(),"function"==typeof c?c({state:i,setState:r}):e.close()}function b(){return p?g("div",{className:`${d}-text`,children:[$("div",{className:`${d}-title`,children:s}),$("div",{className:`${d}-subtitle`,children:p})]}):$("div",{className:`${d}-title`,style:{display:"flex",alignItems:"center",flex:1},children:s})}return g("div",{...h(l,{className:d}),children:[void 0!==m&&$("div",{className:`${d}-before`,onClick:t=>v(t),children:m}),!!s&&b(),void 0!==f&&$("div",{className:`${d}-after`,onClick:t=>v(t),children:f}),!1!==c&&$("div",{className:`${d}-close-button`,onClick:t=>v(t),children:$(u,{path:_,size:.8})})]})},ModalBody=t=>{let{state:e,setState:o,close:i}=n(CTX),{modal:r}=t,{body:a=()=>null,setAttrs:l=()=>({})}=r,d=l("body")||{},s=a({close:i,state:e,setState:o});return s&&null!==s?$("div",{...h(d,{className:"aio-popup-body aio-popup-scroll"}),children:s}):null};function Alert(t){let{icon:e,type:o="",text:i="",subtext:r="",time:a=10,className:n,closeText:l="بستن",position:d="center",onClose:s}=t,p={id:"",time:0,getId:()=>"aa"+Math.round(1e8*Math.random()),getBarRender:()=>`<div class='aio-popup-time-bar' style="width:${p.time}%;"></div>`,updateBarRender(){m(`.aio-popup-alert-container.${p.id} .aio-popup-time`).html(p.getBarRender())},getRender:()=>`
+      <div class='aio-popup-alert-container not-mounted ${p.id} aio-popup-alert-container-${d}'>
         <div class='aio-popup-alert aio-popup-alert-${o}'>
-          <div class='aio-popup-alert-header'>${c.getIcon()}</div>
+          <div class='aio-popup-alert-header'>${p.getIcon()}</div>
           <div class='aio-popup-alert-body aio-popup-scroll'>
-            <div class='aio-popup-alert-text'>${p.renderToStaticMarkup(i)}</div>
+            <div class='aio-popup-alert-text'>${c.renderToStaticMarkup(i)}</div>
             <div class='aio-popup-alert-subtext'>${r}</div>
           </div>
           <div class='aio-popup-alert-footer'>
-            <button class='aio-popup-alert-close ${c.id}'>${l}</button>
+            <button class='aio-popup-alert-close ${p.id}'>${l}</button>
           </div>
@@ -15,2 +15,2 @@ <div class='aio-popup-time'></div>
       </div>
-    `,close(){c.toggleClass(!1),setTimeout(()=>{"function"==typeof s&&s(),!1!==s&&_("."+c.id).remove()},200)},getIcon:()=>!1===e?"":e||({error:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"></path></svg>',warning:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M12,2L1,21H23M12,6L19.53,19H4.47M11,10V14H13V10M11,16V18H13V16"></path></svg>',info:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z"></path></svg>',success:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z"></path></svg>'})[o]||"",startTimer(){setTimeout(()=>{if(c.time>=100){c.time=100,c.close();return}c.time+=2,c.updateBarRender(),c.startTimer()},a/50*1e3)},toggleClass(t){let e=_(`.${c.id}`);t?setTimeout(()=>e.removeClass("not-mounted"),0):e.addClass("not-mounted")},render(){_("body").append(c.getRender()),_("button."+c.id).off("click",c.close),_("button."+c.id).on("click",c.close),c.toggleClass(!0)}};c.id=c.getId(),c.render(),a&&c.startTimer()}class Snackebar extends e{constructor(t){super(t),this.state={items:[]},t.getActions({add:this.add.bind(this)})}add(t){let{items:e}=this.state,o=[...e,{...t,id:"a"+Math.round(1e9*Math.random())}];this.setState({items:o})}remove(t,e){if(!1===e)return;let{items:o}=this.state,i=o.filter((e,o)=>e.id!==t);this.setState({items:i}),"function"==typeof e&&e()}render(){let{items:t}=this.state,{rtl:e}=this.props;return h($,{children:t.map((t,o)=>g(SnackebarItem,{rtl:e,item:t,index:o,onRemove:e=>this.remove(e,t.onClose),key:t.id}))})}}function SnackebarItem(t){var e;let{item:o,onRemove:a,index:n,rtl:l}=t,{time:d=8,id:s,text:p,type:c,subtext:u,action:m,onClose:$,verticalAlign:g="end",horizontalAlign:v="center",icon:b,attrs:y={}}=o;"start"!==g&&"end"!==g&&(g="end",console.error('aio-popup error => snackebar item .verticalAlign should be "start" or "end"')),"start"!==v&&"end"!==v&&"center"!==v&&(v="center",console.error('aio-popup error => snackebar item .horizontalAlign should be "start" or "end" or "center"'));let[k,C]=r(!1);function M(){C(!1),setTimeout(()=>{a(s)},200)}i(()=>{setTimeout(()=>C(!0),0),setTimeout(()=>M(),1e3*d)},[]);let w,L,x,P;return w="aio-popup-snackebar-item-container",w+=` aio-popup-snackebar-item-container-horizontal-align-${v}`,k&&(w+=" mounted"),l&&(w+=" rtl"),L=function t(e){let o=_(".aio-popup-snackebar-item-container"),i={start:12,end:12};for(let r=0;r<e;r++){let a=o.eq(r),n=a.height()+6,l=a.attr("data-vertical-align");i[l]+=n}return{["start"===g?"top":"bottom"]:i[g]}}(n),x={"data-vertical-align":g,className:w,style:L,onClick:!1===$?void 0:()=>M()},h("div",{...x,children:(P="aio-popup-snackebar-item",P+=` aio-popup-snackebar-item-${c}`,y.className&&(P+=` ${y.className}`),f("div",{...{...y,className:P,style:y.style},children:[h("div",{className:"aio-popup-snackebar-item-icon",children:b||("error"===(e=c)||"warning"===e||"info"===e?h("svg",{viewBox:"0 0 24 24",role:"presentation",style:{width:"1.2rem",height:"1.2rem"},children:h("path",{d:"M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z",style:{fill:"currentcolor"}})}):h("svg",{viewBox:"0 0 24 24",role:"presentation",style:{width:"1.2rem",height:"1.2rem"},children:h("path",{d:"M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z",style:{fill:"currentcolor"}})}))})," ",f("div",{className:"aio-popup-snackebar-item-text",children:[h("div",{className:"aio-popup-snackebar-item-uptext",children:p}),!!u&&h("div",{className:"aio-popup-snackebar-item-subtext",children:u})]})," ",m&&m.text?h("button",{className:"aio-popup-snackebar-item-action",onClick(t){t.stopPropagation(),m.onClick(),M()},children:m.text}):null," ",h("div",{className:"aio-popup-snackebar-bar",style:{transition:`${d}s linear`}}),"  "]}))})}function Align(t){let{dom:e,target:o,fitHorizontal:i,fixStyle:r=t=>t,attrs:a={},fitTo:n,pageSelector:l,rtl:d,limitTo:s}=t,p={getDomLimit(t,e){if(n&&"popover"===e){let o=t.parents(n);if(o.length){let{left:i,top:r}=o.offset(),a=o.width(),d=o.height();return{left:i,top:r,right:i+a,bottom:r+d,width:a,height:d}}}let s=t.offset(),p=s.left-window.pageXOffset,c=s.top-window.pageYOffset;if(l&&"page"!==e){let u=_(l);try{let{left:m,top:h}=u.offset()||{left:0,top:0};p-=m,c-=h}catch{}}let $=t.outerWidth(),f=t.outerHeight(),g=p+$,v=c+f;return{left:p,top:c,right:g,bottom:v,width:$,height:f}},getPageLimit(){let t=l?_(l):void 0;t=Array.isArray(t)&&0===t.length?void 0:t;let e=window.innerWidth,o=window.innerHeight,i=t?p.getDomLimit(t,"page"):{left:0,top:0,right:e,bottom:o};return i.left<0&&(i.left=0),i.right>e&&(i.right=e),i.top<0&&(i.top=0),i.bottom>o&&(i.bottom=o),i},getRelatedToLmit(){if(!s)return;let t=e.parents(s);if(!t.length)return;let o=t.offset(),i=o.left-window.pageXOffset,r=o.top-window.pageYOffset,a=t.outerWidth(),n=t.outerHeight();return{left:i,top:r,right:i+a,bottom:r+n,width:a,height:n}},align(){let t=p.getPageLimit(),l=p.getDomLimit(o,"target"),s=p.getDomLimit(e,"popover"),c;if(!n){if(s.top=l.bottom,s.bottom=s.top+s.height,i)s.width=l.width,s.left=l.left,s.right=l.left+l.width;else{let u=p.getRelatedToLmit()||t;d?(s.right=l.right,s.left=s.right-s.width,s.left<u.left&&(s.left=u.left)):(s.left=l.left,s.right=s.left+s.width,s.right>u.right&&(s.left=u.right-s.width))}s.bottom>t.bottom?s.height>l.top-t.top?s.top=t.bottom-s.height:s.top=l.top-s.height:s.top=l.bottom,s.height>t.bottom-t.top&&(s.top=6,s.bottom=void 0,s.height=t.bottom-t.top-12,c="auto")}let _;return r({left:s.left,top:s.top,width:s.width,height:n?s.height:void 0,overflowY:c,...a.style},{targetLimit:l,pageLimit:t})}};return p.align()}
+    `,close(){p.toggleClass(!1),setTimeout(()=>{"function"==typeof s&&s(),!1!==s&&m("."+p.id).remove()},200)},getIcon:()=>!1===e?"":e||({error:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z"></path></svg>',warning:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M12,2L1,21H23M12,6L19.53,19H4.47M11,10V14H13V10M11,16V18H13V16"></path></svg>',info:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z"></path></svg>',success:'<svg viewBox="0 0 24 24" role="presentation" style="width: 4.5rem; height: 4.5rem;"><path d="M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z"></path></svg>'})[o]||"",startTimer(){setTimeout(()=>{if(p.time>=100){p.time=100,p.close();return}p.time+=2,p.updateBarRender(),p.startTimer()},a/50*1e3)},toggleClass(t){let e=m(`.${p.id}`);t?setTimeout(()=>e.removeClass("not-mounted"),0):e.addClass("not-mounted")},render(){m("body").append(p.getRender()),m("button."+p.id).off("click",p.close),m("button."+p.id).on("click",p.close),p.toggleClass(!0)}};p.id=p.getId(),p.render(),a&&p.startTimer()}class Snackebar extends e{constructor(t){super(t),this.state={items:[]},t.getActions({add:this.add.bind(this)})}add(t){let{items:e}=this.state,o=[...e,{...t,id:"a"+Math.round(1e9*Math.random())}];this.setState({items:o})}remove(t,e){if(!1===e)return;let{items:o}=this.state,i=o.filter((e,o)=>e.id!==t);this.setState({items:i}),"function"==typeof e&&e()}render(){let{items:t}=this.state,{rtl:e}=this.props;return $(f,{children:t.map((t,o)=>p(SnackebarItem,{rtl:e,item:t,index:o,onRemove:e=>this.remove(e,t.onClose),key:t.id}))})}}function SnackebarItem(t){var e;let{item:o,onRemove:a,index:n,rtl:l}=t,{time:d=8,id:s,text:p,type:c,subtext:u,action:_,onClose:h,verticalAlign:f="end",horizontalAlign:v="center",icon:b,attrs:y={}}=o;"start"!==f&&"end"!==f&&(f="end",console.error('aio-popup error => snackebar item .verticalAlign should be "start" or "end"')),"start"!==v&&"end"!==v&&"center"!==v&&(v="center",console.error('aio-popup error => snackebar item .horizontalAlign should be "start" or "end" or "center"'));let[k,C]=r(!1);function M(){C(!1),setTimeout(()=>{a(s)},200)}i(()=>{setTimeout(()=>C(!0),0),setTimeout(()=>M(),1e3*d)},[]);let w,L,P,x;return w="aio-popup-snackebar-item-container",w+=` aio-popup-snackebar-item-container-horizontal-align-${v}`,k&&(w+=" mounted"),l&&(w+=" rtl"),L=function t(e){let o=m(".aio-popup-snackebar-item-container"),i={start:12,end:12};for(let r=0;r<e;r++){let a=o.eq(r),n=a.height()+6,l=a.attr("data-vertical-align");i[l]+=n}return{["start"===f?"top":"bottom"]:i[f]}}(n),P={"data-vertical-align":f,className:w,style:L,onClick:!1===h?void 0:()=>M()},$("div",{...P,children:(x="aio-popup-snackebar-item",x+=` aio-popup-snackebar-item-${c}`,y.className&&(x+=` ${y.className}`),g("div",{...{...y,className:x,style:y.style},children:[$("div",{className:"aio-popup-snackebar-item-icon",children:b||("error"===(e=c)||"warning"===e||"info"===e?$("svg",{viewBox:"0 0 24 24",role:"presentation",style:{width:"1.2rem",height:"1.2rem"},children:$("path",{d:"M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z",style:{fill:"currentcolor"}})}):$("svg",{viewBox:"0 0 24 24",role:"presentation",style:{width:"1.2rem",height:"1.2rem"},children:$("path",{d:"M12 2C6.5 2 2 6.5 2 12S6.5 22 12 22 22 17.5 22 12 17.5 2 12 2M12 20C7.59 20 4 16.41 4 12S7.59 4 12 4 20 7.59 20 12 16.41 20 12 20M16.59 7.58L10 14.17L7.41 11.59L6 13L10 17L18 9L16.59 7.58Z",style:{fill:"currentcolor"}})}))})," ",g("div",{className:"aio-popup-snackebar-item-text",children:[$("div",{className:"aio-popup-snackebar-item-uptext",children:p}),!!u&&$("div",{className:"aio-popup-snackebar-item-subtext",children:u})]})," ",_&&_.text?$("button",{className:"aio-popup-snackebar-item-action",onClick(t){t.stopPropagation(),_.onClick(),M()},children:_.text}):null," ",$("div",{className:"aio-popup-snackebar-bar",style:{transition:`${d}s linear`}}),"  "]}))})}function Align(t){let{dom:e,target:o,fitHorizontal:i,fixStyle:r=t=>t,attrs:a={},fitTo:n,pageSelector:l,rtl:d,limitTo:s}=t,p={getDomLimit(t,e){if(n&&"popover"===e){let o=t.parents(n);if(o.length){let{left:i,top:r}=o.offset(),a=o.width(),d=o.height();return{left:i,top:r,right:i+a,bottom:r+d,width:a,height:d}}}let s=t.offset(),p=s.left-window.pageXOffset,c=s.top-window.pageYOffset;if(l&&"page"!==e){let u=m(l);try{let{left:_,top:h}=u.offset()||{left:0,top:0};p-=_,c-=h}catch{}}let $=t.outerWidth(),f=t.outerHeight(),g=p+$,v=c+f;return{left:p,top:c,right:g,bottom:v,width:$,height:f}},getPageLimit(){let t=l?m(l):void 0;t=Array.isArray(t)&&0===t.length?void 0:t;let e=window.innerWidth,o=window.innerHeight,i=t?p.getDomLimit(t,"page"):{left:0,top:0,right:e,bottom:o};return i.left<0&&(i.left=0),i.right>e&&(i.right=e),i.top<0&&(i.top=0),i.bottom>o&&(i.bottom=o),i},getRelatedToLmit(){if(!s)return;let t=e.parents(s);if(!t.length)return;let o=t.offset(),i=o.left-window.pageXOffset,r=o.top-window.pageYOffset,a=t.outerWidth(),n=t.outerHeight();return{left:i,top:r,right:i+a,bottom:r+n,width:a,height:n}},align(){let t=p.getPageLimit(),l=p.getDomLimit(o,"target"),s=p.getDomLimit(e,"popover"),c;if(!n){if(s.top=l.bottom,s.bottom=s.top+s.height,i)s.width=l.width,s.left=l.left,s.right=l.left+l.width;else{let u=p.getRelatedToLmit()||t;d?(s.right=l.right,s.left=s.right-s.width,s.left<u.left&&(s.left=u.left)):(s.left=l.left,s.right=s.left+s.width,s.right>u.right&&(s.left=u.right-s.width))}s.bottom>t.bottom?s.height>l.top-t.top?s.top=t.bottom-s.height:s.top=l.top-s.height:s.top=l.bottom,s.height>t.bottom-t.top&&(s.top=6,s.bottom=void 0,s.height=t.bottom-t.top-12,c="auto")}let _;return r({left:s.left,top:s.top,width:s.width,height:n?s.height:void 0,overflowY:c,...a.style},{targetLimit:l,pageLimit:t})}};return p.align()}

package.json

 {
   "name": "aio-popup",
-  "version": "4.0.1",
+  "version": "4.1.0",
   "description": "handle all types of popup and modals in react",
@@ -5,0 +5,0 @@ "main": "index.js",

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

Lines of code

603

increased by0.84%

Worsened metrics

Total package byte prevSize

30068

decreased by-0.14%

No dependency changes