@remotion/studio
Version:
APIs for interacting with the Remotion Studio
38 lines (37 loc) • 1.36 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.default = MobilePanel;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_dom_1 = __importDefault(require("react-dom"));
const colors_1 = require("../helpers/colors");
const z_index_1 = require("../state/z-index");
const portals_1 = require("./Menu/portals");
const CancelButton_1 = require("./NewComposition/CancelButton");
const container = {
position: 'fixed',
top: 0,
left: 0,
width: '100%',
height: '100%',
padding: '0 0px 50px 0px',
background: colors_1.BACKGROUND,
};
const buttonContainer = {
height: '40px',
width: '100%',
alignItems: 'center',
display: 'flex',
justifyContent: 'flex-end',
};
const button = {
height: 20,
width: 20,
};
function MobilePanel({ children, onClose, }) {
const { currentZIndex } = (0, z_index_1.useZIndex)();
return react_dom_1.default.createPortal(jsx_runtime_1.jsxs("div", { style: container, children: [
jsx_runtime_1.jsx("div", { style: buttonContainer, children: jsx_runtime_1.jsx(CancelButton_1.CancelButton, { style: button, onPress: onClose }) }), children] }), (0, portals_1.getPortal)(currentZIndex));
}