/**
 * amis-ui v6.14.0-beta.1
 * Copyright 2018-2025 fex
 */

import { __read, __awaiter, __generator } from 'tslib';
import React__default from 'react';
import { themeable } from 'amis-core';
import { Icon } from './icons.js';
import { PopOverContainer } from './PopOverContainer.js';

/**
 * @file DropdownContextMenus
 * @desc 下拉菜单组件,用于展示上下文菜单
 */
/**
 * 下拉菜单组件
 * 用于展示上下文菜单的弹出层组件
 */
function DropdownContextMenus(_a) {
    var _this = this;
    var context = _a.context, contextMenus = _a.contextMenus, cx = _a.classnames, onContextMenu = _a.onContextMenu, popOverContainer = _a.popOverContainer, getTargetElement = _a.getTargetElement, style = _a.style, className = _a.className;
    var _b = __read(React__default.useState([]), 2), menus = _b[0], setMenus = _b[1];
    var domRef = React__default.useRef();
    /** 处理菜单项点击事件 */
    var handleItemClick = React__default.useCallback(function (e) {
        var _a;
        e.preventDefault();
        var index = e.currentTarget.getAttribute('data-index') || '';
        var menu = menus[parseInt(index, 10)];
        if (menu) {
            (_a = menu.onClick) === null || _a === void 0 ? void 0 : _a.call(menu, context);
            onContextMenu === null || onContextMenu === void 0 ? void 0 : onContextMenu(context, menu);
        }
    }, [menus, onContextMenu, context]);
    /** 渲染弹出层内容 */
    var popOverRender = React__default.useMemo(function () {
        return function (_a) {
            var onClose = _a.onClose;
            return (React__default.createElement("ul", { className: cx('ContextMenu-list'), onClick: onClose }, Array.isArray(menus) && menus.length ? (menus.map(function (menu, index) {
                var _a;
                return (React__default.createElement("li", { key: "".concat(index), className: cx('ContextMenu-item', menu.className, (_a = {},
                        _a["is-".concat(menu.level)] = menu.level && menu.level !== 'normal',
                        _a['is-disabled'] = menu.disabled,
                        _a)) },
                    React__default.createElement("a", { "data-index": index, onClick: handleItemClick },
                        menu.icon ? (React__default.createElement("span", { className: cx('ContextMenu-itemIcon', menu.icon) })) : null,
                        menu.label)));
            })) : (React__default.createElement("li", { onClick: handleItemClick, className: cx('ContextMenu-item is-disabled is-placeholder') },
                React__default.createElement("a", null, "\u65E0")))));
        };
    }, [menus]);
    /** 处理弹出层打开事件 */
    var handleOpen = React__default.useCallback(function () { return __awaiter(_this, void 0, void 0, function () {
        var _a;
        return __generator(this, function (_b) {
            switch (_b.label) {
                case 0:
                    if (!(typeof contextMenus === 'function')) return [3 /*break*/, 2];
                    _a = setMenus;
                    return [4 /*yield*/, contextMenus(context)];
                case 1:
                    _a.apply(void 0, [_b.sent()]);
                    return [3 /*break*/, 3];
                case 2:
                    setMenus(contextMenus);
                    _b.label = 3;
                case 3: return [2 /*return*/];
            }
        });
    }); }, [context, contextMenus]);
    /** 获取弹出层容器 */
    var getContainer = React__default.useCallback(function () {
        return typeof popOverContainer === 'function'
            ? popOverContainer()
            : popOverContainer || domRef.current;
    }, [popOverContainer]);
    return (React__default.createElement(PopOverContainer, { popOverRender: popOverRender, popOverContainer: getContainer, onOpen: handleOpen }, function (_a) {
        var onClick = _a.onClick, targetRef = _a.ref, isOpened = _a.isOpened;
        var filterRef = function (ref) {
            domRef.current = ref;
            if (ref && getTargetElement) {
                ref = getTargetElement(ref);
            }
            targetRef(ref);
        };
        return (React__default.createElement("a", { ref: filterRef, className: cx('DropdownContextMenus', className, isOpened ? 'is-open' : ''), onClick: onClick, style: style },
            React__default.createElement(Icon, { icon: "ellipsis-v" })));
    }));
}
var DropdownContextMenus$1 = themeable(DropdownContextMenus);

export { DropdownContextMenus, DropdownContextMenus$1 as default };
