@uploadcare/file-uploader 1.9.0 → 1.11.0-alpha.0

package/blocks/ExternalSource/external-source.css

@@ -5,15 +5,12 @@ uc-external-source {
   height: 100%;
   background-color: var(--uc-background);
   overflow: hidden;
+  position: relative;
 }
 
-[uc-modal] uc-external-source {
-  width: min(
-    calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2),
-    calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2)
-  );
-  height: var(--modal-content-height-fill, 100%);
-  max-height: var(--modal-max-content-height);
+[uc-modal] > dialog:has(uc-external-source[active]) {
+  width: 100%;
+  height: 100%;
 }
 
 uc-external-source > .uc-content {
@@ -23,13 +20,6 @@ uc-external-source > .uc-content {
   grid-template-rows: 1fr min-content;
 }
 
-@media only screen and (max-width: 430px) {
-  uc-external-source {
-    width: calc(100vw - var(--uc-padding) * 2);
-    height: var(--modal-content-height-fill, 100%);
-  }
-}
-
 uc-external-source iframe {
   display: block;
   width: 100%;
@@ -42,11 +32,11 @@ uc-external-source .uc-iframe-wrapper {
 }
 
 uc-external-source .uc-toolbar {
-  display: grid;
+  display: flex;
+  width: 100%;
   grid-gap: var(--uc-padding);
-  grid-template-columns: max-content 1fr max-content max-content;
   align-items: center;
-  width: 100%;
+  justify-content: space-between;
   padding: var(--uc-padding);
   border-top: 1px solid var(--uc-border);
 }
@@ -55,11 +45,36 @@ uc-external-source .uc-back-btn {
   padding-left: 0;
 }
 
-uc-external-source .uc-selected-counter {
+uc-external-source .uc-selection-status-box {
+  color: var(--uc-foreground);
   display: flex;
-  grid-gap: var(--uc-padding);
+  flex-direction: column;
   align-items: center;
-  justify-content: space-between;
-  padding: var(--uc-padding);
-  color: var(--uc-muted-foreground);
+  justify-content: center;
+}
+
+uc-external-source .uc-selection-status-box button {
+  color: var(--uc-primary);
+  height: auto;
+  padding: 0;
+  background: none;
+}
+
+uc-external-source .uc-selection-status-box button:hover {
+  text-decoration: underline;
+}
+
+uc-external-source uc-activity-header {
+  position: absolute;
+  width: 100%;
+  justify-content: flex-end;
+  z-index: 1;
+  left: 0;
+  top: 0;
+  right: 0;
+  pointer-events: none;
+}
+
+uc-external-source uc-activity-header .uc-close-btn {
+  pointer-events: auto;
 }

package/blocks/ExternalSource/types.d.ts

@@ -0,0 +1,113 @@
+export type InstagramInfo = {
+    caption?: string | null;
+    created: number;
+    id: string;
+    public_page?: string;
+    username: string;
+    size?: number;
+    name?: string;
+    modified?: number;
+};
+export type DoneSuccessResponse = {
+    error?: undefined;
+    info?: InstagramInfo;
+    alternatives?: Record<string, string>;
+    is_image?: boolean | null;
+    filename?: string;
+    obj_type: 'selected_file';
+    url: string;
+};
+export type InputMessageMap = {
+    'selected-files-change': {
+        type: 'selected-files-change';
+        total: number;
+        selectedCount: number;
+    } & ({
+        isReady: false;
+        isMultipleMode: boolean;
+        selectedFiles: undefined;
+    } | {
+        isReady: true;
+        isMultipleMode: true;
+        selectedFiles: DoneSuccessResponse[];
+    } | {
+        isReady: true;
+        isMultipleMode: false;
+        selectedFiles: [DoneSuccessResponse] | [];
+    });
+};
+export type InputMessageType = keyof InputMessageMap;
+export type InputMessage = InputMessageMap[InputMessageType];
+export type InputMessageHandler<T extends "selected-files-change"> = (message: import('./types').InputMessageMap[T]) => void;
+export type ThemeDefinition = {
+    '--uc-font-family': string;
+    '--uc-font-size': string;
+    '--uc-line-height': string;
+    '--uc-button-size': string;
+    '--uc-preview-size': string;
+    '--uc-input-size': string;
+    '--uc-padding': string;
+    '--uc-radius': string;
+    '--uc-transition': string;
+    '--uc-background': string;
+    '--uc-foreground': string;
+    '--uc-primary': string;
+    '--uc-primary-hover': string;
+    '--uc-primary-transparent': string;
+    '--uc-primary-foreground': string;
+    '--uc-secondary': string;
+    '--uc-secondary-hover': string;
+    '--uc-secondary-foreground': string;
+    '--uc-muted': string;
+    '--uc-muted-foreground': string;
+    '--uc-destructive': string;
+    '--uc-destructive-foreground': string;
+    '--uc-border': string;
+    '--uc-primary-rgb-light': string;
+    '--uc-primary-light': string;
+    '--uc-primary-hover-light': string;
+    '--uc-primary-transparent-light': string;
+    '--uc-background-light': string;
+    '--uc-foreground-light': string;
+    '--uc-primary-foreground-light': string;
+    '--uc-secondary-light': string;
+    '--uc-secondary-hover-light': string;
+    '--uc-secondary-foreground-light': string;
+    '--uc-muted-light': string;
+    '--uc-muted-foreground-light': string;
+    '--uc-destructive-light': string;
+    '--uc-destructive-foreground-light': string;
+    '--uc-border-light': string;
+    '--uc-primary-rgb-dark': string;
+    '--uc-primary-dark': string;
+    '--uc-primary-hover-dark': string;
+    '--uc-primary-transparent-dark': string;
+    '--uc-background-dark': string;
+    '--uc-foreground-dark': string;
+    '--uc-primary-foreground-dark': string;
+    '--uc-secondary-dark': string;
+    '--uc-secondary-hover-dark': string;
+    '--uc-secondary-foreground-dark': string;
+    '--uc-muted-dark': string;
+    '--uc-muted-foreground-dark': string;
+    '--uc-destructive-dark': string;
+    '--uc-destructive-foreground-dark': string;
+    '--uc-border-dark': string;
+    '--uc-primary-oklch-light': string;
+    '--uc-primary-oklch-dark': string;
+};
+export type OutputMessage = {
+    type: 'select-all';
+} | {
+    type: 'deselect-all';
+} | {
+    type: 'set-theme-definition';
+    theme: Record<string, string>;
+} | {
+    type: 'set-locale-definition';
+    localeDefinition: string;
+} | {
+    type: 'set-embed-css';
+    css: Partial<ThemeDefinition>;
+};
+//# sourceMappingURL=types.d.ts.map

package/blocks/ExternalSource/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["types.js"],"names":[],"mappings":"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"}

package/blocks/ExternalSource/types.js

@@ -0,0 +1,143 @@
+// @ts-check
+
+/**
+ * @typedef {{
+ *   caption?: string | null;
+ *   created: number;
+ *   id: string;
+ *   public_page?: string;
+ *   username: string;
+ *   size?: number;
+ *   name?: string;
+ *   modified?: number;
+ * }} InstagramInfo
+ */
+
+/**
+ * @typedef {{
+ *   error?: undefined;
+ *   info?: InstagramInfo;
+ *   alternatives?: Record<string, string>;
+ *   is_image?: boolean | null;
+ *   filename?: string;
+ *   obj_type: 'selected_file';
+ *   url: string;
+ * }} DoneSuccessResponse
+ */
+
+/**
+ * @typedef {{
+ *   'selected-files-change': {
+ *     type: 'selected-files-change';
+ *     total: number;
+ *     selectedCount: number;
+ *   } & (
+ *     | {
+ *         isReady: false;
+ *         isMultipleMode: boolean;
+ *         selectedFiles: undefined;
+ *       }
+ *     | {
+ *         isReady: true;
+ *         isMultipleMode: true;
+ *         selectedFiles: DoneSuccessResponse[];
+ *       }
+ *     | {
+ *         isReady: true;
+ *         isMultipleMode: false;
+ *         selectedFiles: [DoneSuccessResponse] | [];
+ *       }
+ *   );
+ * }} InputMessageMap
+ */
+
+/** @typedef {keyof InputMessageMap} InputMessageType */
+/** @typedef {InputMessageMap[InputMessageType]} InputMessage */
+
+/**
+ * @template {import('./types').InputMessageType} T
+ * @typedef {(message: import('./types').InputMessageMap[T]) => void} InputMessageHandler
+ */
+
+/**
+ * @typedef {{
+ *   '--uc-font-family': string;
+ *   '--uc-font-size': string;
+ *   '--uc-line-height': string;
+ *   '--uc-button-size': string;
+ *   '--uc-preview-size': string;
+ *   '--uc-input-size': string;
+ *   '--uc-padding': string;
+ *   '--uc-radius': string;
+ *   '--uc-transition': string;
+ *   '--uc-background': string;
+ *   '--uc-foreground': string;
+ *   '--uc-primary': string;
+ *   '--uc-primary-hover': string;
+ *   '--uc-primary-transparent': string;
+ *   '--uc-primary-foreground': string;
+ *   '--uc-secondary': string;
+ *   '--uc-secondary-hover': string;
+ *   '--uc-secondary-foreground': string;
+ *   '--uc-muted': string;
+ *   '--uc-muted-foreground': string;
+ *   '--uc-destructive': string;
+ *   '--uc-destructive-foreground': string;
+ *   '--uc-border': string;
+ *   '--uc-primary-rgb-light': string;
+ *   '--uc-primary-light': string;
+ *   '--uc-primary-hover-light': string;
+ *   '--uc-primary-transparent-light': string;
+ *   '--uc-background-light': string;
+ *   '--uc-foreground-light': string;
+ *   '--uc-primary-foreground-light': string;
+ *   '--uc-secondary-light': string;
+ *   '--uc-secondary-hover-light': string;
+ *   '--uc-secondary-foreground-light': string;
+ *   '--uc-muted-light': string;
+ *   '--uc-muted-foreground-light': string;
+ *   '--uc-destructive-light': string;
+ *   '--uc-destructive-foreground-light': string;
+ *   '--uc-border-light': string;
+ *   '--uc-primary-rgb-dark': string;
+ *   '--uc-primary-dark': string;
+ *   '--uc-primary-hover-dark': string;
+ *   '--uc-primary-transparent-dark': string;
+ *   '--uc-background-dark': string;
+ *   '--uc-foreground-dark': string;
+ *   '--uc-primary-foreground-dark': string;
+ *   '--uc-secondary-dark': string;
+ *   '--uc-secondary-hover-dark': string;
+ *   '--uc-secondary-foreground-dark': string;
+ *   '--uc-muted-dark': string;
+ *   '--uc-muted-foreground-dark': string;
+ *   '--uc-destructive-dark': string;
+ *   '--uc-destructive-foreground-dark': string;
+ *   '--uc-border-dark': string;
+ *   '--uc-primary-oklch-light': string;
+ *   '--uc-primary-oklch-dark': string;
+ * }} ThemeDefinition
+ */
+
+/**
+ * @typedef {{
+ *       type: 'select-all';
+ *     }
+ *   | {
+ *       type: 'deselect-all';
+ *     }
+ *   | {
+ *       type: 'set-theme-definition';
+ *       theme: Record<string, string>;
+ *     }
+ *   | {
+ *       type: 'set-locale-definition';
+ *       localeDefinition: string;
+ *     }
+ *   | {
+ *       type: 'set-embed-css';
+ *       css: Partial<ThemeDefinition>;
+ *     }} OutputMessage
+ */
+
+export {};

package/blocks/Modal/Modal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["Modal.js"],"names":[],"mappings":"AAGA;IAEE,kCAAoC;IAIlC;;;;MAKC;IAGH,iCAEE;IAEF,yBAEE;IAEF,+BAEE;IAEF,uBAAuB;IACvB,4BADY,KAAK,UAIf;IAFA,eAAe;IACf,yBAAgC;IAGlC,uBAAuB;IACvB,0BADY,KAAK,UAKf;IAEF,aAMC;IAED,aAMC;CAuDF;;;;sBA9GqB,yBAAyB"}
+{"version":3,"file":"Modal.d.ts","sourceRoot":"","sources":["Modal.js"],"names":[],"mappings":"AAGA;IAEE,kCAAoC;IAIlC;;;;MAKC;IAGH,iCAEE;IAEF,yBAEE;IAEF,+BAEE;IAEF,uBAAuB;IACvB,4BADY,KAAK,UAIf;IAFA,eAAe;IACf,yBAAgC;IAGlC,uBAAuB;IACvB,0BADY,KAAK,UAKf;IAEF,aAMC;IAED,aAMC;CAgDF;;;;sBAvGqB,yBAAyB"}

package/blocks/Modal/Modal.js

@@ -58,17 +58,10 @@ export class Modal extends Block {
 
   initCallback() {
     super.initCallback();
-    if (typeof HTMLDialogElement === 'function') {
-      this.ref.dialog.addEventListener('close', this._handleDialogClose);
-      this.ref.dialog.addEventListener('mousedown', this._handleDialogMouseDown);
-      this.ref.dialog.addEventListener('mouseup', this._handleDialogMouseUp);
-    } else {
-      this.setAttribute('dialog-fallback', '');
-      let backdrop = document.createElement('div');
-      backdrop.className = 'uc-backdrop';
-      this.appendChild(backdrop);
-      backdrop.addEventListener('click', this._handleBackdropClick);
-    }
+
+    this.ref.dialog.addEventListener('close', this._handleDialogClose);
+    this.ref.dialog.addEventListener('mousedown', this._handleDialogMouseDown);
+    this.ref.dialog.addEventListener('mouseup', this._handleDialogMouseUp);
 
     this.sub('*modalActive', (modalActive) => {
       if (this.$.isOpen !== modalActive) {

package/blocks/Modal/modal.css

@@ -1,46 +1,3 @@
-:where([uc-modal]) {
-  --modal-max-content-height: calc(
-    var(--uploadcare-blocks-window-height, 100vh) - 4 * var(--uc-padding) - var(--uc-button-size)
-  );
-  --modal-content-height-fill: var(--uploadcare-blocks-window-height, 100vh);
-}
-
-:where([uc-modal])[dialog-fallback] {
-  --uc-z-max: 2147483647;
-
-  position: fixed;
-  z-index: var(--uc-z-max);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100vw;
-  height: 100vh;
-  pointer-events: none;
-  inset: 0;
-}
-
-:where([uc-modal])[dialog-fallback] dialog[open] {
-  z-index: var(--uc-z-max);
-  pointer-events: auto;
-}
-
-:where([uc-modal])[dialog-fallback] dialog[open] + .uc-backdrop {
-  position: fixed;
-  top: 0px;
-  left: 0px;
-  z-index: calc(var(--uc-z-max) - 1);
-  align-items: center;
-  justify-content: center;
-  width: 100vw;
-  height: 100vh;
-  background-color: oklch(0 0 0 / 0.1);
-  pointer-events: auto;
-}
-
-:where([uc-modal])[strokes][dialog-fallback] dialog[open] + .uc-backdrop {
-  background-image: var(--modal-backdrop-background-image);
-}
-
 @supports selector(dialog::backdrop) {
   :where([uc-modal]) > dialog::backdrop {
     /* backdrop don't inherit theme properties */
@@ -67,12 +24,10 @@
 :where([uc-modal]) > dialog {
   display: flex;
   flex-direction: column;
-
-  /* there was `fit-content` but it doesn't reduce width after activity change */
-  width: max-content;
-  max-width: min(calc(100% - var(--uc-padding) * 2), calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2));
+  width: min(var(--uc-dialog-width), 100%);
+  max-width: min(calc(100% - var(--uc-padding) * 2), var(--uc-dialog-max-width));
   min-height: var(--uc-button-size);
-  max-height: calc(var(--uc-dialog-max-height) - var(--uc-padding) * 2);
+  max-height: min(calc(100% - var(--uc-padding) * 2), var(--uc-dialog-max-height));
   margin: auto;
   padding: 0;
   overflow: hidden;
@@ -88,9 +43,3 @@
 :where(.uc-contrast) :where([uc-modal]) > dialog {
   outline: 1px solid var(--uc-border);
 }
-
-@media only screen and (max-width: 430px), only screen and (max-height: 600px) {
-  :where([uc-modal]) > dialog > .uc-content {
-    height: var(--modal-max-content-height);
-  }
-}

package/blocks/StartFrom/start-from.css

@@ -13,12 +13,8 @@ uc-start-from .uc-content {
   background-color: var(--uc-background);
 }
 
-[uc-modal] uc-start-from {
-  width: min(
-    calc(var(--uc-dialog-width) - var(--uc-padding) * 2),
-    calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2),
-    calc(100vw - var(--uc-padding) * 2)
-  );
+[uc-modal] > dialog:has(uc-start-from[active]) {
+  width: var(--uc-dialog-width);
 }
 
 [uc-modal] uc-start-from uc-drop-area {

package/blocks/UploadList/upload-list.css

@@ -2,22 +2,12 @@ uc-upload-list {
   display: flex;
   flex-direction: column;
   width: 100%;
-  height: 100%;
+  height: max-content;
   overflow: hidden;
   background-color: var(--uc-background);
   transition: opacity var(--uc-transition);
 }
 
-[uc-modal] uc-upload-list {
-  width: min(
-    calc(var(--uc-dialog-width) - var(--uc-padding) * 2),
-    calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2),
-    calc(100vw - var(--uc-padding) * 2)
-  );
-  height: max-content;
-  max-height: var(--modal-max-content-height);
-}
-
 uc-upload-list .uc-no-files {
   height: 32px;
   padding: 20px;

package/blocks/UrlSource/url-source.css

@@ -3,14 +3,6 @@ uc-url-source {
   background-color: var(--uc-background);
 }
 
-[uc-modal] uc-url-source {
-  width: min(
-    calc(var(--uc-dialog-width) - var(--uc-padding) * 2),
-    calc(var(--uc-dialog-max-width) - var(--uc-padding) * 2),
-    calc(100vw - var(--uc-padding) * 2)
-  );
-}
-
 uc-url-source > .uc-content {
   display: grid;
   grid-gap: 4px;

package/blocks/themes/uc-basic/theme.css

@@ -13,8 +13,8 @@
   --uc-radius: 8px;
   --uc-transition: 0.2s ease;
   --uc-dialog-width: 430px;
-  --uc-dialog-max-width: 800px;
-  --uc-dialog-max-height: 600px;
+  --uc-dialog-max-width: 920px;
+  --uc-dialog-max-height: 675px;
   --uc-simple-btn-padding: 7px 14px;
 
   /* Default colors, in case of media query failure */
@@ -276,4 +276,4 @@
 
   --uc-background-dark: oklch(10% 0 0);
   --uc-foreground-dark: oklch(100% 0 0);
-}
+}

package/index.ssr.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.ssr.d.ts","sourceRoot":"","sources":["index.ssr.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;EAcE;AACF;;;;;;;;;;;;;;;EAcE;AACF;;;;;EAIE;AACF;;;;;;EAKE;AACF;;;;;;;;EAYE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0FE;AACF;;;;;;;;EAuCE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;EAuCE;AACF;;;;;;;EA0FE;AACF;;;;;;;EAaE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;EAeE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkEE;AACF;;;;;;;EAWE;AACF;;;;;;;EAWE;AACF;;;;;;;EASE;AACF;;;;;;EAKE;AACF;;;;;;;EAWE;AACF;;;;;;;EAME;AACF;;;;;;;EAWE;AACF;;;;;;;EA2IE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgFE;;;;;;;;;;;;;;AAcF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmFE;AACF;;;;;;EAKE;AACF;;;;;;EAKE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;EAWE;AACF;;;;;;EAwBE;AACF;;;;;;;EAUE;AACF;;;;;;;;EAWE;AACF,oCAAqC;AACrC,sCAAuC;AACvC;;;;;;;EAME;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgDE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0DE;AACF;;;;;;;EAeE;AACF;;;;;;EAKE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDE;AACF;;;;;;EAKE;AACF;;;;;;;;;;;;;;;;EAeE;AACF;;;;;;;;;;;;EAWE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmEE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8FE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2EE;AACK,yCAAiC;AACjC,qCAA6B;AAC7B,6CAAqC;AACrC,oCAA4B"}
+{"version":3,"file":"index.ssr.d.ts","sourceRoot":"","sources":["index.ssr.js"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;EAcE;AACF;;;;;;;;;;;;;;;EAcE;AACF;;;;;EAIE;AACF;;;;;;EAKE;AACF;;;;;;;;EAYE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0FE;AACF;;;;;;;;EAuCE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;EAuCE;AACF;;;;;;;EA0FE;AACF;;;;;;;EAaE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;EAeE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAkEE;AACF;;;;;;;EAWE;AACF;;;;;;;EAWE;AACF;;;;;;;EASE;AACF;;;;;;EAKE;AACF;;;;;;;EAWE;AACF;;;;;;;EAME;AACF;;;;;;;EAWE;AACF;;;;;;;EA2IE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA4EE;;;;;;;;;;;;;;AAcF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmFE;AACF;;;;;;EAKE;AACF;;;;;;EAKE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;EAWE;AACF;;;;;;EAwBE;AACF;;;;;;;EAUE;AACF;;;;;;;;EAWE;AACF,oCAAqC;AACrC,sCAAuC;AACvC;;;;;;;EAME;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgDE;AACF;;;;;;;EAME;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA0DE;AACF;;;;;;;EAeE;AACF;;;;;;EAKE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsDE;AACF;;;;;;EAKE;AACF;;;;;;;;;;;;;;;;EAeE;AACF;;;;;;;;;;;;EAWE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmEE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA8FE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA+CE;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA2EE;AACK,yCAAiC;AACjC,qCAA6B;AAC7B,6CAAqC;AACrC,oCAA4B"}

package/index.ssr.js

@@ -680,13 +680,6 @@ export const EditorToolbar = class {
 export const ExternalSource = class {
   static template = `
   <uc-activity-header>
-    <button type="button" class="uc-mini-btn" set="onclick: *historyBack" l10n="@title:back">
-      <uc-icon name="back"></uc-icon>
-    </button>
-    <div>
-      <uc-icon set="@name: activityIcon"></uc-icon>
-      <span>{{activityCaption}}</span>
-    </div>
     <button
       type="button"
       class="uc-mini-btn uc-close-btn"
@@ -700,12 +693,15 @@ export const ExternalSource = class {
     <div ref="iframeWrapper" class="uc-iframe-wrapper"></div>
     <div class="uc-toolbar">
       <button type="button" class="uc-cancel-btn uc-secondary-btn" set="onclick: onCancel" l10n="cancel"></button>
-      <div></div>
-      <div set="@hidden: !multiple" class="uc-selected-counter"><span l10n="selected-count"></span>{{counter}}</div>
+      <div set="@hidden: !showSelectionStatus" class="uc-selection-status-box">
+        <span>{{counterText}}</span>
+        <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: !counter"
+        set="onclick: onDone; @disabled: !isSelectionReady"
         l10n="done"
       ></button>
     </div>

package/locales/file-uploader/en.d.ts

@@ -27,6 +27,8 @@ declare const _default: {
     'confirm-your-action': string;
     'are-you-sure': string;
     'selected-count': string;
+    'select-all': string;
+    'deselect-all': string;
     'upload-error': string;
     'validation-error': string;
     'no-files': string;

package/locales/file-uploader/en.js

@@ -26,7 +26,9 @@ export default {
   yes: 'Yes',
   'confirm-your-action': 'Confirm your action',
   'are-you-sure': 'Are you sure?',
-  'selected-count': 'Selected:',
+  'selected-count': '{{count}} of {{total}} selected',
+  'select-all': 'Select all',
+  'deselect-all': 'Deselect all',
   'upload-error': 'Upload error',
   'validation-error': 'Validation error',
   'no-files': 'No files selected',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uploadcare/file-uploader",
-  "version": "1.9.0",
+  "version": "1.11.0-alpha.0",
   "description": "Building blocks for Uploadcare products integration",
   "keywords": [
     "web components",
@@ -35,7 +35,9 @@
     "MIT"
   ],
   "type": "module",
-  "sideEffects": ["*.css"],
+  "sideEffects": [
+    "*.css"
+  ],
   "module": "./index.js",
   "exports": {
     ".": {