@chayns-components/core/lib/cjs/utils/fileDialog.js

A set of beautiful React components for developing your own applications with chayns.

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.selectFiles = exports.getFileAsArrayBuffer = exports.filterFilesByMimeType = void 0;
var _chaynsApi = require("chayns-api");
const selectFiles = ({
  type,
  multiple,
  maxFileSizeInMB
}) => new Promise((resolve, reject) => {
  const input = document.createElement('input');
  input.type = 'file';
  input.style.visibility = 'none';
  input.style.width = '0';
  input.style.height = '0';
  input.style.display = 'none';
  if (type !== '*/*' && type) {
    input.accept = type;
  }
  if (multiple) {
    input.multiple = true;
  }
  document.body.appendChild(input);
  const abortController = new AbortController();
  const {
    signal
  } = abortController;
  const onChange = event => {
    document.body.removeChild(input);
    abortController.abort();
    if (!event.target) {
      resolve([]);
      return;
    }
    const target = event.target;
    const {
      files
    } = target;
    if (!files) {
      resolve([]);
      return;
    }
    const fileArray = Object.values(files);
    let filteredFileArray = fileArray.filter(file => {
      const sizeInMB = file.size / 1024 / 1024;
      if (maxFileSizeInMB && maxFileSizeInMB < sizeInMB) {
        return false;
      }
      if (file.type.includes('video/') && sizeInMB > 500) {
        return false;
      }
      return !(file.type.includes('image/') && sizeInMB > 64);
    });
    if (fileArray.length !== filteredFileArray.length) {
      void (0, _chaynsApi.createDialog)({
        type: _chaynsApi.DialogType.ALERT,
        text: 'Einige Deiner ausgewählten Dateien sind zu groß.'
      }).open();
    }
    if (typeof type === 'string') {
      filteredFileArray = filterFilesByMimeType(filteredFileArray, type);
    }
    resolve(filteredFileArray);
  };
  const onCancel = () => {
    document.body.removeChild(input);
    abortController.abort();
    reject(new Error('File selection was cancelled.'));
  };
  input.addEventListener('change', onChange, {
    signal
  });
  input.addEventListener('focusout', onCancel, {
    signal
  });
  input.click();
});
exports.selectFiles = selectFiles;
const filterFilesByMimeType = (files, mimeTypes) => {
  const allowedTypes = mimeTypes.split(',').map(type => type.trim());
  const isAllowedType = fileType => allowedTypes.some(allowedType => {
    if (allowedType.endsWith('/*')) {
      const convertedAllowedType = allowedType.split('/*')[0];
      if (!convertedAllowedType) {
        return false;
      }
      return fileType.startsWith(convertedAllowedType);
    }
    return fileType === allowedType;
  });
  return Array.from(files).filter(file => isAllowedType(file.type));
};
exports.filterFilesByMimeType = filterFilesByMimeType;
const getFileAsArrayBuffer = file => new Promise((resolve, reject) => {
  const reader = new FileReader();
  reader.onload = e => {
    var _e$target;
    if ((_e$target = e.target) !== null && _e$target !== void 0 && _e$target.result) {
      resolve(e.target.result);
    } else {
      reject(Error('Could not get array buffer.'));
    }
  };
  reader.onerror = reject;
  reader.readAsArrayBuffer(file);
});
exports.getFileAsArrayBuffer = getFileAsArrayBuffer;
//# sourceMappingURL=fileDialog.js.map