albinasoft-ui-package 1.0.1 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/dist/Button/button.d.ts +7 -0
  2. package/dist/Button/button.js +11 -0
  3. package/dist/index.d.ts +2 -0
  4. package/dist/index.js +8 -0
  5. package/package.json +18 -34
  6. package/readme.md +10 -0
  7. package/dist/index.cjs +0 -2
  8. package/dist/index.cjs.map +0 -1
  9. package/dist/index.modern.js +0 -2
  10. package/dist/index.modern.js.map +0 -1
  11. package/dist/index.module.js +0 -2
  12. package/dist/index.module.js.map +0 -1
  13. package/dist/index.umd.js +0 -2
  14. package/dist/index.umd.js.map +0 -1
  15. package/src/assets/css/custom/components.css +0 -20
  16. package/src/assets/css/custom/layout.css +0 -89
  17. package/src/assets/css/dark.css +0 -2145
  18. package/src/assets/css/main.css +0 -26263
  19. package/src/assets/data/countryCodes.json +0 -1466
  20. package/src/assets/images/albinasoft/albinasoft_logo.ico +0 -0
  21. package/src/assets/images/albinasoft/albinasoft_logo.png +0 -0
  22. package/src/assets/images/albinasoft/albinasoft_logo.svg +0 -22
  23. package/src/assets/images/albinasoft/albinasoft_logo_blue.svg +0 -7
  24. package/src/assets/images/albinasoft/albinasoft_logo_spin.gif +0 -0
  25. package/src/assets/images/albinasoft/albinasoft_logo_white.svg +0 -1
  26. package/src/assets/images/header/top-header.png +0 -0
  27. package/src/assets/images/header/top-image.jpg +0 -0
  28. package/src/components/CustomButton.tsx +0 -73
  29. package/src/components/CustomCheckbox.tsx +0 -122
  30. package/src/components/CustomDateTimePicker.tsx +0 -127
  31. package/src/components/CustomDivider.tsx +0 -90
  32. package/src/components/CustomForm.tsx +0 -327
  33. package/src/components/CustomInput.tsx +0 -180
  34. package/src/components/CustomModal.tsx +0 -43
  35. package/src/components/CustomRadioButton.tsx +0 -119
  36. package/src/components/CustomRichTextbox.tsx +0 -123
  37. package/src/components/CustomSelect.tsx +0 -134
  38. package/src/components/CustomText.tsx +0 -199
  39. package/src/components/CustomTextarea.tsx +0 -131
  40. package/src/components/CustomUploader.tsx +0 -125
  41. package/src/components/layout/FullScreenToggle.tsx +0 -72
  42. package/src/components/layout/LoginDropdown.tsx +0 -39
  43. package/src/components/layout/ThemeToggle.tsx +0 -59
  44. package/src/index.js +0 -26
