"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.EditModeStringValueEditor = exports.DisplayModeStringValueEditor = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = tslib_1.__importStar(require("react"));
const UITextField_1 = require("../BuildlingBlocks/UITextField");
const PropertyEditorTextList_1 = require("../PropertyEditing/PropertyEditorTextList");
var DisplayModeRender_1 = require("./DisplayModeRender");
Object.defineProperty(exports, "DisplayModeStringValueEditor", { enumerable: true, get: function () { return DisplayModeRender_1.DisplayModeValueEditor; } });
exports.EditModeStringValueEditor = react_1.default.forwardRef(({ value, forData, onUpdate }, ref) => {
    const validValues = forData.validValues;
    const field = {
        value: forData.list
            ? Array.isArray(value) && typeof value !== "string"
                ? value
                : value
                    ? [value]
                    : []
            : Array.isArray(value) && typeof value !== "string"
                ? value[0]
                : value,
    };
    const [values, setValues] = (0, react_1.useState)(field.value);
    const onValueUpdate = () => {
        if (forData.list) {
            setValues([...field.value]);
            onUpdate([...field.value]);
        }
        else {
            setValues(field.value);
            onUpdate(field.value);
        }
    };
    (0, react_1.useEffect)(() => {
        const getInitialValue = () => {
            return {
                value: forData.list
                    ? Array.isArray(value) && typeof value !== "string"
                        ? value
                        : value
                            ? [value]
                            : []
                    : Array.isArray(value) && typeof value !== "string"
                        ? value[0]
                        : value,
            };
        };
        setValues(getInitialValue().value);
    }, [value, forData, setValues]);
    if (forData.list) {
        return ((0, jsx_runtime_1.jsx)(PropertyEditorTextList_1.PropertyEditorTextList, { editObject: field, propertyName: "value", updateCallback: onValueUpdate, validValues: validValues }));
    }
    return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: validValues && validValues.length > 0 ? ((0, jsx_runtime_1.jsx)(UITextField_1.UITextField, { value: value || "", onChange: (event) => {
                setValues(event.target.value);
                onUpdate(event.target.value);
            }, select: true, SelectProps: {
                native: true,
            }, inputProps: {
                ref,
            }, "data-testid": "ValueEditor-Edit-text-withvalids", variant: "outlined", size: "small", children: validValues.map((valid, idx) => ((0, jsx_runtime_1.jsx)("option", { value: valid, children: valid }, `${valid}-${idx}`))) })) : ((0, jsx_runtime_1.jsx)(UITextField_1.UITextField, { variant: "outlined", size: "small", value: values || "", onChange: (event) => {
                setValues(event.target.value);
            }, inputRef: ref, "data-testid": "ValueEditor-Edit-text", inputProps: {
                pattern: forData.pattern,
            }, onBlur: () => {
                onUpdate(values);
            }, placeholder: forData.name, onKeyDown: (event) => {
                if (event.key === "Enter") {
                    onUpdate(values);
                }
            } })) }));
});
//# sourceMappingURL=String.js.map