import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { useEditContext } from "../client/editContext";
import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger, } from "../../components/ui/dropdown-menu";
import { VerticalDotsIcon } from "../ui/Icons";
export function ItemActionsMenu({ isMobile }) {
    const editContext = useEditContext();
    if (!editContext)
        return null;
    const itemGroups = editContext.configuration.editor.itemActionsMenu?.itemsFactory(editContext) || [];
    if (isMobile) {
        return (_jsx("div", { className: "text-sm text-gray-200", children: itemGroups.map((group, groupIndex) => (_jsx("div", { className: "mb-3 flex flex-row flex-wrap items-center justify-end gap-3", children: group.items
                    .filter((x) => !x.disabled)
                    .map((item) => (_jsxs("div", { className: "flex items-center gap-1", onClick: () => {
                        item.command?.({});
                    }, children: [typeof item.icon === "string" ? (_jsx("i", { className: item.icon, style: { fontSize: "1rem" } })) : (_jsx(_Fragment, { children: item.icon })), item.label] }, item.id))) }, `group-${group.id || groupIndex}`))) }));
    }
    return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, className: "cursor-pointer", children: _jsx("div", { className: "p-1", "data-testid": "item-actions-menu-trigger", children: _jsx(VerticalDotsIcon, {}) }) }), _jsx(DropdownMenuContent, { className: "w-64", align: "start", "data-testid": "item-actions-menu-content", children: itemGroups.map((group, groupIndex) => (_jsxs("div", { children: [group.items
                            .filter((x) => !x.disabled)
                            .map((item) => (_jsxs(DropdownMenuItem, { onClick: () => {
                                item.command?.({});
                            }, className: "flex items-center gap-2", "data-testid": `item-action-${item.id}`, children: [typeof item.icon === "string" ? (_jsx("i", { className: item.icon, style: { fontSize: "1rem" } })) : (_jsx(_Fragment, { children: item.icon })), item.label] }, item.id))), groupIndex > 0 && groupIndex < itemGroups.length - 1 && (_jsx(DropdownMenuSeparator, {}))] }, `group-${group.id || groupIndex}`))) })] }));
}
//# sourceMappingURL=ItemActionsMenu.js.map