Steps to reproduce the issue

Bug DragInDrop.
The standard <input type="file"/> field supports drag and drop. You can take an image file and drag mouse it to the file field in any form of any Chromium-based browser site.
However, this function does not work when dragging a file to the image field in the material editor.
The modified file field should inherit from the <input type="file"/> field, we can use the tag, and add more functions. But you should always use the standard field <input type= "file"/>.
However, the material editor uses the <input type="TEXT"/> field without using the <LABEL>tag.

It is important to note that the field supposedly serves for the name of the file selected from the server. However, you can't change the name manually, which means it doesn't matter to the user what type of field this field actually is. If this is the case, we can use the hidden field <input type="hidden" name="filename"/>, but use the open field <input type="file"/> to upload and drag the file to the content editor.

We must adhere to accessibility everywhere, observing the basic rules: uploading files to the form must be based only via <input type=file>
MediaElement in the article editor does not have an outline, which means it is not available by switching the TAB key. You can use Shadow instead of outline.
The user can't see the red or green button highlighted.

II. It is not Possible to insert the image address from the clipboard.
Let's say the image is located deep in subcategories site.
But the user has the full path to the file. We can't insert a path right away. In J3, this feature is available. Moreover, I repeatedly used the function, I repeatedly inserted the address of the image in the media field from clipboard.
The J4 media field looks much more beautiful than the J3 media field, but is less functional than J3.

I suggest making 2 main buttons in the media field in the article editor.

1. Button for selecting images from the user's computer.
2. Button for selecting images from the site server.

Dear developers,

1. when you publish photos on a social network, do you upload photos to the server, and then look for these photos in the catalog to add to a message to a friend?
2. When you write an email to your boss in Mail Google, do you upload an image to the server, and then search for this image in the server folder to add it to the email?
3. Even here in GitHub, I personally write these messages and add an image by dragging the mouse.
   So why doesn't the media field have a drag-and-drop function, and why should the media field only insert an image from the site?
   You must be able to insert the address from the clipboard.

You can use the dropdown button.
With sub-items:

1. Upload.
2. Select.
3. Insert.
4. Clear.

III. There is also an error.
Every six months, my client complained that when uploading a photo to the site in a new article, this photo was somehow added to the old articles. The problem is that the photos had the same file names. But the problem was big, many times 60 articles had their photos reloaded.
.I had to write a plugin that assigned unique names to photos, "Date-Time-Article Title.".
I believe that the user should not worry about the fact that uploading a photo with a short (simple name) on the site, old articles will be replaced with images.
Users often upload photos with the following names:
image.jpg, img.jpg, photo,jpg, _.jpg, cam.jpg.
These file names are generated automatically by image editors.
This creates a problem when uploading a new file with an existing name to the site.
You need to create an image name generator "date-Time-article Title".