@uploadcare/file-uploader 1.15.0-alpha.16 → 1.15.0-alpha.18

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 (99) hide show
  1. package/abstract/ValidationManager.d.ts +4 -0
  2. package/abstract/ValidationManager.d.ts.map +1 -1
  3. package/abstract/uploadEntrySchema.d.ts +4 -0
  4. package/abstract/uploadEntrySchema.d.ts.map +1 -1
  5. package/abstract/uploadEntrySchema.js +4 -0
  6. package/blocks/CloudImageEditor/src/EditorFilterControl.js +1 -1
  7. package/blocks/CloudImageEditor/src/EditorImageCropper.js +1 -1
  8. package/blocks/CloudImageEditor/src/EditorImageFader.js +1 -1
  9. package/blocks/CloudImageEditor/src/EditorToolbar.js +1 -1
  10. package/blocks/FileItem/FileItem.d.ts +0 -1
  11. package/blocks/FileItem/FileItem.d.ts.map +1 -1
  12. package/blocks/FileItem/FileItem.js +30 -15
  13. package/blocks/FileItem/FileItemConfig.d.ts +2 -0
  14. package/blocks/FileItem/FileItemConfig.d.ts.map +1 -1
  15. package/blocks/FileItem/FileItemConfig.js +10 -0
  16. package/blocks/Thumb/Thumb.d.ts +1 -3
  17. package/blocks/Thumb/Thumb.d.ts.map +1 -1
  18. package/blocks/Thumb/Thumb.js +26 -29
  19. package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.js +1 -1
  20. package/locales/file-uploader/ar.d.ts +1 -0
  21. package/locales/file-uploader/ar.js +1 -0
  22. package/locales/file-uploader/az.d.ts +1 -0
  23. package/locales/file-uploader/az.js +1 -0
  24. package/locales/file-uploader/ca.d.ts +1 -0
  25. package/locales/file-uploader/ca.js +1 -0
  26. package/locales/file-uploader/cs.d.ts +1 -0
  27. package/locales/file-uploader/cs.js +1 -0
  28. package/locales/file-uploader/da.d.ts +1 -0
  29. package/locales/file-uploader/da.js +1 -0
  30. package/locales/file-uploader/de.d.ts +1 -0
  31. package/locales/file-uploader/de.js +1 -0
  32. package/locales/file-uploader/el.d.ts +1 -0
  33. package/locales/file-uploader/el.js +1 -0
  34. package/locales/file-uploader/en.d.ts +1 -0
  35. package/locales/file-uploader/en.js +1 -0
  36. package/locales/file-uploader/es.d.ts +1 -0
  37. package/locales/file-uploader/es.js +1 -0
  38. package/locales/file-uploader/et.d.ts +1 -0
  39. package/locales/file-uploader/et.js +1 -0
  40. package/locales/file-uploader/fi.d.ts +1 -0
  41. package/locales/file-uploader/fi.js +1 -0
  42. package/locales/file-uploader/fr.d.ts +1 -0
  43. package/locales/file-uploader/fr.js +1 -0
  44. package/locales/file-uploader/he.d.ts +1 -0
  45. package/locales/file-uploader/he.js +1 -0
  46. package/locales/file-uploader/hy.d.ts +1 -0
  47. package/locales/file-uploader/hy.js +1 -0
  48. package/locales/file-uploader/is.d.ts +1 -0
  49. package/locales/file-uploader/is.js +1 -0
  50. package/locales/file-uploader/it.d.ts +1 -0
  51. package/locales/file-uploader/it.js +1 -0
  52. package/locales/file-uploader/ja.d.ts +1 -0
  53. package/locales/file-uploader/ja.js +1 -0
  54. package/locales/file-uploader/ka.d.ts +1 -0
  55. package/locales/file-uploader/ka.js +1 -0
  56. package/locales/file-uploader/kk.d.ts +1 -0
  57. package/locales/file-uploader/kk.js +1 -0
  58. package/locales/file-uploader/ko.d.ts +1 -0
  59. package/locales/file-uploader/ko.js +1 -0
  60. package/locales/file-uploader/lv.d.ts +1 -0
  61. package/locales/file-uploader/lv.js +1 -0
  62. package/locales/file-uploader/nb.d.ts +1 -0
  63. package/locales/file-uploader/nb.js +1 -0
  64. package/locales/file-uploader/nl.d.ts +1 -0
  65. package/locales/file-uploader/nl.js +1 -0
  66. package/locales/file-uploader/pl.d.ts +1 -0
  67. package/locales/file-uploader/pl.js +1 -0
  68. package/locales/file-uploader/pt.d.ts +1 -0
  69. package/locales/file-uploader/pt.js +1 -0
  70. package/locales/file-uploader/ro.d.ts +1 -0
  71. package/locales/file-uploader/ro.js +1 -0
  72. package/locales/file-uploader/ru.d.ts +1 -0
  73. package/locales/file-uploader/ru.js +1 -0
  74. package/locales/file-uploader/sk.d.ts +1 -0
  75. package/locales/file-uploader/sk.js +1 -0
  76. package/locales/file-uploader/sr.d.ts +1 -0
  77. package/locales/file-uploader/sr.js +1 -0
  78. package/locales/file-uploader/sv.d.ts +1 -0
  79. package/locales/file-uploader/sv.js +1 -0
  80. package/locales/file-uploader/tr.d.ts +1 -0
  81. package/locales/file-uploader/tr.js +1 -0
  82. package/locales/file-uploader/uk.d.ts +1 -0
  83. package/locales/file-uploader/uk.js +1 -0
  84. package/locales/file-uploader/vi.d.ts +1 -0
  85. package/locales/file-uploader/vi.js +1 -0
  86. package/locales/file-uploader/zh-TW.d.ts +1 -0
  87. package/locales/file-uploader/zh-TW.js +1 -0
  88. package/locales/file-uploader/zh.d.ts +1 -0
  89. package/locales/file-uploader/zh.js +1 -0
  90. package/package.json +1 -1
  91. package/types/jsx.d.ts +1 -1
  92. package/web/file-uploader.iife.min.js +4 -4
  93. package/web/file-uploader.min.js +4 -4
  94. package/web/uc-cloud-image-editor.min.js +1 -1
  95. package/web/uc-file-uploader-inline.min.js +4 -4
  96. package/web/uc-file-uploader-minimal.min.js +4 -4
  97. package/web/uc-file-uploader-regular.min.js +4 -4
  98. /package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.d.ts +0 -0
  99. /package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.d.ts.map +0 -0
