feat: Playground에 ChatInput 예시 추가

Author: YeBeenChoi

src/pages/playground.tsx

@@ -1,6 +1,7 @@
 import { BannerCard } from '@shared/ui/BannerCard/BannerCard';
 import { Button } from '@shared/ui/Button/Button';
 import { Card } from '@shared/ui/Card/Card';
+import { ChatInput } from '@shared/ui/ChatInput';
 import { Checkbox } from '@shared/ui/Checkbox/Checkbox';
 import { Header } from '@shared/ui/Header/Header';
 import { Modal } from '@shared/ui/Modal/Modal';
@@ -13,6 +14,7 @@ import { useState } from 'react';
 export default function Playground() {
   const [radioValue, setRadioValue] = useState('option1');
   const [isModalOpen, setIsModalOpen] = useState(false);
+  const [chatMessage, setChatMessage] = useState('');
 
   return (
     <div className="flex flex-col gap-6 p-8">
@@ -121,6 +123,16 @@ export default function Playground() {
         <h2 className="typo-body-1">SearchBar</h2>
         <SearchBar placeholder="어떤 제품을 찾으시나요?" onSearch={() => {}} />
       </section>
+      {/* Chat Input */}
+      <section className="flex flex-col gap-4">
+        <h2 className="typo-body-1">ChatInput</h2>
+        <ChatInput
+          placeholder="무슨 견적을 원하시나요?"
+          value={chatMessage}
+          onChange={setChatMessage}
+          onSend={() => {}}
+        />
+      </section>
       {/* BannerCard */}
       <section className="flex flex-col gap-4">
         <h2 className="typo-body-1">Banner Card</h2>