Hotfix/design

src/app/(auth)/login/_components/login-form.stories.tsx

@@ -6,6 +6,16 @@ import LoginForm, { LoginFormValues } from './login-form';
 const meta: Meta = {
   title: 'auth/login-form',
   component: LoginForm,
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      subtitle: '로그인시 사용되는 폼',
+      description: {
+        component:
+          '포커스 이동 또는 입력 1초 이후에 이메일 형식, 비밀번호 8자이상 유효성 검사가 실행됩니다.',
+      },
+    },
+  },
 };
 
 export default meta;

src/app/(auth)/signup/_components/signup-form.stories.tsx

@@ -6,6 +6,16 @@ import SignupForm, { SignupFormValues } from './signup-form';
 const meta: Meta = {
   title: 'auth/signup-form',
   component: SignupForm,
+  tags: ['autodocs'],
+  parameters: {
+    docs: {
+      subtitle: '회원가입시 사용되는 폼',
+      description: {
+        component:
+          '포커스 이동 또는 입력 1초 이후에 이메일 형식, 비밀번호 8자이상, 비밀번호 확인 유효성 검사가 실행됩니다.',
+      },
+    },
+  },
 };
 
 export default meta;

src/app/(crew)/_components/category/internal-category/internal-category.stories.tsx

@@ -7,16 +7,24 @@ const meta: Meta = {
   title: 'layout/category',
   component: InternalCategory,
   tags: ['autodocs'],
+  parameters: {
+    docs: {
+      subtitle: '운동 종목별 카테고리',
+      description: {
+        component: '크루찾기 페이지에서 운동 대종목 선택에 따라, 세부 카테고리를 보여줍니다.',
+      },
+    },
+  },
   argTypes: {
     category: {
-      description: '세부 카테고리 이름 배열',
+      description: '카테고리 이름 배열',
     },
   },
 };
 
 export default meta;
 
