From b6edc2a8bcbeeafe5a0a2385a0348cd4da875a07 Mon Sep 17 00:00:00 2001
From: static <kmc7468@naver.com>
Date: Tue, 28 Jan 2025 22:41:35 +0900
Subject: [PATCH] =?UTF-8?q?=EB=A0=88=EC=9D=B4=EC=95=84=EC=9B=83=EC=97=90?=
 =?UTF-8?q?=20=ED=95=84=EC=88=98=EC=A0=81=EC=9D=B8=20Snippet=EC=9D=80=20?=
 =?UTF-8?q?=EB=B0=98=EB=93=9C=EC=8B=9C=20=EC=A0=84=EB=8B=AC=ED=95=B4?=
 =?UTF-8?q?=EC=95=BC=ED=95=98=EB=8F=84=EB=A1=9D=20Props=20=ED=83=80?=
 =?UTF-8?q?=EC=9E=85=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/lib/components/atoms/BottomSheet.svelte          |  4 ++--
 src/lib/components/atoms/Modal.svelte                |  4 ++--
 .../atoms/buttons/ActionEntryButton.svelte           |  6 +++---
 src/lib/components/atoms/buttons/Button.svelte       |  4 ++--
 src/lib/components/atoms/buttons/EntryButton.svelte  | 12 +++++-------
 src/lib/components/atoms/buttons/TextButton.svelte   |  4 ++--
 src/lib/components/atoms/divs/AdaptiveDiv.svelte     |  4 ++--
 src/lib/components/atoms/divs/BottomDiv.svelte       |  4 ++--
 src/lib/components/atoms/divs/FullscreenDiv.svelte   |  2 +-
 src/lib/components/atoms/inputs/CheckBox.svelte      |  6 ++----
 src/lib/components/molecules/ActionModal.svelte      |  4 ++--
 src/lib/components/molecules/IconEntryButton.svelte  |  4 ++--
 src/lib/components/molecules/TitledDiv.svelte        |  4 ++--
 src/lib/components/molecules/TopBar.svelte           |  2 +-
 src/lib/components/molecules/labels/IconLabel.svelte |  4 ++--
 .../components/molecules/labels/TitleLabel.svelte    |  4 ++--
 src/routes/(main)/menu/MenuEntryButton.svelte        |  2 +-
 17 files changed, 35 insertions(+), 39 deletions(-)

diff --git a/src/lib/components/atoms/BottomSheet.svelte b/src/lib/components/atoms/BottomSheet.svelte
index f23acae..ac6042c 100644
--- a/src/lib/components/atoms/BottomSheet.svelte
+++ b/src/lib/components/atoms/BottomSheet.svelte
@@ -5,7 +5,7 @@
   import { AdaptiveDiv } from "$lib/components/atoms";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     isOpen: boolean;
     onclose?: () => void;
@@ -33,7 +33,7 @@
           transition:fly|global={{ y: 100, duration: 200 }}
         >
           <div class={["flex-grow overflow-y-auto", className]}>
-            {@render children?.()}
+            {@render children()}
           </div>
         </div>
       </AdaptiveDiv>
diff --git a/src/lib/components/atoms/Modal.svelte b/src/lib/components/atoms/Modal.svelte
index c949ec9..0864477 100644
--- a/src/lib/components/atoms/Modal.svelte
+++ b/src/lib/components/atoms/Modal.svelte
@@ -5,7 +5,7 @@
   import { AdaptiveDiv } from "$lib/components/atoms";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     isOpen: boolean;
     onclose?: () => void;
@@ -25,7 +25,7 @@
     <AdaptiveDiv class="h-full">
       <div class="flex h-full items-center justify-center px-4">
         <div onclick={(e) => e.stopPropagation()} class={["rounded-2xl bg-white p-4", className]}>
-          {@render children?.()}
+          {@render children()}
         </div>
       </div>
     </AdaptiveDiv>
diff --git a/src/lib/components/atoms/buttons/ActionEntryButton.svelte b/src/lib/components/atoms/buttons/ActionEntryButton.svelte
index a52cd1d..c29fd7f 100644
--- a/src/lib/components/atoms/buttons/ActionEntryButton.svelte
+++ b/src/lib/components/atoms/buttons/ActionEntryButton.svelte
@@ -5,7 +5,7 @@
   interface Props {
     actionButtonClass?: ClassValue;
     actionButtonIcon?: Component<SvelteHTMLElements["svg"]>;
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     onActionButtonClick?: () => void;
     onclick?: () => void;
@@ -28,9 +28,9 @@
   onclick={onclick && (() => setTimeout(onclick, 100))}
   class={["rounded-xl", className]}
 >
-  <div id="children" class="flex h-full items-center justify-between gap-x-4 p-2 transition">
+  <div id="children" class="flex h-full items-center gap-x-4 p-2 transition">
     <div class="flex-grow overflow-x-hidden">
-      {@render children?.()}
+      {@render children()}
     </div>
     {#if ActionButtonIcon}
       <button
diff --git a/src/lib/components/atoms/buttons/Button.svelte b/src/lib/components/atoms/buttons/Button.svelte
index 2ec8d98..7b5fb1e 100644
--- a/src/lib/components/atoms/buttons/Button.svelte
+++ b/src/lib/components/atoms/buttons/Button.svelte
@@ -3,7 +3,7 @@
   import type { ClassValue } from "svelte/elements";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     color?: "primary" | "gray";
     onclick?: () => void;
@@ -34,5 +34,5 @@
     className,
   ]}
 >
