albinasoft-ui-package 1.1.36 → 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.
@@ -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) {
|
@@ -327,6 +347,12 @@ var CustomFileUploader = function (props) {
|
|
327
347
|
react_toastify_1.toast.warning(finalTranslations.noFileSelectedWarning);
|
328
348
|
return [2 /*return*/];
|
329
349
|
}
|
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;
|
354
|
+
});
|
355
|
+
});
|
330
356
|
formData = new FormData();
|
331
357
|
filesToUpload.forEach(function (file) {
|
332
358
|
formData.append("file", file);
|
@@ -355,7 +381,7 @@ var CustomFileUploader = function (props) {
|
|
355
381
|
setPreviews(function (prev) {
|
356
382
|
var updatedPreviews = prev.map(function (item, index) {
|
357
383
|
if (!item.uploaded) {
|
358
|
-
return __assign(__assign({}, item), { uploaded: true, serverFileName: uploadedFileNames_1[index] || item.file.name });
|
384
|
+
return __assign(__assign({}, item), { uploaded: true, isUploading: false, serverFileName: uploadedFileNames_1[index] || item.file.name });
|
359
385
|
}
|
360
386
|
return item;
|
361
387
|
});
|
@@ -393,10 +419,12 @@ var CustomFileUploader = function (props) {
|
|
393
419
|
react_1.default.createElement("label", { style: { fontWeight: "bold" } }, label))),
|
394
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" } },
|
395
421
|
react_1.default.createElement("div", { style: previewItemStyle },
|
422
|
+
item.isUploading && react_1.default.createElement("div", { style: spinnerStyle }),
|
396
423
|
item.isImage ? (react_1.default.createElement("img", { src: item.previewContent, alt: "\u00D6nizleme ".concat(item.id), style: {
|
397
424
|
width: "100%",
|
398
425
|
height: "100%",
|
399
426
|
objectFit: "cover",
|
427
|
+
opacity: item.isUploading ? 0.5 : 1,
|
400
428
|
} })) : (react_1.default.createElement("div", { style: {
|
401
429
|
width: "100%",
|
402
430
|
height: "100%",
|
@@ -404,11 +432,12 @@ var CustomFileUploader = function (props) {
|
|
404
432
|
justifyContent: "center",
|
405
433
|
alignItems: "center",
|
406
434
|
fontSize: "48px",
|
435
|
+
opacity: item.isUploading ? 0.5 : 1,
|
407
436
|
} }, item.previewContent)),
|
408
437
|
react_1.default.createElement("button", { type: "button", style: removeButtonStyle, onClick: function (e) {
|
409
438
|
e.stopPropagation();
|
410
439
|
handleRemoveFile(item.id);
|
411
|
-
}, title: finalTranslations.removeButtonTitle }, "\u00D7"),
|
440
|
+
}, title: finalTranslations.removeButtonTitle, disabled: item.isUploading }, "\u00D7"),
|
412
441
|
item.uploaded && react_1.default.createElement("div", { style: tickOverlayStyle }, "\u2713")),
|
413
442
|
react_1.default.createElement("div", { style: {
|
414
443
|
marginTop: "4px",
|
@@ -74,6 +74,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
74
74
|
};
|
75
75
|
Object.defineProperty(exports, "__esModule", { value: true });
|
76
76
|
exports.ElementType = exports.CustomForm = void 0;
|
77
|
+
//CustomForm.tsx
|
77
78
|
var react_1 = __importStar(require("react"));
|
78
79
|
var react_toastify_1 = require("react-toastify");
|
79
80
|
var CustomButton_1 = __importDefault(require("./CustomButton"));
|