@uploadcare/file-uploader 1.15.0-alpha.9 → 1.15.0

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 (279) hide show
  1. package/abstract/ActivityBlock.d.ts +5 -5
  2. package/abstract/ActivityBlock.d.ts.map +1 -1
  3. package/abstract/Block.d.ts +3 -9
  4. package/abstract/Block.d.ts.map +1 -1
  5. package/abstract/CTX.d.ts +6 -6
  6. package/abstract/CTX.d.ts.map +1 -1
  7. package/abstract/LocaleManager.d.ts +3 -3
  8. package/abstract/LocaleManager.d.ts.map +1 -1
  9. package/abstract/ModalManager.d.ts +13 -18
  10. package/abstract/ModalManager.d.ts.map +1 -1
  11. package/abstract/ModalManager.js +19 -10
  12. package/abstract/SecureUploadsManager.d.ts +2 -2
  13. package/abstract/SecureUploadsManager.d.ts.map +1 -1
  14. package/abstract/SolutionBlock.d.ts +2 -2
  15. package/abstract/SolutionBlock.d.ts.map +1 -1
  16. package/abstract/TypedCollection.d.ts +44 -44
  17. package/abstract/TypedCollection.d.ts.map +1 -1
  18. package/abstract/TypedCollection.js +53 -33
  19. package/abstract/TypedData.d.ts +71 -25
  20. package/abstract/TypedData.d.ts.map +1 -1
  21. package/abstract/TypedData.js +74 -17
  22. package/abstract/UploaderBlock.d.ts +10 -10
  23. package/abstract/UploaderBlock.d.ts.map +1 -1
  24. package/abstract/UploaderBlock.js +22 -10
  25. package/abstract/UploaderPublicApi.d.ts +24 -23
  26. package/abstract/UploaderPublicApi.d.ts.map +1 -1
  27. package/abstract/UploaderPublicApi.js +21 -10
  28. package/abstract/ValidationManager.d.ts +125 -6
  29. package/abstract/ValidationManager.d.ts.map +1 -1
  30. package/abstract/ValidationManager.js +1 -1
  31. package/abstract/a11y.d.ts +2 -2
  32. package/abstract/a11y.d.ts.map +1 -1
  33. package/abstract/buildOutputCollectionState.d.ts +1 -1
  34. package/abstract/buildOutputCollectionState.d.ts.map +1 -1
  35. package/abstract/defineComponents.d.ts.map +1 -1
  36. package/abstract/l10nProcessor.d.ts.map +1 -1
  37. package/abstract/loadFileUploaderFrom.d.ts +1 -1
  38. package/abstract/loadFileUploaderFrom.d.ts.map +1 -1
  39. package/abstract/localeRegistry.d.ts.map +1 -1
  40. package/abstract/sharedConfigKey.d.ts.map +1 -1
  41. package/abstract/uploadEntrySchema.d.ts +123 -63
  42. package/abstract/uploadEntrySchema.d.ts.map +1 -1
  43. package/abstract/uploadEntrySchema.js +66 -81
  44. package/blocks/CameraSource/CameraSource.d.ts +9 -9
  45. package/blocks/CameraSource/CameraSource.d.ts.map +1 -1
  46. package/blocks/CameraSource/calcCameraModes.d.ts +1 -1
  47. package/blocks/CameraSource/constants.d.ts.map +1 -1
  48. package/blocks/CloudImageEditor/src/CloudImageEditorBlock.d.ts.map +1 -1
  49. package/blocks/CloudImageEditor/src/CropFrame.d.ts +1 -1
  50. package/blocks/CloudImageEditor/src/EditorFilterControl.js +1 -1
  51. package/blocks/CloudImageEditor/src/EditorImageCropper.d.ts +3 -3
  52. package/blocks/CloudImageEditor/src/EditorImageCropper.js +1 -1
  53. package/blocks/CloudImageEditor/src/EditorImageFader.d.ts +1 -1
  54. package/blocks/CloudImageEditor/src/EditorImageFader.d.ts.map +1 -1
  55. package/blocks/CloudImageEditor/src/EditorImageFader.js +1 -1
  56. package/blocks/CloudImageEditor/src/EditorSlider.d.ts +1 -1
  57. package/blocks/CloudImageEditor/src/EditorSlider.d.ts.map +1 -1
  58. package/blocks/CloudImageEditor/src/EditorToolbar.d.ts +1 -1
  59. package/blocks/CloudImageEditor/src/EditorToolbar.js +1 -1
  60. package/blocks/CloudImageEditor/src/crop-utils.d.ts +14 -14
  61. package/blocks/CloudImageEditor/src/crop-utils.d.ts.map +1 -1
  62. package/blocks/CloudImageEditor/src/cropper-constants.d.ts.map +1 -1
  63. package/blocks/CloudImageEditor/src/lib/applyFocusVisiblePolyfill.d.ts +1 -1
  64. package/blocks/CloudImageEditor/src/lib/applyFocusVisiblePolyfill.d.ts.map +1 -1
  65. package/blocks/CloudImageEditor/src/lib/parseCropPreset.d.ts +1 -1
  66. package/blocks/CloudImageEditor/src/lib/transformationUtils.d.ts +3 -3
  67. package/blocks/CloudImageEditor/src/lib/transformationUtils.d.ts.map +1 -1
  68. package/blocks/CloudImageEditor/src/state.d.ts +4 -4
  69. package/blocks/CloudImageEditor/src/svg-sprite.d.ts.map +1 -1
  70. package/blocks/CloudImageEditor/src/types.d.ts +8 -58
  71. package/blocks/CloudImageEditor/src/types.d.ts.map +1 -1
  72. package/blocks/CloudImageEditorActivity/CloudImageEditorActivity.d.ts +5 -2
  73. package/blocks/CloudImageEditorActivity/CloudImageEditorActivity.d.ts.map +1 -1
  74. package/blocks/CloudImageEditorActivity/CloudImageEditorActivity.js +7 -3
  75. package/blocks/Config/Config.d.ts +3 -12
  76. package/blocks/Config/Config.d.ts.map +1 -1
  77. package/blocks/Config/assertions.d.ts +1 -1
  78. package/blocks/Config/initialConfig.d.ts +1 -1
  79. package/blocks/Config/initialConfig.d.ts.map +1 -1
  80. package/blocks/Config/initialConfig.js +1 -1
  81. package/blocks/Config/normalizeConfigValue.d.ts.map +1 -1
  82. package/blocks/Config/side-effects.d.ts.map +1 -1
  83. package/blocks/Config/validatorsType.d.ts +1 -1
  84. package/blocks/Config/validatorsType.d.ts.map +1 -1
  85. package/blocks/DropArea/DropArea.d.ts +2 -2
  86. package/blocks/DropArea/DropArea.d.ts.map +1 -1
  87. package/blocks/DropArea/addDropzone.d.ts.map +1 -1
  88. package/blocks/DropArea/drop-area.css +4 -2
  89. package/blocks/DropArea/getDropItems.d.ts +2 -2
  90. package/blocks/DropArea/getDropItems.d.ts.map +1 -1
  91. package/blocks/ExternalSource/ExternalSource.d.ts +3 -3
  92. package/blocks/ExternalSource/ExternalSource.d.ts.map +1 -1
  93. package/blocks/ExternalSource/MessageBridge.d.ts +3 -3
  94. package/blocks/ExternalSource/MessageBridge.d.ts.map +1 -1
  95. package/blocks/ExternalSource/query-string.d.ts.map +1 -1
  96. package/blocks/ExternalSource/types.d.ts +64 -64
  97. package/blocks/ExternalSource/types.d.ts.map +1 -1
  98. package/blocks/FileItem/FileItem.d.ts +12 -39
  99. package/blocks/FileItem/FileItem.d.ts.map +1 -1
  100. package/blocks/FileItem/FileItem.js +114 -178
  101. package/blocks/FileItem/FileItemConfig.d.ts +28 -0
  102. package/blocks/FileItem/FileItemConfig.d.ts.map +1 -0
  103. package/blocks/FileItem/FileItemConfig.js +74 -0
  104. package/blocks/FileItem/file-item.css +21 -6
  105. package/blocks/Img/ImgBase.d.ts +3 -3
  106. package/blocks/Img/ImgBase.d.ts.map +1 -1
  107. package/blocks/Img/ImgBase.js +9 -9
  108. package/blocks/Img/ImgConfig.d.ts.map +1 -1
  109. package/blocks/Img/configurations.d.ts.map +1 -1
  110. package/blocks/Modal/Modal.d.ts +4 -4
  111. package/blocks/Modal/Modal.d.ts.map +1 -1
  112. package/blocks/ProgressBar/ProgressBar.d.ts +6 -1
  113. package/blocks/ProgressBar/ProgressBar.d.ts.map +1 -1
  114. package/blocks/ProgressBar/ProgressBar.js +41 -44
  115. package/blocks/ProgressBar/progress-bar.css +8 -6
  116. package/blocks/Range/Range.d.ts.map +1 -1
  117. package/blocks/SimpleBtn/SimpleBtn.d.ts +2 -2
  118. package/blocks/SimpleBtn/SimpleBtn.d.ts.map +1 -1
  119. package/blocks/SourceBtn/SourceBtn.d.ts +2 -5
  120. package/blocks/SourceBtn/SourceBtn.d.ts.map +1 -1
  121. package/blocks/SourceBtn/SourceBtn.js +5 -5
  122. package/blocks/SourceList/SourceList.js +2 -2
  123. package/blocks/Spinner/Spinner.d.ts.map +1 -1
  124. package/blocks/Thumb/Thumb.d.ts +30 -5
  125. package/blocks/Thumb/Thumb.d.ts.map +1 -1
  126. package/blocks/Thumb/Thumb.js +188 -22
  127. package/blocks/UploadCtxProvider/EventEmitter.d.ts +20 -20
  128. package/blocks/UploadCtxProvider/EventEmitter.d.ts.map +1 -1
  129. package/blocks/UploadCtxProvider/UploadCtxProvider.d.ts +4 -4
  130. package/blocks/UploadCtxProvider/UploadCtxProvider.d.ts.map +1 -1
  131. package/blocks/UploadList/UploadList.d.ts +3 -3
  132. package/blocks/UploadList/UploadList.d.ts.map +1 -1
  133. package/blocks/svg-backgrounds/svg-backgrounds.d.ts +3 -3
  134. package/blocks/svg-backgrounds/svg-backgrounds.d.ts.map +1 -1
  135. package/blocks/themes/uc-basic/svg-sprite.d.ts.map +1 -1
  136. package/blocks/utils/UploadSource.d.ts.map +1 -1
  137. package/blocks/utils/debounce.d.ts +3 -1
  138. package/blocks/utils/debounce.d.ts.map +1 -1
  139. package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.js +1 -1
  140. package/blocks/utils/resizeImage.d.ts +1 -1
  141. package/blocks/utils/resizeImage.d.ts.map +1 -1
  142. package/blocks/utils/throttle.d.ts +3 -1
  143. package/blocks/utils/throttle.d.ts.map +1 -1
  144. package/blocks/utils/userAgent.d.ts +1 -1
  145. package/blocks/utils/userAgent.d.ts.map +1 -1
  146. package/env.d.ts +1 -1
  147. package/env.d.ts.map +1 -1
  148. package/env.js +1 -1
  149. package/index.d.ts +1 -0
  150. package/index.js +1 -0
  151. package/index.ssr.d.ts +9 -1
  152. package/index.ssr.d.ts.map +1 -1
  153. package/index.ssr.js +16 -10
  154. package/locales/file-uploader/ar.d.ts +1 -0
  155. package/locales/file-uploader/ar.js +1 -0
  156. package/locales/file-uploader/az.d.ts +1 -0
  157. package/locales/file-uploader/az.js +1 -0
  158. package/locales/file-uploader/ca.d.ts +1 -0
  159. package/locales/file-uploader/ca.js +1 -0
  160. package/locales/file-uploader/cs.d.ts +1 -0
  161. package/locales/file-uploader/cs.js +1 -0
  162. package/locales/file-uploader/da.d.ts +1 -0
  163. package/locales/file-uploader/da.js +1 -0
  164. package/locales/file-uploader/de.d.ts +1 -0
  165. package/locales/file-uploader/de.js +1 -0
  166. package/locales/file-uploader/el.d.ts +1 -0
  167. package/locales/file-uploader/el.js +1 -0
  168. package/locales/file-uploader/en.d.ts +1 -0
  169. package/locales/file-uploader/en.js +1 -0
  170. package/locales/file-uploader/es.d.ts +1 -0
  171. package/locales/file-uploader/es.js +1 -0
  172. package/locales/file-uploader/et.d.ts +1 -0
  173. package/locales/file-uploader/et.js +1 -0
  174. package/locales/file-uploader/fi.d.ts +1 -0
  175. package/locales/file-uploader/fi.js +1 -0
  176. package/locales/file-uploader/fr.d.ts +1 -0
  177. package/locales/file-uploader/fr.js +1 -0
  178. package/locales/file-uploader/he.d.ts +1 -0
  179. package/locales/file-uploader/he.js +1 -0
  180. package/locales/file-uploader/hy.d.ts +1 -0
  181. package/locales/file-uploader/hy.js +1 -0
  182. package/locales/file-uploader/is.d.ts +1 -0
  183. package/locales/file-uploader/is.js +1 -0
  184. package/locales/file-uploader/it.d.ts +1 -0
  185. package/locales/file-uploader/it.js +1 -0
  186. package/locales/file-uploader/ja.d.ts +1 -0
  187. package/locales/file-uploader/ja.js +1 -0
  188. package/locales/file-uploader/ka.d.ts +1 -0
  189. package/locales/file-uploader/ka.js +1 -0
  190. package/locales/file-uploader/kk.d.ts +1 -0
  191. package/locales/file-uploader/kk.js +1 -0
  192. package/locales/file-uploader/ko.d.ts +1 -0
  193. package/locales/file-uploader/ko.js +1 -0
  194. package/locales/file-uploader/lv.d.ts +1 -0
  195. package/locales/file-uploader/lv.js +1 -0
  196. package/locales/file-uploader/nb.d.ts +1 -0
  197. package/locales/file-uploader/nb.js +1 -0
  198. package/locales/file-uploader/nl.d.ts +1 -0
  199. package/locales/file-uploader/nl.js +1 -0
  200. package/locales/file-uploader/pl.d.ts +1 -0
  201. package/locales/file-uploader/pl.js +1 -0
  202. package/locales/file-uploader/pt.d.ts +1 -0
  203. package/locales/file-uploader/pt.js +1 -0
  204. package/locales/file-uploader/ro.d.ts +1 -0
  205. package/locales/file-uploader/ro.js +1 -0
  206. package/locales/file-uploader/ru.d.ts +1 -0
  207. package/locales/file-uploader/ru.js +1 -0
  208. package/locales/file-uploader/sk.d.ts +1 -0
  209. package/locales/file-uploader/sk.js +1 -0
  210. package/locales/file-uploader/sr.d.ts +1 -0
  211. package/locales/file-uploader/sr.js +1 -0
  212. package/locales/file-uploader/sv.d.ts +1 -0
  213. package/locales/file-uploader/sv.js +1 -0
  214. package/locales/file-uploader/tr.d.ts +1 -0
  215. package/locales/file-uploader/tr.js +1 -0
  216. package/locales/file-uploader/uk.d.ts +1 -0
  217. package/locales/file-uploader/uk.js +1 -0
  218. package/locales/file-uploader/vi.d.ts +1 -0
  219. package/locales/file-uploader/vi.js +1 -0
  220. package/locales/file-uploader/zh-TW.d.ts +1 -0
  221. package/locales/file-uploader/zh-TW.js +1 -0
  222. package/locales/file-uploader/zh.d.ts +1 -0
  223. package/locales/file-uploader/zh.js +1 -0
  224. package/package.json +7 -8
  225. package/solutions/file-uploader/inline/FileUploaderInline.d.ts +2 -2
  226. package/solutions/file-uploader/inline/FileUploaderInline.d.ts.map +1 -1
  227. package/solutions/file-uploader/minimal/FileUploaderMinimal.d.ts +10 -10
  228. package/solutions/file-uploader/minimal/FileUploaderMinimal.d.ts.map +1 -1
  229. package/solutions/file-uploader/minimal/FileUploaderMinimal.js +8 -1
  230. package/solutions/file-uploader/minimal/index.css +5 -23
  231. package/solutions/file-uploader/regular/FileUploaderRegular.d.ts +2 -2
  232. package/solutions/file-uploader/regular/FileUploaderRegular.d.ts.map +1 -1
  233. package/types/jsx.d.ts +1 -1
  234. package/utils/browser-info.d.ts +13 -0
  235. package/utils/browser-info.d.ts.map +1 -0
  236. package/utils/browser-info.js +22 -0
  237. package/utils/browser-info.test.d.ts +2 -0
  238. package/utils/browser-info.test.d.ts.map +1 -0
  239. package/utils/browser-info.test.js +109 -0
  240. package/utils/cdn-utils.d.ts +3 -3
  241. package/utils/cdn-utils.d.ts.map +1 -1
  242. package/utils/fileTypes.d.ts +5 -1
  243. package/utils/fileTypes.d.ts.map +1 -1
  244. package/utils/fileTypes.js +18 -2
  245. package/utils/getPluralForm.d.ts.map +1 -1
  246. package/utils/isSecureTokenExpired.d.ts +1 -1
  247. package/utils/memoize.d.ts.map +1 -1
  248. package/utils/mixinClass.d.ts +3 -1
  249. package/utils/mixinClass.d.ts.map +1 -1
  250. package/utils/prettyBytes.d.ts.map +1 -1
  251. package/utils/template-utils.d.ts +1 -1
  252. package/utils/template-utils.d.ts.map +1 -1
  253. package/utils/toKebabCase.d.ts.map +1 -1
  254. package/utils/transparentPixelSrc.d.ts.map +1 -1
  255. package/utils/uniqueArray.d.ts.map +1 -1
  256. package/utils/validators/collection/validateCollectionUploadError.d.ts +1 -1
  257. package/utils/validators/collection/validateMultiple.d.ts +1 -1
  258. package/utils/validators/file/validateFileType.d.ts +1 -1
  259. package/utils/validators/file/validateIsImage.d.ts +1 -1
  260. package/utils/validators/file/validateMaxSizeLimit.d.ts +1 -1
  261. package/utils/validators/file/validateUploadError.d.ts +1 -1
  262. package/utils/waitForAttribute.d.ts +1 -1
  263. package/utils/waitForAttribute.d.ts.map +1 -1
  264. package/web/file-uploader.iife.min.js +4 -4
  265. package/web/file-uploader.min.js +4 -4
  266. package/web/uc-basic.min.css +1 -1
  267. package/web/uc-cloud-image-editor.min.js +2 -2
  268. package/web/uc-file-uploader-inline.min.css +1 -1
  269. package/web/uc-file-uploader-inline.min.js +4 -4
  270. package/web/uc-file-uploader-minimal.min.css +1 -1
  271. package/web/uc-file-uploader-minimal.min.js +4 -4
  272. package/web/uc-file-uploader-regular.min.css +1 -1
  273. package/web/uc-file-uploader-regular.min.js +4 -4
  274. package/web/uc-img.min.js +2 -2
  275. package/blocks/utils/supportCapture.d.ts +0 -2
  276. package/blocks/utils/supportCapture.d.ts.map +0 -1
  277. package/blocks/utils/supportCapture.js +0 -3
  278. /package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.d.ts +0 -0
  279. /package/blocks/{CloudImageEditor/src/lib → utils}/preloadImage.d.ts.map +0 -0
