75 lines
1.5 KiB
JavaScript
75 lines
1.5 KiB
JavaScript
import React from "react";
|
|
import "../styles/text-input.scss";
|
|
const TextInput = (props) => {
|
|
const {
|
|
error,
|
|
message,
|
|
inputClassName,
|
|
labelClassName,
|
|
label,
|
|
name,
|
|
value,
|
|
values,
|
|
onChange,
|
|
id,
|
|
type,
|
|
disabled,
|
|
} = props;
|
|
|
|
return (
|
|
<div
|
|
className={
|
|
inputClassName
|
|
? `pe-input-container form-floating mb-3 ${inputClassName}`
|
|
: "pe-input-container form-floating mb-3"
|
|
}
|
|
>
|
|
{label ? (
|
|
<label htmlFor="signup" className="form-label">
|
|
{label}
|
|
</label>
|
|
) : (
|
|
<></>
|
|
)}
|
|
{type === "select" ? (
|
|
<select
|
|
id={id}
|
|
className={`form-select`}
|
|
value={value}
|
|
name={name}
|
|
disabled={disabled}
|
|
onChange={onChange}
|
|
>
|
|
<option
|
|
id="ddlProducts"
|
|
className={`select-option`}
|
|
value=""
|
|
></option>
|
|
{values.map((item, i) => (
|
|
<option
|
|
id="ddlProducts"
|
|
className={`select-option`}
|
|
key={`item${i}`}
|
|
>
|
|
{item}
|
|
</option>
|
|
))}
|
|
</select>
|
|
) : (
|
|
<input
|
|
id={id}
|
|
className={`form-control ${inputClassName}`}
|
|
value={value}
|
|
name={name}
|
|
disabled={disabled}
|
|
onChange={onChange}
|
|
type={type}
|
|
/>
|
|
)}
|
|
{error ? <div className="textinput-error-box">{message}</div> : <></>}
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default TextInput;
|