import * as React from 'react';
import {BasicConfig, BasicContainer, BasicContainerPropsInterface} from '../../render/core/Container/types';
import componentLoader from '../../render/util/componentLoader';
import {Tooltip} from '@native-ads/antd';
import { createChild } from '../../render/util/createChild';

export class TooltipConfig extends BasicConfig {
    /**
     * 弹出的文字
     */
    title: string;

    /**
     * 被挂载的元素
     */
    children: BasicConfig[];
}

export class TooltipPropsInterface extends BasicContainerPropsInterface {
    info: TooltipConfig;
}

export class AbstractTooltip extends BasicContainer<TooltipPropsInterface, {}> {
    constructor(props: TooltipPropsInterface) {
        super(props);
    }

    render() {
        let info = this.getPropsInfo(this.props.info);
        let children = info.children || [];
        let childElement = (
            <Tooltip title={info.title}>
                {children.map((childInfo, index) => {
                    return createChild(childInfo, {
                        ...this.props,
                        info: childInfo,
                        key: index
                    });
                })}
            </Tooltip>
        );

        return this.renderChildren(info, childElement);
    }
}

componentLoader.addComponent('tooltip', AbstractTooltip, TooltipPropsInterface);