"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.XLineControlUI = exports.LineFormControl = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const FormControl_1 = require("../FormControl");
const PropertyEditorColor_1 = require("../../../CommonUI/PropertyEditing/PropertyEditorColor");
const PropertyEditorInteger_1 = require("../../../CommonUI/PropertyEditing/PropertyEditorInteger");
const PropertyEditorBoolean_1 = require("../../../CommonUI/PropertyEditing/PropertyEditorBoolean");
const core_1 = require("@material-ui/core");
const DataUtilities_1 = require("@appglue/common/dist/Common/DataUtilities");
class LineFormControl extends FormControl_1.FormControl {
    __type = "Line";
    width;
    color = "black";
    height = 3;
    borderRadius;
    marginTop;
    marginBottom;
    marginY = 0;
    sameMargin = true;
    fullWidth = true;
    constructor() {
        super();
        this.canFocus = false;
    }
    render() {
        const styleHr = {
            width: this.fullWidth ? "100%" : this.width,
            color: this.color,
            backgroundColor: this.color,
            height: this.height,
            border: "none",
            borderRadius: this.borderRadius,
            marginTop: this.sameMargin ? this.marginY : this.marginTop,
            marginBottom: this.sameMargin ? this.marginY : this.marginBottom,
            marginLeft: "auto",
            marginRight: "auto",
        };
        return (0, jsx_runtime_1.jsx)("hr", { style: styleHr, "data-testid": "hrTag" });
    }
    renderEditUI() {
        return (0, jsx_runtime_1.jsx)(XLineControlUI, { editMe: this });
    }
    getDesignValidationIssues() {
        return [];
    }
    getRuntimeValidationIssues() {
        return [];
    }
    getAddedData() {
        return;
    }
    getStorageData() {
        let retData = super.getStorageData();
        retData = DataUtilities_1.DataUtilities.addStorageData(this, retData, "__type", "width", "color", "height", "borderRadius", "marginTop", "marginBottom", "marginY", "sameMargin", "fullWidth");
        return retData;
    }
    setStorageData(data) {
        super.setStorageData(data);
        DataUtilities_1.DataUtilities.setStorageData(this, data, "__type", "width", "color", "height", "borderRadius", "marginTop", "marginBottom", "marginY", "sameMargin", "fullWidth");
    }
}
exports.LineFormControl = LineFormControl;
function XLineControlUI(props) {
    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { label: "Same Margin Top and Bottom", updateCallback: props.editMe.controlUpdate, propertyName: "sameMargin", editObject: props.editMe }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: props.editMe.sameMargin, children: (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Margin", updateCallback: props.editMe.controlUpdate, propertyName: "marginY", editObject: props.editMe }) }), (0, jsx_runtime_1.jsxs)(core_1.Collapse, { in: !props.editMe.sameMargin, children: [(0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Margin Top", updateCallback: props.editMe.controlUpdate, propertyName: "marginTop", editObject: props.editMe }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Margin Bottom", updateCallback: props.editMe.controlUpdate, propertyName: "marginBottom", editObject: props.editMe })] }), (0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { label: "Full width", updateCallback: props.editMe.controlUpdate, propertyName: "fullWidth", editObject: props.editMe }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: !props.editMe.fullWidth, children: (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Width", updateCallback: props.editMe.controlUpdate, propertyName: "width", editObject: props.editMe }) }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Height", updateCallback: props.editMe.controlUpdate, propertyName: "height", editObject: props.editMe }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { label: "Border Radius", updateCallback: props.editMe.controlUpdate, propertyName: "borderRadius", editObject: props.editMe }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: props.editMe, label: "Color", propertyName: "color", updateCallback: props.editMe.controlUpdate })] }));
}
exports.XLineControlUI = XLineControlUI;
//# sourceMappingURL=LineFormControl.js.map