feat: duration 설정 가능하도록 수정

src/stories/Base/Toast.stories.tsx

@@ -17,7 +17,11 @@ type Story = StoryObj<typeof ToastItem>;
 const NormalToast = () => {
   const toast = useToast();
   const handleButtonClick = () =>
-    toast.show({ type: 'normal', message: '토스트 메시지에요' });
+    toast.show({
+      type: 'normal',
+      message: '5초 동안 보여지는 토스트 메세지에요.',
+      duration: 5000,
+    });
 
   return <Button onClick={handleButtonClick}>토스트 띄우기</Button>;
 };

src/ui/Base/Toast/ToastProvider.tsx

@@ -1,4 +1,4 @@
-import { createContext, PropsWithChildren, useMemo, useState } from 'react';
+import { createContext, ReactNode, useMemo, useState } from 'react';
 
 import Portal from '@/ui/Base/Portal';
 
@@ -8,10 +8,6 @@ import type { ToastController, ToastOption } from './types';
 
 export const ToastContext = createContext({} as ToastController);
 
-type ToastProviderProps = {
-  duration?: number;
-};
-
 type SlideAnimation = 'slide-in' | 'slide-out' | 'slide-init';
 
 const animations = {
@@ -20,19 +16,16 @@ const animations = {
   'slide-init': 'animate-slide-init',
 } as const;
 
-const ToastProvider = ({
-  duration = 1000,
-  children,
-}: PropsWithChildren<ToastProviderProps>) => {
+const ToastProvider = ({ children }: { children?: ReactNode }) => {
   const [toast, setToast] = useState<ToastOption | null>(null);
   const [animation, setAnimation] = useState<SlideAnimation>('slide-init');
 
   const timer = useTimeout();
 
   const controller = useMemo<ToastController>(
     () => ({
-      show: ({ type, message }) => {
-        setToast({ type, message });
+      show: ({ type, message, duration = 1000 }) => {
+        setToast({ type, message, duration });
 
         setAnimation('slide-init');
         setAnimation('slide-in');
@@ -42,7 +35,7 @@ const ToastProvider = ({
         }, duration);
       },
     }),
-    [timer, duration]
+    [timer]
   );
 
   return (

src/ui/Base/Toast/types.ts

@@ -3,6 +3,7 @@ export type ToastType = 'normal' | 'success' | 'error';
 export type ToastOption = {
   type?: ToastType;
   message: string;
+  duration?: number;
 };
 
 export type ToastController = {