import { jsx as _jsx } from "react/jsx-runtime";
import { ObserveState } from "../../../CommonUI/StateManagement/ObserveState";
import { StateManager } from "../../../CommonUI/StateManagement/StateManager";
import { VariablePickerDialog } from "../../../CommonUI/VariablePickerDialog";
export const ColumnVariablePicker = (props) => {
    const { rule, editContext, dataDefinition, allowNew } = props;
    const onCloseDialog = () => {
        editContext.selectedColumnHeader = undefined;
    };
    return (_jsx(ObserveState, { listenTo: editContext, properties: ["selectedColumnHeader"], control: () => {
            return (_jsx(ObserveState, { listenTo: dataDefinition, properties: ["fields"], control: () => {
                    return (_jsx(VariablePickerDialog, { selected: rule.name, data: dataDefinition, onVariableSet: (path, def) => {
                            if (def) {
                                dataDefinition.fields.push(def);
                                props.onSet(rule, def.name);
                                StateManager.propertyChanged(dataDefinition, "fields");
                            }
                            else {
                                rule.name = path;
                                props.onSet(rule, path);
                            }
                            StateManager.propertyChanged(rule, "name");
                            onCloseDialog();
                        }, allowNewVariable: allowNew, show: editContext.selectedColumnHeader === rule, onClose: onCloseDialog }, void 0));
                } }, void 0));
        } }, void 0));
};
//# sourceMappingURL=ColumnVariablePicker.js.map