import{_ as __rest,a as __assign}from"./tslib.es6-bjGg6Bxl.js";import React__default,{useState,useEffect,useRef,useId}from"react";import{createPortal}from"react-dom";import{F as FocusTrap}from"./focus-trap-react-QYyPJKV2.js";import{M as ModalFooter}from"./ModalFooter.component-vqu5JEqH.js";import{I as Icon}from"./Icon.component-7-ap-6Ys.js";import{u as usePortalRef}from"./PortalProvider.component-wrnUBpcW.js";import"./_commonjsHelpers-BxGi5vpY.js";import"prop-types";import"./Button.component-Ck0-XKMD.js";import"./Spinner.component-B_OKKh5D.js";import"./ButtonRow.component-CgfANnke.js";import"./Stack.component-BNRLhyTo.js";import"./widgets-njngpHa5.js";var modalcontainerstyles="\n\tjn-fixed\n\tjn-inset-0\n\tjn-flex\n\tjn-items-center\n\tjn-bg-theme-modal-backdrop\n\tjn-backdrop-blur-[2px]\n\tjn-z-[9990]\n",modalstyles="\n\tjn-bg-theme-background-lvl-0\n\tjn-relative\n\tjn-rounded\n\tjn-m-auto\n\tjn-overflow-y-auto\n\tjn-max-h-[90%]\n",headerstyles="\n\tjn-flex\n\tjn-py-2\n\tjn-px-8\n\tjn-border-b\n\tjn-border-theme-background-lvl-4\n\tjn-h-[2.8125rem]\n",titlestyles="\n\tjn-text-xl\n\tjn-font-bold\n",contentstyles="\n\tjn-min-h-[5rem]\n",contentpaddingstyles="\n\tjn-py-4\n\tjn-px-8\n",sizeClass=function(a){return"large"===a?"jn-w-[40rem]":"jn-w-[33.625rem]"},Modal=function(a){var b=a.ariaLabel,c=a.cancelButtonIcon,d=void 0===c?null:c,e=a.cancelButtonLabel,f=void 0===e?"":e,g=a.confirmButtonIcon,h=void 0===g?null:g,i=a.confirmButtonLabel,j=void 0===i?"":i,k=a.children,l=void 0===k?null:k,m=a.closeable,n=!(void 0!==m)||m,o=a.closeOnBackdropClick,p=void 0!==o&&o,q=a.closeOnEsc,r=!(void 0!==q)||q,s=a.heading,t=void 0===s?"":s,u=a.initialFocus,v=a.modalFooter,w=void 0===v?null:v,x=a.onConfirm,y=a.onCancel,z=a.open,A=void 0!==z&&z,B=a.size,C=void 0===B?"small":B,D=a.title,E=void 0===D?"":D,F=a.unpad,G=a.className,H=void 0===G?"":G,I=__rest(a,["ariaLabel","cancelButtonIcon","cancelButtonLabel","confirmButtonIcon","confirmButtonLabel","children","closeable","closeOnBackdropClick","closeOnEsc","heading","initialFocus","modalFooter","onConfirm","onCancel","open","size","title","unpad","className"]),J=useState(A),K=J[0],L=J[1],M=useState(n),N=M[0],O=M[1],P=useState(p),Q=P[0],R=P[1],S=useState(r),T=S[0],U=S[1];useEffect(function(){L(A)},[A]),useEffect(function(){O(n)},[n]),useEffect(function(){R(p)},[p]),useEffect(function(){U(r)},[r]);var V=function(a){L(!1),y&&y(a)},W=function(a){N&&T&&(L(!1),y&&y(a))},X=usePortalRef(),Y=useRef(null),Z=E||t,$=function(){return"juno-modal-"+useId()}();return React__default.createElement(React__default.Fragment,null,K&&createPortal(React__default.createElement("div",{className:"juno-modal-container ".concat(modalcontainerstyles),onClick:function(a){Q?(L(!1),y&&y(a)):a.stopPropagation()}},React__default.createElement(FocusTrap,{focusTrapOptions:{initialFocus:u,clickOutsideDeactivates:Q,fallbackFocus:function(){return Y.current},allowOutsideClick:!0,escapeDeactivates:function(a){return W(a),!1}}},React__default.createElement("div",__assign({className:"juno-modal ".concat(sizeClass(C)," ").concat(modalstyles," ").concat(H),role:"dialog",ref:Y},I,{"aria-labelledby":Z&&Z.length?$:void 0,"aria-label":b}),React__default.createElement("div",{className:"juno-modal-header ".concat(headerstyles," ").concat(Z&&Z.length?"jn-justify-between":"jn-justify-end")},E||t?(React__default.createElement("h1",{className:"juno-modal-title ".concat(titlestyles),id:$},E||t)):"",N?React__default.createElement(Icon,{icon:"close",onClick:V}):""),React__default.createElement("div",{className:"juno-modal-content ".concat(contentstyles," ").concat(void 0!==F&&F?"":contentpaddingstyles)},l),N?w?w:(React__default.createElement(ModalFooter,{confirmButtonLabel:j,cancelButtonLabel:f,confirmButtonIcon:h,cancelButtonIcon:d,onConfirm:x?function(a){x&&x(a)}:null,onCancel:V})):null))),X?X:document.body))};export{Modal};