-const Template: StoryFn<InternalCategoryProps> = function InternalCategoryStory() {
+const Template: StoryFn = function InternalCategoryStory() {
   const [subCategory, setSubCategory] = useState('running');
 
   return (
@@ -28,12 +36,5 @@ const Template: StoryFn<InternalCategoryProps> = function InternalCategoryStory(
   );
 };
 
-export const Category1 = Template.bind({});
-Category1.args = {
-  category: categoryData[0].items,
-};
-
-export const Category2 = Template.bind({});
-Category2.args = {
-  category: categoryData[1].items,
-};
+export const Default = Template.bind({});
+Default.args = {};

src/app/(crew)/_components/hero/hero-crew.tsx

@@ -17,14 +17,14 @@ export default function HeroCrew() {
             <strong className="text-sm font-medium text-gray-700 md:text-base">
               함께할 사람이 없나요?
             </strong>
-            <strong className="text-2xl font-semibold text-gray-900 md:text-3.5xl">
+            <strong className="text-xl font-semibold text-gray-900 md:text-3xl">
               지금 크루에 참여해보세요.
             </strong>
           </p>
         </div>
         <Link
           href={isAuth ? '/crew/create' : `/login?redirect=${currentPath}`}
-          className="btn-filled -translate-y-1 items-center rounded-xl px-4 py-2 text-sm font-semibold md:h-11 md:text-lg md:font-bold"
+          className="btn-filled h-10 -translate-y-1 items-center rounded-xl px-4 py-2 text-base font-semibold md:h-11 md:text-lg md:font-bold"
         >
           크루 만들기
         </Link>

src/app/(crew)/crew/create/_components/create-crew-form/create-crew-form.stories.tsx

@@ -17,11 +17,27 @@ export default {
   title: 'crew/create-crew-form',
   component: CreateCrewForm,
   tags: ['autodocs'],
+  argTypes: {
+    type: {
+      control: 'radio',
+      options: ['create', 'edit'],
+      description: '폼 타입',
+      table: { type: { summary: 'create | edit' } },
+    },
+    data: {
+      control: 'object',
+      description: '폼 데이터',
+      table: { type: { summary: 'CreateCrewFormTypes' } },
+    },
+    isEdit: { control: 'boolean', description: '수정 여부' },
+    onSubmit: {
+      action: 'submit',
+      table: { type: { summary: '(data: CreateCrewFormTypes) => void' } },
+    },
+    onEdit: { action: 'edit', table: { type: { summary: '(data: CreateCrewFormTypes) => void' } } },
+  },
   parameters: {
     layout: 'fullscreen',
-    nextjs: {
-      appDirectory: true,
-    },
     docs: {
       description: {
         component: '크루 작성/수정에 사용되는 폼입니다.',

src/app/(crew)/crew/create/_components/create-crew-form/index.tsx

@@ -13,17 +13,26 @@ import DropDown from '@/src/components/common/input/drop-down';
 import FileInputWrap from '@/src/components/common/input/file-input-wrap';
 import TextInput from '@/src/components/common/input/text-input';
 import Textarea from '@/src/components/common/input/textarea';
-import { CreateCrewFormTypes, EditCrewResponseTypes } from '@/src/types/create-crew';
+import { CreateCrewFormTypes } from '@/src/types/create-crew';
 import ImgCrewSampleUrls from '@/public/assets/images/crew-sample';
 
 export interface CreateCrewFormProps {
   type: 'create' | 'edit';
-  data: CreateCrewFormTypes | EditCrewResponseTypes;
+  data: CreateCrewFormTypes;
   isEdit?: boolean;
   onEdit?: (data: CreateCrewFormTypes) => void;
   onSubmit?: (data: CreateCrewFormTypes) => void;
 }
 
+/**
+ * 크루 생성/수정 폼
+ * @param {'create' | 'edit'} type : form 타입
+ * @param {boolean} isEdit : 수정 여부
+ * @param {(data: CreateCrewFormTypes) => void} onEdit
+ * @param {(data: CreateCrewFormTypes) => void} onSubmit
+ * @param {CreateCrewFormTypes} data
+ */
+
 export default function CreateCrewForm({
   type,
   isEdit,
@@ -199,7 +208,7 @@ export default function CreateCrewForm({
                     field.onChange(value);
                     handleMainCategoryChange(value);
                   }}
-                  error={errors.mainCategory?.message}
+                  errorMsg={errors.mainCategory?.message}
                 />
               )}
             />
@@ -218,7 +227,7 @@ export default function CreateCrewForm({
                   placeholder={isEdit && field.value ? field.value : '세부 카테고리'}
                   data={categoryData[categoryIndex]?.items || []}
                   className="flex-1"
-                  error={errors.subCategory?.message}
+                  errorMsg={errors.subCategory?.message}
                 />
               )}
             />
@@ -277,7 +286,7 @@ export default function CreateCrewForm({
                     field.onChange(value);
                     handleMainLocationChange(value);
                   }}
-                  error={errors.mainLocation?.message}
+                  errorMsg={errors.mainLocation?.message}
                 />
               )}
             />
@@ -297,7 +306,7 @@ export default function CreateCrewForm({
                   placeholder={isEdit && field.value ? field.value : '시/군/구'}
                   data={regionData[regionIndex]?.areas || []}
                   className="flex-1"
-                  error={errors.subLocation?.message}
+                  errorMsg={errors.subLocation?.message}
                 />
               )}
             />

src/app/(crew)/crew/detail/[id]/_components/create-gathering/create-gathering-form/index.tsx

@@ -20,6 +20,15 @@ export interface CreateGatheringFormProps {
   onClose: () => void;
 }
 
+/**
+ * 약속 생성/수정 폼
+ * @param {CreateGatheringFormTypes} data
+ * @param {boolean} isEdit
+ * @param {(data: CreateGatheringFormTypes) => void} onEdit
+ * @param {(data: CreateGatheringFormTypes) => void} onSubmit
+ * @param {() => void} onClose
+ */
+
 export default function CreateGatheringForm({
   isEdit = false,
   onEdit = () => {},