refactor: 스토리북에서 DepositToggle을 클릭시 focus가 변경되도록 수정

client/src/components/Design/components/DepositToggle/DepositToggle.stories.tsx

@@ -1,5 +1,8 @@
+/** @jsxImportSource @emotion/react */
 import type {Meta, StoryObj} from '@storybook/react';
 
+import {useEffect, useState} from 'react';
+
 import {DepositToggle} from './DepositToggle';
 
 const meta = {
@@ -20,14 +23,29 @@ const meta = {
       options: [undefined, () => alert('change toggle')],
     },
   },
-  args: {
-    isDeposit: false,
-    onToggle: () => alert('change toggle'),
-  },
 } satisfies Meta<typeof DepositToggle>;
 
 export default meta;
 
 type Story = StoryObj<typeof meta>;
 
-export const Playground: Story = {};
+export const Playground: Story = {
+  args: {
+    isDeposit: false,
+    onToggle: () => {},
+  },
+  render: ({isDeposit, onToggle, ...args}) => {
+    const [isDepositState, setIsDepositState] = useState(isDeposit);
+
+    useEffect(() => {
+      setIsDepositState(isDeposit);
+    }, [isDeposit]);
+
+    const handleToggle = () => {
+      setIsDepositState(!isDepositState);
+      onToggle();
+    };
+
+    return <DepositToggle {...args} isDeposit={isDepositState} onToggle={handleToggle} />;
+  },
+};