terriajs/dist/ReactViews/ExplorerWindow/ExplorerWindow.js

Geospatial data visualization platform.

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { action } from "mobx";
import { observer } from "mobx-react";
import { useViewState } from "../Context";
import ModalPopup from "./ModalPopup";
import Tabs from "./Tabs";
import Text from "../../Styled/Text";
import Box from "../../Styled/Box";
import { useTheme } from "styled-components";
import { useTranslation } from "react-i18next";
export const ExplorerWindowElementName = "AddData";
export default observer(function ExplorerWindow() {
    const viewState = useViewState();
    const theme = useTheme();
    const onClose = action(() => {
        viewState.closeCatalog();
        viewState.switchMobileView("nowViewing");
    });
    const onStartAnimatingIn = action(() => {
        viewState.explorerPanelAnimating = true;
    });
    const onDoneAnimatingIn = action(() => {
        viewState.explorerPanelAnimating = false;
    });
    const isVisible = !viewState.useSmallScreenInterface &&
        !viewState.hideMapUi &&
        viewState.explorerPanelIsVisible;
    const { t } = useTranslation();
    return (_jsxs(ModalPopup, { viewState: viewState, isVisible: isVisible, isTopElement: viewState.topElement === ExplorerWindowElementName, onClose: onClose, onStartAnimatingIn: onStartAnimatingIn, onDoneAnimatingIn: onDoneAnimatingIn, children: [_jsx(Box, { css: `
          background: ${theme.dark};
          border-radius: ${theme.radiusXL} ${theme.radiusXL} 0 0;
        `, paddedRatio: 4, fullWidth: true, children: _jsx(Text, { extraExtraLarge: true, textLight: true, css: { fontWeight: 500 }, children: t("addData.dataCatalogue") }) }), _jsx(Tabs, { terria: viewState.terria, viewState: viewState })] }));
});
//# sourceMappingURL=ExplorerWindow.js.map