@uploadcare/file-uploader 1.23.0 → 1.24.0-alpha.0

package/abstract/managers/ValidationManager.js

@@ -1,340 +0,0 @@
-// @ts-check
-import { EventType } from '../../blocks/UploadCtxProvider/EventEmitter.js';
-import {
-  validateIsImage,
-  validateFileType,
-  validateMaxSizeLimit,
-  validateUploadError,
-} from '../../utils/validators/file/index.js';
-import { validateMultiple, validateCollectionUploadError } from '../../utils/validators/collection/index.js';
-import { Queue } from '@uploadcare/upload-client';
-import { withResolvers } from '../../utils/withResolvers.js';
-import { debounce } from '../../blocks/utils/debounce.js';
-
-/**
- * @typedef {(
- *   outputEntry: import('../../types').OutputFileEntry,
- *   api: import('../UploaderPublicApi.js').UploaderPublicApi,
- *   options?: { signal?: AbortSignal },
- * ) =>
- *   | (undefined | import('../../types').OutputErrorFile)
- *   | Promise<undefined | import('../../types').OutputErrorFile>} FuncFileValidator
- */
-
-/**
- * @typedef {{
- *   runOn: 'add' | 'upload' | 'change';
- *   validator: FuncFileValidator;
- * }} FileValidatorDescriptor
- */
-
-/** @typedef {FileValidatorDescriptor | FuncFileValidator} FileValidator */
-
-/**
- * @typedef {(
- *   collection: ReturnType<
- *     typeof import('../buildOutputCollectionState.js').buildOutputCollectionState<
- *       import('../../types').OutputCollectionStatus
- *     >
- *   >,
- *   api: import('../UploaderPublicApi.js').UploaderPublicApi,
- * ) => undefined | import('../../types').OutputErrorCollection} FuncCollectionValidator
- */
-
-const LOG_TEXT = {
-  FILE_VALIDATION_FAILED: 'File validator execution has failed',
-  FILE_VALIDATION_TIMEOUT: 'File validator execution has timed out',
-  COLLECTION_VALIDATION_FAILED: 'Collection validator execution has failed',
-  MISSING_ERROR_MESSAGE: 'Missing message. We recommend adding message: value.',
-};
-
-/**
- * @param {FileValidator} validator
- * @returns {FileValidatorDescriptor}
- */
-const getValidatorDescriptor = (validator) => {
-  if (typeof validator === 'function') {
-    return { runOn: 'change', validator };
-  }
-  return validator;
-};
-
-export class ValidationManager {
-  /**
-   * @private
-   * @type {import('../UploaderBlock.js').UploaderBlock}
-   */
-  _blockInstance;
-
-  /** @type {FuncFileValidator[]} */
-  _commonFileValidators = [validateIsImage, validateFileType, validateMaxSizeLimit, validateUploadError];
-
-  /** @type {FuncCollectionValidator[]} */
-  _commonCollectionValidators = [validateMultiple, validateCollectionUploadError];
-
-  _queue = new Queue(20);
-  _runQueueDebounced = debounce(() => {
-    this._queue.run();
-  }, 500);
-
-  /**
-   * @type {Map<
-   *   string,
-   *   {
-   *     abortController?: AbortController;
-   *     skippedValidators: WeakSet<FuncFileValidator>;
-   *     promise?: Promise<void>;
-   *     lastErrorThrownByValidator: WeakMap<FuncFileValidator, import('../../types').OutputErrorFile | undefined>;
-   *   }
-   * >}
-   */
-  _entryValidationState = new Map();
-
-  /** @param {import('../UploaderBlock.js').UploaderBlock} blockInstance */
-  constructor(blockInstance) {
-    this._blockInstance = blockInstance;
-
-    this._uploadCollection = this._blockInstance.uploadCollection;
-
-    const runAllValidators = () => {
-      this.runFileValidators('change');
-      this.runCollectionValidators();
-    };
-
-    this._blockInstance.subConfigValue('maxLocalFileSizeBytes', runAllValidators);
-    this._blockInstance.subConfigValue('multipleMin', runAllValidators);
-    this._blockInstance.subConfigValue('multipleMax', runAllValidators);
-    this._blockInstance.subConfigValue('multiple', runAllValidators);
-    this._blockInstance.subConfigValue('imgOnly', runAllValidators);
-    this._blockInstance.subConfigValue('accept', runAllValidators);
-
-    this._blockInstance.subConfigValue('validationConcurrency', (concurrency) => {
-      this._queue.concurrency = concurrency;
-    });
-  }
-
-  /**
-   * @param {FileValidatorDescriptor['runOn']} runOn
-   * @param {string[]} [entryIds]
-   */
-  runFileValidators(runOn, entryIds) {
-    const ids = entryIds ?? this._uploadCollection.items();
-    for (const id of ids) {
-      const entry = this._uploadCollection.read(id);
-      if (entry) {
-        void this._runFileValidatorsForEntry(entry, runOn);
-      }
-    }
-  }
-
-  runCollectionValidators() {
-    const collection = this._blockInstance.api.getOutputCollectionState();
-    const errors = [];
-
-    for (const validator of [...this._commonCollectionValidators, ...this._blockInstance.cfg.collectionValidators]) {
-      try {
-        const error = validator(collection, this._blockInstance.api);
-        if (!error) {
-          continue;
-        }
-        if (error) {
-          errors.push(this._addCustomTypeToValidationError(error));
-
-          if (!error.message) {
-            console.warn(LOG_TEXT.MISSING_ERROR_MESSAGE);
-          }
-        }
-      } catch (error) {
-        console.warn(LOG_TEXT.COLLECTION_VALIDATION_FAILED, error);
-      }
-    }
-
-    this._blockInstance.$['*collectionErrors'] = errors;
-
-    if (errors.length > 0) {
-      this._blockInstance.emit(
-        EventType.COMMON_UPLOAD_FAILED,
-        () =>
-          /** @type {import('../../types').OutputCollectionState<'failed'>} */ (
-            this._blockInstance.api.getOutputCollectionState()
-          ),
-        { debounce: true },
-      );
-    }
-  }
-
-  /** @param {import('../TypedData.js').TypedData<typeof import('../uploadEntrySchema.js').uploadEntrySchema>} entry */
-  cleanupValidationForEntry(entry) {
-    const state = this._entryValidationState.get(entry.uid);
-    if (state) {
-      state.abortController?.abort();
-      this._entryValidationState.delete(entry.uid);
-    }
-  }
-
-  /**
-   * @private
-   * @param {import('../TypedData.js').TypedData<typeof import('../uploadEntrySchema.js').uploadEntrySchema>} entry
-   * @param {FileValidatorDescriptor['runOn']} runOn
-   */
-  async _runFileValidatorsForEntry(entry, runOn) {
-    const entryDescriptors = this._getValidatorDescriptorsForEntry(entry, runOn);
-    if (entryDescriptors.length === 0) {
-      return;
-    }
-    entry.setMultipleValues({
-      isQueuedForValidation: true,
-      isValidationPending: true,
-    });
-    const outputEntry = this._blockInstance.api.getOutputItem(entry.uid);
-    const state = this._getEntryValidationState(entry);
-
-    if (state.promise) {
-      await state.promise;
-    }
-
-    const { promise, resolve } = withResolvers();
-    state.promise = promise;
-    const abortController = new AbortController();
-    state.abortController = abortController;
-
-    const timeoutMs = this._blockInstance.cfg.validationTimeout;
-    const allDescriptors = this._getValidatorDescriptors();
-
-    const entryValidatorSet = new Set(entryDescriptors.map((d) => d.validator));
-    /** @type {import('../../types').OutputErrorFile[]} */
-    const errors = [];
-    for (const descriptor of allDescriptors) {
-      if (!entryValidatorSet.has(descriptor.validator)) {
-        const error = state.lastErrorThrownByValidator.get(descriptor.validator);
-        if (error) errors.push(error);
-      }
-    }
-
-    const tasks = entryDescriptors.map((validatorDescriptor) => async () => {
-      if (!this._blockInstance.isConnected) {
-        return;
-      }
-      const timeoutId = setTimeout(() => {
-        state.skippedValidators.add(validatorDescriptor.validator);
-        abortController.abort();
-        console.warn(LOG_TEXT.FILE_VALIDATION_TIMEOUT);
-      }, timeoutMs);
-
-      try {
-        const error = await validatorDescriptor.validator(outputEntry, this._blockInstance.api, {
-          signal: abortController.signal,
-        });
-        if (!error || abortController.signal.aborted) {
-          state.lastErrorThrownByValidator.set(validatorDescriptor.validator, undefined);
-          return;
-        }
-        const normalizedError = this._addCustomTypeToValidationError(error);
-        state.lastErrorThrownByValidator.set(validatorDescriptor.validator, normalizedError);
-        errors.push(normalizedError);
-
-        if (!error.message) {
-          console.warn(LOG_TEXT.MISSING_ERROR_MESSAGE);
-        }
-      } catch (error) {
-        if (!abortController.signal.aborted) {
-          state.skippedValidators.add(validatorDescriptor.validator);
-
-          console.warn(LOG_TEXT.FILE_VALIDATION_FAILED, error);
-          this._blockInstance.telemetryManager.sendEventError(
-            error,
-            `file validator. ${LOG_TEXT.FILE_VALIDATION_FAILED}`,
-          );
-        }
-      } finally {
-        clearTimeout(timeoutId);
-        if (validatorDescriptor.runOn !== 'change') {
-          state.skippedValidators.add(validatorDescriptor.validator);
-        }
-      }
-    });
-
-    this._runQueueDebounced();
-
-    await this._queue.add(
-      async () => {
-        entry.setValue('isQueuedForValidation', false);
-        await Promise.all(tasks.map((task) => task())).catch(() => {});
-      },
-      {
-        autoRun: false,
-      },
-    );
-
-    if (abortController.signal.aborted) {
-      entry.setMultipleValues({
-        isQueuedForValidation: false,
-        isValidationPending: false,
-      });
-      resolve();
-      return;
-    }
-
-    entry.setMultipleValues({
-      isValidationPending: false,
-      isQueuedForValidation: false,
-      errors,
-    });
-
-    resolve();
-  }
-
-  /**
-   * @private
-   * @template {import('../../types').OutputError<
-   *   import('../../types').OutputFileErrorType | import('../../types').OutputCollectionErrorType
-   * >} T
-   * @param {T} error
-   * @returns {T}
-   */
-  _addCustomTypeToValidationError(error) {
-    return {
-      ...error,
-      type: error.type ?? 'CUSTOM_ERROR',
-    };
-  }
-
-  /**
-   * @private
-   * @param {import('../TypedData.js').TypedData<typeof import('../uploadEntrySchema.js').uploadEntrySchema>} entry
-   */
-  _getEntryValidationState(entry) {
-    const currentState = this._entryValidationState.get(entry.uid);
-    if (currentState) {
-      return currentState;
-    }
-
-    const newState = {
-      abortController: undefined,
-      skippedValidators: new WeakSet(),
-      promise: undefined,
-      lastErrorThrownByValidator: /** @type {WeakMap<FuncFileValidator, import('../../types').OutputErrorFile>} */ (
-        new WeakMap()
-      ),
-    };
-    this._entryValidationState.set(entry.uid, newState);
-    return newState;
-  }
-
-  /** @private */
-  _getValidatorDescriptors() {
-    return [...this._commonFileValidators, ...this._blockInstance.cfg.fileValidators].map(getValidatorDescriptor);
-  }
-
-  /**
-   * @private
-   * @param {import('../TypedData.js').TypedData<typeof import('../uploadEntrySchema.js').uploadEntrySchema>} entry
-   * @param {FileValidatorDescriptor['runOn']} runOn
-   */
-  _getValidatorDescriptorsForEntry(entry, runOn) {
-    const state = this._getEntryValidationState(entry);
-    return this._getValidatorDescriptors()
-      .filter((descriptor) => !state.skippedValidators.has(descriptor.validator))
-      .filter((descriptor) => descriptor.runOn === runOn);
-  }
-}

