import { __assign, __rest } from "tslib";
import React, { forwardRef } from "react";
import IconsBox from "./components/IconsBox";
import { RequiredStyle, TextStatusStyled, LabelStyled, InputWrapperStyled, PlaceholderStyled, IconStyled, IconRightStyled, InputLeadContentStyled } from "./style";
var InputBase = forwardRef(function (props, ref) {
    var error = props.error, type = props.type, isDisabled = props.isDisabled, placeholder = props.placeholder, tooltipContent = props.tooltipContent, tooltipPosition = props.tooltipPosition, alignText = props.alignText, className = props.className, children = props.children, isFocused = props.isFocused, onClear = props.onClear, onPasswordToggle = props.onPasswordToggle, width = props.width, isPasswordVisible = props.isPasswordVisible, isHasValue = props.isHasValue, isShowClearIcon = props.isShowClearIcon, isShowMask = props.isShowMask, _a = props.testId, testId = _a === void 0 ? "testIDWithoutName" : _a, isReadOnly = props.isReadOnly, isRequired = props.isRequired, _b = props.size, size = _b === void 0 ? "l" : _b, status = props.status, statusText = props.statusText, iconLeft = props.iconLeft, iconRight = props.iconRight, classNameIconBox = props.classNameIconBox, isShowLabel = props.isShowLabel, classNameAddonsRight = props.classNameAddonsRight, classNameContent = props.classNameContent, classNamePlaceholder = props.classNamePlaceholder, onIconLeftClick = props.onIconLeftClick, onIconRightClick = props.onIconRightClick, _c = props.viewType, viewType = _c === void 0 ? "round" : _c, otherProps = __rest(props, ["error", "type", "isDisabled", "placeholder", "tooltipContent", "tooltipPosition", "alignText", "className", "children", "isFocused", "onClear", "onPasswordToggle", "width", "isPasswordVisible", "isHasValue", "isShowClearIcon", "isShowMask", "testId", "isReadOnly", "isRequired", "size", "status", "statusText", "iconLeft", "iconRight", "classNameIconBox", "isShowLabel", "classNameAddonsRight", "classNameContent", "classNamePlaceholder", "onIconLeftClick", "onIconRightClick", "viewType"]);
    var IconsBoxProps = {
        isHasValue: isHasValue,
        isDisabled: isDisabled,
        isShowClearIcon: isShowClearIcon,
        type: type,
        isPasswordVisible: isPasswordVisible,
        tooltipContent: tooltipContent,
        tooltipPosition: tooltipPosition,
        onClear: onClear,
        onPasswordToggle: onPasswordToggle,
        classNameIconBox: classNameIconBox,
        isReadOnly: isReadOnly
    };
    var getPlaceholder = function (value) {
        if (typeof value === "string") {
            return value;
        }
        else {
            return isHasValue || isFocused ? value[1] : value[0];
        }
    };
    return (React.createElement(LabelStyled, { width: width, "data-testid": testId + "_label" },
        React.createElement(InputWrapperStyled, __assign({ ref: ref, isFocused: isFocused, isDisabled: isDisabled, isReadOnly: isReadOnly, size: size, width: width, alignText: alignText, className: className, status: status, viewType: viewType, statusText: statusText, error: error, isHasValue: isHasValue, "data-testid": testId }, otherProps),
            React.createElement(InputLeadContentStyled, { isDisabled: isDisabled, isReadOnly: isReadOnly, isFocused: isFocused, isHasValue: isHasValue || isReadOnly, isPlaceholder: Boolean(placeholder), className: classNameContent },
                iconLeft && (React.createElement(IconStyled, { isFocused: isFocused, isDisabled: isDisabled, isReadOnly: isReadOnly, onClick: onIconLeftClick }, iconLeft)),
                placeholder && (isShowLabel || (!isFocused && !isHasValue)) && (React.createElement(PlaceholderStyled, { iconLeft: Boolean(iconLeft), isReadOnly: isReadOnly, isDisabled: isDisabled, "data-element": "input-placeholder", "data-testid": testId + "-placeholder", error: error, size: size, isFocused: isFocused, isHasValue: isHasValue || Boolean(isShowMask) || Boolean(isReadOnly), title: isDisabled ? undefined : getPlaceholder(placeholder), status: status, className: classNamePlaceholder },
                    React.createElement("span", { className: "placeholder-text" }, getPlaceholder(placeholder)),
                    isRequired && (React.createElement(React.Fragment, null,
                        "\u00A0",
                        React.createElement(RequiredStyle, { isDisabled: isDisabled || isReadOnly }, "*"))))),
                children),
            React.createElement(IconsBox, __assign({}, IconsBoxProps)),
            iconRight && (React.createElement(IconRightStyled, { isFocused: isFocused, isDisabled: isDisabled, isReadOnly: isReadOnly, className: classNameAddonsRight, onClick: function (e) {
                    onIconRightClick && onIconRightClick();
                    e.preventDefault();
                } }, iconRight))),
        typeof error === "string" && Boolean(error.trim()) && (React.createElement(TextStatusStyled, { status: "error", "data-element": "input-error", type: "pavo" }, error)),
        status && statusText && (React.createElement(TextStatusStyled, { status: status, "data-element": "input-text", "data-testid": testId + "_status-text", type: "pavo" }, statusText))));
});
InputBase.displayName = "InputBase";
export default InputBase;
