feat: make modals undismissable

appwrite · Jan 22, 2025 · 3114ccc · 3114ccc
1 parent 52b288f
commit 3114ccc
Showing 1 changed file with 8 additions and 5 deletions.
diff --git a/v2/pink-sb/src/lib/Modal.svelte b/v2/pink-sb/src/lib/Modal.svelte
@@ -8,17 +8,18 @@
     export let title: string;
     export let open = false;
     export let hideFooter = false;
+    export let dismissible = true;
 
     let dialog: HTMLDialogElement;
 
     function handleBLur(event: MouseEvent) {
-        if (event.target === dialog) {
+        if (event.target === dialog && dismissible) {
             dialog.close();
         }
     }
 
     function handleKeydown(event: KeyboardEvent) {
-        if (event.key === 'Escape') {
+        if (event.key === 'Escape' && dismissible) {
             event.preventDefault();
             dialog.close();
         }
@@ -41,9 +42,11 @@
             <header>
                 <Stack gap="xl" justifyContent="space-between" direction="row" alignItems="center">
                     <Title size="s">{title}</Title>
-                    <Button icon variant="ghost" size="s" on:click={() => (open = false)}>
-                        <Icon icon={IconX} />
-                    </Button>
+                    {#if !dismissible}
+                        <Button icon variant="ghost" size="s" on:click={() => (open = false)}>
+                            <Icon icon={IconX} />
+                        </Button>
+                    {/if}
                 </Stack>
                 <p>
                     <slot name="description" />