package/abstract/managers/a11y.d.ts

@@ -1,20 +0,0 @@
-export class A11y {
-    /**
-     * @private
-     * @type {(() => void) | undefined}
-     */
-    private _destroyKeyUX;
-    /**
-     * @private
-     * @type {ScopedMinimalWindow}
-     */
-    private _scopedWindow;
-    /** @param {import('../Block.js').Block} scope */
-    registerBlock(scope: import("../Block.js").Block): void;
-    destroy(): void;
-}
-/**
- * MinimalWindow interface is not exported by keyux, so we import it here using tricky way.
- */
-export type MinimalWindow = Parameters<import("keyux").KeyUXModule>[0];
-//# sourceMappingURL=a11y.d.ts.map

package/abstract/managers/a11y.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["a11y.js"],"names":[],"mappings":"AAqFA;IACE;;;OAGG;IACH,sBAAc;IAEd;;;OAGG;IACH,sBAAc;IAYd,iDAAiD;IACjD,qBADY,OAAO,aAAa,EAAE,KAAK,QAGtC;IAED,gBAGC;CACF;;;;4BA/GY,UAAU,CAAC,OAAO,OAAO,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC"}

package/abstract/managers/a11y.js

@@ -1,118 +0,0 @@
-// @ts-check
-import { startKeyUX, hiddenKeyUX, jumpKeyUX, focusGroupKeyUX, pressKeyUX } from 'keyux';
-
-/**
- * MinimalWindow interface is not exported by keyux, so we import it here using tricky way.
- *
- * @typedef {Parameters<import('keyux').KeyUXModule>[0]} MinimalWindow
- */
-
-/**
- * This is global window wrapper that allows to scope event listeners to a specific part of the DOM.
- *
- * It is used to scope the key UX to the widget.
- *
- * @implements {MinimalWindow}
- */
-class ScopedMinimalWindow {
-  /**
-   * @private
-   * @type {Map<Function, (event: Event) => void>}
-   */
-  _listeners = new Map();
-
-  /**
-   * @private
-   * @type {Node[]}
-   */
-  _scope = [];
-
-  /**
-   * @param {'keydown' | 'keyup'} type
-   * @param {(event: Event) => void} listener
-   */
-  addEventListener(type, listener) {
-    /** @param {Event} e */
-    const wrappedListener = (e) => {
-      const target = e.target;
-      if (!target) return;
-      if (this._scope.some((el) => el === e.target || el.contains(/** @type {Node} */ (target)))) {
-        listener(e);
-      }
-    };
-    this._listeners.set(listener, wrappedListener);
-    window.addEventListener(type, wrappedListener);
-  }
-
-  /**
-   * @param {'keydown' | 'keyup'} type
-   * @param {(event: {}) => void} listener
-   */
-  removeEventListener(type, listener) {
-    const wrappedListener = this._listeners.get(listener);
-    if (wrappedListener) {
-      window.removeEventListener(type, wrappedListener);
-    }
-    this._listeners.delete(listener);
-  }
-
-  get CustomEvent() {
-    return window.CustomEvent;
-  }
-
-  get document() {
-    return window.document;
-  }
-
-  get navigator() {
-    return window.navigator;
-  }
-
-  /** @param {Node} scope */
-  registerScope(scope) {
-    this._scope.push(scope);
-  }
-
-  destroy() {
-    this._scope = [];
-    this._listeners.forEach((listener, originalListener) => {
-      window.removeEventListener('keydown', listener);
-      window.removeEventListener('keyup', listener);
-      this._listeners.delete(originalListener);
-    });
-  }
-}
-
-export class A11y {
-  /**
-   * @private
-   * @type {(() => void) | undefined}
-   */
-  _destroyKeyUX;
-
-  /**
-   * @private
-   * @type {ScopedMinimalWindow}
-   */
-  _scopedWindow;
-
-  constructor() {
-    this._scopedWindow = new ScopedMinimalWindow();
-    this._destroyKeyUX = startKeyUX(this._scopedWindow, [
-      focusGroupKeyUX(),
-      pressKeyUX('is-pressed'),
-      jumpKeyUX(),
-      hiddenKeyUX(),
-    ]);
-  }
-
-  /** @param {import('../Block.js').Block} scope */
-  registerBlock(scope) {
-    this._scopedWindow.registerScope(scope);
-  }
-
-  destroy() {
-    this._destroyKeyUX?.();
-    this._scopedWindow.destroy();
-  }
-}

