import { Fragment, jsx, jsxs } from "react/jsx-runtime";
import react, { useContext } from "react";
import { RecursionField, observer, useFieldSchema } from "@tachybase/schema";
import { Space } from "antd";
import classnames from "classnames";
import { createPortal } from "react-dom";
import { useSchemaInitializerRender } from "../../../application/index.mjs";
import { withDynamicSchemaProps } from "../../../application/hoc/withDynamicSchemaProps.mjs";
import { DndContext } from "../../common/index.mjs";
import { useDesignable, useProps } from "../../hooks/index.mjs";
const ActionBarContext = /*#__PURE__*/ react.createContext({
    container: null
});
const ActionBarProvider = (param)=>{
    let { children, ...props } = param;
    return /*#__PURE__*/ jsx(ActionBarContext.Provider, {
        value: props,
        children: children
    });
};
const useActionBarContext = ()=>useContext(ActionBarContext);
const Portal = (props)=>{
    const filedSchema = useFieldSchema();
    const { container, parentComponents = [
        'BlockItem',
        'CardItem'
    ] } = useActionBarContext();
    return /*#__PURE__*/ jsx(Fragment, {
        children: container && parentComponents.includes(filedSchema.parent['x-component']) ? /*#__PURE__*/ createPortal(props.children, container) : props.children
    });
};
const ActionBar = withDynamicSchemaProps(observer((props)=>{
    const { forceProps = {} } = useActionBarContext();
    const { layout = 'tow-columns', style, spaceProps, ...others } = {
        ...useProps(props),
        ...forceProps
    };
    const fieldSchema = useFieldSchema();
    const { render } = useSchemaInitializerRender(fieldSchema['x-initializer'], fieldSchema['x-initializer-props']);
    const { designable } = useDesignable();
    if ('one-column' === layout) return /*#__PURE__*/ jsx(Portal, {
        children: /*#__PURE__*/ jsx(DndContext, {
            children: /*#__PURE__*/ jsxs("div", {
                style: {
                    display: 'flex',
                    alignItems: 'center',
                    gap: 8,
                    ...style
                },
                ...others,
                className: classnames(others.className, 'tb-action-bar'),
                children: [
                    props.children && /*#__PURE__*/ jsx("div", {
                        children: /*#__PURE__*/ jsx(Space, {
                            ...spaceProps,
                            style: {
                                flexWrap: 'wrap'
                            },
                            children: fieldSchema.mapProperties((schema, key)=>/*#__PURE__*/ jsx(RecursionField, {
                                    name: key,
                                    schema: schema
                                }, key))
                        })
                    }),
                    render({
                        style: {
                            margin: '0 !important'
                        }
                    })
                ]
            })
        })
    });
    var _fieldSchema_properties;
    const hasActions = Object.keys(null != (_fieldSchema_properties = fieldSchema.properties) ? _fieldSchema_properties : {}).length > 0;
    return /*#__PURE__*/ jsxs("div", {
        style: designable || hasActions ? {
            display: 'flex',
            justifyContent: 'space-between',
            alignItems: 'center',
            overflowX: 'auto',
            flexShrink: 0,
            ...style
        } : void 0,
        ...others,
        className: classnames(others.className, 'tb-action-bar'),
        children: [
            /*#__PURE__*/ jsx("div", {
                style: {
                    display: 'flex',
                    justifyContent: 'space-between',
                    alignItems: 'center',
                    width: '100%',
                    overflow: 'hidden',
                    flexWrap: 'wrap'
                },
                children: /*#__PURE__*/ jsxs(DndContext, {
                    children: [
                        /*#__PURE__*/ jsx(Space, {
                            ...spaceProps,
                            children: fieldSchema.mapProperties((schema, key)=>{
                                if ('left' !== schema['x-align']) return null;
                                return /*#__PURE__*/ jsx(RecursionField, {
                                    name: key,
                                    schema: schema
                                }, key);
                            })
                        }),
                        /*#__PURE__*/ jsx(Space, {
                            ...spaceProps,
                            children: fieldSchema.mapProperties((schema, key)=>{
                                if ('left' === schema['x-align']) return null;
                                return /*#__PURE__*/ jsx(RecursionField, {
                                    name: key,
                                    schema: schema
                                }, key);
                            })
                        })
                    ]
                })
            }),
            render()
        ]
    });
}), {
    displayName: 'ActionBar'
});
export { ActionBar, ActionBarProvider, useActionBarContext };
