react-simple-hook-modal/dist/react-simple-hook-modal.cjs.production.min.js

A simple React modal with hook based API

"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var r,t=require("react"),n=e(t),a=e(require("react-dom")),s=require("react-spring"),o=n.createContext({});(r=exports.ModalTransition||(exports.ModalTransition={})).NONE="NONE",r.SCALE="SCALE",r.TOP_DOWN="TOP_DOWN",r.BOTTOM_UP="BOTTOM_UP";var i={NONE:{from:{transform:"scale(1)"},enter:{transform:"scale(1)"},leave:{transform:"scale(1)"}},SCALE:{from:{transform:"scale(0)",opacity:0},enter:{transform:"scale(1)",opacity:1},leave:{transform:"scale(0)",opacity:0},config:{tension:800,friction:25}},TOP_DOWN:{from:{transform:"translateY(-150%)"},enter:{transform:"translateY(0)"},leave:{transform:"translateY(-150%)"},config:{tension:500,friction:25}},BOTTOM_UP:{from:{transform:"translateY(150%)"},enter:{transform:"translateY(0)"},leave:{transform:"translateY(150%)"},config:{tension:500,friction:25}}},l=function(e){var r=e.children,t=e.footer,a=e.transition,o=e.onBackdropClick,l=e.transformDistance,m=e.modalClassName,c=function(e,r){return void 0===e&&(e=exports.ModalTransition.SCALE),s.useTransition(r,null,i[e])}(a,e.isOpen);return n.createElement(n.Fragment,null,c.map((function(e){return e.item&&n.createElement(s.animated.div,{key:e.key,style:e.props,className:"rsm-fixed rsm-inset-0 rsm-m-4 sm:rsm-m-8 rsm-flex rsm-justify-center rsm-items-center rsm-z-40",onClick:o},n.createElement("div",{className:"rsm-bg-white rsm-rounded-md rsm-overflow-auto rsm-max-h-full rsm-w-full md:rsm-w-10/12 xl:rsm-w-1/2 rsm-opactiy-100 rsm-shadow-lg rsm-z-50 rsm-border rsm-border-gray-200 rsm-flex rsm-flex-col "+(null!=m?m:""),style:{minHeight:"70%",transition:a===exports.ModalTransition.NONE?"":"transform ease-in-out .2s",transform:"translate("+l+"px, "+l+"px)",transformOrigin:"center"},onClick:function(e){return e.stopPropagation()}},n.createElement("div",{className:"rsm-flex-1 rsm-p-8"},r),t?n.createElement("div",{className:"rsm-bg-gray-200 rsm-p-4"},t):null))})))};exports.Modal=function(e){var r=t.useContext(o),s=r.addOrUpdate,i=r.remove,m=r.getStaggerPixels,c=e.id,u=e.isOpen,f="undefined"!=typeof window&&window.document&&window.document.createElement?document.getElementById("react-simple-modal-container"):null;return t.useEffect((function(){return u?s(c):i(c),function(){return i(c)}}),[c,u]),f?a.createPortal(n.createElement(l,Object.assign({transformDistance:m(c)},e)),f):null},exports.ModalProvider=function(e){var r=e.children,a=e.backdropClassName,s=t.useState([]),i=s[0],l=s[1],m=t.useCallback((function(e){l((function(r){return r.some((function(r){return r===e}))?r:[].concat(r,[e])}))}),[]),c=t.useCallback((function(e){l((function(r){return r.filter((function(r){return r!==e}))}))}),[]),u=i.length>0,f=t.useCallback((function(e){var r=i.findIndex((function(r){return r===e}));return 8*i.length-8*(r+1)}),[i]);return n.createElement(o.Provider,{value:{addOrUpdate:m,remove:c,getStaggerPixels:f}},r,u?n.createElement("div",{className:"rsm-fixed rsm-inset-0 rsm-opacity-50 rsm-z-40 rsm-bg-gray-700 "+a||""}):null,n.createElement("div",{id:"react-simple-modal-container"}))},exports.useModal=function(){var e=t.useState(!1),r=e[1];return{isModalOpen:e[0],openModal:t.useCallback((function(){return r(!0)}),[]),closeModal:t.useCallback((function(){return r(!1)}),[])}};
//# sourceMappingURL=react-simple-hook-modal.cjs.production.min.js.map