modal-sk-01
Advanced tools
Comparing version 1.0.2 to 1.0.3
@@ -1,1 +0,71 @@ | ||
"use strict";const e={position:"fixed",top:0,right:0,bottom:0,left:0,width:"100%",height:"100%",overflow:"auto",zIndex:1e3,padding:"20px",boxSizing:"border-box",backgroundColor:"rgba(0,0,0,0.75)",textAlign:"center"},t={position:"fixed",top:"50%",left:"50%",transform:"translate(-50%,-50%)",backgroundColor:"#FFF",padding:"50px",zIndex:1e3},r={position:"absolute",top:"-12.5px",right:"-12.5px",display:"block",width:"30px",height:"30px",textIndent:"-9999px",cursor:"pointer",border:"none",background:"none",backgroundSize:"contain",backgroundRepeat:"no-repeat",backgroundPosition:"center center",backgroundImage:"url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==)"};exports.Modal=function({open:a,children:o,onClose:n,overlayClassName:l,modalClassName:i,crossClassName:p}){return a?React.createElement(React.Fragment,null,React.createElement("div",{style:e,className:l,onClick:()=>{n()}},React.createElement("div",{style:t,className:i,onClick:e=>{e.stopPropagation()}},React.createElement("button",{style:r,onClick:n,className:p},"Close Modal"),o))):null}; | ||
'use strict'; | ||
const OVERLAY = { | ||
position: 'fixed', | ||
top: 0, | ||
right: 0, | ||
bottom: 0, | ||
left: 0, | ||
width: '100%', | ||
height: '100%', | ||
overflow: 'auto', | ||
zIndex: 1000, | ||
padding: '20px', | ||
boxSizing: 'border-box', | ||
backgroundColor: 'rgba(0,0,0,0.75)', | ||
textAlign: 'center' | ||
}; | ||
const MODALSTYLE = { | ||
position: 'fixed', | ||
top: '50%', | ||
left: '50%', | ||
transform: 'translate(-50%,-50%)', | ||
backgroundColor: '#FFF', | ||
padding: '50px', | ||
zIndex: 1000 | ||
}; | ||
const CROSS = { | ||
position: 'absolute', | ||
top: '-12.5px', | ||
right: '-12.5px', | ||
display: 'block', | ||
width: '30px', | ||
height: '30px', | ||
textIndent: '-9999px', | ||
cursor: 'pointer', | ||
border: 'none', | ||
background: 'none', | ||
backgroundSize: 'contain', | ||
backgroundRepeat: 'no-repeat', | ||
backgroundPosition: 'center center', | ||
backgroundImage: 'url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==)' | ||
}; | ||
function Modal({ | ||
open, | ||
children, | ||
onClose, | ||
overlayClassName, | ||
modalClassName, | ||
crossClassName | ||
}) { | ||
if (!open) return null; | ||
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", { | ||
style: OVERLAY, | ||
className: overlayClassName, | ||
onClick: () => { | ||
onClose(); | ||
} | ||
}, /*#__PURE__*/React.createElement("div", { | ||
style: MODALSTYLE, | ||
className: modalClassName, | ||
onClick: e => { | ||
e.stopPropagation(); | ||
} | ||
}, /*#__PURE__*/React.createElement("button", { | ||
style: CROSS, | ||
onClick: onClose, | ||
className: crossClassName | ||
}, "Close Modal"), children))); | ||
} | ||
exports.Modal = Modal; |
{ | ||
"name": "modal-sk-01", | ||
"version": "1.0.2", | ||
"version": "1.0.3", | ||
"description": "A simple react component that show a modal", | ||
@@ -5,0 +5,0 @@ "main": "dist/index.js", |
Sorry, the diff of this file is not supported yet
10480
197