"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.DataFormControl = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const FormControl_1 = require("./FormControl");
const IDesignValidationProvider_1 = require("@appglue/common/dist/Common/IDesignValidationProvider");
const DataValidationUtilities_1 = require("@appglue/common/dist/Common/DataValidationUtilities");
const PropertyEditorText_1 = require("../../CommonUI/PropertyEditing/PropertyEditorText");
const PropertyEditorBoolean_1 = require("../../CommonUI/PropertyEditing/PropertyEditorBoolean");
const VariablePicker_1 = tslib_1.__importDefault(require("../../CommonUI/VariablePicker"));
const core_1 = require("@material-ui/core");
const DataDefinition_1 = require("@appglue/common/dist/Common/Data/DataDefinition");
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const DataUtilities_1 = require("@appglue/common/dist/Common/DataUtilities");
class DataFormControl extends FormControl_1.FormControl {
    label = "Configure Label";
    valueName;
    requiredOnAllOutcomes = true;
    isPick = true;
    requiredMessage = "value is required";
    getDesignValidationIssues() {
        let issues = [];
        if (!this.valueName) {
            issues.push(new IDesignValidationProvider_1.ValidationIssue("Value name is required", undefined, this.id));
        }
        else {
            let varIssue = (0, DataValidationUtilities_1.validateVariableName)(this.valueName);
            if (varIssue) {
                varIssue.dataName = this.valueName;
                varIssue.elementId = this.id;
                issues.push(varIssue);
            }
        }
        return issues;
    }
    getRuntimeValidationIssues() {
        let issues = [];
        if (this.requiredOnAllOutcomes &&
            this.valueName &&
            this.getFormContext()?.getFormDataValue(this.valueName) === undefined) {
            issues.push(new IDesignValidationProvider_1.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) {
        return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(!hideElement || hideElement.indexOf("label") === -1) && ((0, jsx_runtime_1.jsx)(PropertyEditorText_1.PropertyEditorText, { editObject: this, label: "Label", propertyName: "label", updateCallback: this.controlUpdate })), (!hideElement || hideElement.indexOf("valueName") === -1) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)(core_1.ButtonGroup, { color: "primary", children: [(0, jsx_runtime_1.jsx)(core_1.Button, { variant: this.isPick ? "contained" : "outlined", onClick: () => this.setIsPick(true), children: "Pick Data" }), (0, jsx_runtime_1.jsx)(core_1.Button, { variant: this.isPick ? "outlined" : "contained", onClick: () => this.setIsPick(false), children: "New Data" })] }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: this.isPick, children: (0, jsx_runtime_1.jsx)(VariablePicker_1.default, { selected: this.valueName, data: this.getFormContext()?.form.getInputDefinition() || new DataDefinition_1.DataDefinition(), isList: false, onVariableSet: (path, def) => {
                                    if (path || def) {
                                        if (def) {
                                            this.getFormContext()?.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,
                                    style: {
                                        padding: "18.5px 14px",
                                    },
                                }, errors: !this.valueName ? [new IDesignValidationProvider_1.ValidationIssue("valueName is required")] : undefined }) }), (0, jsx_runtime_1.jsxs)(core_1.Collapse, { in: !this.isPick, children: [(0, jsx_runtime_1.jsx)(PropertyEditorText_1.PropertyEditorText, { editObject: this, label: "Value Name", propertyName: "valueName", updateCallback: this.controlUpdate }), !this.valueName && ((0, jsx_runtime_1.jsx)(ValidationMessage, { "data-name": "valueName", children: "valueName is required" }))] })] })), (!hideElement || hideElement.indexOf("requiredOnAllOutcomes") === -1) && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { editObject: this, label: "Required On All Outcomes", propertyName: "requiredOnAllOutcomes", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: this.requiredOnAllOutcomes, children: (0, jsx_runtime_1.jsx)(PropertyEditorText_1.PropertyEditorText, { editObject: this, label: "Required Message", propertyName: "requiredMessage", updateCallback: this.controlUpdate }) })] }))] }));
    }
    getStorageData() {
        let retData = super.getStorageData();
        retData = DataUtilities_1.DataUtilities.addStorageData(this, retData, "label", "valueName", "requiredOnAllOutcomes", "isPick", "requiredMessage");
        return retData;
    }
    setStorageData(data) {
        super.setStorageData(data);
        DataUtilities_1.DataUtilities.setStorageData(this, data, "label", "valueName", "requiredOnAllOutcomes", "isPick", "requiredMessage");
    }
}
exports.DataFormControl = DataFormControl;
const ValidationMessage = styled_components_1.default.div `
    font-size: 12px;
    color: #f65c66;
`;
//# sourceMappingURL=DataFormControl.js.map