Proyectos de Subversion LeadersLinked - SPA

import React, { useState } from 'react';

import { Menu, MenuItem, IconButton } from '@mui/material';

import MoreVert from '@mui/icons-material/MoreVert';

import colors from '@styles/config/colors';

const Options = ({ children }) => {

  const [anchorEl, setAnchorEl] = useState(null);

  const open = Boolean(anchorEl);

  const handleClick = (event) => setAnchorEl(event.currentTarget);

  const handleClose = () => setAnchorEl(null);

  return (

    <>

      <IconButton

        onClick={handleClick}

        aria-controls={open ? 'account-menu' : ''}

        aria-expanded={open ? 'true' : ''}

        aria-haspopup='true'

      >

        <MoreVert />

      </IconButton>

      <Menu

        id='account-menu'

        anchorEl={anchorEl}

        open={open}

        onClose={handleClose}

        onClick={handleClose}

        transformOrigin={{ horizontal: 'right', vertical: 'top' }}

        anchorOrigin={{ horizontal: 'right', vertical: 'bottom' }}

        sx={{

          '& .MuiPaper-root': {

            boxShadow: 'none',

            border: `1px solid ${colors.border.primary}`

          }

        }}

      >

        {children}

      </Menu>

    </>

  );

};

function OptionItem({ children, ...props }) {

  return <MenuItem {...props}>{children}</MenuItem>;

}

Options.Item = OptionItem;

export default Options;