import * as __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__ from "react/jsx-runtime";
import * as __WEBPACK_EXTERNAL_MODULE_react__ from "react";
import * as __WEBPACK_EXTERNAL_MODULE_antd__ from "antd";
import * as __WEBPACK_EXTERNAL_MODULE_react_i18next__ from "react-i18next";
import * as __WEBPACK_EXTERNAL_MODULE__block_provider_index_mjs__ from "../../block-provider/index.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__record_provider_index_mjs__ from "../../record-provider/index.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__schema_component_index_mjs__ from "../../schema-component/index.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__VariableInput_hooks_useVariableOptions_mjs__ from "../VariableInput/hooks/useVariableOptions.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__VariableInput_VariableInput_mjs__ from "../VariableInput/VariableInput.mjs";
import * as __WEBPACK_EXTERNAL_MODULE__DynamicComponent_mjs__ from "./DynamicComponent.mjs";
const { Option } = __WEBPACK_EXTERNAL_MODULE_antd__.Select;
const ValueDynamicComponent = (props)=>{
    const { fieldValue, schema, setValue, collectionName } = props;
    const [mode, setMode] = (0, __WEBPACK_EXTERNAL_MODULE_react__.useState)((null == fieldValue ? void 0 : fieldValue.mode) || 'constant');
    const { t } = (0, __WEBPACK_EXTERNAL_MODULE_react_i18next__.useTranslation)();
    const { form } = (0, __WEBPACK_EXTERNAL_MODULE__block_provider_index_mjs__.useFormBlockContext)();
    const record = (0, __WEBPACK_EXTERNAL_MODULE__record_provider_index_mjs__.useRecord)();
    const scope = (0, __WEBPACK_EXTERNAL_MODULE__VariableInput_hooks_useVariableOptions_mjs__.useVariableOptions)({
        collectionField: {
            uiSchema: schema
        },
        form,
        record,
        uiSchema: schema,
        noDisabled: true
    });
    const { compatOldVariables } = (0, __WEBPACK_EXTERNAL_MODULE__VariableInput_VariableInput_mjs__.useCompatOldVariables)({
        collectionField: {
            uiSchema: schema,
            collectionName
        },
        uiSchema: schema,
        blockCollectionName: collectionName
    });
    const constantStyle = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
            minWidth: 150,
            maxWidth: 430,
            marginLeft: 5
        }), []);
    const handleChangeOfConstant = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((value)=>{
        setValue({
            mode,
            value
        });
    }, [
        mode,
        setValue
    ]);
    const expressStyle = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
            minWidth: 150,
            maxWidth: 430,
            fontSize: 13
        }), []);
    const handleChangeOfExpress = (0, __WEBPACK_EXTERNAL_MODULE_react__.useCallback)((value)=>{
        const result = value.replaceAll("".concat(collectionName, "."), '').replaceAll('$system.', '').trim();
        setValue({
            mode,
            value,
            result
        });
    }, [
        collectionName,
        mode,
        setValue
    ]);
    const textAreaStyle = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>({
            minWidth: 460,
            marginRight: 15
        }), []);
    const compatScope = (0, __WEBPACK_EXTERNAL_MODULE_react__.useMemo)(()=>compatOldVariables(scope, {
            value: null == fieldValue ? void 0 : fieldValue.value
        }), [
        compatOldVariables,
        null == fieldValue ? void 0 : fieldValue.value,
        scope
    ]);
    const modeMap = {
        constant: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("div", {
            role: "button",
            "aria-label": "dynamic-component-linkage-rules",
            style: constantStyle,
            children: /*#__PURE__*/ __WEBPACK_EXTERNAL_MODULE_react__["default"].createElement(__WEBPACK_EXTERNAL_MODULE__DynamicComponent_mjs__.DynamicComponent, {
                value: (null == fieldValue ? void 0 : fieldValue.value) || fieldValue,
                schema,
                onChange: handleChangeOfConstant
            })
        }),
        express: /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)("div", {
            role: "button",
            "aria-label": "dynamic-component-linkage-rules",
            style: expressStyle,
            children: [
                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(__WEBPACK_EXTERNAL_MODULE__schema_component_index_mjs__.Variable.TextArea, {
                    value: null == fieldValue ? void 0 : fieldValue.value,
                    onChange: handleChangeOfExpress,
                    scope: compatScope,
                    style: textAreaStyle
                }),
                /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)(__WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.Fragment, {
                    children: [
                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)("span", {
                            style: {
                                marginLeft: '.25em'
                            },
                            className: 'ant-formily-item-extra',
                            children: [
                                t('Syntax references'),
                                ":"
                            ]
                        }),
                        /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)("a", {
                            href: "https://formulajs.info/functions/",
                            target: "_blank",
                            rel: "noreferrer",
                            children: "Formula.js"
                        })
                    ]
                })
            ]
        })
    };
    return /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)(__WEBPACK_EXTERNAL_MODULE_antd__.Space.Compact, {
        children: [
            /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsxs)(__WEBPACK_EXTERNAL_MODULE_antd__.Select, {
                role: "button",
                "data-testid": "select-linkage-value-type",
                value: mode,
                style: {
                    width: 150
                },
                onChange: (value)=>{
                    setMode(value);
                    setValue({
                        mode: value
                    });
                },
                children: [
                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(Option, {
                        value: "constant",
                        children: t('Constant value')
                    }),
                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(Option, {
                        value: "express",
                        children: t('Expression')
                    }),
                    /*#__PURE__*/ (0, __WEBPACK_EXTERNAL_MODULE_react_jsx_runtime__.jsx)(Option, {
                        value: "empty",
                        children: t('Empty')
                    })
                ]
            }),
            modeMap[mode]
        ]
    });
};
export { ValueDynamicComponent };
