@uploadcare/file-uploader 1.24.0-alpha.2 → 1.24.0

package/dist/env.js

@@ -25,7 +25,7 @@
  */
 
 // package.json
-var version = "1.24.0-alpha.2";
+var version = "1.24.0";
 
 // src/env.ts
 var PACKAGE_NAME = "blocks";

package/dist/index.css

@@ -23,7 +23,7 @@
  * SOFTWARE.
  * 
  */
-@layer uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset, uc.base, uc.rules, uc.post-reset;
+@layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset, uc.base, uc.rules, uc.post-reset;
 
 /* src/blocks/ActivityHeader/activity-header.css */
 @layer uc.components {
@@ -1740,6 +1740,7 @@
   uc-icon svg {
     width: calc(var(--uc-button-size) / 2);
     height: calc(var(--uc-button-size) / 2);
+    overflow: visible;
   }
 }
 
@@ -2314,7 +2315,7 @@
 }
 
 /* src/blocks/themes/uc-basic/layers.css */
-@layer uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
+@layer uc, uc.base, uc.components, uc.rules, uc.solutions, uc.post-reset;
 
 /* src/blocks/themes/uc-basic/config.css */
 @layer uc.base {

package/dist/index.d.ts

@@ -7,41 +7,6 @@ export { loadFileUploaderFrom } from './abstract/loadFileUploaderFrom.js';
 import { TelemetryRequest } from '@uploadcare/quality-insights';
 export { PACKAGE_NAME, PACKAGE_VERSION } from './env.js';
 
-declare const ExternalUploadSource: Readonly<{
-    readonly FACEBOOK: "facebook";
-    readonly DROPBOX: "dropbox";
-    readonly GDRIVE: "gdrive";
-    readonly GPHOTOS: "gphotos";
-    readonly FLICKR: "flickr";
-    readonly VK: "vk";
-    readonly EVERNOTE: "evernote";
-    readonly BOX: "box";
-    readonly ONEDRIVE: "onedrive";
-    readonly HUDDLE: "huddle";
-}>;
-declare const UploadSource: Readonly<{
-    readonly FACEBOOK: "facebook";
-    readonly DROPBOX: "dropbox";
-    readonly GDRIVE: "gdrive";
-    readonly GPHOTOS: "gphotos";
-    readonly FLICKR: "flickr";
-    readonly VK: "vk";
-    readonly EVERNOTE: "evernote";
-    readonly BOX: "box";
-    readonly ONEDRIVE: "onedrive";
-    readonly HUDDLE: "huddle";
-    readonly MOBILE_VIDEO_CAMERA: "mobile-video-camera";
-    readonly MOBILE_PHOTO_CAMERA: "mobile-photo-camera";
-    readonly LOCAL: "local";
-    readonly DROP_AREA: "drop-area";
-    readonly CAMERA: "camera";
-    readonly EXTERNAL: "external";
-    readonly API: "js-api";
-    readonly URL: "url";
-    readonly DRAW: "draw";
-}>;
-type SourceTypes = (typeof UploadSource)[keyof typeof UploadSource];
-
 declare class A11y {
     private _destroyKeyUX;
     private readonly _scopedWindow;
@@ -182,7 +147,7 @@ declare class Block extends BaseComponent<any> {
     static StateConsumerScope: string | null;
     static styleAttrs: string[];
     protected requireCtxName: boolean;
-    activityType: any;
+    activityType: ActivityType;
     init$: {};
     l10n(str: string, variables?: Record<string, string | number>): string;
     private pluralize;
@@ -479,8 +444,8 @@ declare class ValidationManager {
     private _getValidatorDescriptorsForEntry;
 }
 
-type CameraMode = "photo" | "video";
-type CameraStatus = "shot" | "retake" | "accept" | "play" | "stop" | "pause" | "resume";
+type CameraMode = 'photo' | 'video';
+type CameraStatus = 'shot' | 'retake' | 'accept' | 'play' | 'stop' | 'pause' | 'resume';
 declare class CameraSource extends UploaderBlock {
     couldBeCtxOwner: boolean;
     activityType: "camera";
@@ -580,12 +545,52 @@ declare class UploadList extends UploaderBlock {
     destroyCallback(): void;
 }
 
+declare const ExternalUploadSource: Readonly<{
+    readonly FACEBOOK: "facebook";
+    readonly DROPBOX: "dropbox";
+    readonly GDRIVE: "gdrive";
+    readonly GPHOTOS: "gphotos";
+    readonly FLICKR: "flickr";
+    readonly VK: "vk";
+    readonly EVERNOTE: "evernote";
+    readonly BOX: "box";
+    readonly ONEDRIVE: "onedrive";
+    readonly HUDDLE: "huddle";
+}>;
+declare const UploadSource: Readonly<{
+    readonly FACEBOOK: "facebook";
+    readonly DROPBOX: "dropbox";
+    readonly GDRIVE: "gdrive";
+    readonly GPHOTOS: "gphotos";
+    readonly FLICKR: "flickr";
+    readonly VK: "vk";
+    readonly EVERNOTE: "evernote";
+    readonly BOX: "box";
+    readonly ONEDRIVE: "onedrive";
+    readonly HUDDLE: "huddle";
+    readonly MOBILE_VIDEO_CAMERA: "mobile-video-camera";
+    readonly MOBILE_PHOTO_CAMERA: "mobile-photo-camera";
+    readonly LOCAL: "local";
+    readonly DROP_AREA: "drop-area";
+    readonly CAMERA: "camera";
+    readonly EXTERNAL: "external";
+    readonly API: "js-api";
+    readonly URL: "url";
+    readonly DRAW: "draw";
+}>;
+type SourceTypes = (typeof UploadSource)[keyof typeof UploadSource];
+
 declare const CameraSourceTypes: Readonly<{
     PHOTO: "photo";
     VIDEO: "video";
 }>;
 type ModeCameraType = (typeof CameraSourceTypes)[keyof typeof CameraSourceTypes];
 
+type ApiAddFileCommonOptions = {
+    silent?: boolean;
+    fileName?: string;
+    source?: string;
+};
 declare class UploaderPublicApi {
     private _ctx;
     constructor(ctx: UploaderBlock);
@@ -595,25 +600,10 @@ declare class UploaderPublicApi {
     /**
      * TODO: Probably we should not allow user to override `source` property
      */
-    addFileFromUrl: (url: string, { silent, fileName, source, }?: {
-        silent?: boolean;
-        fileName?: string;
-        source?: string;
-    }) => OutputFileEntry<"idle">;
-    addFileFromUuid: (uuid: string, { silent, fileName, source, }?: {
-        silent?: boolean;
-        fileName?: string;
-        source?: string;
-    }) => OutputFileEntry<"idle">;
-    addFileFromCdnUrl: (cdnUrl: string, { silent, fileName, source, }?: {
-        silent?: boolean;
-        fileName?: string;
-        source?: string;
-    }) => OutputFileEntry<"idle">;
-    addFileFromObject: (file: File, { silent, fileName, source, fullPath, }?: {
-        silent?: boolean;
-        fileName?: string;
-        source?: string;
+    addFileFromUrl: (url: string, { silent, fileName, source }?: ApiAddFileCommonOptions) => OutputFileEntry<"idle">;
+    addFileFromUuid: (uuid: string, { silent, fileName, source }?: ApiAddFileCommonOptions) => OutputFileEntry<"idle">;
+    addFileFromCdnUrl: (cdnUrl: string, { silent, fileName, source }?: ApiAddFileCommonOptions) => OutputFileEntry<"idle">;
+    addFileFromObject: (file: File, { silent, fileName, source, fullPath, }?: ApiAddFileCommonOptions & {
         fullPath?: string;
     }) => OutputFileEntry<"idle">;
     removeFileByInternalId: (internalId: string) => void;
@@ -2040,4 +2030,4 @@ declare class FileUploaderRegular extends SolutionBlock {
 type KebabCase<T extends string> = T extends `${infer Head} ${infer Tail}` ? `${Lowercase<Head>}-${KebabCase<Tail>}` : Lowercase<T>;
 declare const toKebabCase: <T extends string>(str: T) => KebabCase<T>;
 
-export { ActivityBlock, ActivityHeader, Block, BtnUi, CameraSource, CloudImageEditor, CloudImageEditorActivity, CloudImageEditorBlock, type CollectionValidators, Config, type ConfigAttributesType, type ConfigComplexType, type ConfigPlainType, type ConfigType, Copyright, CropFrame, DropArea, EditorAspectRatioButtonControl, EditorCropButtonControl, EditorFilterControl, EditorFreeformButtonControl, EditorImageCropper, EditorImageFader, EditorOperationControl, EditorScroller, EditorSlider, EditorToolbar, type EventMap, type EventPayload, EventType, ExternalSource, ExternalUploadSource, FileItem, FileUploaderInline, FileUploaderMinimal, FileUploaderRegular, type FileValidator, type FileValidatorDescriptor, type FileValidators, FormInput, type FuncCollectionValidator, type FuncFileValidator, type GroupFlag, Icon, type IconHrefResolver, Img, type KebabCase$1 as KebabCase, type KebabCaseKeys, LineLoaderUi, type LocaleDefinitionOverride, type LowerCase, type LowerCaseKeys, type MetadataCallback, Modal, ModalEvents, type ModalId, type OutputCollectionErrorType, type OutputCollectionState, type OutputCollectionStatus, type OutputCustomErrorType, type OutputError, type OutputErrorCollection, type OutputErrorFile, type OutputErrorTypePayload, type OutputFileEntry, type OutputFileErrorPayload, type OutputFileErrorType, type OutputFileStatus, PresenceToggle, ProgressBar, ProgressBarCommon, type SecureDeliveryProxyUrlResolver, type SecureUploadsSignatureAndExpire, type SecureUploadsSignatureResolver, Select, SimpleBtn, SliderUi, SolutionBlock, SourceBtn, SourceList, type SourceTypes, Spinner, StartFrom, Thumb, UploadCtxProvider, UploadList, UploadSource, UploaderBlock, UploaderPublicApi, UrlSource, defineComponents, defineLocale, toKebabCase };
+export { ActivityBlock, ActivityHeader, type ApiAddFileCommonOptions, Block, BtnUi, CameraSource, CloudImageEditor, CloudImageEditorActivity, CloudImageEditorBlock, type CollectionValidators, Config, type ConfigAttributesType, type ConfigComplexType, type ConfigPlainType, type ConfigType, Copyright, CropFrame, DropArea, EditorAspectRatioButtonControl, EditorCropButtonControl, EditorFilterControl, EditorFreeformButtonControl, EditorImageCropper, EditorImageFader, EditorOperationControl, EditorScroller, EditorSlider, EditorToolbar, type EventMap, type EventPayload, EventType, ExternalSource, ExternalUploadSource, FileItem, FileUploaderInline, FileUploaderMinimal, FileUploaderRegular, type FileValidator, type FileValidatorDescriptor, type FileValidators, FormInput, type FuncCollectionValidator, type FuncFileValidator, type GroupFlag, Icon, type IconHrefResolver, Img, type KebabCase$1 as KebabCase, type KebabCaseKeys, LineLoaderUi, type LocaleDefinitionOverride, type LowerCase, type LowerCaseKeys, type MetadataCallback, Modal, ModalEvents, type ModalId, type OutputCollectionErrorType, type OutputCollectionState, type OutputCollectionStatus, type OutputCustomErrorType, type OutputError, type OutputErrorCollection, type OutputErrorFile, type OutputErrorTypePayload, type OutputFileEntry, type OutputFileErrorPayload, type OutputFileErrorType, type OutputFileStatus, PresenceToggle, ProgressBar, ProgressBarCommon, type SecureDeliveryProxyUrlResolver, type SecureUploadsSignatureAndExpire, type SecureUploadsSignatureResolver, Select, SimpleBtn, SliderUi, SolutionBlock, SourceBtn, SourceList, type SourceTypes, Spinner, StartFrom, Thumb, UploadCtxProvider, UploadList, UploadSource, UploaderBlock, UploaderPublicApi, UrlSource, defineComponents, defineLocale, toKebabCase };

package/dist/index.js

@@ -1216,7 +1216,7 @@ import { TelemetryAPIService } from "@uploadcare/quality-insights";
 import { Queue as Queue2 } from "@uploadcare/upload-client";
 
 // package.json
-var version = "1.24.0-alpha.2";
+var version = "1.24.0";
 
 // src/env.ts
 var PACKAGE_NAME = "blocks";
@@ -1547,7 +1547,7 @@ var Block = class extends BaseComponent {
     return testId;
   }
   get modalManager() {
-    return this.has("*modalManager") && this.$["*modalManager"];
+    return this.has("*modalManager") ? this.$["*modalManager"] : void 0;
   }
   get telemetryManager() {
     if (!this.cfg.qualityInsights) {
@@ -1590,7 +1590,7 @@ var Block = class extends BaseComponent {
   destroyCtxCallback() {
     Data.deleteCtx(this.ctxName);
     this.localeManager?.destroy();
-    this.modalManager && this.modalManager?.destroy();
+    this.modalManager?.destroy();
   }
   async proxyUrl(url) {
     if (this.cfg.secureDeliveryProxy && this.cfg.secureDeliveryProxyUrlResolver) {
@@ -1741,7 +1741,7 @@ var ActivityBlock = class _ActivityBlock extends Block {
     }
   }
   _isActivityRegistered() {
-    return this.activityType && _ActivityBlock._activityCallbacks.has(this);
+    return !!this.activityType && _ActivityBlock._activityCallbacks.has(this);
   }
   static _activityCallbacks = /* @__PURE__ */ new Map();
   // declare static activities to satisfy type references below
@@ -3511,11 +3511,7 @@ var UploaderPublicApi = class {
   /**
    * TODO: Probably we should not allow user to override `source` property
    */
-  addFileFromUrl = (url, {
-    silent,
-    fileName,
-    source
-  } = {}) => {
+  addFileFromUrl = (url, { silent, fileName, source } = {}) => {
     const internalId = this._uploadCollection.add({
       externalUrl: url,
       fileName: fileName ?? null,
@@ -3524,11 +3520,7 @@ var UploaderPublicApi = class {
     });
     return this.getOutputItem(internalId);
   };
-  addFileFromUuid = (uuid, {
-    silent,
-    fileName,
-    source
-  } = {}) => {
+  addFileFromUuid = (uuid, { silent, fileName, source } = {}) => {
     const internalId = this._uploadCollection.add({
       uuid,
       fileName: fileName ?? null,
@@ -3537,11 +3529,7 @@ var UploaderPublicApi = class {
     });
     return this.getOutputItem(internalId);
   };
-  addFileFromCdnUrl = (cdnUrl, {
-    silent,
-    fileName,
-    source
-  } = {}) => {
+  addFileFromCdnUrl = (cdnUrl, { silent, fileName, source } = {}) => {
     const parsedCdnUrl = parseCdnUrl({
       url: cdnUrl,
       cdnBase: this.cfg.cdnCname
@@ -3603,10 +3591,7 @@ var UploaderPublicApi = class {
   };
   openSystemDialog = (options = {}) => {
     const accept = serializeCsv(
-      mergeFileTypes([
-        this.cfg.accept ?? "",
-        ...this.cfg.imgOnly ? IMAGE_ACCEPT_LIST : []
-      ])
+      mergeFileTypes([this.cfg.accept ?? "", ...this.cfg.imgOnly ? IMAGE_ACCEPT_LIST : []])
     );
     const INPUT_ATTR_NAME = "uploadcare-file-input";
     const fileInput = document.createElement("input");
@@ -3624,18 +3609,13 @@ var UploaderPublicApi = class {
     fileInput.multiple = this.cfg.multiple;
     if (options.captureCamera) {
       fileInput.capture = this.cfg.cameraCapture;
-      const { isPhotoEnabled, isVideoRecordingEnabled } = calcCameraModes(
-        this.cfg
-      );
+      const { isPhotoEnabled, isVideoRecordingEnabled } = calcCameraModes(this.cfg);
       if (options.modeCamera === CameraSourceTypes.PHOTO && isPhotoEnabled) {
         fileInput.accept = BASIC_IMAGE_WILDCARD;
       } else if (options.modeCamera === CameraSourceTypes.VIDEO && isVideoRecordingEnabled) {
         fileInput.accept = BASIC_VIDEO_WILDCARD;
       } else {
-        fileInput.accept = [
-          BASIC_IMAGE_WILDCARD,
-          isVideoRecordingEnabled && BASIC_VIDEO_WILDCARD
-        ].filter(Boolean).join(",");
+        fileInput.accept = [BASIC_IMAGE_WILDCARD, isVideoRecordingEnabled && BASIC_VIDEO_WILDCARD].filter(Boolean).join(",");
       }
     } else {
       fileInput.accept = accept;
@@ -3713,9 +3693,7 @@ var UploaderPublicApi = class {
           return;
         }
         if (srcKey === "camera" && browserFeatures.htmlMediaCapture) {
-          const { isPhotoEnabled, isVideoRecordingEnabled } = calcCameraModes(
-            this.cfg
-          );
+          const { isPhotoEnabled, isVideoRecordingEnabled } = calcCameraModes(this.cfg);
           if (isPhotoEnabled && isVideoRecordingEnabled) {
             this._ctx.set$({
               "*currentActivity": ActivityBlock.activities.START_FROM
@@ -3773,9 +3751,7 @@ var UploaderPublicApi = class {
   };
   setModalState = (opened) => {
     if (opened && !this._ctx.$["*currentActivity"]) {
-      console.warn(
-        `Can't open modal without current activity. Please use "setCurrentActivity" method first.`
-      );
+      console.warn(`Can't open modal without current activity. Please use "setCurrentActivity" method first.`);
       return;
     }
     if (opened) {
@@ -4425,9 +4401,7 @@ var CameraSource = class extends UploaderBlock {
     }
   };
   _updateTimer = () => {
-    const currentTime = Math.floor(
-      (performance.now() - this.$._startTime + this.$._elapsedTime) / 1e3
-    );
+    const currentTime = Math.floor((performance.now() - this.$._startTime + this.$._elapsedTime) / 1e3);
     if (typeof this.cfg.maxVideoRecordingDuration === "number" && this.cfg.maxVideoRecordingDuration > 0) {
       const remainingTime = this.cfg.maxVideoRecordingDuration - currentTime;
       if (remainingTime <= 0) {
@@ -4496,22 +4470,16 @@ var CameraSource = class extends UploaderBlock {
       if (this._stream) {
         this._mediaRecorder = new MediaRecorder(this._stream, this._options);
         this._mediaRecorder.start();
-        this._mediaRecorder.addEventListener(
-          "dataavailable",
-          (event) => {
-            this._chunks.push(event.data);
-          }
-        );
+        this._mediaRecorder.addEventListener("dataavailable", (event) => {
+          this._chunks.push(event.data);
+        });
         this._startTimer();
         this.classList.add("uc-recording");
         this._setCameraState(CameraSourceEvents.PLAY);
       }
     } catch (error) {
       console.error("Failed to start recording", error);
-      this.telemetryManager.sendEventError(
-        error,
-        "camera recording. Failed to start recording"
-      );
+      this.telemetryManager.sendEventError(error, "camera recording. Failed to start recording");
     }
   };
   _stopRecording = () => {
@@ -4570,10 +4538,7 @@ var CameraSource = class extends UploaderBlock {
       });
     } catch (error) {
       console.error("Failed to preview video", error);
-      this.telemetryManager.sendEventError(
-        error,
-        "camera previewing. Failed to preview video"
-      );
+      this.telemetryManager.sendEventError(error, "camera previewing. Failed to preview video");
     }
   };
   _retake = () => {
@@ -4594,12 +4559,7 @@ var CameraSource = class extends UploaderBlock {
         if (!blob2) {
           return;
         }
-        const file2 = this._createFile(
-          "camera",
-          "jpeg",
-          DEFAULT_PICTURE_FORMAT,
-          blob2
-        );
+        const file2 = this._createFile("camera", "jpeg", DEFAULT_PICTURE_FORMAT, blob2);
         this._toSend(file2);
       }, DEFAULT_PICTURE_FORMAT);
       return;
@@ -4760,47 +4720,44 @@ var CameraSource = class extends UploaderBlock {
       (mode) => mode === CameraSourceTypes.PHOTO || mode === CameraSourceTypes.VIDEO
     );
   }
-  _setPermissionsState = debounce(
-    (state) => {
-      this.classList.toggle("uc-initialized", state === "granted");
-      const visibleAudio = this._activeTab === CameraSourceTypes.VIDEO && this.cfg.enableAudioRecording;
-      const currentIcon = this._activeTab === CameraSourceTypes.PHOTO ? "camera-full" : "video-camera-full";
-      if (state === "granted") {
-        this.set$({
-          videoHidden: false,
-          cameraHidden: false,
-          tabCameraHidden: !this._cameraModes.includes(CameraSourceTypes.PHOTO),
-          tabVideoHidden: !this._cameraModes.includes(CameraSourceTypes.VIDEO),
-          messageHidden: true,
-          timerHidden: true,
-          currentIcon,
-          audioToggleMicrophoneHidden: !visibleAudio,
-          audioSelectHidden: !visibleAudio
-        });
-      } else if (state === "prompt") {
-        this.$.l10nMessage = "camera-permissions-prompt";
-        this.set$({
-          videoHidden: true,
-          cameraHidden: true,
-          tabCameraHidden: true,
-          messageHidden: false
-        });
-        this._stopCapture();
-      } else {
-        this.$.l10nMessage = "camera-permissions-denied";
-        this.set$({
-          videoHidden: true,
-          messageHidden: false,
-          tabCameraHidden: !this._cameraModes.includes(CameraSourceTypes.PHOTO),
-          tabVideoHidden: !this._cameraModes.includes(CameraSourceTypes.VIDEO),
-          cameraActionsHidden: true,
-          mutableClassButton: "uc-shot-btn uc-camera-action"
-        });
-        this._stopCapture();
-      }
-    },
-    300
-  );
+  _setPermissionsState = debounce((state) => {
+    this.classList.toggle("uc-initialized", state === "granted");
+    const visibleAudio = this._activeTab === CameraSourceTypes.VIDEO && this.cfg.enableAudioRecording;
+    const currentIcon = this._activeTab === CameraSourceTypes.PHOTO ? "camera-full" : "video-camera-full";
+    if (state === "granted") {
+      this.set$({
+        videoHidden: false,
+        cameraHidden: false,
+        tabCameraHidden: !this._cameraModes.includes(CameraSourceTypes.PHOTO),
+        tabVideoHidden: !this._cameraModes.includes(CameraSourceTypes.VIDEO),
+        messageHidden: true,
+        timerHidden: true,
+        currentIcon,
+        audioToggleMicrophoneHidden: !visibleAudio,
+        audioSelectHidden: !visibleAudio
+      });
+    } else if (state === "prompt") {
+      this.$.l10nMessage = "camera-permissions-prompt";
+      this.set$({
+        videoHidden: true,
+        cameraHidden: true,
+        tabCameraHidden: true,
+        messageHidden: false
+      });
+      this._stopCapture();
+    } else {
+      this.$.l10nMessage = "camera-permissions-denied";
+      this.set$({
+        videoHidden: true,
+        messageHidden: false,
+        tabCameraHidden: !this._cameraModes.includes(CameraSourceTypes.PHOTO),
+        tabVideoHidden: !this._cameraModes.includes(CameraSourceTypes.VIDEO),
+        cameraActionsHidden: true,
+        mutableClassButton: "uc-shot-btn uc-camera-action"
+      });
+      this._stopCapture();
+    }
+  }, 300);
   _makeStreamInactive = () => {
     if (!this._stream) return false;
     const audioTracks = this._stream?.getAudioTracks();
@@ -4858,10 +4815,7 @@ var CameraSource = class extends UploaderBlock {
     } catch (error) {
       this._setPermissionsState("denied");
       console.log("Failed to capture camera", error);
-      this.telemetryManager.sendEventError(
-        error,
-        "camera capturing. Failed to capture camera"
-      );
+      this.telemetryManager.sendEventError(error, "camera capturing. Failed to capture camera");
     }
   };
   _handlePermissionsChange = () => {
@@ -4877,14 +4831,8 @@ var CameraSource = class extends UploaderBlock {
         response.addEventListener("change", this._handlePermissionsChange);
       }
     } catch (error) {
-      console.log(
-        "Failed to use permissions API. Fallback to manual request mode.",
-        error
-      );
-      this.telemetryManager.sendEventError(
-        error,
-        "camera permissions. Failed to use permissions API"
-      );
+      console.log("Failed to use permissions API. Fallback to manual request mode.", error);
+      this.telemetryManager.sendEventError(error, "camera permissions. Failed to use permissions API");
       this._capture();
     }
   };
@@ -4899,10 +4847,7 @@ var CameraSource = class extends UploaderBlock {
       await this._getDevices();
       navigator.mediaDevices.addEventListener("devicechange", this._getDevices);
     } catch (error) {
-      this.telemetryManager.sendEventError(
-        error,
-        "camera devices. Failed to get user media"
-      );
+      this.telemetryManager.sendEventError(error, "camera devices. Failed to get user media");
       console.log("Failed to get user media", error);
     }
   };
@@ -4932,10 +4877,7 @@ var CameraSource = class extends UploaderBlock {
       }
       this._selectedAudioId = this._audioDevices[0]?.value ?? null;
     } catch (error) {
-      this.telemetryManager.sendEventError(
-        error,
-        "camera devices. Failed to get devices"
-      );
+      this.telemetryManager.sendEventError(error, "camera devices. Failed to get devices");
       console.log("Failed to get devices", error);
     }
   };
@@ -4949,9 +4891,7 @@ var CameraSource = class extends UploaderBlock {
     if (this._unsubPermissions) {
       this._unsubPermissions();
     }
-    const isChromium = Boolean(
-      window.chrome
-    );
+    const isChromium = Boolean(window.chrome);
     if (!isChromium) {
       this._setPermissionsState("denied");
     }
@@ -4990,15 +4930,9 @@ var CameraSource = class extends UploaderBlock {
   }
   _destroy() {
     for (const permission of DEFAULT_PERMISSIONS) {
-      this._permissionResponses[permission]?.removeEventListener(
-        "change",
-        this._handlePermissionsChange
-      );
+      this._permissionResponses[permission]?.removeEventListener("change", this._handlePermissionsChange);
     }
-    navigator.mediaDevices?.removeEventListener(
-      "devicechange",
-      this._getDevices
-    );
+    navigator.mediaDevices?.removeEventListener("devicechange", this._getDevices);
   }
   async destroyCallback() {
     super.destroyCallback();
@@ -6127,9 +6061,7 @@ function batchPreloadImages(list) {
     preloaders.push(preload);
   }
   const images = preloaders.map((preload) => preload.image);
-  const promise = Promise.allSettled(
-    preloaders.map((preload) => preload.promise)
-  );
+  const promise = Promise.allSettled(preloaders.map((preload) => preload.promise));
   const cancel = () => {
     preloaders.forEach((preload) => {
       preload.cancel();
@@ -9247,6 +9179,7 @@ var ExternalSource = class extends UploaderBlock {
       couldSelectAll: false,
       couldDeselectAll: false,
       showSelectionStatus: false,
+      showDoneBtn: false,
       counterText: "",
       doneBtnTextClass: "uc-hidden",
       toolbarVisible: true,
@@ -9358,6 +9291,9 @@ var ExternalSource = class extends UploaderBlock {
       couldDeselectAll: message.selectedCount === message.total,
       selectedList: message.selectedFiles
     });
+    if (!this.$.showDoneBtn && message.isReady) {
+      this.$.showDoneBtn = true;
+    }
   }
   handleIframeLoad() {
     this.applyEmbedCss(this.cfg.externalSourcesEmbedCss);
@@ -9437,7 +9373,8 @@ var ExternalSource = class extends UploaderBlock {
       isDoneBtnEnabled: false,
       couldSelectAll: false,
       couldDeselectAll: false,
-      showSelectionStatus: false
+      showSelectionStatus: false,
+      showDoneBtn: false
     });
   }
 };
@@ -9462,7 +9399,11 @@ ExternalSource.template = /* HTML */
         <button type="button" set="onclick: onSelectAll; @hidden: !couldSelectAll" l10n="select-all"></button>
         <button type="button" set="onclick: onDeselectAll; @hidden: !couldDeselectAll" l10n="deselect-all"></button>
       </div>
-      <button type="button" class="uc-done-btn uc-primary-btn" set="onclick: onDone; @disabled: !isDoneBtnEnabled;">
+      <button
+        type="button"
+        class="uc-done-btn uc-primary-btn"
+        set="onclick: onDone; @disabled: !isDoneBtnEnabled; @hidden: !showDoneBtn"
+      >
         <uc-spinner set="@hidden: isSelectionReady"></uc-spinner>
         <span l10n="done" set="@class: doneBtnTextClass"></span>
       </button>
@@ -11121,6 +11062,7 @@ var Thumb = class extends FileItemConfig {
     }
     return Math.min(size, CDN_MAX_OUTPUT_DIMENSION);
   }
+  // biome-ignore lint/style/noInferrableTypes: Here the type is needed because `_withEntry` could not infer it correctly
   _generateThumbnail = this._withEntry(async (entry, force = false) => {
     const fileInfo = entry.getValue("fileInfo");
     const isImage = entry.getValue("isImage");

package/dist/index.ssr.js

@@ -840,7 +840,11 @@ export const ExternalSource = class {
         <button type="button" set="onclick: onSelectAll; @hidden: !couldSelectAll" l10n="select-all"></button>
         <button type="button" set="onclick: onDeselectAll; @hidden: !couldDeselectAll" l10n="deselect-all"></button>
       </div>
-      <button type="button" class="uc-done-btn uc-primary-btn" set="onclick: onDone; @disabled: !isDoneBtnEnabled;">
+      <button
+        type="button"
+        class="uc-done-btn uc-primary-btn"
+        set="onclick: onDone; @disabled: !isDoneBtnEnabled; @hidden: !showDoneBtn"
+      >
         <uc-spinner set="@hidden: isSelectionReady"></uc-spinner>
         <span l10n="done" set="@class: doneBtnTextClass"></span>
       </button>
@@ -1128,7 +1132,7 @@ export const ModalEvents = {
 	DESTROY: "modal:destroy",
 };
 export const PACKAGE_NAME = `blocks`;
-export const PACKAGE_VERSION = `1.24.0-alpha.2`;
+export const PACKAGE_VERSION = `1.24.0`;
 export const PresenceToggle = class {
 	static template = `<slot></slot> `;
 	static reg = () => {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uploadcare/file-uploader",
-  "version": "1.24.0-alpha.2",
+  "version": "1.24.0",
   "description": "Building blocks for Uploadcare products integration",
   "keywords": [
     "web components",
@@ -47,6 +47,7 @@
       "default": "./dist/index.js"
     },
     "./index.css": {
+      "types": "./types/css.d.ts",
       "default": "./dist/index.css"
     },
     "./abstract/loadFileUploaderFrom.js": "./dist/abstract/loadFileUploaderFrom.js",

package/types/css.d.ts

@@ -0,0 +1,3 @@
+declare module '*.css' {
+  export {};
+}