package/abstract/sharedConfigKey.d.ts

@@ -1,2 +0,0 @@
-export function sharedConfigKey<T extends keyof import("../types").ConfigType>(key: T): `*cfg/${T}`;
-//# sourceMappingURL=sharedConfigKey.d.ts.map

package/abstract/sharedConfigKey.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"sharedConfigKey.d.ts","sourceRoot":"","sources":["sharedConfigKey.js"],"names":[],"mappings":"AAOO,gCAJ4C,CAAC,SAAvC,MAAO,OAAO,UAAU,EAAE,UAAW,OACvC,CAAC,GACC,QAAQ,CAAC,EAAE,CAE6B"}

package/abstract/sharedConfigKey.js

@@ -1,8 +0,0 @@
-// @ts-check
-
-/**
- * @template {keyof import('../types').ConfigType} T
- * @param {T} key
- * @returns {`*cfg/${T}`}
- */
-export const sharedConfigKey = (key) => `*cfg/${key}`;

package/abstract/testModeProcessor.d.ts

@@ -1,7 +0,0 @@
-/**
- * @template {import('./Block.js').Block} T
- * @param {DocumentFragment} fr
- * @param {T} fnCtx
- */
-export function testModeProcessor<T extends import("./Block.js").Block>(fr: DocumentFragment, fnCtx: T): void;
-//# sourceMappingURL=testModeProcessor.d.ts.map

