fix(VFileInput): closable slotted chips (#20250)

fixes #18638

Co-authored-by: John Leider <[email protected]>

Author: huynhtehoa

packages/vuetify/src/components/VFileInput/VFileInput.sass

@@ -31,7 +31,6 @@
       position: absolute
       top: 0
       width: 100%
-      z-index: 1
 
     .v-input__details
       padding-inline: $file-input-details-padding-inline

packages/vuetify/src/components/VFileInput/VFileInput.tsx

@@ -155,6 +155,16 @@ export const VFileInput = genericComponent<VFileInputSlots>()({
         callEvent(props['onClick:clear'], e)
       })
     }
+    function onDragover (e: DragEvent) {
+      e.preventDefault()
+    }
+    function onDrop (e: DragEvent) {
+      e.preventDefault()
+
+      if (!e.dataTransfer) return
+
+      model.value = [...e.dataTransfer.files ?? []]
+    }
 
     watch(model, newValue => {
       const hasModelReset = !Array.isArray(newValue) || !newValue.length
@@ -215,6 +225,8 @@ export const VFileInput = genericComponent<VFileInputSlots>()({
                 disabled={ isDisabled.value }
                 focused={ isFocused.value }
                 error={ isValid.value === false }
+                onDragover={ onDragover }
+                onDrop={ onDrop }
               >
                 {{
                   ...slots,