albinasoft-ui-package 1.1.35 → 1.1.37

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 (5) hide show
  1. package/dist/components/CustomFileUploader.d.ts +0 -1
  2. package/dist/components/CustomFileUploader.js +83 -100
  3. package/dist/components/CustomForm.d.ts +0 -1
  4. package/dist/components/CustomForm.js +4 -24
  5. package/package.json +1 -1
package/dist/components/CustomFileUploader.d.ts CHANGED
@@ -55,7 +55,6 @@ export interface CustomFileUploaderProps {
55
55
  * Eğer bu prop’un değeri değişirse uploader içini temizle
56
56
  */
57
57
  clearTrigger?: any;
58
- onUploadedListChange?: (uploadedFileNames: string[]) => void;
59
58
  }
60
59
  declare const CustomFileUploader: React.FC<CustomFileUploaderProps>;
61
60
  export default CustomFileUploader;
package/dist/components/CustomFileUploader.js CHANGED
@@ -117,6 +117,18 @@ exports.defaultTranslations = {
117
117
  // ====================
118
118
  // Stil Ayarları
119
119
  // ====================
120
+ var spinnerStyle = {
121
+ position: "absolute",
122
+ top: "40%",
123
+ left: "40%",
124
+ width: "20px",
125
+ height: "20px",
126
+ border: "2px solid #007bff",
127
+ borderTop: "2px solid transparent",
128
+ borderRadius: "50%",
129
+ animation: "spin 1s linear infinite",
130
+ zIndex: 3,
131
+ };
120
132
  var dropAreaStyle = {
121
133
  border: "2px dashed #007bff",
122
134
  borderRadius: "5px",
@@ -235,6 +247,14 @@ var CustomFileUploader = function (props) {
235
247
  handleClearAll();
236
248
  }
237
249
  }, [clearTrigger]);
250
+ (0, react_1.useEffect)(function () {
251
+ var style = document.createElement("style");
252
+ style.innerHTML = "\n @keyframes spin {\n to { transform: rotate(360deg); }\n }\n ";
253
+ document.head.appendChild(style);
254
+ return function () {
255
+ document.head.removeChild(style);
256
+ };
257
+ }, []);
238
258
  // Pending dosya sayısını parent'a iletecek yardımcı fonksiyon
