fix(modal): prevent clicking inside inner modal from closing the modal

- revert adding a `stopPropagation` modifier to the PasswordInput "toggle password" button
This commit is contained in:
Eric Liu 2020-08-12 12:46:07 -07:00
commit 52a10d3acd
5 changed files with 23 additions and 12 deletions

View file

@ -14,7 +14,9 @@
</script>
{#if story === undefined}
<ComposedModal {...$$props.composedModal}>
<ComposedModal {...$$props.composedModal} on:click={(e) => {
console.log(e.target)
}}>
<ModalHeader {...$$props.modalHeader} />
<ModalBody
{...$$props.modalBody}

View file

@ -47,6 +47,7 @@
let buttonRef = null;
let innerModal = null;
let didClickInnerModal = false;
setContext("ComposedModal", {
closeModal: () => {
@ -102,10 +103,9 @@
class:bx--modal--danger={danger}
{...$$restProps}
on:click
on:click={({ target }) => {
if (!innerModal.contains(target)) {
open = false;
}
on:click={() => {
if (!didClickInnerModal) open = false;
didClickInnerModal = false;
}}
on:mouseover
on:mouseenter
@ -121,7 +121,10 @@
bind:this={innerModal}
class:bx--modal-container={true}
class="{size && `bx--modal-container--${size}`}
{containerClass}">
{containerClass}"
on:click={() => {
didClickInnerModal = true;
}}>
<slot />
</div>
</div>