hst-custom-modal-component/dist/index.js

A customizable modal component for React apps

"use strict";var n=Object.defineProperty;var k=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames,m=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,N=Object.prototype.propertyIsEnumerable;var u=(o,e,t)=>e in o?n(o,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):o[e]=t,p=(o,e)=>{for(var t in e||(e={}))f.call(e,t)&&u(o,t,e[t]);if(m)for(var t of m(e))N.call(e,t)&&u(o,t,e[t]);return o};var E=(o,e)=>{for(var t in e)n(o,t,{get:e[t],enumerable:!0})},M=(o,e,t,r)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of h(e))!f.call(o,a)&&a!==t&&n(o,a,{get:()=>e[a],enumerable:!(r=k(e,a))||r.enumerable});return o};var w=o=>M(n({},"__esModule",{value:!0}),o);var P={};E(P,{CustomModal:()=>g});module.exports=w(P);var i=require("react");var s=require("react/jsx-runtime"),g=({isOpen:o,onClose:e,title:t,children:r,footer:a,className:v="",backdropClassName:x="",style:b={},closeOnOutsideClick:y=!0,closeOnEscape:c=!0})=>{let l=(0,i.useRef)(null);(0,i.useEffect)(()=>{let d=R=>{R.key==="Escape"&&c&&e()};return o&&document.addEventListener("keydown",d),()=>{document.removeEventListener("keydown",d)}},[o,c,e]);let C=d=>{y&&l.current&&!l.current.contains(d.target)&&e()};return o?(0,s.jsx)("div",{className:`custom-modal-backdrop ${x}`,onClick:C,style:{position:"fixed",inset:0,backgroundColor:"rgba(0, 0, 0, 0.6)",display:"flex",alignItems:"center",justifyContent:"center",zIndex:9999,padding:"1rem",boxSizing:"border-box"},children:(0,s.jsxs)("div",{ref:l,className:`custom-modal-content ${v}`,style:p({background:"#ffffff",padding:"2rem",borderRadius:"12px",width:"100%",maxWidth:"600px",maxHeight:"90vh",overflowY:"auto",boxShadow:"0 8px 20px rgba(0,0,0,0.15)"},b),onClick:d=>d.stopPropagation(),children:[t&&(0,s.jsx)("h2",{className:"custom-modal-title",style:{fontSize:"1.5rem",fontWeight:600,marginBottom:"1.5rem"},children:t}),(0,s.jsx)("div",{className:"custom-modal-body",style:{marginBottom:a?"2rem":"0"},children:r}),a&&(0,s.jsx)("div",{className:"custom-modal-footer",style:{display:"flex",justifyContent:"flex-end",gap:"1rem"},children:a})]})}):null};0&&(module.exports={CustomModal});
//# sourceMappingURL=index.js.map