239
259
  var updatePendingStatus = function (previewsArray) {
240
260
  if (onPendingChange) {
@@ -308,12 +328,7 @@ var CustomFileUploader = function (props) {
308
328
  };
309
329
  // Dosya kaldırma işlemi
310
330
  var handleRemoveFile = function (previewId) {
311
- var _a;
312
331
  var updatedPreviews = previews.filter(function (item) { return item.id !== previewId; });
313
- var uploadedList = updatedPreviews
314
- .filter(function (p) { return p.uploaded && p.serverFileName; })
315
- .map(function (p) { return p.serverFileName; });
316
- (_a = props.onUploadedListChange) === null || _a === void 0 ? void 0 : _a.call(props, uploadedList);
317
332
  setPreviews(updatedPreviews);
318
333
  updatePendingStatus(updatedPreviews);
319
334
  var itemToRemove = previews.find(function (item) { return item.id === previewId; });
@@ -323,96 +338,75 @@ var CustomFileUploader = function (props) {
323
338
  };
324
339
  // Dosyaları sunucuya yükleme işlemi
325
340
  var handleUpload = function () { return __awaiter(void 0, void 0, void 0, function () {
326
- var pendingItems, _loop_1, i;
341
+ var filesToUpload, formData, response, data, uploadedFileNames_1, errorData, error_1;
327
342
  return __generator(this, function (_a) {
328
343
  switch (_a.label) {
329
344
  case 0:
330
- pendingItems = previews.filter(function (item) { return !item.uploaded; });
331
- if (pendingItems.length === 0) {
345
+ filesToUpload = previews.filter(function (item) { return !item.uploaded; }).map(function (item) { return item.file; });
346
+ if (filesToUpload.length === 0) {
332
347
  react_toastify_1.toast.warning(finalTranslations.noFileSelectedWarning);
333
348
  return [2 /*return*/];
334
349
  }
335
- _loop_1 = function (i) {
336
- var item, formData, response, data, uploadedFileName_1, error_1;
337
- return __generator(this, function (_b) {
338
- switch (_b.label) {
339
- case 0:
340
- item = pendingItems[i];
341
- // isUploading = true olarak işaretle
342
- setPreviews(function (prev) {
343
- var updated = prev.map(function (p) {
344
- return p.id === item.id ? __assign(__assign({}, p), { isUploading: true }) : p;
345
- });
346
- updatePendingStatus(updated);
347
- return updated;
348
- });
349
- formData = new FormData();
350
- formData.append("file", item.file);
351
- _b.label = 1;
352
- case 1:
353
- _b.trys.push([1, 6, , 7]);
354
- return [4 /*yield*/, fetch(url, {
355
- method: "POST",
356
- body: formData,
357
- })];
358
- case 2:
359
- response = _b.sent();
360
- if (!response.ok) return [3 /*break*/, 4];
361
- return [4 /*yield*/, response.json()];
362
- case 3:
363
- data = _b.sent();
364
- if (data.responseCode === 200 && data.content && data.content.fileList.length > 0) {
365
- uploadedFileName_1 = data.content.fileList[0].fileName;
366
- setPreviews(function (prev) {
367
- var _a;
368
- var updated = prev.map(function (p) {
369
- return p.id === item.id
370
- ? __assign(__assign({}, p), { uploaded: true, isUploading: false, serverFileName: uploadedFileName_1 }) : p;
371
- });
372
- updatePendingStatus(updated);
373
- var uploadedList = updated
374
- .filter(function (p) { return p.uploaded && p.serverFileName; })
375
- .map(function (p) { return p.serverFileName; });
376
- (_a = props.onUploadedListChange) === null || _a === void 0 ? void 0 : _a.call(props, uploadedList);
377
- return updated;
378
- });
379
- }
380
- else {
381
- throw new Error("Sunucu hatası");
382
- }
383
- return [3 /*break*/, 5];
384
- case 4: throw new Error("HTTP hatası");
385
- case 5: return [3 /*break*/, 7];
386
- case 6:
387
- error_1 = _b.sent();
388
- console.error("Yükleme hatası:", error_1);
389
- react_toastify_1.toast.error("".concat(item.file.name, " y\u00FCklenemedi."));
390
- setPreviews(function (prev) {
391
- var updated = prev.map(function (p) {
392
- return p.id === item.id ? __assign(__assign({}, p), { isUploading: false }) : p;
393
- });
394
- updatePendingStatus(updated);
395
- return updated;
396
- });
397
- return [3 /*break*/, 7];
398
- case 7: return [2 /*return*/];
399
- }
350
+ // Yüklenmeye başlayan dosyaları işaretle
351
+ setPreviews(function (prev) {
352
+ return prev.map(function (item) {
353
+ return !item.uploaded ? __assign(__assign({}, item), { isUploading: true }) : item;
400
354
  });
401
- };
402
- i = 0;
355
+ });
356
+ formData = new FormData();
357
+ filesToUpload.forEach(function (file) {
358
+ formData.append("file", file);
359
+ });
403
360
  _a.label = 1;
404
361
  case 1:
405
- if (!(i < pendingItems.length)) return [3 /*break*/, 4];
406
- return [5 /*yield**/, _loop_1(i)];
362
+ _a.trys.push([1, 7, , 8]);
363
+ return [4 /*yield*/, fetch(url, {
364
+ method: "POST",
365
+ body: formData,
366
+ })];
407
367
  case 2:
408
- _a.sent();
409
- _a.label = 3;
368
+ response = _a.sent();
369
+ if (!response.ok) return [3 /*break*/, 4];
370
+ return [4 /*yield*/, response.json()];
410
371
  case 3:
411
- i++;
412
- return [3 /*break*/, 1];
413
- case 4:
414
- react_toastify_1.toast.success(finalTranslations.uploadSuccessToast);
415
- return [2 /*return*/];
372
+ data = _a.sent();
373
+ if (data.responseCode === 200 &&
374
+ data.content &&
375
+ data.content.fileList &&
376
+ data.content.fileList.length > 0) {
377
+ uploadedFileNames_1 = data.content.fileList.map(function (item) { return item.fileName; });
378
+ if (onUploadComplete) {
379
+ onUploadComplete(uploadedFileNames_1);
380
+ }
381
+ setPreviews(function (prev) {
382
+ var updatedPreviews = prev.map(function (item, index) {
383
+ if (!item.uploaded) {
384
+ return __assign(__assign({}, item), { uploaded: true, isUploading: false, serverFileName: uploadedFileNames_1[index] || item.file.name });
385
+ }
386
+ return item;
387
+ });
388
+ updatePendingStatus(updatedPreviews);
389
+ return updatedPreviews;
390
+ });
391
+ react_toastify_1.toast.success(finalTranslations.uploadSuccessToast);
392
+ }
393
+ else {
394
+ react_toastify_1.toast.error(finalTranslations.uploadErrorToast);
395
+ }
396
+ return [3 /*break*/, 6];
397
+ case 4: return [4 /*yield*/, response.json()];
398
+ case 5:
399
+ errorData = _a.sent();
400
+ console.error("API Hatası:", errorData);
401
+ react_toastify_1.toast.error(finalTranslations.uploadErrorToast);
402
+ _a.label = 6;
403
+ case 6: return [3 /*break*/, 8];
404
+ case 7:
405
+ error_1 = _a.sent();
406
+ console.error("API çağrısında hata:", error_1);
407
+ react_toastify_1.toast.error(finalTranslations.uploadErrorToast);
408
+ return [3 /*break*/, 8];
409
+ case 8: return [2 /*return*/];
416
410
  }
417
411
  });
418
412
  }); };
@@ -425,10 +419,12 @@ var CustomFileUploader = function (props) {
425
419
  react_1.default.createElement("label", { style: { fontWeight: "bold" } }, label))),
426
420
  react_1.default.createElement("div", { style: dropAreaStyle, onDrop: handleDrop, onDragOver: handleDragOver, onClick: handleAreaClick }, previews.length === 0 ? (react_1.default.createElement("div", null, dropAreaText)) : (react_1.default.createElement("div", { style: previewContainerStyle }, previews.map(function (item) { return (react_1.default.createElement("div", { key: item.id, style: { display: "flex", flexDirection: "column", alignItems: "center" } },
427
421
  react_1.default.createElement("div", { style: previewItemStyle },
422
+ item.isUploading && react_1.default.createElement("div", { style: spinnerStyle }),
428
423
  item.isImage ? (react_1.default.createElement("img", { src: item.previewContent, alt: "\u00D6nizleme ".concat(item.id), style: {
429
424
  width: "100%",
430
425
  height: "100%",
431
426
  objectFit: "cover",
427
+ opacity: item.isUploading ? 0.5 : 1,
432
428
  } })) : (react_1.default.createElement("div", { style: {
433
429
  width: "100%",
434
430
  height: "100%",
@@ -436,26 +432,13 @@ var CustomFileUploader = function (props) {
436
432
  justifyContent: "center",
437
433
  alignItems: "center",
438
434
  fontSize: "48px",
435
+ opacity: item.isUploading ? 0.5 : 1,
439
436
  } }, item.previewContent)),
440
437
  react_1.default.createElement("button", { type: "button", style: removeButtonStyle, onClick: function (e) {
441
438
  e.stopPropagation();
442
439
  handleRemoveFile(item.id);
443
- }, title: finalTranslations.removeButtonTitle }, "\u00D7"),
444
- item.uploaded && react_1.default.createElement("div", { style: tickOverlayStyle }, "\u2713"),
445
- item.isUploading && (react_1.default.createElement("div", { style: {
446
- position: "absolute",
447
- top: "0",
448
- left: "0",
449
- width: "100%",
450
- height: "100%",
451
- backgroundColor: "rgba(255,255,255,0.6)",
452
- display: "flex",
453
- justifyContent: "center",
454
- alignItems: "center",
455
- zIndex: 3,
456
- } },
457
- react_1.default.createElement("div", { className: "spinner-border text-primary", role: "status", style: { width: "24px", height: "24px" } },
458
- react_1.default.createElement("span", { className: "visually-hidden" }, "Y\u00FCkleniyor..."))))),
440
+ }, title: finalTranslations.removeButtonTitle, disabled: item.isUploading }, "\u00D7"),
441
+ item.uploaded && react_1.default.createElement("div", { style: tickOverlayStyle }, "\u2713")),
459
442
  react_1.default.createElement("div", { style: {
460
443
  marginTop: "4px",
461
444
  fontSize: "12px",
package/dist/components/CustomForm.d.ts CHANGED
@@ -219,7 +219,6 @@ interface CustomFormProps {
219
219
  handleCancel?: () => void;
220
220
  showConfirmButton?: boolean;
221
221
  showCancelButton?: boolean;
222
- pendingFileCounts?: Record<string, number>;
223
222
  }
224
223
  declare const CustomForm: React.FC<CustomFormProps>;
225
224
  export { CustomForm, ElementType };
package/dist/components/CustomForm.js CHANGED
@@ -69,20 +69,12 @@ var __generator = (this && this.__generator) || function (thisArg, body) {
69
69
  if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
70
70
  }
71
71
  };
72
- var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
73
- if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
74
- if (ar || !(i in from)) {
75
- if (!ar) ar = Array.prototype.slice.call(from, 0, i);
76
- ar[i] = from[i];
77
- }
78
- }
79
- return to.concat(ar || Array.prototype.slice.call(from));
80
- };
81
72
  var __importDefault = (this && this.__importDefault) || function (mod) {
82
73
  return (mod && mod.__esModule) ? mod : { "default": mod };
83
74
  };
84
75
  Object.defineProperty(exports, "__esModule", { value: true });
85
76
  exports.ElementType = exports.CustomForm = void 0;
77
+ //CustomForm.tsx
86
78
  var react_1 = __importStar(require("react"));
87
79
  var react_toastify_1 = require("react-toastify");
88
80
  var CustomButton_1 = __importDefault(require("./CustomButton"));
@@ -125,15 +117,10 @@ var CustomForm = function (_a) {
125
117
  cancelLabel = _c === void 0 ? "Cancel" : _c, // Varsayılan değer
126
118
  handleCancel = _a.handleCancel, _d = _a.showConfirmButton, showConfirmButton = _d === void 0 ? true : _d, // Varsayılan olarak görünür
127
119
  _e = _a.showCancelButton, // Varsayılan olarak görünür
128
- showCancelButton = _e === void 0 ? false : _e, // Varsayılan olarak görünür
129
- pendingFileCounts = _a.pendingFileCounts;
120
+ showCancelButton = _e === void 0 ? false : _e;
130
121
  var formRef = (0, react_1.useRef)(null);
131
122
  var _f = (0, react_1.useState)(false), isLoading = _f[0], setIsLoading = _f[1];
132
123
  var _g = (0, react_1.useState)(false), submitted = _g[0], setSubmitted = _g[1];
133
- var _h = (0, react_1.useState)([]), uploadedFiles = _h[0], setUploadedFiles = _h[1];
134
- var _j = (0, react_1.useState)([]), uploadedFileNames = _j[0], setUploadedFileNames = _j[1];
135
- var isUploadingAnyFile = Object.values(pendingFileCounts || {}).some(function (count) { return count > 0; });
136
- var disableConfirmButton = isLoading || isUploadingAnyFile;
137
124
  var handleConfirm = function (e) { return __awaiter(void 0, void 0, void 0, function () {
138
125
  var form, customSelectValid, isValid, formValues_1, error_1;
139
126
  return __generator(this, function (_a) {
@@ -198,9 +185,6 @@ var CustomForm = function (_a) {
198
185
  formValues_1[element.id] = element.value;
199
186
  }
200
187
  });
201
- formValues_1.uploadedFiles = uploadedFiles;
202
- formValues_1["__uploadedFileNames"] = uploadedFileNames;
203
- formValues_1["fileNames"] = uploadedFileNames;
204
188
  return [4 /*yield*/, onSubmit(formValues_1)];
205
189
  case 2:
206
190
  _a.sent();
@@ -245,18 +229,14 @@ var CustomForm = function (_a) {
245
229
  return (react_1.default.createElement("div", { className: "row ".concat(innerRowCustomClass), key: "inner-row-".concat(rowId, "-").concat(colId, "-").concat(innerRowId) }, elements.map(function (element) { return (react_1.default.createElement("div", { className: element.colClass || "col-12", key: element.id }, element.type === ElementType.TEXT ? (react_1.default.createElement(CustomText_1.default, __assign({}, element))) : element.type === ElementType.INPUT ? (react_1.default.createElement(CustomInput_1.default, __assign({}, element))) : element.type === ElementType.TEXTAREA ? (react_1.default.createElement(CustomTextarea_1.default, __assign({}, element))) : element.type === ElementType.CHECKBOX ? (react_1.default.createElement(CustomCheckbox_1.default, __assign({}, element))) : element.type === ElementType.RADIO ? (react_1.default.createElement(CustomRadioButton_1.default, __assign({}, element))) : element.type === ElementType.SELECT ? (react_1.default.createElement(CustomSelect_1.default, __assign({}, element, { submitted: submitted }))) : element.type === ElementType.SIMPLESELECT ? (react_1.default.createElement(CustomSimpleSelect_1.default, __assign({}, element, { value: Array.isArray(element.value) ? element.value[0] || "" : "", onChange: function (val) { return element.onChange(val); } }))) : element.type === ElementType.DATETIMEPICKER ? (react_1.default.createElement(CustomDateTimePicker_1.default, __assign({}, element, { submitted: submitted }))) : element.type === ElementType.DIVIDER ? (react_1.default.createElement(CustomDivider_1.default, __assign({}, element))) : element.type === ElementType.RICHTEXTBOX ? (react_1.default.createElement(CustomRichTextbox_1.default, __assign({}, element))) : element.type === ElementType.TREEVIEW ? (react_1.default.createElement(CustomTreeView_1.default, __assign({}, element))) : element.type === ElementType.BUTTON ? (react_1.default.createElement(CustomButton_1.default, __assign({}, element, { isLoading: isLoading }))) : element.type === ElementType.AUTOCOMPLETEINPUT ? (react_1.default.createElement(CustomAutocompleteInput_1.default, __assign({}, element))) : element.type === ElementType.PHONE ? (react_1.default.createElement(CustomPhoneInput_1.default, __assign({}, element))) : element.type === ElementType.FILEUPLOADER ? (
246
230
  // FILEUPLOADER elemanı için CustomFileUploader'ı render ediyoruz
247
231
  react_1.default.createElement(react_1.default.Fragment, null,
248
- react_1.default.createElement(CustomFileUploader_1.default, { url: element.url, multi: element.multi, allowedTypes: element.allowedTypes, maxFile: element.maxFile, maxSize: element.maxSize, onUploadComplete: function (fileNames) {
249
- var _a, _b;
250
- setUploadedFileNames(function (prev) { return __spreadArray(__spreadArray([], prev, true), fileNames, true); });
251
- (_b = (_a = element).onUploadComplete) === null || _b === void 0 ? void 0 : _b.call(_a, fileNames); // Orijinal fonksiyonu da tetikle
252
- }, onRemoveUploaded: element.onRemoveUploaded, onPendingChange: element.onPendingChange, clearTrigger: element.clearTrigger, label: element.label, translations: element.translations, onUploadedListChange: setUploadedFiles }))) : null)); })));
232
+ react_1.default.createElement(CustomFileUploader_1.default, { url: element.url, multi: element.multi, allowedTypes: element.allowedTypes, maxFile: element.maxFile, maxSize: element.maxSize, onUploadComplete: element.onUploadComplete, onRemoveUploaded: element.onRemoveUploaded, onPendingChange: element.onPendingChange, clearTrigger: element.clearTrigger, label: element.label, translations: element.translations }))) : null)); })));
253
233
  })));
254
234
  })));
255
235
  }),
256
236
  (showConfirmButton || showCancelButton) && (react_1.default.createElement("div", { className: "card-footer mt-3" },
257
237
  react_1.default.createElement("div", { className: "form-actions mt-3", style: { display: "flex", justifyContent: "flex-end", gap: "10px" } },
258
238
  showCancelButton && (react_1.default.createElement(CustomButton_1.default, { label: cancelLabel, className: "btn btn-secondary", onClick: handleCancel || (function () { }), isLoading: isLoading })),
259
- showConfirmButton && (react_1.default.createElement(CustomButton_1.default, { label: confirmLabel, className: "btn btn-primary", onClick: handleConfirm, isLoading: isLoading, disabled: disableConfirmButton })))))));
239
+ showConfirmButton && (react_1.default.createElement(CustomButton_1.default, { label: confirmLabel, className: "btn btn-primary", onClick: handleConfirm, isLoading: isLoading })))))));
260
240
  };
261
241
  exports.CustomForm = CustomForm;
262
242
  exports.default = CustomForm;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "albinasoft-ui-package",
3
- "version": "1.1.35",
3
+ "version": "1.1.37",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "scripts": {