var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import './demo8.css';
import Box from '../../box';
import Menu from '..';
import React from 'react';
import ReactDOM from 'react-dom';
const { PopupItem, Divider } = Menu;
const popupProps = {
    align: 'tc bc',
    triggerType: 'click',
};
const ds = [
    {
        title: '库存管理',
        children: [
            {
                title: '部门库存管理',
                link: '',
            },
            {
                title: '小二库存管理',
                link: '',
            },
        ],
    },
    {
        title: '功能模块管理',
        children: [
            {
                title: '功能模块管理',
                link: '',
            },
            {
                title: '卡片管理',
                link: '',
            },
            {
                title: '首页布局',
                link: '',
            },
            {
                title: '页面管理',
                link: '',
            },
        ],
    },
    {
        title: '系统管理',
        children: [
            {
                title: '角色管理',
                link: '',
            },
            {
                title: '标签管理',
                link: '',
            },
            {
                title: '字典管理',
                link: '',
            },
        ],
    },
];
const Panel = props => {
    const { dataSource } = props, others = __rest(props, ["dataSource"]);
    return (React.createElement("div", Object.assign({ className: "my-custom-content3" }, others),
        React.createElement(Box, { direction: "row" }, dataSource.map((item, i) => {
            return (React.createElement(Menu, { embeddable: true, key: i },
                React.createElement(Menu.Item, null,
                    React.createElement("div", { className: "title" }, item.title)),
                React.createElement(Divider, null),
                item.dataSource.map((child, g) => {
                    const a = child.children &&
                        child.children.map((c, j) => {
                            return (React.createElement(Menu.Item, { key: j },
                                React.createElement("a", { href: c.link }, c.title)));
                        });
                    return [
                        React.createElement("div", { className: "sub-title", key: `title-${g}` }, child.title),
                        ...a,
                    ];
                })));
        }))));
};
const SubPanel = props => {
    const { dataSource } = props, others = __rest(props, ["dataSource"]);
    return (React.createElement("div", Object.assign({ className: "my-custom-content2" }, others),
        React.createElement(Box, { direction: "row" }, dataSource.map((item, i) => {
            return (React.createElement(Menu, { embeddable: true, key: i },
                React.createElement("div", { className: "sub-title" }, item.title),
                item.children.map((child, j) => {
                    return (React.createElement(Menu.Item, { key: j },
                        React.createElement("a", { href: child.link }, child.title)));
                })));
        }))));
};
ReactDOM.render(React.createElement(Menu
// @ts-ignore
, { 
    // @ts-ignore
    hozInLine: true, direction: "hoz", mode: "popup", className: "my-hoz-menu", popupClassName: "my-hoz-menu", popupProps: popupProps, renderMore: more => {
        const newDs = more.map(item => {
            const data = item.props.children.props;
            return {
                title: item.props.label,
                dataSource: data.dataSource,
            };
        });
        return (React.createElement(PopupItem
        // @ts-ignore
        , { 
            // @ts-ignore
            noIcon: true, triggerType: "click", key: "0-more", label: "\u66F4\u591A" },
            React.createElement(Panel, { dataSource: newDs })));
    } },
    React.createElement(PopupItem, { key: "0", label: "Popup item 1", 
        // @ts-ignore
        noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "1", label: "Popup item 2", 
        // @ts-ignore
        noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "2", label: "Popup item 3" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "3", label: "Popup item 4" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "4", label: "Popup item 5" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "5", label: "Popup item 6" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "6", label: "Popup item 7" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "7", label: "Popup item 8" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds })),
    React.createElement(PopupItem, { key: "8", label: "Popup item 9" // @ts-ignore
        , noIcon: true },
        React.createElement(SubPanel, { dataSource: ds }))), document.getElementById('menu-demo-8'));
