ScIcon

ScIcon은 프로젝트 내에서 사용하는 아이콘을 컴포넌트화한 UI 요소입니다.
type, size, color, customSize를 props로 받아 SVG 또는 폰트 아이콘을 렌더링합니다.

전체 아이콘을 미리 보고 싶다면
아이콘 미리보기 페이지 보기

---

✅ 기본 사용법

<sc-icon type="check" />

※ ScIcon은 전역으로 등록되어 있으므로 import 없이 사용할 수 있습니다.

---

✨ 사용 예시 모음

▸ TODO 타입 종류 검색할수있게 리스트형식으로 제공

▸ 기본 아이콘

<sc-icon type="star" color="yellow" />
<sc-icon type="star" color="yellow" />
<sc-icon type="star" color="yellow" />

---

▸ 색상 적용

<sc-icon type="star" color="red" />
<sc-icon type="star" color="yellow" />
<sc-icon type="star" color="blue" />

---

▸ HEX 색상 사용

<sc-icon type="star" color="#f87171" />

---

▸ 크기 변경

<sc-icon type="star" size="small" />
<sc-icon type="star" size="large" />
<sc-icon type="star" :customSize="32" />

---

🛠️ 속성 (Props)

이름	타입	기본값	설명
type	string	(필수)	표시할 아이콘 이름
size	string	'medium'	'small', 'medium', 'large', 'xlarge' 중 하나
customSize	string | number	undefined	사용자 정의 크기(px 또는 문자열)
color	string	'dark-gray'	'blue', 'red', 'green', '#hex' 등 Tailwind/hex 색상값

---

📤 이벤트 (Emits)

이 컴포넌트는 별도의 이벤트를 발생시키지 않습니다.

---

🔳 슬롯 (Slots)

이 컴포넌트는 슬롯을 사용하지 않습니다.

---

🎨 스타일 클래스

클래스 이름	설명
sc-icon	아이콘의 공통 스타일 클래스
sc-icon--small	작은 아이콘 스타일
sc-icon--medium	중간 크기 아이콘 스타일
sc-icon--large	큰 아이콘 스타일
text-{color}	Tailwind 기반 색상 클래스

---

📝 기타 참고사항

• customSize가 지정되면 size보다 우선 적용됩니다.
• customSize는 숫자(px) 또는 문자열(px, em 등 CSS 단위)로 지정할 수 있습니다.
• color는 Tailwind CSS 색상 클래스 외에 HEX 코드(#f87171)도 사용 가능합니다.