package/abstract/testModeProcessor.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"testModeProcessor.d.ts","sourceRoot":"","sources":["testModeProcessor.js"],"names":[],"mappings":"AAEA;;;;GAIG;AACH,kCAJ0C,CAAC,SAA9B,OAAQ,YAAY,EAAE,KAAM,MAC9B,gBAAgB,SAChB,CAAC,QAiCX"}

package/abstract/testModeProcessor.js

@@ -1,39 +0,0 @@
-// @ts-check
-
-/**
- * @template {import('./Block.js').Block} T
- * @param {DocumentFragment} fr
- * @param {T} fnCtx
- */
-export function testModeProcessor(fr, fnCtx) {
-  const elementsWithTestId = fr.querySelectorAll('[data-testid]');
-  if (elementsWithTestId.length === 0) {
-    return;
-  }
-  const valuesPerElement = new WeakMap();
-
-  for (const el of elementsWithTestId) {
-    const testIdValue = el.getAttribute('data-testid');
-    if (testIdValue) {
-      valuesPerElement.set(el, testIdValue);
-    }
-  }
-
-  fnCtx.subConfigValue('testMode', (testMode) => {
-    if (!testMode) {
-      for (const el of elementsWithTestId) {
-        el.removeAttribute('data-testid');
-      }
-      return;
-    }
-
-    const testIdPrefix = fnCtx.testId;
-    for (const el of elementsWithTestId) {
-      const testIdValue = valuesPerElement.get(el);
-      if (!testIdValue) {
-        continue;
-      }
-      el.setAttribute(`data-testid`, `${testIdPrefix}--${testIdValue}`);
-    }
-  });
-}

