import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { XBaseControl } from "./XBaseControl";
import { ValidationIssue } from "../../Common/IDesignValidationProvider";
import { validateVariableName } from "../../Common/DataValidationUtilities";
import { PropertyEditorText } from "../../CommonUI/PropertyEditing/PropertyEditorText";
import { PropertyEditorBoolean } from "../../CommonUI/PropertyEditing/PropertyEditorBoolean";
import VariablePicker from '../../CommonUI/VariablePicker';
import { Button, ButtonGroup, Collapse } from "@material-ui/core";
import { XDataDefinition } from "../../Common/Data/XDataDefinition";
import styled from "styled-components";
export class BaseDataControl extends XBaseControl {
    constructor() {
        super(...arguments);
        this.label = "Configure Label";
        this.requiredOnAllOutcomes = true;
        this.isPick = true;
        this.requiredMessage = "value is required";
    }
    getDesignValidationIssues() {
        let issues = [];
        if (!this.valueName) {
            issues.push(new ValidationIssue("Value name is required", undefined, this.id));
        }
        else {
            let varIssue = validateVariableName(this.valueName);
            if (varIssue) {
                varIssue.dataName = this.valueName;
                varIssue.elementId = this.id;
                issues.push(varIssue);
            }
        }
        return issues;
    }
    getRuntimeValidationIssues() {
        var _a;
        let issues = [];
        if (this.requiredOnAllOutcomes &&
            this.valueName &&
            ((_a = this.getFormContext()) === null || _a === void 0 ? void 0 : _a.getFormDataValue(this.valueName)) === undefined) {
            issues.push(new ValidationIssue(this.requiredMessage, this.valueName, this.id));
        }
        return issues;
    }
    setIsPick(isPick) {
        this.isPick = isPick;
        this.controlUpdate();
    }
    // produces part of the editor for label and name
    renderBaseDataControlEditor(hideElement) {
        var _a;
        return (_jsxs(_Fragment, { children: [(!hideElement || hideElement.indexOf('label') === -1) &&
                    _jsx(PropertyEditorText, { editObject: this, label: "Label", propertyName: "label", updateCallback: this.controlUpdate }, void 0),
                (!hideElement || hideElement.indexOf('valueName') === -1) && (_jsxs(_Fragment, { children: [_jsxs(ButtonGroup, Object.assign({ color: "primary" }, { children: [_jsx(Button, Object.assign({ variant: this.isPick ? "contained" : "outlined", onClick: () => this.setIsPick(true) }, { children: "Pick Data" }), void 0),
                                _jsx(Button, Object.assign({ variant: this.isPick ? "outlined" : "contained", onClick: () => this.setIsPick(false) }, { children: "New Data" }), void 0)] }), void 0),
                        _jsxs(Collapse, Object.assign({ in: this.isPick }, { children: [_jsx(VariablePicker, { selected: this.valueName, data: ((_a = this.getFormContext()) === null || _a === void 0 ? void 0 : _a.form.getInputDefinition()) || new XDataDefinition(), isList: false, onVariableSet: (path, def) => {
                                        var _a;
                                        if (path || def) {
                                            if (def) {
                                                (_a = this.getFormContext()) === null || _a === void 0 ? void 0 : _a.form.getInputDefinition().fields.push(def);
                                            }
                                            if (path) {
                                                this.valueName = path;
                                            }
                                            else {
                                                this.valueName = def.name;
                                            }
                                            this.controlUpdate();
                                        }
                                    }, label: "Value Name", inputProps: {
                                        variant: "outlined",
                                        size: "medium",
                                        fullWidth: true,
                                    } }, void 0),
                                !this.valueName && (_jsx(ValidationMessage, Object.assign({ "data-name": "valueName" }, { children: "valueName is required" }), void 0))] }), void 0),
                        _jsxs(Collapse, Object.assign({ in: !this.isPick }, { children: [_jsx(PropertyEditorText, { editObject: this, label: "Value Name", propertyName: "valueName", updateCallback: this.controlUpdate }, void 0),
                                !this.valueName && (_jsx(ValidationMessage, Object.assign({ "data-name": "valueName" }, { children: "valueName is required" }), void 0))] }), void 0)] }, void 0)),
                (!hideElement || hideElement.indexOf('requiredOnAllOutcomes') === -1) && (_jsxs(_Fragment, { children: [_jsx(PropertyEditorBoolean, { editObject: this, label: "Required On All Outcomes", propertyName: "requiredOnAllOutcomes", updateCallback: this.controlUpdate }, void 0),
                        _jsx(Collapse, Object.assign({ in: this.requiredOnAllOutcomes }, { children: _jsx(PropertyEditorText, { editObject: this, label: "Required Message", propertyName: "requiredMessage", updateCallback: this.controlUpdate }, void 0) }), void 0)] }, void 0))] }, void 0));
    }
}
const ValidationMessage = styled.div `
  font-size: 12px;
  color: #F65C66;
`;
//# sourceMappingURL=BaseDataControl.js.map