useDropZone dataTypes filter

[alex-martinez]

Describe the bug

In v10.6.1 useDropZone's dataTypes allowed us filtering based on event.dataTransfer.types, but v10.7.0 removed this ability in PR #3540.

The advantage of using event.dataTransfer.types is on dragstart the data can be set set via event.dataTransfer.setData('text/plain', event.target.id), allowing the dragenter event to filter data types based on the event.dataTransfer.types. However, in v10.7.0 filtering is done using event.dataTransfer.items, which doesn't utilize the setData data.

I propose reverting the changes from PR #3540, or adding back this ability.

Reproductions

v10.6.1
In this example, drag the draggable item over the drop zone and notice how isOverDropZone changes to true.
https://stackblitz.com/edit/vitejs-vite-hg3ssu?file=src%2FApp.vue

v10.7.0
In this example, drag the draggable item over the drop zone and notice how isOverDropZone stays false.
https://stackblitz.com/edit/vitejs-vite-yhkerf?file=src%2FApp.vue

Reproduction

https://stackblitz.com/edit/vitejs-vite-yhkerf?file=src%2FApp.vue

System Info

System:
  OS: macOS 13.6.3
  CPU: (10) arm64 Apple M1 Pro
  Memory: 92.45 MB / 16.00 GB
  Shell: 5.9 - /bin/zsh
Binaries:
  Node: 18.19.0 - ~/.nvm/versions/node/v18.19.0/bin/node
  npm: 10.2.3 - ~/.nvm/versions/node/v18.19.0/bin/npm
Browsers:
  Brave Browser: 123.1.64.116
  Chrome: 123.0.6312.107
  Chrome Canary: 125.0.6398.0
  Safari: 16.6
npmPackages:
  vue: ^3.4.21 => 3.4.21

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion.
• The provided reproduction is a minimal reproducible example of the bug.