import React__default, { useState, useCallback, useMemo } from 'react';
import { useUniqueId } from '../../utils/uniqueId.mjs';
import { FlexBox } from '../shared/components/FlexBox.mjs';
import { Typography } from './Typography.mjs';
import Menu from '../../../../../node_modules/@mui/material/Menu/Menu.mjs';
import styled from '../../../../../node_modules/@mui/material/styles/styled.mjs';
import IconButton from '../../../../../node_modules/@mui/material/IconButton/IconButton.mjs';
import MenuItem from '../../../../../node_modules/@mui/material/MenuItem/MenuItem.mjs';

const StyledMenuItem$1 = styled(MenuItem)(({ theme })=>({
        padding: theme.spacing(1),
        '& svg': {
            height: 16,
            width: 16
        }
    }));
const StyledIconButton = styled(IconButton)({
    padding: '3px'
});
const anchorOrigin$1 = {
    horizontal: 'center',
    vertical: 'bottom'
};
const transformOrigin$1 = {
    horizontal: 'right',
    vertical: 'top'
};
const ActionMenuItem = ({ children, onClick, onClose, color, icon, item, ...rest })=>{
    const handleClick = useCallback(()=>{
        onClick(item);
        onClose?.();
    }, [
        item,
        onClick,
        onClose
    ]);
    return /*#__PURE__*/ React__default.createElement(StyledMenuItem$1, {
        ...rest,
        disableRipple: true,
        onClick: handleClick
    }, /*#__PURE__*/ React__default.createElement(Typography, {
        variant: "body2",
        color: color
    }, /*#__PURE__*/ React__default.createElement(FlexBox, {
        alignItems: "center"
    }, icon, children)));
};
const IconButtonMenu = ({ actions, anchorEl: anchorElProp, closeOnClick = true, icon, item, idPrefix, menuAnchorOrigin = anchorOrigin$1, menuTransformOrigin = transformOrigin$1, onClose, onOpen })=>{
    const [anchorEl, setAnchorEl] = useState();
    const handleClose = useCallback(()=>{
        setAnchorEl(undefined);
        onClose?.();
    }, [
        onClose
    ]);
    const handleOpen = useCallback((e)=>{
        onOpen?.();
        setAnchorEl(anchorElProp ?? e.currentTarget);
    }, [
        anchorElProp,
        onOpen
    ]);
    const id = useUniqueId(idPrefix);
    const children = useMemo(()=>{
        return actions.map(({ key, label, onClick, icon, isDangerous, isVisible = true })=>{
            if (!isVisible || typeof isVisible === 'function' && !isVisible(item)) {
                return null;
            }
            return /*#__PURE__*/ React__default.createElement(ActionMenuItem, {
                key: key,
                item: item,
                onClick: onClick,
                onClose: closeOnClick ? handleClose : undefined,
                color: isDangerous ? 'error' : undefined,
                icon: icon
            }, label);
        });
    }, [
        actions,
        closeOnClick,
        handleClose,
        item
    ]);
    const isOpen = !!anchorEl;
    return /*#__PURE__*/ React__default.createElement(React__default.Fragment, null, /*#__PURE__*/ React__default.createElement(StyledIconButton, {
        disableTouchRipple: true,
        "aria-label": "actions",
        color: "inherit",
        onClick: handleOpen,
        "aria-controls": id,
        "aria-haspopup": true,
        size: "small"
    }, icon), /*#__PURE__*/ React__default.createElement(Menu, {
        id: id,
        open: isOpen,
        anchorEl: anchorEl,
        variant: "menu",
        anchorOrigin: menuAnchorOrigin,
        transformOrigin: menuTransformOrigin,
        onClose: handleClose
    }, children));
};

export { IconButtonMenu };
//# sourceMappingURL=IconButtonMenu.mjs.map
