import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import { useMemo, useState } from "react";
import { useForm } from "@tachybase/schema";
import { uid } from "@tachybase/utils/client";
import { SchemaInitializerItem, useSchemaInitializer } from "../../application/index.mjs";
import { Action, ActionContextProvider, SchemaComponent } from "../../schema-component/index.mjs";
function ModalActionSchemaInitializerItem(props) {
    const { modalSchema = {}, ...otherProps } = props;
    const { properties, ...others } = modalSchema;
    const [visible, setVisible] = useState(false);
    const { setVisible: setSchemaInitializerVisible } = useSchemaInitializer();
    const schema = useMemo(()=>({
            name: uid(),
            'x-component': 'Action.Modal',
            'x-component-props': {
                width: '520px'
            },
            type: 'void',
            'x-decorator': 'FormV2',
            'x-decorator-props': {},
            ...others,
            properties: {
                ...properties,
                footer1: {
                    'x-component': 'Action.Modal.Footer',
                    type: 'void',
                    properties: {
                        close: {
                            title: 'Cancel',
                            'x-component': 'Action',
                            'x-component-props': {
                                type: 'default'
                            },
                            'x-use-component-props': ()=>({
                                    onClick () {
                                        var _props_onCancel;
                                        setVisible(false);
                                        null == props || null == (_props_onCancel = props.onCancel) || _props_onCancel.call(props);
                                    }
                                })
                        },
                        submit: {
                            title: 'OK',
                            'x-component': 'Action',
                            'x-component-props': {
                                type: 'primary'
                            },
                            'x-use-component-props': ()=>{
                                const form = useForm();
                                return {
                                    async onClick () {
                                        var _props_onSubmit;
                                        await form.submit();
                                        setVisible(false);
                                        null == props || null == (_props_onSubmit = props.onSubmit) || _props_onSubmit.call(props, form.values);
                                    }
                                };
                            }
                        }
                    }
                }
            }
        }), [
        visible
    ]);
    return /*#__PURE__*/ jsxs(Fragment, {
        children: [
            /*#__PURE__*/ jsx(SchemaInitializerItem, {
                ...otherProps,
                onClick: (e)=>{
                    var _props_onClick;
                    setSchemaInitializerVisible(false);
                    setVisible(true);
                    null == props || null == (_props_onClick = props.onClick) || _props_onClick.call(props, e);
                }
            }),
            /*#__PURE__*/ jsx(ActionContextProvider, {
                value: {
                    visible,
                    setVisible
                },
                children: /*#__PURE__*/ jsx(SchemaComponent, {
                    components: {
                        Action: Action
                    },
                    schema: schema
                })
            })
        ]
    });
}
export { ModalActionSchemaInitializerItem };
