Modal noOutsideClick prop

This commit is contained in:
Dallas Hoffman 2023-10-02 23:28:23 -04:00
parent 69d022a2fa
commit bd9fcf74c7
No known key found for this signature in database
2 changed files with 3 additions and 2 deletions

View File

@ -6,6 +6,7 @@
export let open: boolean; export let open: boolean;
export let title: string; export let title: string;
export let size: 'sm' | 'md' | 'lg' = 'md'; export let size: 'sm' | 'md' | 'lg' = 'md';
export let noOutsideClick: boolean = false;
const dispatch = createEventDispatcher(); const dispatch = createEventDispatcher();
@ -34,7 +35,7 @@
</script> </script>
<svelte:window on:keyup={escape} /> <svelte:window on:keyup={escape} />
<dialog {open} on:click={close} class="app-modal"> <dialog {open} on:click={() => (!noOutsideClick ? close() : null)} class="app-modal">
<article style:--max-width={maxWidths[size]} on:click|stopPropagation> <article style:--max-width={maxWidths[size]} on:click|stopPropagation>
<header> <header>
{title} {title}

View File

@ -18,7 +18,7 @@
} }
</script> </script>
<Modal title="Welcome!" size="sm" bind:open on:close={close}> <Modal title="Welcome!" size="sm" noOutsideClick={true} bind:open on:close={close}>
<p> <p>
Capture your thoughts for later by writing a quick note. Add tags to categorize it and organize Capture your thoughts for later by writing a quick note. Add tags to categorize it and organize
your notes. your notes.