import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState } from "react";
import "./style.scss";
import GetSvgIcon from "../GetSvgIcon";
const InputField = ({ id, value, type = "text", placeholder = "", style = {}, disabled = false, errorState = false, props = {}, onChangeHandler, errorMessage = "Something went wrong!", name, register = (_prop) => ({}), autoComplete = "on", dataCyInput, dataCyToggle, inputFieldClassname, }) => {
    const [showPassword, setShowPassword] = useState(false);
    const togglePasswordVisibility = () => {
        setShowPassword((prevShowPassword) => !prevShowPassword);
    };
    return (_jsxs("div", { className: "parent-inputfiled", children: [_jsxs("div", { className: `inputFieldGeneric ${errorState && "errorInputField"}`, children: [_jsx("input", { id: id, type: showPassword ? "text" : type, disabled: disabled, style: style, placeholder: placeholder, value: value, onChange: onChangeHandler, name: name, ...register(name), ...props, autoComplete: autoComplete, "data-cy": dataCyInput, className: inputFieldClassname }), type === "password" && (_jsx("span", { className: "passwordToggle", onClick: togglePasswordVisibility, "data-cy": dataCyToggle, children: showPassword ? (_jsx(GetSvgIcon, { iconType: "eye", iconSize: "16" })) : (_jsx(GetSvgIcon, { iconType: "eyeOff", iconSize: "16" })) }))] }), errorState && _jsx("span", { children: errorMessage })] }));
};
export default InputField;
