ActionModal 레이아웃 및 Props 이름 관련 리팩토링

src/lib/components/molecules/ActionModal.svelte

@@ -12,7 +12,7 @@
     confirmText: string;
     isOpen: boolean;
     onbeforeclose?: () => void;
-    onconfirm: ConfirmHandler;
+    onConfirmClick: ConfirmHandler;
     title: string;
   }
 
@@ -22,7 +22,7 @@
     confirmText,
     isOpen = $bindable(),
     onbeforeclose,
-    onconfirm,
+    onConfirmClick,
     title,
   }: Props = $props();
 
@@ -32,15 +32,17 @@
   };
 
   const confirmAction = async () => {
-    if ((await onconfirm()) !== false) {
+    if ((await onConfirmClick()) !== false) {
       closeModal();
     }
   };
 </script>
 
-<Modal bind:isOpen onclose={closeModal} class="flex flex-col gap-y-2">
-  <p class="text-xl font-bold">{title}</p>
-  {@render children?.()}
+<Modal bind:isOpen onclose={closeModal} class="space-y-4">
+  <div class="flex flex-col gap-y-2 break-keep">
+    <p class="text-xl font-bold">{title}</p>
+    {@render children?.()}
+  </div>
   <div class="flex gap-x-2">
     <Button color="gray" onclick={closeModal} class="flex-1">{cancelText}</Button>
     <Button onclick={confirmAction} class="flex-1">{confirmText}</Button>

src/lib/components/organisms/modals/CategoryCreateModal.svelte

@@ -14,5 +14,5 @@
   title="새 카테고리"
   placeholder="카테고리 이름"
   submitText="만들기"
-  onsubmit={oncreate}
+  onSubmitClick={oncreate}
 />

src/lib/components/organisms/modals/RenameModal.svelte

@@ -4,11 +4,11 @@
   interface Props {
     isOpen: boolean;
     onbeforeclose?: () => void;
-    onrename: (newName: string) => Promise<boolean>;
+    onRenameClick: (newName: string) => Promise<boolean>;
     originalName: string | undefined;
   }
 
-  let { isOpen = $bindable(), onbeforeclose, onrename, originalName }: Props = $props();
+  let { isOpen = $bindable(), onbeforeclose, onRenameClick, originalName }: Props = $props();
 </script>
 
 <TextInputModal
@@ -18,5 +18,5 @@
   placeholder="이름"
   defaultValue={originalName}
   submitText="바꾸기"
-  onsubmit={onrename}
+  onSubmitClick={onRenameClick}
 />

src/lib/components/organisms/modals/TextInputModal.svelte

@@ -6,7 +6,7 @@
     defaultValue?: string;
     isOpen: boolean;
     onbeforeclose?: () => void;
-    onsubmit: (value: string) => ReturnType<ConfirmHandler>;
+    onSubmitClick: (value: string) => ReturnType<ConfirmHandler>;
     placeholder: string;
     submitText: string;
     title: string;
@@ -16,7 +16,7 @@
     defaultValue = "",
     isOpen = $bindable(),
     onbeforeclose,
-    onsubmit,
+    onSubmitClick,
     placeholder,
     submitText,
     title,
@@ -36,7 +36,7 @@
   {onbeforeclose}
   {title}
   confirmText={submitText}
-  onconfirm={() => onsubmit(value)}
+  onConfirmClick={() => onSubmitClick(value)}
 >
-  <TextInput bind:value {placeholder} class="mb-5" />
+  <TextInput bind:value {placeholder} class="mb-3" />
 </ActionModal>

src/routes/(main)/category/[[id]]/+page.svelte

@@ -89,7 +89,7 @@
   bind:isOpen={isCategoryRenameModalOpen}
   onbeforeclose={() => (selectedSubCategory = undefined)}
   originalName={selectedSubCategory?.name}
-  onrename={async (newName: string) => {
+  onRenameClick={async (newName: string) => {
     if (await requestCategoryRename(selectedSubCategory!, newName)) {
       info = getCategoryInfo(data.id, $masterKeyStore?.get(1)?.key!); // TODO: FIXME
       return true;

src/routes/(main)/directory/[[id]]/+page.svelte

@@ -170,7 +170,7 @@
   bind:isOpen={isDirectoryEntryRenameModalOpen}
   onbeforeclose={() => (selectedEntry = undefined)}
   originalName={selectedEntry?.name}
-  onrename={async (newName: string) => {
+  onRenameClick={async (newName: string) => {
     if (await requestDirectoryEntryRename(selectedEntry!, newName)) {
       info = getDirectoryInfo(data.id, $masterKeyStore?.get(1)?.key!); // TODO: FIXME
       return true;