Modal background effect not disappearing with modal.hide(), Version 0.0.29

[robert-cronin]

I have a modal I initialize and show with the following code in the root of the showcase example:

root = Root("showcase") {
    val modal = Modal("Example Modal", size = ModalSize.LARGE, closeButton = true,
            animation = false, escape = false)
    modal.show()

    tabPanel {
        width = 80.perc
        margin = 20.px
       .....
}

The result looks fine:

until I try to close the modal:

Is there any way to remove the background effect and UI blocking after calling modal.hide() or pressing the closeButton?

[rjaros]

The problem is you are trying to display the modal window before the root component is initialized and rendered. And the modal is actually showing twice (the background effect is darker than normally). The easiest way to fix this, is to move modal.show() after the Root initializer.

        lateinit var modal: Modal
        root = Root("showcase") {
            modal = Modal("Example Modal", size = ModalSize.LARGE, closeButton = true,
                animation = false, escape = false)
            tabPanel {
                width = 80.perc
                margin = 20.px
                // ...
            }
            // ...
        }
        modal.show()

[robert-cronin]

Cheers, closing this issue as solved