Ver Fonte

add ignoreEvent — so that paste/drop events are not passed to Url plugin

 ignore drop/paste events if they are not in input or textarea —
otherwise when Url plugin adds drop/paste listeners to this.el,
draging UI elements or pasting anything into any field triggers those events — Url treats them as URLs that need to be imported

// @goto-bus-stop could you check this when you are back, what do you think
Artur Paikin há 6 anos atrás
pai
commit
69343e68bd

+ 10 - 7
packages/@uppy/dashboard/src/FileCard.js → packages/@uppy/dashboard/src/components/FileCard.js

@@ -1,8 +1,9 @@
-const getFileTypeIcon = require('./getFileTypeIcon')
+const getFileTypeIcon = require('../utils/getFileTypeIcon')
 const FilePreview = require('./FilePreview')
+const ignoreEvent = require('../utils/ignoreEvent.js')
 const { h, Component } = require('preact')
 
-module.exports = class FileCard extends Component {
+class FileCard extends Component {
   constructor (props) {
     super(props)
 
@@ -66,14 +67,14 @@ module.exports = class FileCard extends Component {
   }
 
   render () {
-    // if (!this.props.fileCardFor) {
-    //   return <div class="uppy-DashboardFileCard" aria-hidden />
-    // }
-
     const file = this.props.files[this.props.fileCardFor]
 
     return (
-      <div class="uppy-DashboardFileCard">
+      <div class="uppy-DashboardFileCard"
+        onDragOver={ignoreEvent}
+        onDragLeave={ignoreEvent}
+        onDrop={ignoreEvent}
+        onPaste={ignoreEvent}>
         <div class="uppy-DashboardContent-bar">
           <div class="uppy-DashboardContent-title" role="heading" aria-level="h1">
             {this.props.i18nArray('editing', {
@@ -106,3 +107,5 @@ module.exports = class FileCard extends Component {
     )
   }
 }
+
+module.exports = FileCard

+ 7 - 2
packages/@uppy/dashboard/src/PanelContent.js → packages/@uppy/dashboard/src/components/PanelContent.js

@@ -1,10 +1,15 @@
 const { h } = require('preact')
+const ignoreEvent = require('../utils/ignoreEvent.js')
 
-const PanelContent = (props) => {
+function PanelContent (props) {
   return (
     <div class="uppy-DashboardContent-panel"
       role="tabpanel"
-      id={props.activePanel && `uppy-DashboardContent-panel--${props.activePanel.id}`}>
+      id={props.activePanel && `uppy-DashboardContent-panel--${props.activePanel.id}`}
+      onDragOver={ignoreEvent}
+      onDragLeave={ignoreEvent}
+      onDrop={ignoreEvent}
+      onPaste={ignoreEvent}>
       <div class="uppy-DashboardContent-bar">
         <div class="uppy-DashboardContent-title" role="heading" aria-level="h1">
           {props.i18n('importFrom', { name: props.activePanel.name })}

+ 17 - 0
packages/@uppy/dashboard/src/utils/ignoreEvent.js

@@ -0,0 +1,17 @@
+// ignore drop/paste events if they are not in input or textarea —
+// otherwise when Url plugin adds drop/paste listeners to this.el,
+// draging UI elements or pasting anything into any field triggers those events —
+// Url treats them as URLs that need to be imported
+
+function ignoreEvent (ev) {
+  const tagName = ev.target.tagName
+  if (tagName === 'INPUT' ||
+      tagName === 'TEXTAREA') {
+    ev.stopPropagation()
+    return
+  }
+  ev.preventDefault()
+  ev.stopPropagation()
+}
+
+module.exports = ignoreEvent