"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.XTabContainer = exports.XTabContainerTab = exports.XTabContainerTabContent = exports.XTabContainerTabHeader = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
const XBaseContainer_1 = require("./XBaseContainer");
const FormDesignConstants_1 = require("../Utilities/FormDesignConstants");
const PropertyEditorInteger_1 = require("../../CommonUI/PropertyEditing/PropertyEditorInteger");
const PropertyEditorColor_1 = require("../../CommonUI/PropertyEditing/PropertyEditorColor");
const FormControl_1 = require("../Controls/FormControl");
const Tab_1 = tslib_1.__importDefault(require("@material-ui/core/Tab"));
const react_beautiful_dnd_1 = require("react-beautiful-dnd");
const lab_1 = require("@mui/lab");
const AutoBind_1 = require("@appglue/common/dist/Common/AutoBind");
const StateManager_1 = require("@appglue/common/dist/Common/StateManager");
const ObserveState_1 = require("../../CommonUI/StateManagement/ObserveState");
const DataUtilities_1 = require("@appglue/common/dist/Common/DataUtilities");
const XBaseStackContainer_1 = require("./XBaseStackContainer");
const XStackContainer_1 = require("./XStackContainer");
const XDesignWrapper_1 = require("../Utilities/XDesignWrapper");
const PropertyEditorSelect_1 = require("../../CommonUI/PropertyEditing/PropertyEditorSelect");
const CommonStyled_1 = require("../Controls/Web/CommonStyled");
const core_1 = require("@material-ui/core");
const DefaultOnOff_1 = require("../Utilities/DefaultOnOff");
const PropertyEditorList_1 = require("../../CommonUI/PropertyEditing/PropertyEditorList");
const PropertyEditorBoolean_1 = require("../../CommonUI/PropertyEditing/PropertyEditorBoolean");
const PropertyEditorText_1 = require("../../CommonUI/PropertyEditing/PropertyEditorText");
const PropertyEditorOptionWithButtonGroup_1 = require("../../CommonUI/PropertyEditing/PropertyEditorOptionWithButtonGroup");
const XRuntimeWrapper_1 = require("../Utilities/XRuntimeWrapper");
const UIStyleConstants_1 = require("@appglue/common/dist/Common/UIStyleConstants");
const StyledTab = (0, styled_components_1.default)(Tab_1.default) `
    && {
        padding: 0;
    }
`;
const TabContainerWrapper = (0, styled_components_1.default)("div") `
    width: 100%;
    padding: ${(props) => props.padding || 0}px;
    min-height: ${(props) => (props.padding || 0) * 2 + (props.minHeight || 75)}px;
    border: ${(props) => props.hasBorder
    ? `${(props.borderStyle || FormDesignConstants_1.FormDesignConstants.CONTAINER_BORDER_STYLE).toLowerCase()} ${props.borderWidth || FormDesignConstants_1.FormDesignConstants.CONTAINER_BORDER_WIDTH}px ${props.borderColor || FormDesignConstants_1.FormDesignConstants.CONTAINER_BORDER_COLOR}`
    : "none"};
    border-radius: ${(props) => props.borderRadius || FormDesignConstants_1.FormDesignConstants.CONTAINER_BORDER_RADIOUS}px;
    // overflow: hidden;
    background-color: ${(props) => props.backgroundColor || FormDesignConstants_1.FormDesignConstants.CONTAINER_BACKGROUND_COLOR};
    position: relative;

    ${(props) => props.orientation === FormDesignConstants_1.TabOrientation.Veritical &&
    `
		display: flex;
	`}
`;
const TabHeaderWrapper = (0, styled_components_1.default)("div") `
    padding: ${(props) => props.padding || 0}px;
    border: ${(props) => props.hasBorder ? `${props.borderStyle.toLowerCase()} ${props.borderWidth}px ${props.borderColor}` : "none"};
    border-radius: ${(props) => props.borderRadius || 0}px;
`;
const StyledTabPanel = (0, styled_components_1.default)(lab_1.TabPanel) `
    && {
        padding: 0;
    }
`;
class XTabContainerTabHeader {
    icon = null;
    title = "";
    tab;
    getStorageData() {
        return DataUtilities_1.DataUtilities.addStorageData(this, undefined, "title");
    }
    setStorageData(data) {
        DataUtilities_1.DataUtilities.setStorageData(this, data, "title");
    }
}
exports.XTabContainerTabHeader = XTabContainerTabHeader;
class XTabContainerTabContent extends XBaseStackContainer_1.XBaseStackContainer {
    __type = "Tab Content";
    tab;
    contentBorderType;
    contentBorderRadius;
    contentBorderWidth;
    contentBorderStyle;
    contentBorderColor;
    contentBackgroundColor;
    setFormContext(value) {
        if (!value)
            throw new Error("cannot set edit context to null (base control)");
        super.setFormContext(value);
        for (let c of this.controls) {
            c.setFormContext(value);
        }
    }
    getFormMode() {
        return this.getFormContext().mode || FormDesignConstants_1.FormMode.Runtime;
    }
    getStorageData() {
        let retData = super.getStorageData();
        retData = DataUtilities_1.DataUtilities.addStorageData(this, retData, "__type", "contentBorderType", "contentBorderRadius", "contentBorderWidth", "contentBorderStyle", "contentBorderColor", "contentBackgroundColor");
        return retData;
    }
    setStorageData(data) {
        super.setStorageData(data);
        DataUtilities_1.DataUtilities.setStorageData(this, data, "__type", "contentBorderType", "contentBorderRadius", "contentBorderWidth", "contentBorderStyle", "contentBorderColor", "contentBackgroundColor");
    }
    getInnerControlSpacing() {
        return this.getContainer().interControlSpacing;
    }
    getContainer() {
        return this.tab.container;
    }
    hasOwnBorder() {
        return this.overrideFormBorderSettings === DefaultOnOff_1.DefaultOnOff.On;
    }
    hasBorder() {
        return (this.hasOwnBorder() ||
            (this.overrideFormBorderSettings === DefaultOnOff_1.DefaultOnOff.DEFAULT && this.getContainer().defaultShowContentBorder));
    }
    borderColor() {
        return (this.hasOwnBorder() && this.contentBorderColor) || this.getContainer().defaultContentBorderColor;
    }
    borderStyle() {
        return (this.hasOwnBorder() && this.contentBorderStyle) || this.getContainer().defaultContentBorderStyle;
    }
    borderWidth() {
        return (this.hasOwnBorder() && this.contentBorderWidth) || this.getContainer().defaultContentBorderWidth;
    }
    borderRadius() {
        return (this.hasOwnBorder() && this.contentBorderRadius) || this.getContainer().defaultContentBorderRadius;
    }
    backgroundColor() {
        return this.contentBackgroundColor || this.getContainer().defaultTabContentBackground;
    }
    getInnerMargin() {
        return this.innerMargin || this.getContainer().defaultTabContentInnerMargin;
    }
    render() {
        let mode = this.getFormContext()?.mode ?? FormDesignConstants_1.FormMode.Runtime;
        if (mode === FormDesignConstants_1.FormMode.FormDesign) {
            return ((0, jsx_runtime_1.jsx)(react_beautiful_dnd_1.Droppable, { droppableId: this.id, children: (provided, snapshot) => {
                    return ((0, jsx_runtime_1.jsxs)(XStackContainer_1.StackContainerDiv, { padding: this.getInnerMargin(), hasBorder: snapshot.isDraggingOver || this.hasBorder(), borderColor: (snapshot.isDraggingOver && FormDesignConstants_1.FormDesignConstants.DROPPABLE_BORDER_COLOR) ||
                            this.borderColor(), borderStyle: (snapshot.isDraggingOver && FormDesignConstants_1.FormDesignConstants.DROPPABLE_BORDER_STYLE) ||
                            this.borderStyle(), borderWidth: (snapshot.isDraggingOver && FormDesignConstants_1.FormDesignConstants.DROPPABLE_BORDER_WIDTH) ||
                            this.borderWidth(), borderRadius: (snapshot.isDraggingOver && FormDesignConstants_1.FormDesignConstants.DROPPABLE_BORDER_RADIUS) ||
                            this.borderRadius(), backgroundColor: this.backgroundColor(), ref: provided.innerRef, ...provided.droppableProps, children: [this.controls.map((control, index) => {
                                return ((0, jsx_runtime_1.jsx)(XStackContainer_1.StackContainerColumn, { colGap: this.getInnerControlSpacing() ||
                                        this.getFormContext()?.form?.defaultInterControlSpacing, id: control.id, children: (0, jsx_runtime_1.jsx)(XDesignWrapper_1.XDesignWrapper, { id: control.id, index: index, innerComponent: control, editContext: this.getFormContext(), children: control.render() }, control.id) }, index));
                            }), provided.placeholder, this.controls.length === 0 && this.renderEmptyControlDiv(this.getInnerMargin())] }));
                } }, this.id));
        }
        else {
            return ((0, jsx_runtime_1.jsxs)(XStackContainer_1.StackContainerDiv, { padding: this.getInnerMargin(), hasBorder: this.hasBorder(), borderColor: this.borderColor(), borderStyle: this.borderStyle(), borderWidth: this.borderWidth(), borderRadius: this.borderRadius(), backgroundColor: this.backgroundColor(), children: [this.controls.map((control, index) => {
                        return ((0, jsx_runtime_1.jsx)(XStackContainer_1.StackContainerColumn, { colGap: this.getInnerControlSpacing() ||
                                this.getFormContext()?.form?.defaultInterControlSpacing, id: control.id, children: (0, jsx_runtime_1.jsx)(XRuntimeWrapper_1.XRuntimeWrapper, { innerComponent: control, context: this.getFormContext() }) }, index));
                    }), this.controls.length === 0 &&
                        mode !== FormDesignConstants_1.FormMode.Runtime &&
                        this.renderEmptyControlDiv(this.getInnerMargin(), "Add controls in the form design tab")] }));
        }
    }
    renderEditUI() {
        throw new Error("Method not implemented.");
    }
}
exports.XTabContainerTabContent = XTabContainerTabContent;
class XTabContainerTab extends FormControl_1.FormControl {
    __type = "Tab Container Tab";
    header;
    content;
    container;
    getAddedData() {
        return;
    }
    getStorageData() {
        let resData = super.getStorageData();
        Reflect.set(resData, "__header", this.header.getStorageData());
        Reflect.set(resData, "__content", this.content.getStorageData());
        return resData;
    }
    setStorageData(data) {
        super.setStorageData(data);
        let headerData = Reflect.get(data, "__header");
        let header = new XTabContainerTabHeader();
        header.setStorageData(headerData);
        this.setHeader(header);
        let contentData = Reflect.get(data, "__content");
        let content = new XTabContainerTabContent();
        content.setStorageData(contentData);
        this.setContent(content);
    }
    setContainer(container) {
        this.container = container;
        if (container.getFormContext()) {
            this.setFormContext(container.getFormContext());
        }
    }
    setFormContext(value) {
        if (!value)
            throw new Error("cannot set edit context to null (base control)");
        super.setFormContext(value);
        this.content.setFormContext(value);
    }
    setContent(content) {
        this.content = content;
        this.content.tab = this;
        if (this.getFormContext()) {
            content.setFormContext(this.getFormContext());
        }
    }
    setHeader(header) {
        this.header = header;
        this.header.tab = this;
    }
    find(id) {
        return this.content.find(id);
    }
    add(control, index) {
        this.content.add(control, index);
    }
    getContainer() {
        return this.container;
    }
    remove(control) {
        this.content?.remove(control);
    }
    getControls() {
        return this.content.getControls() || [];
    }
    getDesignValidationIssues() {
        return [];
    }
    getRuntimeValidationIssues() {
        return [];
    }
    renderEditUI() {
        return null;
    }
}
exports.XTabContainerTab = XTabContainerTab;
class XTabContainer extends XBaseContainer_1.XBaseContainer {
    __type = "Tab Container";
    orientation = FormDesignConstants_1.TabOrientation.Horizontal;
    tabs = [];
    selectedValue = "";
    interControlSpacing;
    innerMargin = 0;
    innerMarginTabHeader = 0;
    minWidthPxTabHeader = 0;
    fullWidth = false;
    centered = false;
    defaultTabContentHeight = null;
    defaultTabContentWidth = null;
    defaultTabContentBackground = UIStyleConstants_1.UIStyleConstants.WHITE_COLOR;
    defaultTabContentInnerMargin = 0;
    defaultTabHeaderBackground = UIStyleConstants_1.UIStyleConstants.WHITE_COLOR;
    defaultShowContentBorder = false;
    defaultContentBorderColor = "lightGray";
    defaultContentBorderRadius = 10;
    defaultContentBorderWidth = 2;
    defaultContentBorderStyle;
    // eslint-disable-next-line
    setOrder(id, order) { }
    setFormContext(value) {
        if (!value)
            return;
        super.setFormContext(value);
        if (this.tabs) {
            for (let tab of this.tabs) {
                // set edit context first
                tab.setFormContext(value);
            }
        }
    }
    getControls() {
        let controls = [];
        for (let col of this.tabs) {
            controls.push(...col.getControls());
        }
        return controls;
    }
    getCurrentTab() {
        for (let t of this.tabs) {
            if (t.header.title === this.selectedValue) {
                return t;
            }
        }
    }
    addTab(tab) {
        if (this.tabs.length === 0) {
            this.selectedValue = tab.header.title;
        }
        this.add(tab);
    }
    add(control, index) {
        if (control instanceof XTabContainerTab) {
            let tab = control;
            tab.setContainer(this);
            if (!index) {
                this.tabs.push(tab);
            }
            else {
                this.tabs.splice(index, 0, tab);
            }
        }
        else {
            this.getCurrentTab()?.add(control, index);
        }
        if (this.getFormContext())
            control.setFormContext(this.getFormContext());
    }
    remove(control) {
        for (let col of this.tabs) {
            col.remove(control);
        }
    }
    find(id) {
        for (let tab of this.tabs) {
            if (tab.id === id)
                return tab;
            if (tab.content && tab.content.id === id)
                return tab.content;
            let con = tab.find(id);
            if (con)
                return con;
        }
        return null;
    }
    getInnerMargin() {
        return this.innerMargin || this.getFormContext()?.form?.defaultInnerContainerMargin;
    }
    getStorageData() {
        let resData = super.getStorageData();
        resData = DataUtilities_1.DataUtilities.addStorageData(this, resData, "__type", "orientation", "selectedValue", "interControlSpacing", "innerMargin", "innerMarginTabHeader", "minWidthPxTabHeader", "fullWidth", "centered", "defaultTabContentHeight", "defaultTabContentWidth", "defaultTabContentBackground", "defaultTabContentInnerMargin", "defaultTabHeaderBackground", "defaultShowContentBorder", "defaultContentBorderColor", "defaultContentBorderRadius", "defaultContentBorderWidth", "defaultContentBorderStyle");
        let tabs = [];
        for (let t of this.tabs) {
            tabs.push(t.getStorageData());
        }
        Reflect.set(resData, "__tabs", tabs);
        return resData;
    }
    setStorageData(data) {
        super.setStorageData(data);
        DataUtilities_1.DataUtilities.setStorageData(this, data, "__type", "orientation", "selectedValue", "interControlSpacing", "innerMargin", "innerMarginTabHeader", "minWidthPxTabHeader", "fullWidth", "centered", "defaultTabContentHeight", "defaultTabContentWidth", "defaultTabContentBackground", "defaultTabContentInnerMargin", "defaultTabHeaderBackground", "defaultShowContentBorder", "defaultContentBorderColor", "defaultContentBorderRadius", "defaultContentBorderWidth", "defaultContentBorderStyle");
        let tabsArray = Reflect.get(data, "__tabs");
        if (tabsArray && tabsArray instanceof Array && tabsArray.length !== 0) {
            for (let tabData of tabsArray) {
                let tab = new XTabContainerTab();
                tab.setStorageData(tabData);
                this.addTab(tab);
            }
        }
    }
    handleChange(_event, newValue) {
        this.selectedValue = newValue;
        StateManager_1.StateManager.changed(this);
    }
    render() {
        let styles = {};
        if (this.tabs.length === 0) {
            let tab = new XTabContainerTab();
            let tabHeader = new XTabContainerTabHeader();
            tabHeader.title = "test 1";
            let tabContent = new XTabContainerTabContent();
            tab.setHeader(tabHeader);
            tab.setContent(tabContent);
            let tab2 = new XTabContainerTab();
            let tabHeader2 = new XTabContainerTabHeader();
            tabHeader2.title = "test 2";
            let tabContent2 = new XTabContainerTabContent();
            tab2.setHeader(tabHeader2);
            tab2.setContent(tabContent2);
            this.addTab(tab);
            this.addTab(tab2);
        }
        if (this.orientation === FormDesignConstants_1.TabOrientation.Horizontal) {
            styles.height = this.defaultTabContentHeight;
        }
        else {
            styles.width = this.defaultTabContentWidth;
            styles.flex = 1;
        }
        return ((0, jsx_runtime_1.jsx)(TabContainerWrapper, { padding: this.getInnerMargin(), hasBorder: this.hasBorder(), borderColor: this.borderColor(), borderStyle: this.borderStyle(), borderWidth: this.borderWidth(), borderRadius: this.borderRadius(), backgroundColor: this.backgroundColor(), minHeight: this.tabs.length > 0 ? 1 : 75, orientation: this.orientation, children: (0, jsx_runtime_1.jsx)(ObserveState_1.ObserveState, { listenTo: this, control: () => ((0, jsx_runtime_1.jsxs)(lab_1.TabContext, { value: this.selectedValue, children: [(0, jsx_runtime_1.jsx)(lab_1.TabList, { orientation: this.orientation, onChange: this.handleChange, variant: this.fullWidth ? "fullWidth" : "standard", centered: this.centered, children: this.tabs.map((t) => {
                                return ((0, jsx_runtime_1.jsx)(StyledTab, { value: t.header.title, label: (0, jsx_runtime_1.jsx)(TabHeaderWrapper, { padding: this.innerMarginTabHeader, children: t.header.title }) }, t.id));
                            }) }), (0, jsx_runtime_1.jsx)("div", { style: styles, children: this.tabs.map((t) => {
                                return ((0, jsx_runtime_1.jsx)(StyledTabPanel, { value: t.header.title, children: t.content.render() }, t.id));
                            }) })] })) }) }));
    }
    renderEditUI() {
        return ((0, jsx_runtime_1.jsxs)(CommonStyled_1.ChildFullWidthDiv, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorSelect_1.PropertyEditorSelect, { editObject: this, label: "Orientation", propertyName: "orientation", updateCallback: this.controlUpdate, options: FormDesignConstants_1.FormDesignConstants.TAB_ORIENTATION }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: this.orientation === FormDesignConstants_1.TabOrientation.Horizontal, children: (0, jsx_runtime_1.jsxs)(CommonStyled_1.ChildFullWidthDiv, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { editObject: this, label: "Full Width For Tab Headers?", propertyName: "fullWidth", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { editObject: this, label: "Center Tab Headers?", propertyName: "centered", updateCallback: this.controlUpdate })] }) }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Inner Margin For Tab Header", propertyName: "innerMarginTabHeader", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Inner Margin For Tab Content", propertyName: "defaultTabContentInnerMargin", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Gap Between Controls", propertyName: "interControlSpacing", updateCallback: this.controlUpdate, parentDefaultValue: this.getFormContext()?.form?.defaultInterControlSpacing }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Inner Margin", propertyName: "paddingBetweenContainerAndtabs", updateCallback: this.controlUpdate, parentDefaultValue: this.getFormContext()?.form?.defaultInnerContainerMargin }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: this, label: "Container Color", propertyName: "containerBackgroundColor", updateCallback: this.controlUpdate, parentDefaultValue: this.getFormContext()?.form?.defaultContainerBackgroundColor }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: this, label: "Default Tab Content Color", propertyName: "defaultTabContentBackground", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorBoolean_1.PropertyEditorBoolean, { editObject: this, label: "Show Content Border", propertyName: "defaultShowContentBorder", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: this.defaultShowContentBorder, children: (0, jsx_runtime_1.jsxs)(CommonStyled_1.ChildFullWidthDiv, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Content Border Width", propertyName: "defaultContentBorderWidth", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: this, label: "Content Border Radius", propertyName: "defaultContentBorderRadius", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: this, label: "Content Border Color", propertyName: "defaultContentBorderColor", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorSelect_1.PropertyEditorSelect, { editObject: this, label: "Content Border Style", propertyName: "defaultContentBorderStyle", updateCallback: this.controlUpdate, options: FormDesignConstants_1.FormDesignConstants.BORDER_STYLES })] }) }), this.renderBorderConfigUI(), (0, jsx_runtime_1.jsx)(PropertyEditorList_1.PropertyEditorList, { label: "Tabs", list: this.tabs.map((col, idx) => ({ name: `tabs ${idx + 1}`, item: col })), showDialogCancel: false, itemUI: (item) => ({
                        onComplete: (item) => {
                            if (item.content) {
                                item.content.setContainer(this);
                                Reflect.set(this.tabs, item.index, item.content);
                            }
                            else {
                                this.tabs.splice(item.index, 1);
                            }
                            this.controlUpdate();
                        },
                        onCancel: () => {
                            delete item.content;
                        },
                        ui: ((0, jsx_runtime_1.jsx)(CommonStyled_1.ChildFullWidthDiv, { children: item.content && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorText_1.PropertyEditorText, { editObject: item.content.header, propertyName: "title", updateCallback: this.controlUpdate, label: "Tab Title" }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: item.content.content, label: "Inner Margin", propertyName: "innerMargin", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorOptionWithButtonGroup_1.PropertyEditorOptionWithButtonGroup, { editObject: item.content.content, label: "Override Border Settings", propertyName: "overrideFormBorderSettings", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(core_1.Collapse, { in: item.content.content.overrideFormBorderSettings === DefaultOnOff_1.DefaultOnOff.On, children: (0, jsx_runtime_1.jsxs)(CommonStyled_1.ChildFullWidthDiv, { children: [(0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: item.content.content, label: "Border Width", propertyName: "containerBorderWidth", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorInteger_1.PropertyEditorInteger, { editObject: item.content.content, label: "Border Radius", propertyName: "containerBorderRadius", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: item.content.content, label: "Border Color", propertyName: "containerBorderColor", updateCallback: this.controlUpdate }), (0, jsx_runtime_1.jsx)(PropertyEditorSelect_1.PropertyEditorSelect, { editObject: item.content, label: "Border Style", propertyName: "containerBorderStyle", updateCallback: this.controlUpdate, options: FormDesignConstants_1.FormDesignConstants.BORDER_STYLES })] }) }), (0, jsx_runtime_1.jsx)(PropertyEditorColor_1.PropertyEditorColor, { editObject: item.content.content, label: "Tab Content Background Color", propertyName: "containerBackgroundColor", updateCallback: this.controlUpdate })] })) })),
                    }), prototype: () => {
                        let tab = new XTabContainerTab();
                        let tabHeader = new XTabContainerTabHeader();
                        let tabContent = new XTabContainerTabContent();
                        tab.setHeader(tabHeader);
                        tab.setContent(tabContent);
                        return tab;
                    } })] }));
    }
}
tslib_1.__decorate([
    AutoBind_1.AutoBind
], XTabContainer.prototype, "handleChange", null);
exports.XTabContainer = XTabContainer;
//# sourceMappingURL=XTabContainer.js.map