react-responsive-modal/dist/react-responsive-modal.cjs.production.min.js

A simple responsive and accessible react modal

"use strict";function e(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var n=require("react"),t=e(n),o=e(require("react-dom")),r=e(require("classnames")),l=require("body-scroll-lock"),a=e(require("@bedrock-layout/use-forwarded-ref"));function i(){return(i=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}var u=function(e){var n=e.classNames,o=e.styles,l=e.closeIcon,a=e.onClick;return t.createElement("button",{id:e.id,className:r(e.classes.closeButton,null==n?void 0:n.closeButton),style:null==o?void 0:o.closeButton,onClick:a,"data-testid":"close-button"},l||t.createElement("svg",{className:null==n?void 0:n.closeIcon,style:null==o?void 0:o.closeIcon,width:28,height:28,viewBox:"0 0 36 36","data-testid":"close-icon"},t.createElement("path",{d:"M28.5 9.62L26.38 7.5 18 15.88 9.62 7.5 7.5 9.62 15.88 18 7.5 26.38l2.12 2.12L18 20.12l8.38 8.38 2.12-2.12L20.12 18z"})))},c="undefined"!=typeof window,d=["input","select","textarea","a[href]","button","[tabindex]","audio[controls]","video[controls]",'[contenteditable]:not([contenteditable="false"])'];function s(e){return null===e.offsetParent||"hidden"===getComputedStyle(e).visibility}function v(e){if("INPUT"!==e.tagName||"radio"!==e.type||!e.name)return!0;var n=(e.form||e.ownerDocument).querySelectorAll('input[type="radio"][name="'+e.name+'"]'),t=function(e,n){for(var t=0;t<e.length;t++)if(e[t].checked&&e[t].form===n)return e[t]}(n,e.form);return t===e||void 0===t&&n[0]===e}function m(e){for(var n=document.activeElement,t=e.querySelectorAll(d.join(",")),o=[],r=0;r<t.length;r++){var l=t[r];(n===l||!l.disabled&&f(l)>-1&&!s(l)&&v(l))&&o.push(l)}return o}function f(e){var n=parseInt(e.getAttribute("tabindex"),10);return isNaN(n)?function(e){return e.getAttribute("contentEditable")}(e)?0:e.tabIndex:n}var y=function(e){var t=e.container,o=e.initialFocusRef,r=n.useRef();return n.useEffect((function(){var e=function(e){(null==t?void 0:t.current)&&function(e,n){if(e&&"Tab"===e.key){if(!n||!n.contains)return process,!1;if(!n.contains(e.target))return!1;var t=m(n),o=t[0],r=t[t.length-1];e.shiftKey&&e.target===o?(r.focus(),e.preventDefault()):!e.shiftKey&&e.target===r&&(o.focus(),e.preventDefault())}}(e,t.current)};if(c&&document.addEventListener("keydown",e),c&&(null==t?void 0:t.current)){var n=function(){-1!==d.findIndex((function(e){var n;return null==(n=document.activeElement)?void 0:n.matches(e)}))&&(r.current=document.activeElement)};if(o)n(),requestAnimationFrame((function(){var e;null==(e=o.current)||e.focus()}));else{var l=m(t.current);l[0]&&(n(),l[0].focus())}}return function(){var n;c&&(document.removeEventListener("keydown",e),null==(n=r.current)||n.focus())}}),[t,o]),null},p=[],b={root:"react-responsive-modal-root",overlay:"react-responsive-modal-overlay",overlayAnimationIn:"react-responsive-modal-overlay-in",overlayAnimationOut:"react-responsive-modal-overlay-out",modalContainer:"react-responsive-modal-container",modalContainerCenter:"react-responsive-modal-containerCenter",modal:"react-responsive-modal-modal",modalAnimationIn:"react-responsive-modal-modal-in",modalAnimationOut:"react-responsive-modal-modal-out",closeButton:"react-responsive-modal-closeButton"},E=t.forwardRef((function(e,d){var s,v,m,f,E=e.open,h=e.center,C=e.blockScroll,I=void 0===C||C,A=e.closeOnEsc,g=void 0===A||A,k=e.closeOnOverlayClick,w=void 0===k||k,O=e.container,N=e.showCloseIcon,x=void 0===N||N,B=e.closeIconId,R=e.closeIcon,S=e.focusTrapped,q=void 0===S||S,L=e.initialFocusRef,D=void 0===L?void 0:L,j=e.animationDuration,M=void 0===j?300:j,P=e.classNames,F=e.styles,K=e.role,T=void 0===K?"dialog":K,G=e.ariaDescribedby,U=e.ariaLabelledby,_=e.containerId,z=e.modalId,H=e.onClose,J=e.onEscKeyDown,Q=e.onOverlayClick,V=e.onAnimationEnd,W=e.children,X=e.reserveScrollBarGap,Y=a(d),Z=n.useRef(null),$=n.useRef(null),ee=n.useRef(null);null===ee.current&&c&&(ee.current=document.createElement("div"));var ne=n.useState(!1),te=ne[0],oe=ne[1];!function(e,t){n.useEffect((function(){return t&&p.push(e),function(){var n;n=e,p=p.filter((function(e){return e!==n}))}}),[t,e])}(Z,E),function(e,t,o,r,a){var i=n.useRef(null);n.useEffect((function(){return t&&e.current&&r&&(i.current=e.current,l.disableBodyScroll(e.current,{reserveScrollBarGap:a})),function(){i.current&&(l.enableBodyScroll(i.current),i.current=null)}}),[t,o,e,r,a])}(Z,E,te,I,X);var re=function(e){27===e.keyCode&&p.length&&p[p.length-1]===Z&&(null==J||J(e),g&&H())};n.useEffect((function(){return function(){te&&(ee.current&&!O&&document.body.contains(ee.current)&&document.body.removeChild(ee.current),document.removeEventListener("keydown",re))}}),[te]),n.useEffect((function(){E&&!te&&(oe(!0),!ee.current||O||document.body.contains(ee.current)||document.body.appendChild(ee.current),document.addEventListener("keydown",re))}),[E]);var le=function(){$.current=!1},ae=O||ee.current,ie=E?null!=(s=null==P?void 0:P.overlayAnimationIn)?s:b.overlayAnimationIn:null!=(v=null==P?void 0:P.overlayAnimationOut)?v:b.overlayAnimationOut,ue=E?null!=(m=null==P?void 0:P.modalAnimationIn)?m:b.modalAnimationIn:null!=(f=null==P?void 0:P.modalAnimationOut)?f:b.modalAnimationOut;return te&&ae?o.createPortal(t.createElement("div",{className:r(b.root,null==P?void 0:P.root),style:null==F?void 0:F.root,"data-testid":"root"},t.createElement("div",{className:r(b.overlay,null==P?void 0:P.overlay),"data-testid":"overlay","aria-hidden":!0,style:i({animation:ie+" "+M+"ms"},null==F?void 0:F.overlay)}),t.createElement("div",{ref:Z,id:_,className:r(b.modalContainer,h&&b.modalContainerCenter,null==P?void 0:P.modalContainer),style:null==F?void 0:F.modalContainer,"data-testid":"modal-container",onClick:function(e){null===$.current&&($.current=!0),$.current?(null==Q||Q(e),w&&H(),$.current=null):$.current=null}},t.createElement("div",{ref:Y,className:r(b.modal,null==P?void 0:P.modal),style:i({animation:ue+" "+M+"ms"},null==F?void 0:F.modal),onMouseDown:le,onMouseUp:le,onClick:le,onAnimationEnd:function(){E||oe(!1),null==V||V()},id:z,role:T,"aria-modal":"true","aria-labelledby":U,"aria-describedby":G,"data-testid":"modal",tabIndex:-1},q&&t.createElement(y,{container:Y,initialFocusRef:D}),W,x&&t.createElement(u,{classes:b,classNames:P,styles:F,closeIcon:R,onClick:H,id:B})))),ae):null}));exports.Modal=E,exports.default=E;
//# sourceMappingURL=react-responsive-modal.cjs.production.min.js.map