import { Drawer, Modal } from '@wix/design-system';
import React, { useState } from 'react';
import { useToolbarCollectionContext } from '../ToolbarCollectionContext';
import { ModalState } from '@wix/bex-core';
import { ImportButtonModalLayout } from './ImportButtonModalLayout';
import { observer } from 'mobx-react-lite';
import { useIsMobile } from '../../hooks/useIsMobile';
function _ImportModal(props) {
    const table = useToolbarCollectionContext();
    const [importModalState] = useState(() => (table.importState ??= new ModalState()));
    const isMobile = useIsMobile();
    const child = (React.createElement(ImportButtonModalLayout, { ...props, importModalState: importModalState }));
    if (isMobile) {
        return (React.createElement(Drawer, { dataHook: "import-modal", open: importModalState.isOpen, onClose: importModalState.close }, child));
    }
    return (React.createElement(Modal, { onRequestClose: importModalState.close, isOpen: importModalState.isOpen, dataHook: "import-modal" }, child));
}
export const ImportModal = observer(_ImportModal);
//# sourceMappingURL=ImportModal.js.map