Storybook documentation/#110

[gahyuun]

📌 작업 내용

close #110

구현 내용 및 작업 했던 내역

• view component 문서화

🤔 고민 했던 부분

• 아래 구조대로 문서화를 진행했습니다

const meta = {
  title: 'ui/view/', // 스토리북 제목 및 위치 설정
  component:, // 컴포넌트 
  tags: ['autodocs'], // documentation 생성 
  parameters: {
    componentSubtitle:, // component의 서브 제목으로 네이밍만 봤을 때 역할 유추가 쉽지 않은 컴포넌트들에만 추가를 했습니다 ( ex. label-container)
    description:{
     component:  // 부가적인 설명이 필요할 때 사용했습니다. (ex molecule component의 하위 컴포넌트 소개 )
   }
  },
  argTypes: {
    label: {
      description: // 매개변수들의 역할을 간단하게 소개했습니다 
    },
 variant: {
      description:,
      table: {
        type: { summary: 'ButtonVariant' },
        defaultValue: { summary: 'primary' },
      },
      options: ['primary', 'secondary', 'text', 'list', 'outlined'],
      control: {
        type: 'radio',
      }, // 버튼의 variant 속성처럼 사용자가 control 하면서 UI가 바뀌는 걸 확인하면 좋을 것 같은 속성들은 control 할 수 있게 구현했습니다
    },
  },
} satisfies Meta<typeof >;

export default meta

• 위 속성들이 모두 적용된게 grid story 입니다 모든 story를 확인하기 어렵다면 grid story를 보시면 좋을 것 같네요!
• shadcn 코드로만 구성된 컴포넌트들은 ( ex. sheet, alert, toast 등등.. ) 따로 storybook을 만들지 않았습니다.

[github-actions]

🚀storybook: https://65ccb85d5afe55a024495bc0-ytziayjsst.chromatic.com/

[yougyung]

수고하셨습니다. 혹시 PR을 작성하면서 참고한 자료가 있나요? 있다면 공유부탁드립니다 !

[gahyuun]

수고하셨습니다. 혹시 PR을 작성하면서 참고한 자료가 있나요? 있다면 공유부탁드립니다 !

참고한 자료는 스토리북 공식 문서랑 과거 제 코드 밖에 없습니다..!

[seonghunYang]

• 엄청 많네요. 정말 수고 많으셨습니다. 고맙습니다.

[seonghunYang]

• 요 table이란 속성은 뭔지 설명 해주실 수 있을까요?

[gahyuun]

table이 어떤 역할을 하기 보단 단순히 스펙이어서 defaultValue , control 등 속성을 사용하기 위해서 table을 썼습니다!

table?: {
      category?: string;
      defaultValue?: { summary: string; detail?: string };
      disable?: boolean;
      subcategory?: string;
      type?: { summary?: string; detail?: string };
    },