52 lines
1.3 KiB
JavaScript
52 lines
1.3 KiB
JavaScript
import PropTypes from 'prop-types';
|
|
import Paper from '@mui/material/Paper';
|
|
import MuiPopper from '@mui/material/Popper';
|
|
import Tab from '@mui/material/Tab';
|
|
import * as React from 'react';
|
|
import Suggestions from 'components/PowerInput/Suggestions';
|
|
import TabPanel from 'components/TabPanel';
|
|
import { Tabs } from './style';
|
|
|
|
const Popper = (props) => {
|
|
const { open, anchorEl, data, onSuggestionClick } = props;
|
|
|
|
return (
|
|
<MuiPopper
|
|
open={open}
|
|
anchorEl={anchorEl}
|
|
style={{ width: anchorEl?.clientWidth, zIndex: 1 }}
|
|
modifiers={[
|
|
{
|
|
name: 'flip',
|
|
enabled: false,
|
|
options: {
|
|
altBoundary: false,
|
|
},
|
|
},
|
|
]}
|
|
>
|
|
<Paper elevation={5} sx={{ width: '100%' }}>
|
|
<Tabs sx={{ mb: 2 }} value={0}>
|
|
<Tab label="Insert data..." />
|
|
</Tabs>
|
|
|
|
<TabPanel value={0} index={0}>
|
|
<Suggestions data={data} onSuggestionClick={onSuggestionClick} />
|
|
</TabPanel>
|
|
</Paper>
|
|
</MuiPopper>
|
|
);
|
|
};
|
|
|
|
Popper.propTypes = {
|
|
open: PropTypes.bool.isRequired,
|
|
anchorEl: PropTypes.oneOfType([
|
|
PropTypes.func,
|
|
PropTypes.shape({ current: PropTypes.instanceOf(Element) }),
|
|
]),
|
|
data: PropTypes.array.isRequired,
|
|
onSuggestionClick: PropTypes.func,
|
|
};
|
|
|
|
export default Popper;
|