@@ -1,17 +1,4 @@
1
- export class FileItem extends UploaderBlock {
2
- /** @private */
3
- private _entrySubs;
4
- /**
5
- * @private
6
- * @type {any} TODO: Add types for upload entry
7
- */
8
- private _entry;
9
- /** @private */
10
- private _isIntersecting;
11
- /** @private */
12
- private _debouncedGenerateThumb;
13
- /** @private */
14
- private _debouncedCalculateState;
1
+ export class FileItem extends FileItemConfig {
15
2
  /** @private */
16
3
  private _renderedOnce;
17
4
  init$: {
@@ -31,14 +18,14 @@ export class FileItem extends UploaderBlock {
31
18
  showFileNames: boolean;
32
19
  state: symbol;
33
20
  ariaLabelStatusFile: string;
34
- onEdit: () => void;
21
+ onEdit: (...args: any[]) => void;
35
22
  onRemove: () => void;
36
23
  onUpload: () => void;
37
24
  '*commonProgress': number;
38
25
  '*uploadList': never[];
39
26
  '*uploadQueue': import("@uploadcare/upload-client").Queue;
40
- '*collectionErrors': any[];
41
- '*collectionState': import("../../index.js").OutputCollectionState<import("../../index.js").OutputCollectionStatus, "maybe-has-group"> | null;
27
+ '*collectionErrors': ReturnType<import("../../index.js").OutputErrorCollection>[];
28
+ '*collectionState': import("../../index.js").OutputCollectionState | null;
42
29
  '*groupInfo': import("@uploadcare/upload-client").UploadcareGroup | null;
43
30
  '*uploadTrigger': Set<string>;
44
31
  '*secureUploadsManager': import("../../abstract/SecureUploadsManager.js").SecureUploadsManager | null;
@@ -48,33 +35,26 @@ export class FileItem extends UploaderBlock {
48
35
  '*historyBack': null;
49
36
  '*closeModal': () => void;
50
37
  };
51
- _reset(): void;
52
38
  /**
53
39
  * @private
54
40
  * @param {IntersectionObserverEntry[]} entries
55
41
  */
56
42
  private _observerCallback;
43
+ _isIntersecting: boolean | undefined;
57
44
  _thumbRect: DOMRectReadOnly | undefined;
58
45
  /** @private */
59
46
  private _calculateState;
60
47
  /** @private */
61
- private _generateThumbnail;
62
- /**
63
- * @private
64
- * @param {string} prop
65
- * @param {(value: any) => void} handler
66
- */
67
- private _subEntry;
68
- _updateHint: (() => void) & {
69
- readonly cancel: () => void;
70
- };
48
+ private _debouncedCalculateState;
49
+ _updateHint: (...args: any[]) => void;
71
50
  /**
72
51
  * @private
73
52
  * @param {String} id
74
53
  */
75
54
  private _handleEntryId;
76
- /** @param {(typeof FileItemState)[keyof typeof FileItemState]} state */
77
- _handleState(state: (typeof FileItemState)[keyof typeof FileItemState]): void;
55
+ /** @param {boolean} value */
56
+ _updateShowFileNames(value: boolean): void;
57
+ _handleState: (...args: any[]) => void;
78
58
  /** @private */
79
59
  private _observer;
80
60
  _settingsOfShrink(): {
@@ -86,18 +66,11 @@ export class FileItem extends UploaderBlock {
86
66
  * @param {File} file
87
67
  */
88
68
  private _processShrink;
89
- upload(): Promise<void>;
69
+ upload: (...args: any[]) => Promise<void>;
90
70
  }
91
71
  export namespace FileItem {
92
72
  let template: string;
93
73
  let activeInstances: Set<any>;
94
74
  }
95
- import { UploaderBlock } from '../../abstract/UploaderBlock.js';
96
- declare const FileItemState: Readonly<{
97
- FINISHED: symbol;
98
- FAILED: symbol;
99
- UPLOADING: symbol;
100
- IDLE: symbol;
101
- }>;
102
- export {};
75
+ import { FileItemConfig } from './FileItemConfig.js';
103
76
  //# sourceMappingURL=FileItem.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"FileItem.d.ts","sourceRoot":"","sources":["FileItem.js"],"names":[],"mappings":"AAoBA;IAIE,eAAe;IACf,mBAAuB;IACvB;;;OAGG;IACH,eAAc;IACd,eAAe;IACf,wBAAwB;IACxB,eAAe;IACf,gCAA4E;IAC5E,eAAe;IACf,iCAA0E;IAE1E,eAAe;IACf,sBAAsB;IAKpB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MA+BC;IAGH,eASC;IAED;;;OAGG;IACH,0BAgBC;IAZC,wCAA0C;IAc5C,eAAe;IACf,wBAgBC;IAED,eAAe;IACf,2BAuCC;IAED;;;;OAIG;IACH,kBAUC;IAED;;MAaQ;IAER;;;OAGG;IACH,uBAmDC;IAyDD,wEAAwE;IACxE,oBADY,CAAC,oBAAoB,CAAC,CAAC,MAAM,oBAAoB,CAAC,QA0B7D;IAaC,eAAe;IACf,kBAEE;IAWJ;;;MAEC;IAED;;;OAGG;IACH,uBAEC;IAED,wBAsFC;CACF;;;;;8BAhd6B,iCAAiC;AAS/D;;;;;GAKG"}
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;IAED,6BAA6B;IAC7B,4BADY,OAAO,QASlB;IAgDD,uCA+BE;IAaA,eAAe;IACf,kBAEE;IAUJ;;;MAEC;IAED;;;OAGG;IACH,uBAEC;IAED,0CAwGG;CACJ;;;;;+BA5Y8B,qBAAqB"}
@@ -1,15 +1,12 @@
1
1
  // @ts-check
2
- import { CancelError, uploadFile } from '@uploadcare/upload-client';
3
2
  import { shrinkFile } from '@uploadcare/image-shrink';
3
+ import { CancelError, UploadcareError, uploadFile } from '@uploadcare/upload-client';
4
4
  import { ActivityBlock } from '../../abstract/ActivityBlock.js';
5
- import { UploaderBlock } from '../../abstract/UploaderBlock.js';
6
- import { createCdnUrl, createCdnUrlModifiers, createOriginalUrl } from '../../utils/cdn-utils.js';
7
- import { fileCssBg } from '../svg-backgrounds/svg-backgrounds.js';
8
5
  import { debounce } from '../utils/debounce.js';
9
- import { generateThumb } from '../utils/resizeImage.js';
10
6
  import { parseShrink } from '../../utils/parseShrink.js';
11
7
  import { UploadSource } from '../utils/UploadSource.js';
12
8
  import { throttle } from '../utils/throttle.js';
9
+ import { FileItemConfig } from './FileItemConfig.js';
13
10
 
14
11
  const FileItemState = Object.freeze({
15
12
  FINISHED: Symbol('FINISHED'),
@@ -18,24 +15,10 @@ const FileItemState = Object.freeze({
18
15
  IDLE: Symbol('IDLE'),
19
16
  });
20
17
 
21
- export class FileItem extends UploaderBlock {
18
+ export class FileItem extends FileItemConfig {
22
19
  couldBeCtxOwner = true;
23
20
  pauseRender = true;
24
21
 
25
- /** @private */
26
- _entrySubs = new Set();
27
- /**
28
- * @private
29
- * @type {any} TODO: Add types for upload entry
30
- */
31
- _entry = null;
32
- /** @private */
33
- _isIntersecting = false;
34
- /** @private */
35
- _debouncedGenerateThumb = debounce(this._generateThumbnail.bind(this), 100);
36
- /** @private */
37
- _debouncedCalculateState = debounce(this._calculateState.bind(this), 100);
38
-
39
22
  /** @private */
40
23
  _renderedOnce = false;
41
24
 
@@ -60,13 +43,13 @@ export class FileItem extends UploaderBlock {
60
43
  showFileNames: false,
61
44
  state: FileItemState.IDLE,
62
45
  ariaLabelStatusFile: '',
63
- onEdit: () => {
46
+ onEdit: this._withEntry((entry) => {
64
47
  this.$['*currentActivityParams'] = {
65
- internalId: this._entry.uid,
48
+ internalId: entry.uid,
66
49
  };
67
50
  this.modalManager.open(ActivityBlock.activities.CLOUD_IMG_EDIT);
68
51
  this.$['*currentActivity'] = ActivityBlock.activities.CLOUD_IMG_EDIT;
69
- },
52
+ }),
70
53
  onRemove: () => {
71
54
  this.uploadCollection.remove(this.$.uid);
72
55
  },
@@ -77,14 +60,8 @@ export class FileItem extends UploaderBlock {
77
60
  }
78
61
 
79
62
  _reset() {
80
- for (let sub of this._entrySubs) {
81
- sub.remove();
82
- }
83
-
84
- this._debouncedGenerateThumb.cancel();
63
+ super._reset();
85
64
  this._debouncedCalculateState.cancel();
86
- this._entrySubs = new Set();
87
- this._entry = null;
88
65
  }
89
66
 
90
67
  /**
@@ -101,20 +78,10 @@ export class FileItem extends UploaderBlock {
101
78
  this.render();
102
79
  this._renderedOnce = true;
103
80
  }
104
- if (entry.intersectionRatio === 0) {
105
- this._debouncedGenerateThumb.cancel();
106
- } else {
107
- this._debouncedGenerateThumb();
108
- // this?._observer.disconnect();
109
- }
110
81
  }
111
82
 
112
83
  /** @private */
113
- _calculateState() {
114
- if (!this._entry) {
115
- return;
116
- }
117
- let entry = this._entry;
84
+ _calculateState = this._withEntry((entry) => {
118
85
  let state = FileItemState.IDLE;
119
86
 
120
87
  if (entry.getValue('errors').length > 0) {
@@ -126,81 +93,40 @@ export class FileItem extends UploaderBlock {
126
93
  }
127
94
 
128
95
  this.$.state = state;
129
- }
96
+ });
130
97
 
131
98
  /** @private */
132
- async _generateThumbnail() {
133
- if (!this._entry) {
134
- return;
135
- }
136
- let entry = this._entry;
137
-
138
- if (entry.getValue('fileInfo') && entry.getValue('isImage')) {
139
- let size = Math.max(
140
- parseInt(String(this?._thumbRect?.height || 0)),
141
- parseInt(String(this?._thumbRect?.width || 0)),
142
- this.cfg.thumbSize,
143
- );
144
-
145
- let thumbUrl = await this.proxyUrl(
146
- createCdnUrl(
147
- createOriginalUrl(this.cfg.cdnCname, this._entry.getValue('uuid')),
148
- createCdnUrlModifiers(entry.getValue('cdnUrlModifiers'), `scale_crop/${size}x${size}/center`),
149
- ),
150
- );
151
- let currentThumbUrl = entry.getValue('thumbUrl');
152
- if (currentThumbUrl !== thumbUrl) {
153
- entry.setValue('thumbUrl', thumbUrl);
154
- currentThumbUrl?.startsWith('blob:') && URL.revokeObjectURL(currentThumbUrl);
155
- }
156
- return;
157
- }
99
+ _debouncedCalculateState = debounce(this._calculateState.bind(this), 100);
158
100
 
159
- if (entry.getValue('file')?.type.includes('image')) {
160
- try {
161
- let thumbUrl = await generateThumb(entry.getValue('file'), this.cfg.thumbSize);
162
- entry.setValue('thumbUrl', thumbUrl);
163
- } catch (err) {
164
- let color = window.getComputedStyle(this).getPropertyValue('--uc-muted-foreground');
165
- entry.setValue('thumbUrl', fileCssBg(color));
101
+ _updateHint = this._withEntry(
102
+ throttle((entry) => {
103
+ const source = entry.getValue('source');
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;
166
113
  }
167
- } else {
168
- let color = window.getComputedStyle(this).getPropertyValue('--uc-muted-foreground');
169
- entry.setValue('thumbUrl', fileCssBg(color));
170
- }
171
- }
172
-
173
- /**
174
- * @private
175
- * @param {string} prop
176
- * @param {(value: any) => void} handler
177
- */
178
- _subEntry(prop, handler) {
179
- let sub = this._entry.subscribe(
180
- prop,
181
- /** @param {any} value */ (value) => {
182
- if (this.isConnected) {
183
- handler(value);
184
- }
185
- },
186
- );
187
- this._entrySubs.add(sub);
188
- }
189
114
 
190
- _updateHint = throttle(() => {
191
- const showHint =
192
- this.$.state === FileItemState.UPLOADING &&
193
- this._entry.getValue('externalUrl') &&
194
- this._entry.getValue('source') !== UploadSource.URL &&
195
- this._entry.getValue('errors').length === 0 &&
196
- this.$.progressValue === 0;
115
+ if (isQueued) {
116
+ const hint = this.l10n('queued');
117
+ this.$.hint = hint;
118
+ return;
119
+ }
197
120
 
198
- const hint = showHint
199
- ? this.l10n('waiting-for', { source: this.l10n(`src-type-${this._entry.getValue('source')}`) })
200
- : '';
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
+ }
201
126
 
202
- this.$.hint = hint;
203
- }, 100);
127
+ this.$.hint = '';
128
+ }, 100),
129
+ );
204
130
 
205
131
  /**
206
132
  * @private
@@ -209,7 +135,6 @@ export class FileItem extends UploaderBlock {
209
135
  _handleEntryId(id) {
210
136
  this._reset();
211
137
 
212
- /** @type {import('../../abstract/TypedData.js').TypedData} */
213
138
  let entry = this.uploadCollection?.read(id);
214
139
  this._entry = entry;
215
140
 
@@ -222,6 +147,10 @@ export class FileItem extends UploaderBlock {
222
147
  this._updateHint();
223
148
  });
224
149
 
150
+ this._subEntry('isQueued', () => {
151
+ this._updateHint();
152
+ });
153
+
225
154
  this._subEntry('fileName', (name) => {
226
155
  this.$.itemName = name || entry.getValue('externalUrl') || this.l10n('file-no-name');
227
156
  this._debouncedCalculateState();
@@ -231,21 +160,8 @@ export class FileItem extends UploaderBlock {
231
160
  this.$.itemName = entry.getValue('fileName') || externalUrl || this.l10n('file-no-name');
232
161
  });
233
162
 
234
- this._subEntry('fileInfo', (fileInfo) => {
163
+ this._subEntry('fileInfo', () => {
235
164
  this._debouncedCalculateState();
236
- if (fileInfo && this._isIntersecting) {
237
- this._debouncedGenerateThumb();
238
- }
239
- });
240
-
241
- this._subEntry('cdnUrlModifiers', () => {
242
- if (this._isIntersecting) {
243
- this._debouncedGenerateThumb();
244
- }
245
- });
246
-
247
- this._subEntry('thumbUrl', (thumbUrl) => {
248
- this.$.thumbUrl = thumbUrl ? `url(${thumbUrl})` : '';
249
165
  });
250
166
 
251
167
  this._subEntry('errors', () => this._debouncedCalculateState());
@@ -253,10 +169,17 @@ export class FileItem extends UploaderBlock {
253
169
  this._subEntry('fileSize', () => this._debouncedCalculateState());
254
170
  this._subEntry('mimeType', () => this._debouncedCalculateState());
255
171
  this._subEntry('isImage', () => this._debouncedCalculateState());
172
+ }
256
173
 
257
- if (this._isIntersecting) {
258
- this._debouncedGenerateThumb();
174
+ /** @param {boolean} value */
175
+ _updateShowFileNames(value) {
176
+ const isListMode = this.cfg.filesViewMode === 'list';
177
+ if (isListMode) {
178
+ this.$.showFileNames = true;
179
+ return;
259
180
  }
181
+
182
+ this.$.showFileNames = value;
260
183
  }
261
184
 
262
185
  initCallback() {
@@ -271,24 +194,15 @@ export class FileItem extends UploaderBlock {
271
194
  });
272
195
 
273
196
  this.subConfigValue('useCloudImageEditor', () => this._debouncedCalculateState());
197
+
274
198
  this.subConfigValue('filesViewMode', (mode) => {
275
- if (this.cfg.filesViewMode === 'grid') {
276
- this.$.showFileNames = this.cfg.gridShowFileNames;
277
- }
278
- if (this.cfg.filesViewMode === 'list') {
279
- this.$.showFileNames = true;
280
- }
199
+ this._updateShowFileNames(this.cfg.gridShowFileNames);
281
200
 
282
201
  this.setAttribute('mode', mode);
283
202
  });
284
203
 
285
204
  this.subConfigValue('gridShowFileNames', (value) => {
286
- if (this.cfg.filesViewMode === 'grid') {
287
- this.$.showFileNames = value;
288
- }
289
- if (this.cfg.filesViewMode === 'list') {
290
- this.$.showFileNames = true;
291
- }
205
+ this._updateShowFileNames(value);
292
206
  });
293
207
 
294
208
  this.onclick = () => {
@@ -305,7 +219,7 @@ export class FileItem extends UploaderBlock {
305
219
  '*uploadTrigger',
306
220
  /** @param {Set<string>} itemsToUpload */
307
221
  (itemsToUpload) => {
308
- if (!itemsToUpload.has(this._entry.uid)) {
222
+ if (this._entry && !itemsToUpload.has(this._entry.uid)) {
309
223
  return;
310
224
  }
311
225
  setTimeout(() => this.isConnected && this.upload());
@@ -314,33 +228,38 @@ export class FileItem extends UploaderBlock {
314
228
  FileItem.activeInstances.add(this);
315
229
  }
316
230
 
317
- /** @param {(typeof FileItemState)[keyof typeof FileItemState]} state */
318
- _handleState(state) {
319
- if (state === FileItemState.FAILED) {
320
- this.$.badgeIcon = 'badge-error';
321
- } else if (state === FileItemState.FINISHED) {
322
- this.$.badgeIcon = 'badge-success';
323
- }
324
-
325
- if (state === FileItemState.UPLOADING) {
326
- this.$.isFocused = false;
327
- }
231
+ _handleState = this._withEntry(
232
+ /** @param {(typeof FileItemState)[keyof typeof FileItemState]} state */
233
+ (entry, state) => {
234
+ if (state === FileItemState.FAILED) {
235
+ this.$.badgeIcon = 'badge-error';
236
+ } else if (state === FileItemState.FINISHED) {
237
+ this.$.badgeIcon = 'badge-success';
238
+ }
328
239
 
329
- this.set$({
330
- isFailed: state === FileItemState.FAILED,
331
- isUploading: state === FileItemState.UPLOADING,
332
- isFinished: state === FileItemState.FINISHED,
333
- progressVisible: state === FileItemState.UPLOADING,
334
- isEditable: this.cfg.useCloudImageEditor && this._entry?.getValue('isImage') && this._entry?.getValue('cdnUrl'),
335
- errorText: this._entry.getValue('errors')?.[0]?.message,
336
- ariaLabelStatusFile: this.l10n('a11y-file-item-status', {
337
- fileName: this._entry?.getValue('fileName'),
338
- status: this.l10n(state?.description?.toLocaleLowerCase() ?? '').toLocaleLowerCase(),
339
- }),
340
- });
240
+ if (state === FileItemState.UPLOADING) {
241
+ this.$.isFocused = false;
242
+ }
243
+ const fileName = entry.getValue('fileName');
244
+
245
+ this.set$({
246
+ isFailed: state === FileItemState.FAILED,
247
+ isUploading: state === FileItemState.UPLOADING,
248
+ isFinished: state === FileItemState.FINISHED,
249
+ progressVisible: state === FileItemState.UPLOADING,
250
+ isEditable: this.cfg.useCloudImageEditor && this._entry?.getValue('isImage') && this._entry?.getValue('cdnUrl'),
251
+ errorText: entry.getValue('errors')?.[0]?.message,
252
+ ariaLabelStatusFile:
253
+ fileName &&
254
+ this.l10n('a11y-file-item-status', {
255
+ fileName,
256
+ status: this.l10n(state?.description?.toLocaleLowerCase() ?? '').toLocaleLowerCase(),
257
+ }),
258
+ });
341
259
 
342
- this._updateHint();
343
- }
260
+ this._updateHint();
261
+ },
262
+ );
344
263
 
345
264
  destroyCallback() {
346
265
  super.destroyCallback();
@@ -363,7 +282,6 @@ export class FileItem extends UploaderBlock {
363
282
  disconnectedCallback() {
364
283
  super.disconnectedCallback();
365
284
 
366
- this._debouncedGenerateThumb.cancel();
367
285
  this._observer?.disconnect();
368
286
  }
369
287
 
@@ -379,9 +297,7 @@ export class FileItem extends UploaderBlock {
379
297
  return shrinkFile(file, this._settingsOfShrink());
380
298
  }
381
299
 
382
- async upload() {
383
- let entry = this._entry;
384
-
300
+ upload = this._withEntry(async (entry) => {
385
301
  if (!this.uploadCollection.read(entry.uid)) {
386
302
  return;
387
303
  }
@@ -395,26 +311,35 @@ export class FileItem extends UploaderBlock {
395
311
  }
396
312
 
397
313
  this._debouncedCalculateState();
398
- entry.setValue('isUploading', true);
399
- entry.setValue('errors', []);
314
+
315
+ entry.setMultipleValues({
316
+ isUploading: true,
317
+ errors: [],
318
+ isQueued: true,
319
+ });
400
320
 
401
321
  try {
402
322
  let abortController = new AbortController();
403
323
  entry.setValue('abortController', abortController);
404
324
 
405
325
  const uploadTask = async () => {
326
+ entry.setValue('isQueued', false);
327
+ /** @type {Blob | File | null} */
406
328
  let file = entry.getValue('file');
407
329
  if (file && this.cfg.imageShrink) {
408
- file = await this._processShrink(file).catch(() => file);
330
+ file = await this._processShrink(/** @type {File} */ (file)).catch(() => file);
409
331
  }
410
332
 
411
333
  const fileInput = file || entry.getValue('externalUrl') || entry.getValue('uuid');
334
+ if (!fileInput) {
335
+ throw new Error('No file input');
336
+ }
412
337
  const baseUploadClientOptions = await this.getUploadClientOptions();
413
338
  /** @type {import('@uploadcare/upload-client').FileFromOptions} */
414
339
  const uploadClientOptions = {
415
340
  ...baseUploadClientOptions,
416
- fileName: entry.getValue('fileName'),
417
- source: entry.getValue('source'),
341
+ fileName: entry.getValue('fileName') ?? undefined,
342
+ source: entry.getValue('source') ?? undefined,
418
343
  onProgress: (progress) => {
419
344
  if (progress.isComputable) {
420
345
  let percentage = progress.value * 100;
@@ -432,10 +357,11 @@ export class FileItem extends UploaderBlock {
432
357
  let fileInfo = await this.$['*uploadQueue'].add(uploadTask);
433
358
  entry.setMultipleValues({
434
359
  fileInfo,
360
+ isQueued: false,
435
361
  isUploading: false,
436
362
  fileName: fileInfo.originalFilename,
437
363
  fileSize: fileInfo.size,
438
- isImage: fileInfo.isImage,
364
+ isImage: fileInfo.isImage ?? false,
439
365
  mimeType: fileInfo.contentInfo?.mime?.mime ?? fileInfo.mimeType,
440
366
  uuid: fileInfo.uuid,
441
367
  cdnUrl: entry.getValue('cdnUrl') ?? fileInfo.cdnUrl,
@@ -453,24 +379,34 @@ export class FileItem extends UploaderBlock {
453
379
  isUploading: false,
454
380
  uploadProgress: 0,
455
381
  });
456
- } else {
382
+ } else if (cause instanceof UploadcareError) {
457
383
  entry.setMultipleValues({
458
384
  isUploading: false,
459
385
  uploadProgress: 0,
460
386
  uploadError: cause,
461
387
  });
388
+ } else {
389
+ console.error('Unknown upload error', cause);
390
+ entry.setMultipleValues({
391
+ isUploading: false,
392
+ uploadProgress: 0,
393
+ // TODO: Add translation?
394
+ uploadError: new Error('Something went wrong', {
395
+ cause,
396
+ }),
397
+ });
462
398
  }
463
399
 
464
400
  if (entry === this._entry) {
465
401
  this._debouncedCalculateState();
466
402
  }
467
403
  }
468
- }
404
+ });
469
405
  }
470
406
 
471
407
  FileItem.template = /* HTML */ `
472
408
  <div class="uc-inner" set="@finished: isFinished; @uploading: isUploading; @failed: isFailed; @focused: isFocused">
473
- <uc-thumb set="uid:uid;thumbUrl:thumbUrl;badgeIcon:badgeIcon"></uc-thumb>
409
+ <uc-thumb set="uid:uid;badgeIcon:badgeIcon"></uc-thumb>
474
410
 
475
411
  <div aria-atomic="true" aria-live="polite" class="uc-file-name-wrapper" set="@aria-label:ariaLabelStatusFile;">
476
412
  <span class="uc-file-name" set="@hidden: !showFileNames">{{itemName}}</span>
@@ -500,7 +436,7 @@ FileItem.template = /* HTML */ `
500
436
  </div>
501
437
  <uc-progress-bar
502
438
  class="uc-progress-bar"
503
- set="value: progressValue; visible: progressVisible; @hasFileName: showFileNames"
439
+ set="value: progressValue; visible: progressVisible; @hasFileName: showFileNames;"
504
440
  >
505
441
  </uc-progress-bar>
506
442
  </div>
@@ -0,0 +1,28 @@
1
+ export class FileItemConfig extends UploaderBlock {
2
+ /** @protected */
3
+ protected _entrySubs: Set<any>;
4
+ /**
5
+ * @type {import('../../abstract/uploadEntrySchema.js').UploadEntryTypedData | null}
6
+ * @protected
7
+ */
8
+ protected _entry: import("../../abstract/uploadEntrySchema.js").UploadEntryTypedData | null;
9
+ /**
10
+ * @template {any[]} A
11
+ * @template {(entry: import('../../abstract/uploadEntrySchema.js').UploadEntryTypedData, ...args: A) => any} T
12
+ * @param {T} fn
13
+ * @returns {(...args: A) => ReturnType<T>}
14
+ * @protected
15
+ */
16
+ protected _withEntry<A extends any[], T extends (entry: import("../../abstract/uploadEntrySchema.js").UploadEntryTypedData, ...args: A) => any>(fn: T): (...args: A) => ReturnType<T>;
17
+ /**
18
+ * @template {import('../../abstract/uploadEntrySchema.js').UploadEntryKeys} K
19
+ * @param {K} prop_
20
+ * @param {(value: import('../../abstract/uploadEntrySchema.js').UploadEntryData[K]) => void} handler_
21
+ * @protected
22
+ */
23
+ protected _subEntry: (prop_: K, handler_: (value: import("../../abstract/uploadEntrySchema.js").UploadEntryData[K]) => void) => void;
24
+ /** @protected */
25
+ protected _reset(): void;
26
+ }
27
+ import { UploaderBlock } from '../../abstract/UploaderBlock.js';
28
+ //# sourceMappingURL=FileItemConfig.d.ts.map
@@ -0,0 +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;IAErB,iBAAiB;IACjB,yBAOC;CAMF;8BAvE6B,iCAAiC"}