Modal blocks half of file input

MR Raised

Please check the pipeline before review.

Also this seems like a CSS bug no?

I've updated the JS removing forEach and making sure it scrolls just the modal (on my vanilla setup it was scrolling the document root too)

Drupal.behaviors.mediaLibraryScrollOnOpen = {
    attach: function (context, settings) {
      const input = once('mediaLibraryScrollOnOpen', 'input[type="file"]', context)[0];
      if (input) {
        const modalContent = input.closest('#drupal-modal');
        if (modalContent) {
          setTimeout(() => {
            modalContent.scrollTo({
              top: modalContent.offsetTop  - modalContent.scrollTop,
              behavior: 'smooth',
            });
          }, 100);
        }
      }
    }
  };

As I've investigated, the issue lies on jQuery adding max-height on #drupal-modal.ui-front ui-dialog-content ui-widget-content when it actually should add this property to .media-library-wrapper I couldn't find yet how we can tweak the jQuery

If anyone could Shed a light I'll be thankful :)

hello, I have checked this issue on Drupal 11, in Claro and Gin theme. I am able to replicate it.
Tested the MR , and the issue get resolved ie able to see the file input on click of Add media field in a content type, the popup gets opened and the scroll is up at the top of the modal. In terms of UX, may be this can still be improved, but it is fixing the issue of file input getting cut off.

I have added before and after screenshots for reference.