@datalayer/core
Version:
[](https://datalayer.io)
52 lines (51 loc) • 1.66 kB
JavaScript
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
/*
* Copyright (c) 2023-2025 Datalayer, Inc.
* Distributed under the terms of the Modified BSD License.
*/
import { createContext, useState, useContext } from 'react';
import styled from 'styled-components';
const JupyterLabBackdropComponent = styled.div `
position: fixed;
display: flex;
justify-content: center;
align-items: center;
background-color: rgba(0, 0, 0, 0.3);
height: 100vh;
width: 100vw;
right: 0;
top: 0;
z-index: 1000000000;
`;
function JupyterLabBackdrop({ open, element }) {
return open ? (_jsx(JupyterLabBackdropComponent, { children: element })) : (_jsx(_Fragment, {}));
}
export default JupyterLabBackdrop;
const JupyterLabBackdropContext = createContext({
openBackdrop: (element) => {
/* no-op */
},
closeBackdrop: () => {
/* no-op */
},
});
const JupyterLabBackdropProvider = ({ children, }) => {
const [opened, setOpened] = useState(false);
const [element, setElement] = useState();
const openBackdrop = (element) => {
setElement(element);
setOpened(true);
};
const closeBackdrop = () => {
setElement(undefined);
setOpened(false);
};
return (_jsxs(JupyterLabBackdropContext.Provider, { value: {
openBackdrop: openBackdrop,
closeBackdrop: closeBackdrop,
}, children: [_jsx(JupyterLabBackdrop, { open: opened, element: element }), children] }));
};
function useJupyterLabBackdrop() {
return useContext(JupyterLabBackdropContext);
}
export { useJupyterLabBackdrop, JupyterLabBackdropProvider };