@uploadcare/file-uploader 1.11.0-alpha.2 → 1.11.0-alpha.3

package/blocks/ExternalSource/ExternalSource.js

@@ -5,31 +5,12 @@ import { ActivityBlock } from '../../abstract/ActivityBlock.js';
 import { UploaderBlock } from '../../abstract/UploaderBlock.js';
 import { stringToArray } from '../../utils/stringToArray.js';
 import { wildcardRegexp } from '../../utils/wildcardRegexp.js';
-import { buildStyles } from './buildStyles.js';
-import { registerMessage, unregisterMessage } from './messages.js';
+import { buildThemeDefinition } from './buildThemeDefinition.js';
+import { MessageBridge } from './MessageBridge.js';
 import { queryString } from './query-string.js';
 
 /** @typedef {{ externalSourceType: string }} ActivityParams */
 
-/**
- * @typedef {{
- *   type: 'file-selected';
- *   obj_type: 'selected_file';
- *   filename: string;
- *   url: string;
- *   alternatives?: Record<string, string>;
- * }} SelectedFileMessage
- */
-
-/**
- * @typedef {{
- *   type: 'embed-css';
- *   style: string;
- * }} EmbedCssMessage
- */
-
-/** @typedef {SelectedFileMessage | EmbedCssMessage} Message */
-
 export class ExternalSource extends UploaderBlock {
   couldBeCtxOwner = true;
   activityType = ActivityBlock.activities.EXTERNAL;
@@ -41,12 +22,20 @@ export class ExternalSource extends UploaderBlock {
       ...this.init$,
       activityIcon: '',
       activityCaption: '',
+
+      /** @type {import('./types.js').InputMessageMap['selected-files-change']['selectedFiles']} */
       selectedList: [],
-      counter: 0,
-      multiple: false,
+      total: 0,
+
+      isSelectionReady: false,
+      couldSelectAll: false,
+      couldDeselectAll: false,
+      showSelectionStatus: false,
+      counterText: '',
+
       onDone: () => {
         for (const message of this.$.selectedList) {
-          const url = this.extractUrlFromMessage(message);
+          const url = this.extractUrlFromSelectedFile(message);
           const { filename } = message;
           const { externalSourceType } = this.activityParams;
           this.api.addFileFromUrl(url, { fileName: filename, source: externalSourceType });
@@ -57,6 +46,14 @@ export class ExternalSource extends UploaderBlock {
       onCancel: () => {
         this.historyBack();
       },
+
+      onSelectAll: () => {
+        this._messageBridge?.send({ type: 'select-all' });
+      },
+
+      onDeselectAll: () => {
+        this._messageBridge?.send({ type: 'deselect-all' });
+      },
     };
   }
 
@@ -69,12 +66,6 @@ export class ExternalSource extends UploaderBlock {
     throw new Error(`External Source activity params not found`);
   }
 
-  /**
-   * @private
-   * @type {HTMLIFrameElement | null}
-   */
-  _iframe = null;
-
   initCallback() {
     super.initCallback();
     this.registerActivity(this.activityType, {
@@ -108,24 +99,25 @@ export class ExternalSource extends UploaderBlock {
         this.unmountIframe();
       }
     });
-    this.sub('selectedList', (list) => {
-      this.$.counter = list.length;
-    });
     this.subConfigValue('multiple', (multiple) => {
-      this.$.multiple = multiple;
+      this.$.showSelectionStatus = multiple;
+    });
+
+    this.subConfigValue('localeName', (val) => {
+      this.setupL10n();
     });
   }
 
   /**
    * @private
-   * @param {SelectedFileMessage} message
+   * @param {NonNullable<import('./types.js').InputMessageMap['selected-files-change']['selectedFiles']>[number]} selectedFile
    */
-  extractUrlFromMessage(message) {
-    if (message.alternatives) {
+  extractUrlFromSelectedFile(selectedFile) {
+    if (selectedFile.alternatives) {
       const preferredTypes = stringToArray(this.cfg.externalSourcesPreferredTypes);
       for (const preferredType of preferredTypes) {
         const regexp = wildcardRegexp(preferredType);
-        for (const [type, typeUrl] of Object.entries(message.alternatives)) {
+        for (const [type, typeUrl] of Object.entries(selectedFile.alternatives)) {
           if (regexp.test(type)) {
             return typeUrl;
           }
@@ -133,81 +125,71 @@ export class ExternalSource extends UploaderBlock {
       }
     }
 
-    return message.url;
+    return selectedFile.url;
   }
 
   /**
    * @private
-   * @param {Message} message
+   * @param {import('./types.js').InputMessageMap['selected-files-change']} message
    */
-  sendMessage(message) {
-    this._iframe?.contentWindow?.postMessage(JSON.stringify(message), '*');
-  }
-
-  /**
-   * @private
-   * @param {SelectedFileMessage} message
-   */
-  async handleFileSelected(message) {
-    if (!this.$.multiple && this.$.selectedList.length) {
+  async handleSelectedFilesChange(message) {
+    if (this.cfg.multiple !== message.isMultipleMode) {
+      console.error('Multiple mode mismatch');
       return;
     }
 
-    this.$.selectedList = [...this.$.selectedList, message];
-
-    if (!this.$.multiple) {
-      this.$.onDone();
-    }
+    this.bindL10n('counterText', () =>
+      this.l10n('selected-count', {
+        count: message.selectedCount,
+        total: message.total,
+      }),
+    );
+
+    this.set$({
+      isSelectionReady: message.isReady,
+      showSelectionStatus: message.isMultipleMode && message.total > 0,
+      couldSelectAll: message.selectedCount < message.total,
+      couldDeselectAll: message.selectedCount === message.total,
+      selectedList: message.selectedFiles,
+    });
   }
 
   /** @private */
   handleIframeLoad() {
     this.applyStyles();
-  }
-
-  /**
-   * @private
-   * @param {string} propName
-   */
-  getCssValue(propName) {
-    let style = window.getComputedStyle(this);
-    return style.getPropertyValue(propName).trim();
+    this.setupL10n();
   }
 
   /** @private */
   applyStyles() {
-    let colors = {
-      radius: this.getCssValue('--uc-radius'),
-      backgroundColor: this.getCssValue('--uc-background'),
-      textColor: this.getCssValue('--uc-foreground'),
-      secondaryColor: this.getCssValue('--uc-secondary'),
-      secondaryForegroundColor: this.getCssValue('--uc-secondary-foreground'),
-      secondaryHover: this.getCssValue('--uc-secondary-hover'),
-      linkColor: this.getCssValue('--uc-primary'),
-      linkColorHover: this.getCssValue('--uc-primary-hover'),
-      fontFamily: this.getCssValue('--uc-font-family'),
-      fontSize: this.getCssValue('--uc-font-size'),
-    };
+    this._messageBridge?.send({
+      type: 'set-theme-definition',
+      theme: buildThemeDefinition(this),
+    });
+  }
 
-    this.sendMessage({
-      type: 'embed-css',
-      style: buildStyles(colors),
+  /** @private */
+  setupL10n() {
+    this._messageBridge?.send({
+      type: 'set-locale-definition',
+      localeDefinition: this.cfg.localeName,
     });
   }
 
   /** @private */
   remoteUrl() {
-    const { pubkey, remoteTabSessionKey, socialBaseUrl } = this.cfg;
+    const { pubkey, remoteTabSessionKey, socialBaseUrl, multiple } = this.cfg;
     const { externalSourceType } = this.activityParams;
     const lang = this.l10n('social-source-lang')?.split('-')?.[0] || 'en';
     const params = {
       lang,
       public_key: pubkey,
       images_only: false.toString(),
-      pass_window_open: false,
       session_key: remoteTabSessionKey,
+      wait_for_theme: true,
+      multiple: multiple.toString(),
     };
-    const url = new URL(`/window3/${externalSourceType}`, socialBaseUrl);
+    const url = new URL(`/window4/${externalSourceType}`, socialBaseUrl);
     url.search = queryString(params);
     return url.toString();
   }
@@ -231,31 +213,43 @@ export class ExternalSource extends UploaderBlock {
     this.ref.iframeWrapper.innerHTML = '';
     this.ref.iframeWrapper.appendChild(iframe);
 
-    registerMessage('file-selected', iframe.contentWindow, this.handleFileSelected.bind(this));
+    if (!iframe.contentWindow) {
+      return;
+    }
+
+    this._messageBridge?.destroy();
+
+    /** @private */
+    this._messageBridge = new MessageBridge(iframe.contentWindow);
+    this._messageBridge.on('selected-files-change', this.handleSelectedFilesChange.bind(this));
 
-    this._iframe = iframe;
-    this.$.selectedList = [];
+    this.resetSelectionStatus();
   }
 
   /** @private */
   unmountIframe() {
-    this._iframe && unregisterMessage('file-selected', this._iframe.contentWindow);
+    this._messageBridge?.destroy();
+    this._messageBridge = undefined;
     this.ref.iframeWrapper.innerHTML = '';
-    this._iframe = null;
-    this.$.selectedList = [];
-    this.$.counter = 0;
+
+    this.resetSelectionStatus();
+  }
+
+  /** @private */
+  resetSelectionStatus() {
+    this.set$({
+      selectedList: [],
+      total: 0,
+      isSelectionReady: false,
+      couldSelectAll: false,
+      couldDeselectAll: false,
+      showSelectionStatus: false,
+    });
   }
 }
 
 ExternalSource.template = /* HTML */ `
   <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"
@@ -269,12 +263,15 @@ ExternalSource.template = /* HTML */ `
     <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/blocks/ExternalSource/MessageBridge.d.ts

@@ -0,0 +1,20 @@
+export class MessageBridge {
+    /** @param {Window} context */
+    constructor(context: Window);
+    /** @type {Map<string, Set<import('./types').InputMessageHandler<import('./types').InputMessageType>>>} */
+    _handlerMap: Map<string, Set<import('./types').InputMessageHandler<import('./types').InputMessageType>>>;
+    /** @type {Window} */
+    _context: Window;
+    /** @param {MessageEvent} e */
+    _handleMessage: (e: MessageEvent) => void;
+    /**
+     * @template {import('./types').InputMessageType} T
+     * @param {T} type
+     * @param {import('./types').InputMessageHandler<T>} handler
+     */
+    on<T extends "selected-files-change">(type: T, handler: import("./types").InputMessageHandler<T>): void;
+    /** @param {import('./types').OutputMessage} message */
+    send(message: import('./types').OutputMessage): void;
+    destroy(): void;
+}
+//# sourceMappingURL=MessageBridge.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"MessageBridge.d.ts","sourceRoot":"","sources":["MessageBridge.js"],"names":[],"mappings":"AAgBA;IAOE,8BAA8B;IAC9B,qBADY,MAAM,EAKjB;IAXD,0GAA0G;IAC1G,aADW,IAAI,MAAM,EAAE,IAAI,OAAO,SAAS,EAAE,mBAAmB,CAAC,OAAO,SAAS,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAC9E;IAExB,qBAAqB;IACrB,UADW,MAAM,CACR;IAST,8BAA8B;IAC9B,oBADY,YAAY,UAgBtB;IAEF;;;;OAIG;IACH,wGAOC;IAED,uDAAuD;IACvD,cADY,OAAO,SAAS,EAAE,aAAa,QAG1C;IAED,gBAEC;CACF"}

package/blocks/ExternalSource/MessageBridge.js

@@ -0,0 +1,71 @@
+/** @type {import('./types').InputMessageType[]} */
+const MESSAGE_TYPE_WHITELIST = ['selected-files-change'];
+
+/**
+ * @param {unknown} message
+ * @returns {message is import("./types").InputMessageMap[import("./types").InputMessageType]}
+ */
+const isWhitelistedMessage = (message) => {
+  if (!message) return false;
+  if (typeof message !== 'object') return false;
+  return (
+    'type' in message &&
+    MESSAGE_TYPE_WHITELIST.includes(/** @type {import('./types').InputMessageType} */ (message.type))
+  );
+};
+
+export class MessageBridge {
+  /** @type {Map<string, Set<import('./types').InputMessageHandler<import('./types').InputMessageType>>>} */
+  _handlerMap = new Map();
+
+  /** @type {Window} */
+  _context;
+
+  /** @param {Window} context */
+  constructor(context) {
+    this._context = context;
+
+    window.addEventListener('message', this._handleMessage);
+  }
+
+  /** @param {MessageEvent} e */
+  _handleMessage = (e) => {
+    if (e.source !== this._context) {
+      return;
+    }
+    const message = e.data;
+    if (!isWhitelistedMessage(message)) {
+      return;
+    }
+
+    const handlers = this._handlerMap.get(message.type);
+    if (handlers) {
+      for (const handler of handlers) {
+        handler(message);
+      }
+    }
+  };
+
+  /**
+   * @template {import('./types').InputMessageType} T
+   * @param {T} type
+   * @param {import('./types').InputMessageHandler<T>} handler
+   */
+  on(type, handler) {
+    const handlers = this._handlerMap.get(type) ?? new Set();
+    if (!this._handlerMap.has(type)) {
+      this._handlerMap.set(type, handlers);
+    }
+
+    handlers.add(/** @type {import('./types').InputMessageHandler<import('./types').InputMessageType>} */ (handler));
+  }
+
+  /** @param {import('./types').OutputMessage} message */
+  send(message) {
+    this._context.postMessage(message, '*');
+  }
+
+  destroy() {
+    window.removeEventListener('message', this._handleMessage);
+  }
+}

package/blocks/ExternalSource/buildThemeDefinition.d.ts

@@ -0,0 +1,3 @@
+/** @param {HTMLElement} element */
+export function buildThemeDefinition(element: HTMLElement): Record<keyof import("./types.js").ThemeDefinition, string>;
+//# sourceMappingURL=buildThemeDefinition.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"buildThemeDefinition.d.ts","sourceRoot":"","sources":["buildThemeDefinition.js"],"names":[],"mappings":"AAqCA,mCAAmC;AACnC,8CADY,WAAW,8DAStB"}

package/blocks/ExternalSource/buildThemeDefinition.js

@@ -0,0 +1,47 @@
+// @ts-check
+
+/**
+ * @param {HTMLElement} element
+ * @param {string} propName
+ */
+function getCssValue(element, propName) {
+  let style = window.getComputedStyle(element);
+  return style.getPropertyValue(propName).trim();
+}
+
+const ucCustomProperties = /** @type {(keyof import('./types.js').ThemeDefinition)[]} */ ([
+  '--uc-font-family',
+  '--uc-font-size',
+  '--uc-line-height',
+  '--uc-button-size',
+  '--uc-preview-size',
+  '--uc-input-size',
+  '--uc-padding',
+  '--uc-radius',
+  '--uc-transition',
+  '--uc-background',
+  '--uc-foreground',
+  '--uc-primary',
+  '--uc-primary-hover',
+  '--uc-primary-transparent',
+  '--uc-primary-foreground',
+  '--uc-secondary',
+  '--uc-secondary-hover',
+  '--uc-secondary-foreground',
+  '--uc-muted',
+  '--uc-muted-foreground',
+  '--uc-destructive',
+  '--uc-destructive-foreground',
+  '--uc-border',
+]);
+
+/** @param {HTMLElement} element */
+export function buildThemeDefinition(element) {
+  return ucCustomProperties.reduce((acc, prop) => {
+    const value = getCssValue(element, prop);
+    if (value) {
+      acc[prop] = value;
+    }
+    return acc;
+  }, /** @type {Record<keyof import('./types.js').ThemeDefinition, string>} */ ({}));
+}

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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"}