@@ -1,327 +0,0 @@
1
- import React, { useRef } from 'react';
2
- import { toast } from 'react-toastify';
3
- import CustomButton from './CustomButton';
4
- import CustomInput from './CustomInput';
5
- import CustomTextarea from './CustomTextarea';
6
- import CustomCheckbox from './CustomCheckbox';
7
- import CustomRadioButton from './CustomRadioButton';
8
- import CustomSelect from './CustomSelect';
9
- import CustomDateTimePicker from './CustomDateTimePicker';
10
- import CustomText from './CustomText';
11
- import CustomDivider from './CustomDivider';
12
- import CustomRichTextbox from './CustomRichTextbox';
13
- import CustomUploader from './CustomUploader';
14
-
15
- enum ElementType {
16
- INPUT = 'input',
17
- TEXTAREA = 'textarea',
18
- CHECKBOX = 'checkbox',
19
- RADIO = 'radio',
20
- SELECT = 'select',
21
- DATETIMEPICKER = 'datetimepicker',
22
- TEXT = 'text',
23
- DIVIDER = 'divider',
24
- RICHTEXTBOX = 'richtextbox',
25
- UPLOADER = 'uploader',
26
- }
27
-
28
- // Form Elemanlarının Türleri
29
- interface InputElement {
30
- id?: string;
31
- type: ElementType;
32
- label: string;
33
- value: string;
34
- rowId?: number; // Hangi satır
35
- colId?: number; // Hangi sütun
36
- innerRowId?: number; // Hangi iç satır
37
- colClass?: string; // Bootstrap sütun genişliği
38
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
39
- }
40
-
41
- interface TextareaElement {
42
- id?: string;
43
- type: ElementType.TEXTAREA;
44
- label: string;
45
- value: string;
46
- rowId?: number; // Hangi satır
47
- colId?: number; // Hangi sütun
48
- innerRowId?: number; // Hangi iç satır
49
- colClass?: string; // Bootstrap sütun genişliği
50
- onChange: (e: React.ChangeEvent<HTMLTextAreaElement>) => void;
51
- }
52
-
53
- interface CheckboxElement {
54
- id?: string;
55
- type: ElementType.CHECKBOX;
56
- label: string;
57
- value: boolean;
58
- rowId?: number; // Hangi satır
59
- colId?: number; // Hangi sütun
60
- innerRowId?: number; // Hangi iç satır
61
- colClass?: string; // Bootstrap sütun genişliği
62
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
63
- }
64
-
65
- interface RadioButtonElement {
66
- id?: string;
67
- type: ElementType.RADIO;
68
- label: string;
69
- value: string;
70
- options: {
71
- id: string;
72
- label: string;
73
- value: string;
74
- }[];
75
- rowId?: number; // Hangi satır
76
- colId?: number; // Hangi sütun
77
- innerRowId?: number; // Hangi iç satır
78
- colClass?: string; // Bootstrap sütun genişliği
79
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
80
- }
81
-
82
- interface SelectElement {
83
- id?: string;
84
- type: ElementType.SELECT;
85
- label: string;
86
- value: string[];
87
- options: {
88
- id: string;
89
- label: string;
90
- value: string;
91
- }[];
92
- rowId?: number; // Hangi satır
93
- colId?: number; // Hangi sütun
94
- innerRowId?: number; // Hangi iç satır
95
- colClass?: string; // Bootstrap sütun genişliği
96
- onChange: (value: string | string[]) => void;
97
- }
98
-
99
- interface DateTimePickerElement {
100
- id?: string;
101
- type: ElementType.DATETIMEPICKER;
102
- label: string;
103
- value: Date | null;
104
- rowId?: number; // Hangi satır
105
- colId?: number; // Hangi sütun
106
- innerRowId?: number; // Hangi iç satır
107
- colClass?: string; // Bootstrap sütun genişliği
108
- onChange: (e: Date | null) => void;
109
- }
110
-
111
- interface TextElement {
112
- id: string;
113
- type: ElementType;
114
- value: string;
115
- rowId?: number; // Hangi satır
116
- colId?: number; // Hangi sütun
117
- innerRowId?: number; // Hangi iç satır
118
- colClass?: string; // Bootstrap sütun genişliği
119
- style?: React.CSSProperties;
120
- className?: string;
121
- }
122
-
123
- interface DividerElement {
124
- id?: string;
125
- type: ElementType.DIVIDER;
126
- //value: string;
127
- rowId?: number; // Hangi satır
128
- colId?: number; // Hangi sütun
129
- innerRowId?: number; // Hangi iç satır
130
- colClass?: string; // Bootstrap sütun genişliği
131
- className?: string;
132
- style?: React.CSSProperties;
133
- }
134
-
135
- interface RichTextboxElement {
136
- id?: string;
137
- type: ElementType.RICHTEXTBOX;
138
- label: string;
139
- value: string;
140
- rowId?: number;
141
- colId?: number;
142
- innerRowId?: number;
143
- colClass?: string;
144
- onChange: (value: string) => void;
145
- }
146
-
147
- // interface UploaderElement {
148
- // id: string;
149
- // type: ElementType.UPLOADER; // Uploader bileşeni türü
150
- // label: string; // Etiket
151
- // value?: FileInfo[]; // Varsayılan değer
152
- // rowId?: number; // Satır numarası
153
- // colId?: number; // Sütun numarası
154
- // innerRowId?: number; // İç satır numarası
155
- // colClass?: string; // CSS sınıfı (ör. Bootstrap sütun genişliği)
156
- // onChange: (files: FileInfo[]) => void; // Değişiklik olayları için callback
157
- // onError?: (errorType: UploadError, file?: File) => void; // Hata işleyici (isteğe bağlı)
158
- // }
159
-
160
- // Mevcut Türlerle Birleştirme
161
- type FormElement =
162
- | InputElement
163
- | TextareaElement
164
- | CheckboxElement
165
- | RadioButtonElement
166
- | SelectElement
167
- | DateTimePickerElement
168
- | TextElement
169
- | DividerElement
170
- | RichTextboxElement;
171
- // | UploaderElement;
172
-
173
- interface CustomFormProps {
174
- elements: FormElement[];
175
- onSubmit: (formValues: Record<string, any>) => void;
176
- confirmLabel?: string; // Confirm butonu etiketi
177
- cancelLabel?: string; // Cancel butonu etiketi
178
- handleCancel?: () => void; // Cancel butonu işlevi
179
- showConfirmButton?: boolean; // Confirm butonunun görünürlüğü
180
- showCancelButton?: boolean; // Cancel butonunun görünürlüğü
181
- }
182
-
183
- const CustomForm: React.FC<CustomFormProps> = ({
184
- elements,
185
- onSubmit,
186
- confirmLabel = 'Confirm', // Varsayılan değer
187
- cancelLabel = 'Cancel', // Varsayılan değer
188
- handleCancel,
189
- showConfirmButton = true, // Varsayılan olarak görünür
190
- showCancelButton = false, // Varsayılan olarak görünür
191
- }) => {
192
- const formRef = useRef<HTMLFormElement>(null);
193
-
194
- const handleConfirm = (e: React.FormEvent) => {
195
- e.preventDefault();
196
-
197
- const form = formRef.current;
198
- if (!form) return;
199
-
200
- const isValid = form.checkValidity();
201
- if (isValid) {
202
- const formValues: Record<string, any> = {};
203
-
204
- Array.from(form.elements).forEach((element) => {
205
- if (
206
- element instanceof HTMLInputElement ||
207
- element instanceof HTMLTextAreaElement ||
208
- element instanceof HTMLSelectElement
209
- ) {
210
- if (element.id) { //RichTextbox boş göndermemesi için
211
- const name = element.name || element.id;
212
-
213
- if (element instanceof HTMLInputElement && element.type === ElementType.RADIO) {
214
- if (element.checked) {
215
- formValues[name] = element.value;
216
- }
217
- } else if (element instanceof HTMLInputElement && element.type === ElementType.CHECKBOX) {
218
- formValues[name] = element.checked;
219
- } else if (element instanceof HTMLSelectElement && element.multiple) {
220
- const selectedOptions = Array.from(element.selectedOptions).map(
221
- (option) => option.value
222
- );
223
- formValues[name] = selectedOptions;
224
- } else if (element instanceof HTMLSelectElement) {
225
- formValues[name] = [element.value]; // Tekli seçim bile array olarak döner
226
- }
227
- else {
228
- formValues[name] = element.value;
229
- }
230
-
231
- }
232
- }
233
- });
234
-
235
- // CustomForm elemanlarını kontrol etme
236
- elements.forEach((element) => {
237
- if (element.type === ElementType.RICHTEXTBOX) {
238
- formValues[element.id!] = element.value; // RichTextbox değerini ekleme
239
- }
240
- });
241
-
242
- // Form verilerini JSON olarak çıktıya yazdır
243
- console.log(JSON.stringify(formValues, null, 2));
244
-
245
- onSubmit(formValues);
246
- } else {
247
- toast.error('Gerekli tüm alanları doldurunuz.');
248
- form.classList.add('was-validated');
249
- }
250
- };
251
-
252
- // Elemanları satır, sütun ve iç satıra göre gruplama
253
- const groupedElements = elements.reduce<Record<number, Record<number, Record<number, FormElement[]>>>>(
254
- (acc, el) => {
255
- const row = el.rowId || 0;
256
- const col = el.colId || 0;
257
- const innerRow = el.innerRowId || 0;
258
-
259
- if (!acc[row]) acc[row] = {};
260
- if (!acc[row][col]) acc[row][col] = {};
261
- if (!acc[row][col][innerRow]) acc[row][col][innerRow] = [];
262
-
263
- acc[row][col][innerRow].push(el);
264
- return acc;
265
- },
266
- {}
267
- );
268
-
269
- return (
270
- <form ref={formRef} noValidate className="needs-validation" autoComplete="off">
271
- {Object.entries(groupedElements).map(([rowId, columns]) => (
272
- <div className="row" key={`row-${rowId}`}>
273
- {Object.entries(columns).map(([colId, innerRows]) => (
274
- <div className="col" key={`col-${rowId}-${colId}`}>
275
- {Object.entries(innerRows).map(([innerRowId, elements]) => (
276
- <div className="row" key={`inner-row-${rowId}-${colId}-${innerRowId}`}>
277
- {elements.map((element) => (
278
- <div className={element.colClass || 'col-12'} key={element.id}>
279
- {element.type === ElementType.TEXT ? (
280
- <CustomText {...(element as TextElement)} />
281
- ) : element.type === ElementType.INPUT ? (
282
- <CustomInput {...(element as InputElement)} />
283
- ) : element.type === ElementType.TEXTAREA ? (
284
- <CustomTextarea {...(element as TextareaElement)} />
285
- ) : element.type === ElementType.CHECKBOX ? (
286
- <CustomCheckbox {...(element as CheckboxElement)} />
287
- ) : element.type === ElementType.RADIO ? (
288
- <CustomRadioButton {...(element as RadioButtonElement)} />
289
- ) : element.type === ElementType.SELECT ? (
290
- <CustomSelect {...(element as SelectElement)} />
291
- ) : element.type === ElementType.DATETIMEPICKER ? (
292
- <CustomDateTimePicker {...(element as DateTimePickerElement)} />
293
- ) : element.type === ElementType.DIVIDER ? (
294
- <CustomDivider {...(element as DividerElement)} />
295
- ) : element.type === ElementType.RICHTEXTBOX ? (
296
- <CustomRichTextbox {...(element as RichTextboxElement)} />
297
- // ) : element.type === ElementType.UPLOADER ? (
298
- // <CustomUploader {...(element as UploaderElement)} />
299
- ) : null}
300
- </div>
301
- ))}
302
- </div>
303
- ))}
304
- </div>
305
- ))}
306
- </div>
307
- ))}
308
- <div className="card-footer mt-3">
309
- <div className="form-actions mt-3">
310
- {showCancelButton && (
311
- <CustomButton
312
- label={cancelLabel}
313
- className="btn btn-secondary"
314
- onClick={handleCancel || (() => { })}
315
- />
316
- )}
317
- {showConfirmButton && (
318
- <CustomButton label={confirmLabel} onClick={handleConfirm} />
319
- )}
320
- </div>
321
- </div>
322
- </form>
323
- );
324
- };
325
-
326
- export { CustomForm, ElementType };
327
- export default CustomForm;
@@ -1,180 +0,0 @@
1
- import React, { useState } from 'react';
2
- import { OverlayTrigger, Tooltip } from 'react-bootstrap';
3
- import { FaExclamationTriangle, FaEye, FaEyeSlash, FaInfoCircle } from 'react-icons/fa';
4
-
5
- enum InputType {
6
- TEXT = 'text',
7
- NUMBER = 'number',
8
- TEL = 'tel',
9
- PASSWORD = 'password',
10
- EMAIL = 'email',
11
- FILE = 'file'
12
- }
13
-
14
- interface CustomInputProps {
15
- id?: string;
16
- name?: string;
17
- label: string;
18
- inputType?: InputType;
19
- value: string;
20
- placeholder?: string;
21
- required?: boolean;
22
- errorMessage?: string;
23
- conditionalErrorVisible?: boolean;
24
- conditionalErrorMessage?: string;
25
- disabled?: boolean;
26
- readOnly?: boolean;
27
- buttonIcon?: React.ReactNode;
28
- buttonTooltip?: string;
29
- description?: string | null;
30
- tooltip?: string;
31
- style?: React.CSSProperties;
32
- className?: string;
33
- buttonOnClick?: () => void;
34
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
35
- }
36
-
37
- const CustomInput: React.FC<CustomInputProps> = ({
38
- id,
39
- name,
40
- label,
41
- inputType = InputType.TEXT,
42
- value,
43
- placeholder,
44
- required = false,
45
- errorMessage,
46
- conditionalErrorVisible = false,
47
- conditionalErrorMessage,
48
- disabled = false,
49
- readOnly = false,
50
- buttonIcon,
51
- buttonTooltip,
52
- description,
53
- tooltip,
54
- style,
55
- className,
56
- buttonOnClick,
57
- onChange
58
- }) => {
59
- const [showPassword, setShowPassword] = useState(false);
60
- const handleType = inputType === InputType.PASSWORD && showPassword ? InputType.TEXT : inputType;
61
-
62
- const togglePasswordVisibility = () => {
63
- setShowPassword((prev) => !prev);
64
- };
65
-
66
- return (
67
- <div className={className}>
68
- <div className="form-group">
69
- <label htmlFor={id} className="form-label">
70
- {label}
71
- </label>
72
- <div className="input-group position-relative">
73
-
74
- {tooltip ? (
75
- <OverlayTrigger
76
- placement="bottom"
77
- overlay={<Tooltip id={`tooltip-${tooltip}`}>{tooltip}</Tooltip>}
78
- >
79
- <input
80
- id={id}
81
- name={name}
82
- type={handleType}
83
- value={value}
84
- placeholder={placeholder}
85
- onChange={onChange}
86
- className="form-control"
87
- style={style}
88
- required={required}
89
- disabled={disabled}
90
- autoComplete="new-password" // Modern tarayıcılarda autocomplete autofill engellemek için
91
- />
92
- </OverlayTrigger>
93
- ) : (
94
- <input
95
- id={id}
96
- name={name}
97
- type={handleType}
98
- value={value}
99
- placeholder={placeholder}
100
- onChange={onChange}
101
- className="form-control"
102
- style={style}
103
- required={required}
104
- disabled={disabled}
105
- autoComplete="new-password" // Modern tarayıcılarda autocomplete autofill engellemek için
106
- />
107
- )}
108
-
109
- {/* Parola göster/gizle ikonu */}
110
- {inputType === InputType.PASSWORD && (
111
- <button
112
- type="button"
113
- onClick={togglePasswordVisibility}
114
- className="btn btn-outline-secondary"
115
- title={showPassword ? "Parolayı Gizle" : "Parolayı Göster"}
116
- >
117
- {showPassword ? <FaEyeSlash /> : <FaEye />}
118
- </button>
119
- )}
120
-
121
- {/* Özel Buton */}
122
- {buttonIcon && buttonOnClick && (
123
- <button
124
- type="button"
125
- onClick={buttonOnClick}
126
- className="btn btn-outline-secondary"
127
- title={buttonTooltip || ""}
128
- >
129
- {buttonIcon}
130
- </button>
131
- )}
132
-
133
- {required && (
134
- <div className="invalid-feedback text-danger">
135
- <div className="description-icon">
136
- <FaExclamationTriangle />
137
- </div>
138
- <div className="description-text">
139
- <span>
140
- {errorMessage || 'Bu alan boş bırakılamaz.'}
141
- </span>
142
- </div>
143
- </div>
144
- )}
145
-
146
- {conditionalErrorVisible && (
147
- <div className="conditional-error-message text-warning">
148
- <div className="description-icon">
149
- <FaExclamationTriangle />
150
- </div>
151
- <div className="description-text">
152
- <span>
153
- {conditionalErrorMessage}
154
- </span>
155
- </div>
156
- </div>
157
- )}
158
-
159
- {description && (
160
- <div className="form-description text-secondary">
161
- <div className="description-icon">
162
- <FaInfoCircle />
163
- </div>
164
- <div className="description-text">
165
- <span>
166
- {description}
167
- </span>
168
- </div>
169
- </div>
170
- )}
171
-
172
- </div>
173
- </div>
174
- </div>
175
- );
176
-
177
- };
178
-
179
- export { CustomInput, InputType };
180
- export default CustomInput;
@@ -1,43 +0,0 @@
1
- import React from 'react';
2
- import { Modal } from 'react-bootstrap';
3
-
4
- interface CustomModalProps {
5
- show: boolean; // Modalın açık/kapalı durumu
6
- title?: string; // Modal başlığı
7
- size?: 'sm' | 'lg' | 'xl' | 'fullscreen'; // Modal boyutu ve fullscreen seçeneği
8
- onHide: () => void; // Modalı kapatma fonksiyonu
9
- children?: React.ReactNode; // Modal içeriği
10
- footer?: React.ReactNode; // Modal footer içeriği (isteğe bağlı)
11
- style?: React.CSSProperties; // Modalın özel stilleri
12
- bodyStyle?: React.CSSProperties; // Modal.Body için stil özelliği
13
- }
14
-
15
- const CustomModal: React.FC<CustomModalProps> = ({
16
- show,
17
- title = 'Default Title',
18
- size = 'lg',
19
- onHide,
20
- children,
21
- footer,
22
- style,
23
- bodyStyle, // Modal.Body için özel stil
24
- }) => {
25
- return (
26
- <Modal
27
- show={show}
28
- onHide={onHide}
29
- size={size !== 'fullscreen' ? size : undefined} // Tam ekran haricinde boyut seçimi
30
- fullscreen={size === 'fullscreen' ? true : undefined} // React-Bootstrap'ın fullscreen özelliği
31
- centered={size !== 'fullscreen'} // Tam ekran dışında merkezleme
32
- style={style} // Stil özelliği eklendi
33
- >
34
- <Modal.Header closeButton>
35
- <Modal.Title>{title}</Modal.Title>
36
- </Modal.Header>
37
- <Modal.Body style={bodyStyle}>{children}</Modal.Body>
38
- {footer && <Modal.Footer>{footer}</Modal.Footer>}
39
- </Modal>
40
- );
41
- };
42
-
43
- export default CustomModal;
@@ -1,119 +0,0 @@
1
- import React from 'react';
2
- import { OverlayTrigger, Tooltip } from 'react-bootstrap';
3
- import { FaExclamationTriangle, FaInfoCircle } from 'react-icons/fa';
4
-
5
- interface CustomRadioButtonOption {
6
- id: string;
7
- label: string;
8
- value: string;
9
- }
10
-
11
- interface CustomRadioButtonProps {
12
- id?: string;
13
- name?: string;
14
- label: string;
15
- options: CustomRadioButtonOption[];
16
- value: string;
17
- required?: boolean;
18
- errorMessage?: string;
19
- conditionalErrorVisible?: boolean;
20
- conditionalErrorMessage?: string;
21
- tooltip?: string;
22
- description?: string | null;
23
- disabled?: boolean;
24
- className?: string;
25
- style?: React.CSSProperties;
26
- onChange: (e: React.ChangeEvent<HTMLInputElement>) => void;
27
- }
28
-
29
- const CustomRadioButton: React.FC<CustomRadioButtonProps> = ({
30
- id,
31
- name,
32
- label,
33
- options,
34
- value,
35
- required = false,
36
- errorMessage,
37
- conditionalErrorVisible,
38
- conditionalErrorMessage,
39
- tooltip,
40
- description,
41
- disabled = false,
42
- className,
43
- style,
44
- onChange,
45
- }) => {
46
- return (
47
- <div className={className} style={style}>
48
- <div className="form-group">
49
- <label className="form-label">{label}</label>
50
- <div className="radio-options">
51
- {options.map((option, index) => (
52
- <div key={option.id} className="form-check">
53
- <OverlayTrigger
54
- placement="bottom"
55
- overlay={
56
- tooltip ? (
57
- <Tooltip id={`tooltip-${option.id}`}>
58
- {tooltip}
59
- </Tooltip>
60
- ) : <></>
61
- }
62
- >
63
- <input
64
- id={option.id}
65
- name={name || id}
66
- type="radio"
67
- className="form-check-input"
68
- value={option.value}
69
- checked={value === option.value}
70
- disabled={disabled}
71
- onChange={onChange}
72
- required={required}
73
- />
74
- </OverlayTrigger>
75
- <label htmlFor={option.id} className="form-check-label">
76
- {option.label}
77
- </label>
78
-
79
- {required && !value && index === options.length - 1 && (
80
- <div className="invalid-feedback text-danger mt-2">
81
- <div className="description-icon">
82
- <FaExclamationTriangle />
83
- </div>
84
- <div className="description-text">
85
- <span>{errorMessage || 'Seçim yapılması gerekmektedir.'}</span>
86
- </div>
87
- </div>
88
- )}
89
-
90
- {conditionalErrorVisible && index === options.length - 1 && (
91
- <div className="conditional-error-message text-warning mt-2">
92
- <div className="description-icon">
93
- <FaExclamationTriangle />
94
- </div>
95
- <div className="description-text">
96
- <span>{conditionalErrorMessage}</span>
97
- </div>
98
- </div>
99
- )}
100
-
101
- {description && index === options.length - 1 && (
102
- <div className="form-description text-secondary mt-2">
103
- <div className="description-icon">
104
- <FaInfoCircle />
105
- </div>
106
- <div className="description-text">
107
- <span>{description}</span>
108
- </div>
109
- </div>
110
- )}
111
- </div>
112
- ))}
113
- </div>
114
- </div>
115
- </div>
116
- );
117
- };
118
-
119
- export default CustomRadioButton;