import { PopoverMenu, Button } from '@wix/design-system';
import React, { useMemo } from 'react';
import { ChevronDown } from '@wix/wix-ui-icons-common';
import { DisabledTooltip } from '../DisabledTooltip';
function isActionSubitemLabel(item) {
    return typeof item === 'object' && item !== null && 'sectionTitle' in item;
}
export function ActionPopover(props) {
    const { actionItem, size, priority, onPopoverClick, fullWidth } = props;
    const { dataHook, subItems, popoverMenuProps } = actionItem;
    const allActions = useMemo(() => {
        return subItems
            ?.filter((subItemGroup) => subItemGroup?.length)
            .reduce((result, group, index, array) => {
            const nodes = [];
            group.forEach((item, itemIndex) => {
                if (isActionSubitemLabel(item)) {
                    nodes.push(React.createElement(PopoverMenu.SectionTitle, { key: `section-${index}-${itemIndex}`, title: item.sectionTitle, dataHook: item.dataHook }));
                }
                else {
                    nodes.push(React.createElement(PopoverMenu.MenuItem, { prefixIcon: item.prefixIcon, disabled: item.disabled, text: item.label, key: item.label, subtitle: item.subtitle, dataHook: item.dataHook, onClick: item.onClick }));
                }
            });
            if (index !== array.length - 1) {
                nodes.push(React.createElement(PopoverMenu.Divider, { key: `divider-${index}` }));
            }
            return [...result, ...nodes];
        }, []);
    }, [subItems]);
    return (React.createElement(PopoverMenu, { ...popoverMenuProps, dataHook: dataHook ? `${dataHook}-popover` : undefined, triggerElement: ({ toggle }) => (React.createElement(DisabledTooltip, { content: actionItem.tooltip, dataHook: dataHook ? `${dataHook}-tooltip` : undefined },
            React.createElement(Button, { skin: "standard", priority: priority, size: size, fullWidth: fullWidth, dataHook: actionItem.dataHook, onClick: () => {
                    onPopoverClick?.();
                    toggle();
                }, ellipsis: true, prefixIcon: actionItem.prefixIcon, disabled: actionItem.disabled, suffixIcon: React.createElement(ChevronDown, null) }, actionItem.label))) }, allActions));
}
//# sourceMappingURL=ActionPopover.js.map