-  {@render children?.()}
+  {@render children()}
 </button>
diff --git a/src/lib/components/atoms/buttons/EntryButton.svelte b/src/lib/components/atoms/buttons/EntryButton.svelte
index 63926cc..dc2534e 100644
--- a/src/lib/components/atoms/buttons/EntryButton.svelte
+++ b/src/lib/components/atoms/buttons/EntryButton.svelte
@@ -5,7 +5,7 @@
   import IconChevronRight from "~icons/material-symbols/chevron-right";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     onclick?: () => void;
   }
@@ -17,12 +17,10 @@
   onclick={onclick && (() => setTimeout(onclick, 100))}
   class={["rounded-xl active:bg-gray-100", className]}
 >
-  <div class="flex h-full gap-x-4 p-2 transition active:scale-95">
-    <div class="h-full flex-grow">
-      {@render children?.()}
-    </div>
-    <div class="flex flex-shrink-0 items-center">
-      <IconChevronRight class="text-xl text-gray-800" />
+  <div class="flex h-full items-center gap-x-4 p-2 transition active:scale-95">
+    <div class="flex-grow">
+      {@render children()}
     </div>
+    <IconChevronRight class="flex-shrink-0 text-xl text-gray-800" />
   </div>
 </button>
diff --git a/src/lib/components/atoms/buttons/TextButton.svelte b/src/lib/components/atoms/buttons/TextButton.svelte
index 10f9e0c..84603e2 100644
--- a/src/lib/components/atoms/buttons/TextButton.svelte
+++ b/src/lib/components/atoms/buttons/TextButton.svelte
@@ -2,7 +2,7 @@
   import type { Snippet } from "svelte";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     onclick?: () => void;
   }
 
@@ -14,6 +14,6 @@
   class="text-sm font-medium text-gray-800 underline underline-offset-2 active:rounded-xl active:bg-gray-100"
 >
   <div class="h-full p-1 transition active:scale-95">
-    {@render children?.()}
+    {@render children()}
   </div>
 </button>
diff --git a/src/lib/components/atoms/divs/AdaptiveDiv.svelte b/src/lib/components/atoms/divs/AdaptiveDiv.svelte
index c723a55..23fa00b 100644
--- a/src/lib/components/atoms/divs/AdaptiveDiv.svelte
+++ b/src/lib/components/atoms/divs/AdaptiveDiv.svelte
@@ -3,7 +3,7 @@
   import type { ClassValue } from "svelte/elements";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
   }
 
@@ -11,5 +11,5 @@
 </script>
 
 <div class={["mx-auto max-w-screen-md", className]}>
-  {@render children?.()}
+  {@render children()}
 </div>
diff --git a/src/lib/components/atoms/divs/BottomDiv.svelte b/src/lib/components/atoms/divs/BottomDiv.svelte
index 5db0dd0..e28765b 100644
--- a/src/lib/components/atoms/divs/BottomDiv.svelte
+++ b/src/lib/components/atoms/divs/BottomDiv.svelte
@@ -3,7 +3,7 @@
   import type { ClassValue } from "svelte/elements";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
   }
 
@@ -11,5 +11,5 @@
 </script>
 
 <div class={["sticky bottom-0 bg-white pb-4", className]}>
-  {@render children?.()}
+  {@render children()}
 </div>
diff --git a/src/lib/components/atoms/divs/FullscreenDiv.svelte b/src/lib/components/atoms/divs/FullscreenDiv.svelte
index cdea8cc..c90e02c 100644
--- a/src/lib/components/atoms/divs/FullscreenDiv.svelte
+++ b/src/lib/components/atoms/divs/FullscreenDiv.svelte
@@ -3,5 +3,5 @@
 </script>
 
 <div class="flex flex-grow flex-col justify-between px-4">
-  {@render children?.()}
+  {@render children()}
 </div>
diff --git a/src/lib/components/atoms/inputs/CheckBox.svelte b/src/lib/components/atoms/inputs/CheckBox.svelte
index 753892f..fe2899b 100644
--- a/src/lib/components/atoms/inputs/CheckBox.svelte
+++ b/src/lib/components/atoms/inputs/CheckBox.svelte
@@ -6,7 +6,7 @@
 
   interface Props {
     checked?: boolean;
-    children?: Snippet;
+    children: Snippet;
   }
 
   let { checked = $bindable(false), children }: Props = $props();
@@ -14,9 +14,7 @@
 
 <label class="flex items-center gap-x-1">
   <input bind:checked type="checkbox" class="hidden" />
