import { ISchema, observer } from '@formily/react';
import { Button, Dropdown, Menu } from 'antd';
import React, { createContext, useContext, useState } from 'react';
import { useDesignable } from '../schema-component/hooks';
import {
SchemaInitializerButtonProps,
SchemaInitializerItemComponent,
SchemaInitializerItemOptions,
SchemaInitializerItemProps
} from './types';
const defaultWrap = (s: ISchema) => s;
export const SchemaInitializerItemContext = createContext(null);
export const SchemaInitializer = () => null;
SchemaInitializer.Button = observer((props: SchemaInitializerButtonProps) => {
const { insert, wrap = defaultWrap, items = [], insertPosition, dropdown, ...others } = props;
let { insertAdjacent, findComponent } = useDesignable();
const [visible, setVisible] = useState(false);
const insertSchema = (schema) => {
if (props.insert) {
props.insert(wrap(schema));
} else {
insertAdjacent(insertPosition, wrap(schema));
}
};
const menu = (
);
console.log('others', others);
return (
{
setVisible(visible);
}}
{...dropdown}
overlay={menu}
>
);
});
SchemaInitializer.Item = (props: SchemaInitializerItemProps) => {
const { index, info } = useContext(SchemaInitializerItemContext);
const { items = [], children = info?.title, icon, onClick, ...others } = props;
if (items?.length > 0) {
const renderMenuItem = (items: SchemaInitializerItemOptions[]) => {
if (!items?.length) {
return null;
}
return items.map((item, indexA) => {
if (item.type === 'divider') {
return ;
}
if (item.type === 'itemGroup') {
return (
// @ts-ignore
{renderMenuItem(item.children)}
);
}
if (item.type === 'subMenu') {
return (
// @ts-ignore
{renderMenuItem(item.children)}
);
}
return (
{
onClick({ ...info, item });
}}
>
{item.title}
);
});
};
return (
// @ts-ignore
{renderMenuItem(items)}
);
}
return (
{
onClick({ ...opts, item: info });
}}
{...others}
>
{children}
);
};
SchemaInitializer.itemWrap = (component?: SchemaInitializerItemComponent) => {
return component;
};