Gabia Icons

Gabia 서비스에서 사용하는 아이콘을 관리하고 배포하는 패키지입니다.

설치

npm install @gabia-inc/gabia-icons

사용법

React

import { ArrowLeft } from '@gabia-inc/gabia-icons/react'

<ArrowLeft size={24} />

Vue 3

<script setup>
import { ArrowLeft } from '@gabia-inc/gabia-icons/vue3'
</script>

<template>
  <ArrowLeft size="24" />
</template>

Vue 2

<script>
import { ArrowLeft } from '@gabia-inc/gabia-icons/vue2'

export default {
  components: { ArrowLeft }
}
</script>

<template>
  <ArrowLeft size="24" />
</template>

SVG

아이콘 목록은 manifest.json에서 확인할 수 있습니다.

import manifest from '@gabia-inc/gabia-icons/svg/manifest.json'
// { "arrow-left": { category: "navigation", tags: [...] }, ... }

개별 SVG 파일도 직접 참조할 수 있습니다.

import arrowLeft from '@gabia-inc/gabia-icons/svg/arrow-left.svg'

Font (아이콘 폰트)

import '@gabia-inc/gabia-icons/font/gabia-icons.css'

<i class="gbi gbi-arrow-left"></i>

컴포넌트 Props (React / Vue)

| Prop | 타입 | 기본값 | 설명 | |------|------|--------|------| | size | number \| string | — | 아이콘 크기 (px) | | color | string | currentColor | 아이콘 색상 | | title | string | — | 접근성용 SVG title |