-  <div>
-    {@render children?.()}
-  </div>
+  {@render children()}
   {#if checked}
     <IconCheckCircle class="text-primary-600" />
   {:else}
diff --git a/src/lib/components/molecules/ActionModal.svelte b/src/lib/components/molecules/ActionModal.svelte
index 058d572..a351403 100644
--- a/src/lib/components/molecules/ActionModal.svelte
+++ b/src/lib/components/molecules/ActionModal.svelte
@@ -8,7 +8,7 @@
 
   interface Props {
     cancelText?: string;
-    children?: Snippet;
+    children: Snippet;
     confirmText: string;
     isOpen: boolean;
     onbeforeclose?: () => void;
@@ -41,7 +41,7 @@
 <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?.()}
+    {@render children()}
   </div>
   <div class="flex gap-x-2">
     <Button color="gray" onclick={closeModal} class="flex-1">{cancelText}</Button>
diff --git a/src/lib/components/molecules/IconEntryButton.svelte b/src/lib/components/molecules/IconEntryButton.svelte
index cb9ec72..4b6ad47 100644
--- a/src/lib/components/molecules/IconEntryButton.svelte
+++ b/src/lib/components/molecules/IconEntryButton.svelte
@@ -5,7 +5,7 @@
   import { IconLabel } from "$lib/components/molecules";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     icon: Component<SvelteHTMLElements["svg"]>;
     iconClass?: ClassValue;
@@ -25,6 +25,6 @@
 
 <EntryButton {onclick} class={className}>
   <IconLabel {icon} class="h-full" iconClass={iconClassName} textClass={textClassName}>
-    {@render children?.()}
+    {@render children()}
   </IconLabel>
 </EntryButton>
diff --git a/src/lib/components/molecules/TitledDiv.svelte b/src/lib/components/molecules/TitledDiv.svelte
index 2240a89..e7ddc25 100644
--- a/src/lib/components/molecules/TitledDiv.svelte
+++ b/src/lib/components/molecules/TitledDiv.svelte
@@ -9,7 +9,7 @@
     class?: ClassValue;
     description?: Snippet;
     icon?: Component<SvelteHTMLElements["svg"]>;
-    title?: Snippet;
+    title: Snippet;
     titleClass?: ClassValue;
   }
 
@@ -27,7 +27,7 @@
 <div class={["space-y-4 py-4", className]}>
   <div class="space-y-2 break-keep">
     <TitleLabel {icon} textClass={titleClassName}>
-      {@render title?.()}
+      {@render title()}
     </TitleLabel>
     {#if description}
       <p>
diff --git a/src/lib/components/molecules/TopBar.svelte b/src/lib/components/molecules/TopBar.svelte
index e748b6c..cf7f8b8 100644
--- a/src/lib/components/molecules/TopBar.svelte
+++ b/src/lib/components/molecules/TopBar.svelte
@@ -31,7 +31,7 @@
   {/if}
   <div class="w-[2.3rem] flex-shrink-0">
     {#if children}
-      {@render children?.()}
+      {@render children()}
     {/if}
   </div>
 </div>
diff --git a/src/lib/components/molecules/labels/IconLabel.svelte b/src/lib/components/molecules/labels/IconLabel.svelte
index 7e100c4..a173b68 100644
--- a/src/lib/components/molecules/labels/IconLabel.svelte
+++ b/src/lib/components/molecules/labels/IconLabel.svelte
@@ -3,7 +3,7 @@
   import type { ClassValue, SvelteHTMLElements } from "svelte/elements";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     icon: Component<SvelteHTMLElements["svg"]>;
     iconClass?: ClassValue;
@@ -27,7 +27,7 @@
   </div>
   <div class="flex flex-grow flex-col overflow-x-hidden text-left">
     <p class={["truncate font-medium", textClassName]}>
-      {@render children?.()}
+      {@render children()}
     </p>
     {#if subtext}
       <p class="truncate text-xs text-gray-800">
diff --git a/src/lib/components/molecules/labels/TitleLabel.svelte b/src/lib/components/molecules/labels/TitleLabel.svelte
index d2ecf72..ffb51c3 100644
--- a/src/lib/components/molecules/labels/TitleLabel.svelte
+++ b/src/lib/components/molecules/labels/TitleLabel.svelte
@@ -3,7 +3,7 @@
   import type { ClassValue, SvelteHTMLElements } from "svelte/elements";
 
   interface Props {
-    children?: Snippet;
+    children: Snippet;
     class?: ClassValue;
     icon?: Component<SvelteHTMLElements["svg"]>;
     textClass?: ClassValue;
@@ -19,6 +19,6 @@
     {/if}
   </div>
   <p class={["text-3xl font-bold", textClassName]}>
-    {@render children?.()}
+    {@render children()}
   </p>
 </div>
diff --git a/src/routes/(main)/menu/MenuEntryButton.svelte b/src/routes/(main)/menu/MenuEntryButton.svelte
index e96fd2e..84341e6 100644
--- a/src/routes/(main)/menu/MenuEntryButton.svelte
+++ b/src/routes/(main)/menu/MenuEntryButton.svelte
@@ -19,5 +19,5 @@
   class="w-full"
   iconClass={["rounded-lg bg-gray-200 p-1 !text-base", iconColor]}
 >
-  {@render children?.()}
+  {@render children()}
 </IconEntryButton>