import CheckIcon from '../../../../../node_modules/@mui/icons-material/esm/CheckRounded.mjs';
import FilterList from '../../../../../node_modules/@mui/icons-material/esm/FilterList.mjs';
import React__default, { useState, useMemo, useCallback } from 'react';
import { IconButtonMenu } from './IconButtonMenu.mjs';
import useTheme from '../../../../../node_modules/@mui/material/styles/useTheme.mjs';

const anchorOrigin = {
    horizontal: 'left',
    vertical: 'bottom'
};
const transformOrigin = {
    horizontal: 'left',
    vertical: 'top'
};
const FilterMenu = ({ anchorEl, items, onChange, value })=>{
    const theme = useTheme();
    const iconColor = value.size > 0 ? theme.styleConfig.colors.primary : theme.styleConfig.colors.secondary;
    const [pendingValue, setPendingValue] = useState(value);
    const actions = useMemo(()=>items.map((item)=>({
                key: item.value,
                label: item.label,
                onClick: ()=>{
                    const newValue = new Set(pendingValue);
                    if (pendingValue.has(item.value)) {
                        newValue.delete(item.value);
                    } else {
                        newValue.add(item.value);
                    }
                    setPendingValue(newValue);
                },
                icon: /*#__PURE__*/ React__default.createElement(CheckIcon, {
                    style: {
                        visibility: pendingValue.has(item.value) ? undefined : 'hidden'
                    }
                })
            })), [
        items,
        pendingValue
    ]);
    const handleOpen = useCallback(()=>{
        setPendingValue(value);
    }, [
        value
    ]);
    const handleClose = useCallback(()=>{
        onChange(pendingValue);
    }, [
        onChange,
        pendingValue
    ]);
    return /*#__PURE__*/ React__default.createElement(IconButtonMenu, {
        actions: actions,
        anchorEl: anchorEl,
        closeOnClick: false,
        icon: /*#__PURE__*/ React__default.createElement(FilterList, {
            htmlColor: iconColor
        }),
        item: undefined,
        idPrefix: "filter_column",
        menuAnchorOrigin: anchorOrigin,
        menuTransformOrigin: transformOrigin,
        onOpen: handleOpen,
        onClose: handleClose
    });
};

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