import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import React from "react";
import InputLabel from "@material-ui/core/InputLabel";
import { XBaseControl } from "./XBaseControl";
import { Collapse, Tooltip } from "@material-ui/core";
import styled from "styled-components";
import { PropertyEditorText } from "../../CommonUI/PropertyEditing/PropertyEditorText";
import { PropertyEditorBoolean } from "../../CommonUI/PropertyEditing/PropertyEditorBoolean";
import { PropertyEditorInteger } from "../../CommonUI/PropertyEditing/PropertyEditorInteger";
class XLabelEditUI extends React.Component {
    render() {
        return (_jsxs(_Fragment, { children: [_jsx(PropertyEditorText, { editObject: this.props.editMe, propertyName: "htmlFor", label: "Label For", updateCallback: this.props.editMe.controlUpdate }, void 0),
                _jsx(PropertyEditorInteger, { editObject: this.props.editMe, propertyName: "maxLength", label: "Max Length", updateCallback: this.props.editMe.controlUpdate }, void 0),
                _jsx(PropertyEditorBoolean, { editObject: this.props.editMe, propertyName: "fromData", label: "From Data?", updateCallback: this.props.editMe.controlUpdate }, void 0),
                _jsx(Collapse, Object.assign({ in: this.props.editMe.fromData }, { children: _jsx(PropertyEditorText, { editObject: this.props.editMe, propertyName: "valueName", label: "Value Name For Data", updateCallback: this.props.editMe.controlUpdate }, void 0) }), void 0),
                _jsx(Collapse, Object.assign({ in: !this.props.editMe.fromData }, { children: _jsx(PropertyEditorText, { editObject: this.props.editMe, propertyName: "text", label: "Static Text", updateCallback: this.props.editMe.controlUpdate }, void 0) }), void 0)] }, void 0));
    }
}
export class XLabel extends XBaseControl {
    constructor() {
        super();
        this.text = "Label Text";
        this.htmlFor = "html-for";
        this.fromData = false;
        this.maxLength = 20;
        this.canFocus = false;
    }
    render() {
        const labelText = this.fromData ? (this.valueName ? this.getFormDataValue(this.valueName) : "") : this.text;
        if ((labelText || "").length > this.maxLength) {
            return (_jsx(Tooltip, Object.assign({ title: labelText }, { children: _jsxs(StyledLabel, Object.assign({ style: { width: "100%" }, htmlFor: this.htmlFor, "data-testid": "xlabel" }, { children: [labelText.slice(0, this.maxLength), "..."] }), void 0) }), void 0));
        }
        return (_jsx(StyledLabel, Object.assign({ style: { width: "100%" }, htmlFor: this.htmlFor, "data-testid": "xlabel" }, { children: labelText }), void 0));
    }
    renderEditUI() {
        return _jsx(XLabelEditUI, { editMe: this }, void 0);
    }
    getDesignValidationIssues() {
        return [];
    }
    getRuntimeValidationIssues() {
        return [];
    }
    getAddedData() {
        return;
    }
}
const StyledLabel = styled(InputLabel) `
    && {
        //styleName: text/Inter SemiBold 12px;
        font-family: Inter;
        font-size: 12px;
        font-style: normal;
        font-weight: 600;
        line-height: 17px;
        letter-spacing: 0px;
        text-align: left;
        color: rgba(39, 41, 50, 0.7);
    }
`;
//# sourceMappingURL=XLabel.js.map