암호 키 내보내기 페이지 구현

src/lib/components/BottomSheet.svelte

@@ -0,0 +1,31 @@
+<script lang="ts">
+  import type { Snippet } from "svelte";
+  import { fade, fly } from "svelte/transition";
+
+  interface Props {
+    children: Snippet;
+    isOpen: boolean;
+  }
+
+  let { children, isOpen = $bindable() }: Props = $props();
+</script>
+
+{#if isOpen}
+  <!-- svelte-ignore a11y_click_events_have_key_events -->
+  <!-- svelte-ignore a11y_no_static_element_interactions -->
+  <div
+    onclick={() => {
+      isOpen = false;
+    }}
+    class="fixed inset-0 flex items-end justify-center"
+  >
+    <div class="absolute inset-0 bg-black bg-opacity-50" transition:fade={{ duration: 100 }}></div>
+    <div
+      onclick={(e) => e.stopPropagation()}
+      class="z-10 flex max-h-[70vh] min-h-[30vh] w-full items-stretch rounded-t-2xl bg-white p-4"
+      transition:fly={{ y: 100, duration: 200 }}
+    >
+      {@render children?.()}
+    </div>
+  </div>
+{/if}

src/lib/components/Modal.svelte

@@ -8,24 +8,19 @@
   }
 
   let { children, isOpen = $bindable() }: Props = $props();
-
-  const closeModal = () => {
-    isOpen = false;
-  };
 </script>
 
 {#if isOpen}
   <!-- svelte-ignore a11y_click_events_have_key_events -->
   <!-- svelte-ignore a11y_no_static_element_interactions -->
   <div
-    onclick={closeModal}
+    onclick={() => {
+      isOpen = false;
+    }}
     class="fixed inset-0 flex items-center justify-center bg-black bg-opacity-50 px-2"
+    transition:fade={{ duration: 100 }}
   >
-    <div
-      onclick={(e) => e.stopPropagation()}
-      class="max-w-full rounded-2xl bg-white p-4"
-      transition:fade={{ duration: 100 }}
-    >
+    <div onclick={(e) => e.stopPropagation()} class="max-w-full rounded-2xl bg-white p-4">
       {@render children?.()}
     </div>
   </div>

src/lib/components/index.ts

@@ -1 +1,2 @@
+export { default as BottomSheet } from "./BottomSheet.svelte";
 export { default as Modal } from "./Modal.svelte";

src/lib/hooks/gotoStateful.ts

@@ -3,6 +3,7 @@ import { goto } from "$app/navigation";
 type Path = "/key/export";
 
 interface KeyExportState {
+  redirectPath: string;
   pubKeyBase64: string;
   privKeyBase64: string;
 }