Initial commit

src/components/table/menu.js

@@ -0,0 +1,106 @@
+/* default menu */
+
+import React from 'react';
+import { withStyles } from '@material-ui/core/styles';
+
+import Menu from '@material-ui/core/Menu';
+import MenuItem from '@material-ui/core/MenuItem';
+import ListItemIcon from '@material-ui/core/ListItemIcon';
+
+import MenuList from '@material-ui/core/MenuList';
+import { green } from '@material-ui/core/colors';
+import { red } from '@material-ui/core/colors';
+import { blue } from '@material-ui/core/colors';
+
+import AddCircleIcon from '@material-ui/icons/AddCircle';
+import DeleteForeverIcon from '@material-ui/icons/DeleteForever';
+import EditIcon from '@material-ui/icons/Edit';
+import SearchIcon from '@material-ui/icons/Search';
+import Typography from '@material-ui/core/Typography';
+
+const StyledMenu = withStyles({
+  paper: {
+    border: '1px solid #d3d4d5',
+  },
+})((props) => (
+  <Menu
+    elevation={0}
+    getContentAnchorEl={null}
+    anchorOrigin={{
+      vertical: 'bottom',
+      horizontal: 'center',
+    }}
+    transformOrigin={{
+      vertical: 'top',
+      horizontal: 'center',
+    }}
+    {...props}
+  />
+));
+
+/*
+const StyledMenuItem = withStyles((theme) => ({
+  root: {
+    '&:focus': {
+      backgroundColor: theme.palette.primary.main,
+      '& .MuiListItemIcon-root, & .MuiListItemText-primary': {
+        color: theme.palette.common.white,
+      },
+    },
+  },
+}))(MenuItem);
+*/
+
+export default function CustomizedMenus(props) {
+  const [anchorEl, setAnchorEl] = React.useState(props.anchorref);
+
+  const handleClick = (event, menu) => {
+    setAnchorEl(event.currentTarget);
+    props.menuClicked(menu);
+  };
+
+  const handleClose = () => {
+    setAnchorEl(null);
+    props.menuClosed();
+  };
+
+  return (
+    <div>
+
+      <StyledMenu
+        id="customized-menu"
+        anchorEl={anchorEl}
+        keepMounted
+        open={Boolean(anchorEl)}
+        onClose={handleClose}
+      >
+        <MenuList open={Boolean(anchorEl)} id="menu-list-grow" >
+          <MenuItem onClick={(event)=>handleClick(event, "add")}>
+            <ListItemIcon>
+              <AddCircleIcon style={{ color: green[500] }} fontSize="small" />
+            </ListItemIcon>
+            <Typography variant="inherit">pridať</Typography>
+          </MenuItem>
+          <MenuItem onClick={(event)=>handleClick(event, "edit")}>
+            <ListItemIcon>
+              <EditIcon style={{ color: blue[300] }} fontSize="small" />
+            </ListItemIcon>
+            <Typography variant="inherit">editovať</Typography>
+          </MenuItem>
+          <MenuItem onClick={(event)=>handleClick(event, "delete")}>
+            <ListItemIcon>
+              <DeleteForeverIcon style={{ color: red[500] }} fontSize="small" />
+            </ListItemIcon>
+            <Typography variant="inherit">zmazať</Typography>
+          </MenuItem>
+          <MenuItem onClick={(event)=>handleClick(event, "find")}>
+            <ListItemIcon>
+              <SearchIcon style={{ color: blue[200] }} fontSize="default" />
+            </ListItemIcon>
+            <Typography variant="inherit">hľadať</Typography>
+          </MenuItem>
+        </MenuList>
+      </StyledMenu>
+    </div>
+  );
+}