Fix soft bricking app when closing nested modals using escape key
This commit is contained in:
parent
2e4cfb3312
commit
42b063d21b
1 changed files with 33 additions and 24 deletions
|
@ -54,14 +54,22 @@
|
|||
|
||||
<svelte:window on:keydown={handleKey} />
|
||||
|
||||
<!-- These svelte if statements need to be defined like this. -->
|
||||
<!-- The modal transitions do not work if nested inside more than one "if" -->
|
||||
{#if visible && inline}
|
||||
{#if inline}
|
||||
{#if visible}
|
||||
<div use:focusFirstInput class="spectrum-Modal inline is-open">
|
||||
<slot />
|
||||
</div>
|
||||
{:else if visible}
|
||||
{/if}
|
||||
{:else}
|
||||
<!--
|
||||
We cannot conditionally render the portal as this leads to a missing
|
||||
insertion point when using nested modals. Therefore we just conditionally
|
||||
render the content of the portal.
|
||||
It still breaks the modal animation, but its better than soft bricking the
|
||||
screen.
|
||||
-->
|
||||
<Portal target=".modal-container">
|
||||
{#if visible}
|
||||
<div
|
||||
class="spectrum-Underlay is-open"
|
||||
in:fade={{ duration: 200 }}
|
||||
|
@ -82,6 +90,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</Portal>
|
||||
{/if}
|
||||
|
||||
|
|
Loading…
Reference in a new issue