Dialog modal + addons

Flow
1

Hello,

Got small problems with addons using modal dialog. Modal dialog show some kind of backdrop that block everything until we close dialog.

I open addon from modal dialog but I cannot use it until i close dialog.

Is there configuration for modal dialog not block components that we don’t want to be blocked (np. QuickPopup).

2

Hi!

I think you’ve bumped into this issue: https://github.com/vaadin/vaadin-overlay/issues/141

Matti had a similar issue with TinyMCE.

3

Hello,

It really depends how your javascript component is built but if the content of your quickpopup is outside the vaadin-overlay then the click is “ignored” (which is the idea of a modal dialog).
One solution for “overlay/popup” component inside a component is to put the content (html code) inside the dialog (next to your component). I’m guessing it’s not inside the dialog-overlay and I think you don’t have any option to do that with quickpopup.

Another workaround can be to add this css in your content of the quickpopup: (you need to change the name of the css class)

.quickpopup-overlay {
pointer-events: auto;
}

Joni also gave you more workarounds.

4

Thx work like charm.

<dom-module id="popup" theme-for="quick-popup-overlay">
  <template>
    <style>
            .overlay{
                z-index:9999;  /*to show pupup before dialog*/
                pointer-events: auto;
            }
        
      </style>
  </template>
</dom-module>