@opentiny/vue-renderless/upload-dragger/index.js

An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.

import "../chunk-G2ADBYYC.js";
const onDragOver = ({ props, state }) => () => !props.disabled && (state.dragover = true);
const onDrop = ({ emit, props, state }) => async (event) => {
  if (props.disabled || !state.uploader) {
    return;
  }
  const accept = state.uploader.accept;
  let files = event.dataTransfer.files;
  const isDirectory = event.dataTransfer.items && event.dataTransfer.items[0].webkitGetAsEntry().isDirectory;
  state.uploadFiles = [];
  state.dragover = false;
  if (isDirectory) {
    const fileItems = event.dataTransfer.items[0].webkitGetAsEntry();
    await readFiles(fileItems, state);
    files = state.uploadFiles;
  }
  if (!accept) {
    emit("file", files);
    return;
  }
  const notAcceptedFiles = [];
  [].slice.call(files).filter((file) => {
    const { type, name } = file;
    const extension = name.includes(".") ? `.${name.split(".").pop()}` : "";
    const baseType = type.replace(/\/.*$/, "");
    let isValid = accept.split(",").map((type2) => type2.trim()).filter((type2) => type2).some((type2) => {
      if (/\..+$/.test(type2)) {
        return extension === type2;
      }
      if (/\/\*$/.test(type2)) {
        return baseType === type2.replace(/\/\*$/, "");
      }
      if (/^[^/]+\/[^/]+$/.test(type2)) {
        return true;
      }
      return false;
    });
    !isValid && notAcceptedFiles.push(file);
    return isValid;
  });
  notAcceptedFiles.length && state.uploader.$emit("drop-error", notAcceptedFiles);
  emit("file", files);
};
const watchDragover = ({ state, constants }) => () => {
  state.uploader.$refs[constants.FILE_UPLOAD_INNER_TEMPLATE].$emit("drag-over", state.dragover);
};
async function readFiles(directory, state) {
  const reader = directory.createReader();
  const entries = await new Promise((resolve) => {
    reader.readEntries((entries2) => {
      resolve(entries2);
    });
  });
  for (let i = 0; i < entries.length; i++) {
    const entry = entries[i];
    if (entry.isFile) {
      await new Promise((resolve) => {
        entry.file((file) => {
          state.uploadFiles.push(file);
          resolve(void 0);
        });
      });
    } else if (entry.isDirectory) {
      await readFiles(entry, state);
    }
  }
}
export {
  onDragOver,
  onDrop,
  watchDragover
};