import { jsx, jsxs } from "react/jsx-runtime";
import { useMemo } from "react";
import { observer } from "@tachybase/schema";
import { Tag } from "antd";
import { useAntdToken } from "antd-style";
import { useCompile } from "../../../schema-component/index.mjs";
const Summary_Summary = observer((props)=>{
    const { schema, label } = props;
    const compile = useCompile();
    const token = useAntdToken();
    const styles = useMemo(()=>({
            container: {
                backgroundColor: token.colorFillAlter,
                marginBottom: token.marginLG,
                padding: token.paddingSM + token.paddingXXS
            },
            title: {
                color: token.colorText
            },
            description: {
                marginTop: token.marginXS,
                color: token.colorTextDescription
            },
            tag: {
                background: 'none'
            }
        }), [
        token.colorFillAlter,
        token.colorText,
        token.colorTextDescription,
        token.marginLG,
        token.marginXS,
        token.paddingSM,
        token.paddingXXS
    ]);
    if (!schema) return null;
    return /*#__PURE__*/ jsxs("div", {
        style: styles.container,
        children: [
            /*#__PURE__*/ jsxs("div", {
                style: styles.title,
                children: [
                    label,
                    ": ",
                    /*#__PURE__*/ jsx(Tag, {
                        style: styles.tag,
                        children: compile(schema.title)
                    })
                ]
            }),
            schema.description ? /*#__PURE__*/ jsx("div", {
                style: styles.description,
                children: compile(schema.description)
            }) : null
        ]
    });
}, {
    displayName: 'Summary'
});
const Summary = Summary_Summary;
export { Summary as default };
