UNPKG

streamlit-react-modal

Version:

[![NPM version][npm-image]][npm-url] [![Build][github-build]][github-build-url] ![npm-typescript] [![License][github-license]][github-license-url]

59 lines 3.01 kB
"use strict"; exports.__esModule = true; exports.addCSS = exports.createModal = exports.getWindowHeight = exports.getWindow = exports.isInIframe = void 0; var isInIframe = function () { return window.location !== window.parent.location; }; exports.isInIframe = isInIframe; var getWindow = function () { try { if ((0, exports.isInIframe)()) { try { if (window.parent.document) { return window.parent; } return window; } catch (_a) { return window; } } else { return window; } } catch (_b) { return window; } }; exports.getWindow = getWindow; var getWindowHeight = function () { try { var cWindow = (0, exports.getWindow)(); return cWindow.innerHeight; } catch (_a) { return 600; } }; exports.getWindowHeight = getWindowHeight; var createModal = function () { try { var cWindow = (0, exports.getWindow)(); var divEl = cWindow.document.createElement('div'); divEl.setAttribute('id', 'streamlit-react-modal-div'); cWindow.document.body.append(divEl); return cWindow.document.getElementById('streamlit-react-modal-div'); } catch (_a) { console.log('Error in creating modal on dom'); return null; } }; exports.createModal = createModal; var addCSS = function () { var cWindow = (0, exports.getWindow)(); cWindow.document.body.insertAdjacentHTML('afterbegin', "\n <style>\n #streamlit-react-modal-container {\n display: none;\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 1;\n background-color: rgba(0, 0, 0, 0.2);\n }\n \n #streamlit-react-modal {\n background-color: white;\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n width: auto;\n height: auto;\n padding: 10px 20px;\n border-radius: 5px;\n font-size: 1.5rem;\n display: flex;\n justify-content: space-between;\n animation: animatemodal 0.4s;\n flex-direction: column;\n align-items: flex-start;\n }\n \n @keyframes animatemodal {\n 0% {\n top: -300px;\n opacity: 0;\n }\n \n 100% {\n top: -50%;\n opacity: 1;\n }\n }\n </style>\n "); }; exports.addCSS = addCSS; //# sourceMappingURL=common.js.map