Amp_Intelligence/amp-client/src/Components/CommonComponents/InputField/InputField.jsx at 1ab94fa04c30ff6c444fd855c948c71b5037f9d3 · Riyad-Murad/Amp_Intelligence · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
import "./styles.css";

const InputField = ({
  label,
  placeholder,
  value,
  onChange,
  width,
  textarea,
  type,
  required = true,
}) => {
  return (
    <div className="input-field-container" style={{ width: width || "100%" }}>
      <label className="subtitle black-color">
        {label}
        {required ? <span>*</span> : null}
      </label>
      {textarea ? (
        <textarea
          placeholder={placeholder}
          value={value}
          onChange={onChange}
          required={required}
        />
      ) : (
        <input
          type={type || "text"}
          placeholder={placeholder}
          value={value}
          onChange={onChange}
          required={required}
        />
      )}
    </div>
  );
};

// V2
// const InputField = ({
//   label,
//   placeholder,
//   value,
//   onChange,
//   width,
//   textarea,
//   type,
//   required = true,
// }) => {
//   return (
//     <div className="input-field-container" style={{ width: width || "100%" }}>
//       <label className="subtitle black-color">
//         {label} {required && <span>*</span>}
//       </label>
//       {textarea ? (
//         <textarea placeholder={placeholder} value={value} onChange={onChange} />
//       ) : (
//         <input
//           type={type || "text"}
//           placeholder={placeholder}
//           value={value}
//           onChange={onChange}
//         />
//       )}
//     </div>
//   );
// };

// const InputField = ({ label, placeholder, value, onChange, width, textarea, type }) => {
//   return (
//     <div className="input-field-container" style={{ width: width || '100%' }}>
//       <label className="subtitle black-color">{label}*</label>
//       {textarea ? (
//         <textarea
//           placeholder={placeholder}
//           value={value}
//           onChange={onChange}
//         />
//       ) : (
//         <input
//           type={type?type:"text"}
//           placeholder={placeholder}
//           value={value}
//           onChange={onChange}
//         />
//       )}
//     </div>
//   );
// }

export default InputField;