import { computed, defineComponent, h, inject, provide } from 'vue';
import { renderArrow } from '../../popover/src/PopoverBody';
import NDropdownOption from './DropdownOption';
import NDropdownDivider from './DropdownDivider';
import NDropdownGroup from './DropdownGroup';
import NDropdownRenderOption from './DropdownRenderOption';
import { isSubmenuNode, isGroupNode, isDividerNode, isRenderNode } from './utils';
import { dropdownInjectionKey } from './Dropdown';
export const dropdownMenuInjectionKey = Symbol('dropdownMenu');
export default defineComponent({
    name: 'DropdownMenu',
    props: {
        showArrow: Boolean,
        arrowStyle: [String, Object],
        clsPrefix: {
            type: String,
            required: true
        },
        tmNodes: {
            type: Array,
            default: () => []
        },
        parentKey: {
            type: [String, Number],
            default: null
        }
    },
    setup(props) {
        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
        const { renderIconRef, childrenFieldRef } = inject(dropdownInjectionKey);
        provide(dropdownMenuInjectionKey, {
            showIconRef: computed(() => {
                const renderIcon = renderIconRef.value;
                return props.tmNodes.some((tmNode) => {
                    var _a;
                    if (tmNode.isGroup) {
                        return (_a = tmNode.children) === null || _a === void 0 ? void 0 : _a.some(({ rawNode: rawChild }) => renderIcon ? renderIcon(rawChild) : rawChild.icon);
                    }
                    const { rawNode } = tmNode;
                    return renderIcon ? renderIcon(rawNode) : rawNode.icon;
                });
            }),
            hasSubmenuRef: computed(() => {
                const { value: childrenField } = childrenFieldRef;
                return props.tmNodes.some((tmNode) => {
                    var _a;
                    if (tmNode.isGroup) {
                        return (_a = tmNode.children) === null || _a === void 0 ? void 0 : _a.some(({ rawNode: rawChild }) => isSubmenuNode(rawChild, childrenField));
                    }
                    const { rawNode } = tmNode;
                    return isSubmenuNode(rawNode, childrenField);
                });
            })
        });
    },
    render() {
        const { parentKey, clsPrefix } = this;
        return (h("div", { class: `${clsPrefix}-dropdown-menu` },
            this.tmNodes.map((tmNode) => {
                if (isRenderNode(tmNode.rawNode)) {
                    return (h(NDropdownRenderOption, { tmNode: tmNode, key: tmNode.key }));
                }
                if (isDividerNode(tmNode.rawNode)) {
                    return h(NDropdownDivider, { clsPrefix: clsPrefix, key: tmNode.key });
                }
                if (isGroupNode(tmNode.rawNode)) {
                    return (h(NDropdownGroup, { clsPrefix: clsPrefix, tmNode: tmNode, parentKey: parentKey, key: tmNode.key }));
                }
                return (h(NDropdownOption, { clsPrefix: clsPrefix, tmNode: tmNode, parentKey: parentKey, key: tmNode.key, props: tmNode.rawNode.props }));
            }),
            this.showArrow
                ? renderArrow({
                    clsPrefix,
                    arrowStyle: this.arrowStyle
                })
                : null));
    }
});