@@ -125,6 +125,10 @@ export class ValidationManager {
125
125
  type: BooleanConstructor;
126
126
  value: false;
127
127
  }>;
128
+ isQueued: Readonly<{
129
+ type: BooleanConstructor;
130
+ value: false;
131
+ }>;
128
132
  }>>;
129
133
  /** @param {string[]} [entryIds] */
130
134
  runFileValidators(entryIds?: string[]): void;
@@ -1 +1 @@
1
- {"version":3,"file":"ValidationManager.d.ts","sourceRoot":"","sources":["ValidationManager.js"],"names":[],"mappings":"AAkCA;IAaE,wEAAwE;IACxE,2BADY,OAAO,oBAAoB,EAAE,aAAa,EAiBrD;IA7BD;;;OAGG;IACH,uBAAe;IAEf,kCAAkC;IAClC,iBADW,iBAAiB,EAAE,CACmE;IAEjG,wCAAwC;IACxC,uBADW,uBAAuB,EAAE,CACsC;IAMxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAA6D;IAe/D,mCAAmC;IACnC,6BADY,MAAM,EAAE,QASnB;IAED,gCAqCC;IAED;;;OAGG;IACH,mCAyBC;IAED;;;;OAIG;IACH,2BAJa,CAAC,cACH,CAAC,EAAE,GACD,CAAC,EAAE,CAUf;CACF;gCAtJY,CACR,WAAW,EAAE,OAAO,UAAU,EAAE,eAAe,EAC/C,GAAG,EAAE,OAAO,wBAAwB,EAAE,iBAAiB,KACpD,SAAS,GAAG,OAAO,UAAU,EAAE,eAAe;sCAIzC,CACR,UAAU,EAAE,UAAU,CAC1B,cAAoB,iCAAiC,EAAE,0BAA0B,CACjF,OAAe,UAAU,EAAE,sBAAsB,CAC1C,CACF,EACD,GAAG,EAAE,OAAO,wBAAwB,EAAE,iBAAiB,KACpD,SAAS,GAAG,OAAO,UAAU,EAAE,qBAAqB"}
1
+ {"version":3,"file":"ValidationManager.d.ts","sourceRoot":"","sources":["ValidationManager.js"],"names":[],"mappings":"AAkCA;IAaE,wEAAwE;IACxE,2BADY,OAAO,oBAAoB,EAAE,aAAa,EAiBrD;IA7BD;;;OAGG;IACH,uBAAe;IAEf,kCAAkC;IAClC,iBADW,iBAAiB,EAAE,CACmE;IAEjG,wCAAwC;IACxC,uBADW,uBAAuB,EAAE,CACsC;IAMxE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;QAA6D;IAe/D,mCAAmC;IACnC,6BADY,MAAM,EAAE,QASnB;IAED,gCAqCC;IAED;;;OAGG;IACH,mCAyBC;IAED;;;;OAIG;IACH,2BAJa,CAAC,cACH,CAAC,EAAE,GACD,CAAC,EAAE,CAUf;CACF;gCAtJY,CACR,WAAW,EAAE,OAAO,UAAU,EAAE,eAAe,EAC/C,GAAG,EAAE,OAAO,wBAAwB,EAAE,iBAAiB,KACpD,SAAS,GAAG,OAAO,UAAU,EAAE,eAAe;sCAIzC,CACR,UAAU,EAAE,UAAU,CAC1B,cAAoB,iCAAiC,EAAE,0BAA0B,CACjF,OAAe,UAAU,EAAE,sBAAsB,CAC1C,CACF,EACD,GAAG,EAAE,OAAO,wBAAwB,EAAE,iBAAiB,KACpD,SAAS,GAAG,OAAO,UAAU,EAAE,qBAAqB"}
@@ -114,6 +114,10 @@ export const uploadEntrySchema: Readonly<{
114
114
  type: BooleanConstructor;
115
115
  value: false;
116
116
  }>;
