retro-react
Version:
A React component library for building retro-style websites
2 lines (1 loc) • 1.37 kB
JavaScript
import{__rest as o}from"../../_virtual/_tslib.js";import{forwardRef as e,useEffect as l}from"react";import{jsxs as r,jsx as i}from"../../node_modules/@theme-ui/core/jsx-runtime/dist/theme-ui-core-jsx-runtime.esm.js";import{classNames as s}from"../../utils/classNames.js";import a from"../../constants/commonClassNames.js";import{Portal as d}from"../portal/Portal.js";import{Modal as t,ModalTitleBar as n,ModalContent as m,ModalBackdrop as c,ModalTitle as p,CloseButton as u}from"./Modal.styled.js";const v=e(((e,v)=>{var{id:j,className:h,children:b,open:f=!1,onClose:k,color:N="primary",backdrop:w=!0,title:x="Dialog",sx:y}=e,C=o(e,["id","className","children","open","onClose","color","backdrop","title","sx"]);return l((()=>{const o=o=>{"Escape"===o.key&&f&&(null==k||k(o))};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)}),[f,k]),r(d,{children:[w&&i(c,{$open:f,onClick:o=>null==k?void 0:k(o)},void 0),r(t,Object.assign({$color:N,$backdrop:w,$open:f,ref:v,id:j,sx:y,role:"dialog","aria-modal":"true",className:s("modal-root",h,a)},C,{children:[r(n,{children:[i(p,{children:x},void 0),i(u,{className:"modal-close-button",onClick:o=>null==k?void 0:k(o),"aria-label":"Close Modal"},void 0)]},void 0),i(m,Object.assign({className:"modal-content"},{children:b}),void 0)]}),void 0)]},void 0)}));v.displayName="Modal";export{v as Modal};