package/abstract/uploadEntrySchema.d.ts

@@ -1,134 +0,0 @@
-/** @constant */
-export const uploadEntrySchema: Readonly<{
-    file: Readonly<{
-        type: {
-            new (fileBits: BlobPart[], fileName: string, options?: FilePropertyBag): File;
-            prototype: File;
-        };
-        value: null;
-        nullable: true;
-    }>;
-    externalUrl: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    fileName: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    fileSize: Readonly<{
-        type: NumberConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    lastModified: Readonly<{
-        type: NumberConstructor;
-        value: number;
-    }>;
-    uploadProgress: Readonly<{
-        type: NumberConstructor;
-        value: 0;
-    }>;
-    uuid: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    isImage: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    mimeType: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    ctxName: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    cdnUrl: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    cdnUrlModifiers: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    fileInfo: Readonly<{
-        type: typeof UploadcareFile;
-        value: null;
-        nullable: true;
-    }>;
-    isUploading: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    abortController: Readonly<{
-        type: {
-            new (): AbortController;
-            prototype: AbortController;
-        };
-        value: null;
-        nullable: true;
-    }>;
-    thumbUrl: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    silent: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    source: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    fullPath: Readonly<{
-        type: StringConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    metadata: Readonly<{
-        type: ObjectConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    errors: Readonly<{
-        type: ArrayConstructor;
-        value: import("../types").OutputErrorFile[];
-    }>;
-    uploadError: Readonly<{
-        type: ErrorConstructor;
-        value: null;
-        nullable: true;
-    }>;
-    isRemoved: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    isQueuedForUploading: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    isValidationPending: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-    isQueuedForValidation: Readonly<{
-        type: BooleanConstructor;
-        value: false;
-    }>;
-}>;
-export type UploadEntryData = import("./TypedData").ExtractDataFromSchema<typeof uploadEntrySchema>;
-export type UploadEntryTypedData = import("./TypedData.js").TypedData<typeof uploadEntrySchema>;
-export type UploadEntryKeys = import("./TypedData.js").ExtractKeysFromSchema<typeof uploadEntrySchema>;
-import { UploadcareFile } from '@uploadcare/upload-client';
-//# sourceMappingURL=uploadEntrySchema.d.ts.map

package/abstract/uploadEntrySchema.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"uploadEntrySchema.d.ts","sourceRoot":"","sources":["uploadEntrySchema.js"],"names":[],"mappings":"AAGA,gBAAgB;AAChB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;eAkGsB,OAAO,UAAU,EAAE,eAAe,EAAE;;;;;;;;;;;;;;;;;;;;;;;GAuBvD;8BAEW,OAAO,aAAa,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;mCAErE,OAAO,gBAAgB,EAAE,SAAS,CAAC,OAAO,iBAAiB,CAAC;8BAE5D,OAAO,gBAAgB,EAAE,qBAAqB,CAAC,OAAO,iBAAiB,CAAC;+BAlIvD,2BAA2B"}