117
+ isQueued: Readonly<{
118
+ type: BooleanConstructor;
119
+ value: false;
120
+ }>;
117
121
  }>;
118
122
  export type UploadEntryData = import("./TypedData").ExtractDataFromSchema<typeof uploadEntrySchema>;
119
123
  export type UploadEntryTypedData = import("./TypedData.js").TypedData<typeof uploadEntrySchema>;
@@ -1 +1 @@
1
- {"version":3,"file":"uploadEntrySchema.d.ts","sourceRoot":"","sources":["uploadEntrySchema.js"],"names":[],"mappings":"AAGA,gBAAgB;AAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAkGsB,KAAK,EAAE;;;;;;;;;;;GAW1B;8BAEW,OAAO,aAAa,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;mCAErE,OAAO,gBAAgB,EAAE,SAAS,CAAC,OAAO,iBAAiB,CAAC;8BAE5D,OAAO,gBAAgB,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;+BAtHvD,2BAA2B"}
1
+ {"version":3,"file":"uploadEntrySchema.d.ts","sourceRoot":"","sources":["uploadEntrySchema.js"],"names":[],"mappings":"AAGA,gBAAgB;AAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAkGsB,KAAK,EAAE;;;;;;;;;;;;;;;GAe1B;8BAEW,OAAO,aAAa,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;mCAErE,OAAO,gBAAgB,EAAE,SAAS,CAAC,OAAO,iBAAiB,CAAC;8BAE5D,OAAO,gBAAgB,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;+BA1HvD,2BAA2B"}
@@ -111,6 +111,10 @@ export const uploadEntrySchema = Object.freeze({
111
111
  type: Boolean,
112
112
  value: false,
113
113
  }),
114
+ isQueued: Object.freeze({
115
+ type: Boolean,
116
+ value: false,
117
+ }),
114
118
  });
115
119
 
116
120
  /** @typedef {import('./TypedData').ExtractDataFromSchema<typeof uploadEntrySchema>} UploadEntryData */
@@ -3,7 +3,7 @@ import { createCdnUrl, createCdnUrlModifiers } from '../../../utils/cdn-utils.js
3
3
  import { EditorButtonControl } from './EditorButtonControl.js';
4
4
  import { FAKE_ORIGINAL_FILTER } from './EditorSlider.js';
5
5
  import { COMMON_OPERATIONS, transformationsToOperations } from './lib/transformationUtils.js';
6
- import { preloadImage } from './lib/preloadImage.js';
6
+ import { preloadImage } from '../../utils/preloadImage.js';
7
7
 
