Ronit Panda
8639cb921e
* chore: removes replaces 'import type xxx from 'xxx'' with 'import { type xxx} from 'xxx'''
* chore: remove typed imports
* chore: remove typed imports
* chore: cleanup
---------
Co-authored-by: Lucas Bordeau <bordeau.lucas@gmail.com>
47 lines
1.1 KiB
TypeScript
47 lines
1.1 KiB
TypeScript
import styled from '@emotion/styled';
|
|
|
|
import { useSpreadsheetImportInternal } from '@/spreadsheet-import/hooks/useSpreadsheetImportInternal';
|
|
import { Modal } from '@/ui/modal/components/Modal';
|
|
import { MOBILE_VIEWPORT } from '@/ui/theme/constants/theme';
|
|
|
|
import { ModalCloseButton } from './ModalCloseButton';
|
|
|
|
const StyledModal = styled(Modal)`
|
|
height: 61%;
|
|
min-height: 600px;
|
|
min-width: 800px;
|
|
position: relative;
|
|
width: 63%;
|
|
@media (max-width: ${MOBILE_VIEWPORT}px) {
|
|
min-width: auto;
|
|
min-height: auto;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
`;
|
|
|
|
const StyledRtlLtr = styled.div`
|
|
display: flex;
|
|
flex: 1;
|
|
flex-direction: column;
|
|
`;
|
|
|
|
type Props = {
|
|
children: React.ReactNode;
|
|
isOpen: boolean;
|
|
onClose: () => void;
|
|
};
|
|
|
|
export const ModalWrapper = ({ children, isOpen, onClose }: Props) => {
|
|
const { rtl } = useSpreadsheetImportInternal();
|
|
|
|
return (
|
|
<StyledModal isOpen={isOpen} size="large">
|
|
<StyledRtlLtr dir={rtl ? 'rtl' : 'ltr'}>
|
|
<ModalCloseButton onClose={onClose} />
|
|
{children}
|
|
</StyledRtlLtr>
|
|
</StyledModal>
|
|
);
|
|
};
|