8
8
  export class EditorFilterControl extends EditorButtonControl {
9
9
  constructor() {
@@ -14,7 +14,7 @@ import {
14
14
  import { CROP_PADDING } from './cropper-constants.js';
15
15
  import { classNames } from './lib/classNames.js';
16
16
  import { pick } from './lib/pick.js';
17
- import { preloadImage } from './lib/preloadImage.js';
17
+ import { preloadImage } from '../../utils/preloadImage.js';
18
18
  import { viewerImageSrc } from './util.js';
19
19
 
20
20
  /**
@@ -2,7 +2,7 @@ import { debounce } from '../../utils/debounce.js';
2
2
  import { Block } from '../../../abstract/Block.js';
3
3
  import { classNames } from './lib/classNames.js';
4
4
  import { linspace } from './lib/linspace.js';
5
- import { batchPreloadImages } from './lib/preloadImage.js';
5
+ import { batchPreloadImages } from '../../utils/preloadImage.js';
6
6
  import { COLOR_OPERATIONS_CONFIG } from './toolbar-constants.js';
7
7
  import { viewerImageSrc } from './util.js';
8
8
 
@@ -5,7 +5,7 @@ import { EditorCropButtonControl } from './EditorCropButtonControl.js';
5
5
  import { EditorFilterControl } from './EditorFilterControl.js';
6
6
  import { EditorOperationControl } from './EditorOperationControl.js';
7
7
  import { FAKE_ORIGINAL_FILTER } from './EditorSlider.js';
8
- import { batchPreloadImages } from './lib/preloadImage.js';
8
+ import { batchPreloadImages } from '../../utils/preloadImage.js';
9
9
  import {
10
10
  ALL_COLOR_OPERATIONS,
11
11
  ALL_CROP_OPERATIONS,
@@ -35,7 +35,6 @@ export class FileItem extends FileItemConfig {
35
35
  '*historyBack': null;
36
36
  '*closeModal': () => void;
37
37
  };
38
- _reset(): void;
39
38
  /**
40
39
  * @private
41
40
  * @param {IntersectionObserverEntry[]} entries
@@ -1 +1 @@
1
- {"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["FileItem.js"],"names":[],"mappings":"AAiBA;IAIE,eAAe;IACf,sBAAsB;IAKpB;;;;;;;;;;;;;;;;;;;;;;;+CAVoB,gBAAU;mCAIlB,gBACR;6BAMM,2BAET;;wCAMC,wCACK;;;;;;MAqBN;IAGH,eAQC;IAED;;;OAGG;IACH,0BAUC;IAPC,qCAA2C;IAC3C,wCAA0C;IAQ5C,eAAe;IACf,wBAYG;IAEH,eAAe;IACf,iCAA0E;IAE1E,sCAeE;IAEF;;;OAGG;IACH,uBAiCC;IAyDD,uCA+BE;IAaA,eAAe;IACf,kBAEE;IAUJ;;;MAEC;IAED;;;OAGG;IACH,uBAEC;IAED,0CAqGG;CACJ;;;;;+BA3X8B,qBAAqB"}
1
+ {"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["FileItem.js"],"names":[],"mappings":"AAiBA;IAIE,eAAe;IACf,sBAAsB;IAKpB;;;;;;;;;;;;;;;;;;;;;;;+CAVoB,gBAAU;mCAIlB,gBACR;6BAMM,2BAET;;wCAMC,wCACK;;;;;;MAqBN;IAQH;;;OAGG;IACH,0BAUC;IAPC,qCAA2C;IAC3C,wCAA0C;IAQ5C,eAAe;IACf,wBAYG;IAEH,eAAe;IACf,iCAA0E;IAE1E,sCA4BE;IAEF;;;OAGG;IACH,uBAqCC;IAyDD,uCA+BE;IAaA,eAAe;IACf,kBAEE;IAUJ;;;MAEC;IAED;;;OAGG;IACH,uBAEC;IAED,0CAwGG;CACJ;;;;;+BA1Y8B,qBAAqB"}
@@ -60,13 +60,8 @@ export class FileItem extends FileItemConfig {
60
60
  }
61
61
 
62
62
  _reset() {
63
- for (let sub of this._entrySubs) {
64
- sub.remove();
65
- }
66
-
63
+ super._reset();
67
64
  this._debouncedCalculateState.cancel();
68
- this._entrySubs = new Set();
69
- this._entry = null;
70
65
  }
71
66
 
72
67
  /**
@@ -106,17 +101,30 @@ export class FileItem extends FileItemConfig {
106
101
  _updateHint = this._withEntry(
107
102
  throttle((entry) => {
108
103
  const source = entry.getValue('source');
109
- const showHint =
110
- this.$.state === FileItemState.UPLOADING &&
111
- entry.getValue('externalUrl') &&
112
- source &&
113
- source !== UploadSource.URL &&
114
- entry.getValue('errors').length === 0 &&
115
- this.$.progressValue === 0;
104
+ const externalUrl = entry.getValue('externalUrl');
105
+ const noErrors = entry.getValue('errors').length === 0;
106
+ const noProgress = this.$.progressValue === 0;
107
+ const isUploading = this.$.state === FileItemState.UPLOADING;
108
+ const isQueued = entry.getValue('isQueued');
109
+
110
+ if (!noErrors || !isUploading || !noProgress) {
111
+ this.$.hint = '';
112
+ return;
113
+ }
116
114
 
117
- const hint = showHint ? this.l10n('waiting-for', { source: this.l10n(`src-type-${source}`) }) : '';
115
+ if (isQueued) {
116
+ const hint = this.l10n('queued');
117
+ this.$.hint = hint;
118
+ return;
119
+ }
118
120
 
119
- this.$.hint = hint;
121
+ if (externalUrl && source && source !== UploadSource.URL) {
122
+ const hint = this.l10n('waiting-for', { source: this.l10n(`src-type-${source}`) });
123
+ this.$.hint = hint;
124
+ return;
125
+ }
126
+
127
+ this.$.hint = '';
120
128
  }, 100),
121
129
  );
122
130
 
@@ -139,6 +147,10 @@ export class FileItem extends FileItemConfig {
139
147
  this._updateHint();
140
148
  });
141
149
 
150
+ this._subEntry('isQueued', () => {
151
+ this._updateHint();
152
+ });
153
+
142
154
  this._subEntry('fileName', (name) => {
143
155
  this.$.itemName = name || entry.getValue('externalUrl') || this.l10n('file-no-name');
144
156
  this._debouncedCalculateState();
@@ -301,6 +313,7 @@ export class FileItem extends FileItemConfig {
301
313
  entry.setMultipleValues({
302
314
  isUploading: true,
303
315
  errors: [],
316
+ isQueued: true,
304
317
  });
305
318
 
306
319
  try {
@@ -308,6 +321,7 @@ export class FileItem extends FileItemConfig {
308
321
  entry.setValue('abortController', abortController);
309
322
 
310
323
  const uploadTask = async () => {
324
+ entry.setValue('isQueued', false);
311
325
  /** @type {Blob | File | null} */
312
326
  let file = entry.getValue('file');
313
327
  if (file && this.cfg.imageShrink) {
@@ -341,6 +355,7 @@ export class FileItem extends FileItemConfig {
341
355
  let fileInfo = await this.$['*uploadQueue'].add(uploadTask);
342
356
  entry.setMultipleValues({
343
357
  fileInfo,
358
+ isQueued: false,
344
359
  isUploading: false,
345
360
  fileName: fileInfo.originalFilename,
346
361
  fileSize: fileInfo.size,
@@ -21,6 +21,8 @@ export class FileItemConfig extends UploaderBlock {
21
21
  * @protected
22
22
  */
23
23
  protected _subEntry: (prop_: K, handler_: (value: import("../../abstract/uploadEntrySchema.js").UploadEntryData[K]) => void) => void;
24
+ /** @protected */
25
+ protected _reset(): void;
24
26
  }
25
27
  import { UploaderBlock } from '../../abstract/UploaderBlock.js';
26
28
  //# sourceMappingURL=FileItemConfig.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"FileItemConfig.d.ts","sourceRoot":"","sources":["FileItemConfig.js"],"names":[],"mappings":"AAIA;IACE,iBAAiB;IACjB,+BAAuB;IAEvB;;;OAGG;IACH,kBAHU,OAAO,qCAAqC,EAAE,oBAAoB,GAAG,IAAI,CAGrE;IAEd;;;;;;OAMG;IACH,qBANqB,CAAC,SAAR,GAAG,EAAG,EAC0F,CAAC,SAAlG,CAAE,KAAK,EAAE,OAAO,qCAAqC,EAAE,oBAAoB,EAAE,GAAG,IAAI,EAAE,CAAC,KAAK,GAAI,MAClG,CAAC,GACC,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,CAezC;IAED;;;;;OAKG;IACH,sBAAa,OAJF,CAIO,EAAE,UAHT,CAAC,KAAK,EAAE,OAAO,qCAAqC,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAG5D,UAgBP;CAMtB;8BA7D6B,iCAAiC"}
1
+ {"version":3,"file":"FileItemConfig.d.ts","sourceRoot":"","sources":["FileItemConfig.js"],"names":[],"mappings":"AAIA;IACE,iBAAiB;IACjB,+BAAuB;IAEvB;;;OAGG;IACH,kBAHU,OAAO,qCAAqC,EAAE,oBAAoB,GAAG,IAAI,CAGrE;IAEd;;;;;;OAMG;IACH,qBANqB,CAAC,SAAR,GAAG,EAAG,EAC0F,CAAC,SAAlG,CAAE,KAAK,EAAE,OAAO,qCAAqC,EAAE,oBAAoB,EAAE,GAAG,IAAI,EAAE,CAAC,KAAK,GAAI,MAClG,CAAC,GACC,CAAC,GAAG,IAAI,EAAE,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,CAezC;IAED;;;;;OAKG;IACH,sBAAa,OAJF,CAIO,EAAE,UAHT,CAAC,KAAK,EAAE,OAAO,qCAAqC,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,IAG5D,UAgBP;IAErB,iBAAiB;IACjB,yBAOC;CAMF;8BAvE6B,iCAAiC"}
@@ -57,6 +57,16 @@ export class FileItemConfig extends UploaderBlock {
57
57
  },
58
58
  )(prop_, handler_);
59
59
 
60
+ /** @protected */
61
+ _reset() {
62
+ for (let sub of this._entrySubs) {
63
+ sub.remove();
64
+ }
65
+
66
+ this._entrySubs = new Set();
67
+ this._entry = null;
68
+ }
69
+
60
70
  disconnectedCallback() {
61
71
  super.disconnectedCallback();
62
72
  this._entrySubs = new Set();
@@ -7,7 +7,7 @@ export class Thumb extends FileItemConfig {
7
7
  */
8
8
  private _thumbRect;
9
9
  _isIntersecting: boolean;
10
- _firstViewMode: string;
10
+ _firstViewMode: import("../UploadList/UploadList.js").FilesViewMode;
11
11
  init$: {
12
12
  thumbUrl: string;
13
13
  badgeIcon: string;
@@ -26,8 +26,6 @@ export class Thumb extends FileItemConfig {
26
26
  '*historyBack': null;
27
27
  '*closeModal': () => void;
28
28
  };
29
- /** @param {string} imageUrl */
30
- loadImage(imageUrl: string): Promise<any>;
31
29
  _calculateThumbSize(force?: boolean): number;
32
30
  /** @private */
33
31
  private _generateThumbnail;
@@ -1 +1 @@
1
- {"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["Thumb.js"],"names":[],"mappings":"AAQA;IACE,eAAe;IACf,0BAA0B;IAE1B;;;OAGG;IACH,mBAAkB;IAElB,yBAAwB;IAExB,uBAAoB;IAKlB;;;;;;;+CACO,gBACX;mCAMU,gBAAU;6BAGd,2BAAoB;;wCAKpB,wCACa;;;;;;MAZd;IAGH,+BAA+B;IAC/B,oBADY,MAAM,gBAgBjB;IAED,6CAgBC;IAED,eAAe;IACf,2BA2CG;IAEH;;MAA4E;IAE5E;;;OAGG;IACH,0BAaC;IAED;;;OAGG;IACH,uBA0BC;IAgCC,4CAAuG;CAY1G;;;;+BA/M8B,+BAA+B"}
1
+ {"version":3,"file":"Thumb.d.ts","sourceRoot":"","sources":["Thumb.js"],"names":[],"mappings":"AASA;IACE,eAAe;IACf,0BAA0B;IAE1B;;;OAGG;IACH,mBAAkB;IAElB,yBAAwB;IAExB,oEAAwC;IAKtC;;;;;;;+CALyB,gBAAU;mCAOjC,gBAAK;6BAMe,2BACZ;;wCAK4B,wCAC5B;;;;;;MAVT;IAGH,6CAgBC;IAED,eAAe;IACf,2BAmDG;IAEH;;MAA4E;IAE5E;;;OAGG;IACH,0BAaC;IAOD;;;OAGG;IACH,uBA6BC;IA8BC,4CAAuG;CAY1G;;;;+BA3M8B,+BAA+B"}
@@ -1,6 +1,7 @@
1
1
  //@ts-check
2
2
 
3
3
  import { createCdnUrl, createCdnUrlModifiers, createOriginalUrl } from '../../utils/cdn-utils.js';
4
+ import { preloadImage } from '../utils/preloadImage.js';
4
5
  import { FileItemConfig } from '../FileItem/FileItemConfig.js';
5
6
  import { fileCssBg } from '../svg-backgrounds/svg-backgrounds.js';
6
7
  import { debounce } from '../utils/debounce.js';
@@ -18,7 +19,7 @@ export class Thumb extends FileItemConfig {
18
19
 
19
20
  _isIntersecting = false;
20
21
 
21
- _firstViewMode = '';
22
+ _firstViewMode = this.cfg.filesViewMode;
22
23
 
23
24
  constructor() {
24
25
  super();
@@ -31,24 +32,6 @@ export class Thumb extends FileItemConfig {
31
32
  };
32
33
  }
33
34
 
34
- /** @param {string} imageUrl */
35
- loadImage(imageUrl) {
36
- return new Promise((resolve, reject) => {
37
- const img = new Image();
38
- img.onload = () => {
39
- this.set$({ thumbUrl: `url(${imageUrl})` });
40
- resolve(true);
41
- img.remove();
42
- };
43
- img.onerror = () => {
44
- console.error('Failed to load image:', imageUrl);
45
- reject(new Error(`Failed to load image: ${imageUrl}`));
46
- img.remove();
47
- };
48
- img.src = imageUrl;
49
- });
50
- }
51
-
52
35
  _calculateThumbSize(force = false) {
53
36
  if (force) {
54
37
  this._thumbRect = this.getBoundingClientRect();
@@ -72,6 +55,7 @@ export class Thumb extends FileItemConfig {
72
55
  const fileInfo = entry.getValue('fileInfo');
73
56
  const isImage = entry.getValue('isImage');
74
57
  const uuid = entry.getValue('uuid');
58
+
75
59
  let size = this._calculateThumbSize(force);
76
60
 
77
61
  if (fileInfo && isImage && uuid) {
@@ -82,13 +66,21 @@ export class Thumb extends FileItemConfig {
82
66
  ),
83
67
  );
84
68
 
85
- this.loadImage(thumbUrl).then(() => {
86
- let currentThumbUrl = entry.getValue('thumbUrl');
87
- if (currentThumbUrl !== thumbUrl) {
88
- entry.setValue('thumbUrl', thumbUrl);
89
- currentThumbUrl?.startsWith('blob:') && URL.revokeObjectURL(currentThumbUrl);
90
- }
91
- });
69
+ let currentThumbUrl = entry.getValue('thumbUrl');
70
+
71
+ const { promise } = preloadImage(thumbUrl);
72
+
73
+ promise
74
+ .then(() => this.set$({ thumbUrl: `url(${thumbUrl})` }))
75
+ .then(() => {
76
+ if (this._entry?.getValue('uuid') !== uuid) {
77
+ entry.setValue('thumbUrl', thumbUrl);
78
+ currentThumbUrl?.startsWith('blob:') && URL.revokeObjectURL(currentThumbUrl);
79
+ }
80
+ })
81
+ .catch(() => {
82
+ console.error('Failed to load image', thumbUrl);
83
+ });
92
84
 
93
85
  return;
94
86
  }
@@ -98,7 +90,6 @@ export class Thumb extends FileItemConfig {
98
90
  }
99
91
 
100
92
  const file = entry.getValue('file');
101
-
102
93
  if (file?.type.includes('image')) {
103
94
  try {
104
95
  let thumbUrl = await generateThumb(file, size);
@@ -134,13 +125,21 @@ export class Thumb extends FileItemConfig {
134
125
  }
135
126
  }
136
127
 
128
+ _reset() {
129
+ super._reset();
130
+ this._debouncedGenerateThumb.cancel();
131
+ }
132
+
137
133
  /**
138
134
  * @private
139
135
  * @param {String} id
140
136
  */
141
137
  _handleEntryId(id) {
138
+ this._reset();
139
+
142
140
  let entry = this.uploadCollection?.read(id);
143
141
  this._entry = entry;
142
+
144
143
  if (!entry) {
145
144
  return;
146
145
  }
@@ -169,8 +168,6 @@ export class Thumb extends FileItemConfig {
169
168
  initCallback() {
170
169
  super.initCallback();
171
170
 
172
- this._firstViewMode = this.cfg.filesViewMode;
173
-
174
171
  this.defineAccessor('badgeIcon', (/** @type {string} */ val) => (this.$.badgeIcon = val));
175
172
 
176
173
  this.defineAccessor('uid', (/** @type {string} */ value) => {
@@ -1,4 +1,4 @@
1
- import { TRANSPARENT_PIXEL_SRC } from '../../../../utils/transparentPixelSrc.js';
1
+ import { TRANSPARENT_PIXEL_SRC } from '../../utils/transparentPixelSrc.js';
2
2
 
3
3
  export function preloadImage(src) {
4
4
  let image = new Image();
@@ -125,6 +125,7 @@ declare const _default: {
125
125
  failed: string;
126
126
  uploading: string;
127
127
  idle: string;
128
+ queued: string;
128
129
  'a11y-file-item-status': string;
129
130
  'waiting-for': string;
130
131
  };
@@ -126,6 +126,7 @@ export default {
126
126
  failed: 'فشل',
127
127
  uploading: 'جارٍ التحميل',
128
128
  idle: 'خامل',
129
+ queued: 'في الانتظار',
129
130
  'a11y-file-item-status': 'الملف {{fileName}} في حالة {{status}}',
130
131
  'waiting-for': 'في انتظار {{source}}',
131
132
  };
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'waiting-for': string;
122
123
  };
@@ -118,6 +118,7 @@ export default {
118
118
  failed: 'Uğursuz',
119
119
  uploading: 'Yüklənir',
120
120
  idle: 'Boş',
121
+ queued: 'Növbədə',
121
122
  'a11y-file-item-status': '{{fileName}} faylı {{status}} statusundadır',
122
123
  'waiting-for': '{{source}} gözlənilir',
123
124
  };
@@ -119,6 +119,7 @@ declare const _default: {
119
119
  failed: string;
120
120
  uploading: string;
121
121
  idle: string;
122
+ queued: string;
122
123
  'a11y-file-item-status': string;
123
124
  'waiting-for': string;
124
125
  };
@@ -121,6 +121,7 @@ export default {
121
121
  failed: 'Fallat',
122
122
  uploading: 'Carregant',
123
123
  idle: 'Inactiu',
124
+ queued: 'En cua',
124
125
  'a11y-file-item-status': 'El fitxer {{fileName}} està en estat {{status}}',
125
126
  'waiting-for': 'Esperant per {{source}}',
126
127
  };
@@ -121,6 +121,7 @@ declare const _default: {
121
121
  failed: string;
122
122
  uploading: string;
123
123
  idle: string;
124
+ queued: string;
124
125
  'a11y-file-item-status': string;
125
126
  'waiting-for': string;
126
127
  };
@@ -123,6 +123,7 @@ export default {
123
123
  failed: 'Selhalo',
124
124
  uploading: 'Nahrává se',
125
125
  idle: 'Nečinný',
126
+ queued: 'Ve frontě',
126
127
  'a11y-file-item-status': 'Soubor {{fileName}} je ve stavu {{status}}',
127
128
  'waiting-for': 'Čekání na {{source}}',
128
129
  };
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'waiting-for': string;
122
123
  };
@@ -119,6 +119,7 @@ export default {
119
119
  failed: 'Mislykkedes',
120
120
  uploading: 'Uploader',
121
121
  idle: 'Inaktiv',
122
+ queued: 'I kø',
122
123
  'a11y-file-item-status': 'Filen {{fileName}} er i status {{status}}',
123
124
  'waiting-for': 'Venter på {{source}}',
124
125
  };
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'waiting-for': string;
122
123
  };
@@ -120,6 +120,7 @@ export default {
120
120
  failed: 'Fehlgeschlagen',
121
121
  uploading: 'Hochladen',
122
122
  idle: 'Leerlauf',
123
+ queued: 'In der Warteschlange',
123
124
  'a11y-file-item-status': 'Datei {{fileName}} im Status {{status}}',
124
125
  'waiting-for': 'Warten auf {{source}}',
125
126
  };
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'waiting-for': string;
122
123
  };
@@ -120,6 +120,7 @@ export default {
120
120
  failed: 'Απέτυχε',
121
121
  uploading: 'Μεταφόρτωση',
122
122
  idle: 'Αδράνεια',
123
+ queued: 'Σε ουρά',
123
124
  'a11y-file-item-status': 'Το αρχείο {{fileName}} βρίσκεται στην κατάσταση {{status}}',
124
125
  'waiting-for': 'Αναμονή για {{source}}',
125
126
  };
@@ -119,6 +119,7 @@ declare const _default: {
119
119
  idle: string;
120
120
  'a11y-file-item-status': string;
121
121
  'waiting-for': string;
122
+ queued: string;
122
123
  };
123
124
  export default _default;
124
125
  //# sourceMappingURL=en.d.ts.map
@@ -120,4 +120,5 @@ export default {
120
120
  idle: 'Idle',
121
121
  'a11y-file-item-status': 'File {{fileName}} in status {{status}}',
122
122
  'waiting-for': 'Waiting for {{source}}',
123
+ queued: 'Queued',
123
124
  };
@@ -119,6 +119,7 @@ declare const _default: {
119
119
  failed: string;
120
120
  uploading: string;
121
121
  idle: string;
122
+ queued: string;
122
123
  'a11y-file-item-status': string;
123
124
  'waiting-for': string;
124
125
  };
@@ -121,6 +121,7 @@ export default {
121
121
  failed: 'Fallido',
122
122
  uploading: 'Subiendo',
123
123
  idle: 'Inactivo',
124
+ queued: 'En cola',
124
125
  'a11y-file-item-status': 'El archivo {{fileName}} está en estado {{status}}',
125
126
  'waiting-for': 'Esperando por {{source}}',
126
127
  };
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'waiting-for': string;
122
123
  };
@@ -118,6 +118,7 @@ export default {
118
118
  failed: 'Ebaõnnestunud',
119
119
  uploading: 'Üleslaadimine',
120
120
  idle: 'Ootel',
121
+ queued: 'Järjekorras',
121
122
  'a11y-file-item-status': 'Fail {{fileName}} on seisundis {{status}}',
122
123
  'waiting-for': 'Ootel {{source}}',
123
124
  };
@@ -115,6 +115,7 @@ declare const _default: {
115
115
  failed: string;
116
116
  uploading: string;
117
117
  idle: string;
118
+ queued: string;
118
119
  'a11y-file-item-status': string;
119
120
  'select-all': string;
120
121
  'deselect-all': string;
@@ -117,6 +117,7 @@ export default {
117
117
  failed: 'Epäonnistui',
118
118
  uploading: 'Ladataan',
119
119
  idle: 'Toimeton',
120
+ queued: 'Jonossa',
120
121
  'a11y-file-item-status': 'Tiedosto {{fileName}} tilassa {{status}}',
121
122
  'select-all': 'Valitse kaikki',
122
123
  'deselect-all': 'Poista valinnat',
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'select-all': string;
122
123
  'deselect-all': string;
@@ -119,6 +119,7 @@ export default {
119
119
  failed: 'Échoué',
120
120
  uploading: 'Téléchargement',
121
121
  idle: 'Inactif',
122
+ queued: 'En file',
122
123
  'a11y-file-item-status': 'Le fichier {{fileName}} est en statut {{status}}',
123
124
  'select-all': 'Tout sélectionner',
124
125
  'deselect-all': 'Tout désélectionner',
@@ -117,6 +117,7 @@ declare const _default: {
117
117
  failed: string;
118
118
  uploading: string;
119
119
  idle: string;
120
+ queued: string;
120
121
  'a11y-file-item-status': string;
121
122
  'select-all': string;
122
123
  'deselect-all': string;
@@ -118,6 +118,7 @@ export default {
118
118
  failed: 'נכשל',
119
119
  uploading: 'מעלה',
120
120
  idle: 'בטלה',
121
+ queued: 'בתור',
121
122
  'a11y-file-item-status': 'הקובץ {{fileName}} במצב {{status}}',
122
123
  'select-all': 'בחר הכל',
123
124
  'deselect-all': 'בטל בחירת הכל',
@@ -115,6 +115,7 @@ declare const _default: {
115
115
  failed: string;
116
116
  uploading: string;
117
117
  idle: string;
118
+ queued: string;
118
119
  'a11y-file-item-status': string;
119
120
  'select-all': string;
120
121
  'deselect-all': string;
@@ -116,6 +116,7 @@ export default {
116
116
  failed: 'Չհաջողվեց',
117
117
  uploading: 'Բեռնվում է',
118
118
  idle: 'Անգործ',
119
+ queued: 'Հերթում',
119
120
  'a11y-file-item-status': 'Ֆայլը {{fileName}} {{status}} կարգավիճակում է',
120
121
  'select-all': 'Ընտրել բոլորը',
121
122
  'deselect-all': 'Հրաժարվել բոլորից',
@@ -115,6 +115,7 @@ declare const _default: {
115
115
  failed: string;
116
116
  uploading: string;
117
117
  idle: string;
118
+ queued: string;
118
119
  'a11y-file-item-status': string;
119
120
  'select-all': string;
120
121
  'deselect-all': string;