open-index/open-npm huggingface dataset:
npm package: @o2-ui/react-icon
Description: [![GitHub](https://img.shields.io/badge/GitHub-o2--ui%2Freact--icon-blue)](https://github.com/o2-ui/react-icon) [![Chromatic](https://img.shields.io/badge/Chromatic-Storybook-pink)](https://www.chromatic.com/setup?appId=68a54b35549b57acb90d7795)
Author: Jeff Lee
Latest version: 0.28.0
Deprecated: This package is no longer maintained. Please use `@o2-ui/carmore-icon` instead.

# @o2-ui/react-icon

[![GitHub](https://img.shields.io/badge/GitHub-o2--ui%2Freact--icon-blue)](https://github.com/o2-ui/react-icon)
[![Chromatic](https://img.shields.io/badge/Chromatic-Storybook-pink)](https://www.chromatic.com/setup?appId=68a54b35549b57acb90d7795)

## 🌐 Overview | 개요

**English**

@o2-ui/react-icon is part of the [Carmore](https://carmore.kr/home) Design System, providing accessible and consistent icon components for modern React applications. This package emphasizes not only User Interface (UI) but the broader concept of Interface itself — designed so that browsers, assistive technologies, and even AI engines can interpret and consume information more effectively. The goal is to deliver richer, more inclusive content to every agent that interacts with the web.

**한국어**

@o2-ui/react-icon 은 [카모아](https://carmore.kr/home) 디자인시스템의 일부로, React 애플리케이션을 위한 일관되고 접근성 높은 아이콘 컴포넌트를 제공합니다. 이 패키지는 단순히 사용자 인터페이스(UI) 에 머무르지 않고, 인터페이스 본질에 집중합니다. 즉, 브라우저, 보조 기술(스크린리더 등), 나아가 AI 엔진까지 웹 문서를 읽고 해석할 수 있도록 설계되어, 모든 주체에게 더 풍부한 정보를 전달하는 것을 목표로 합니다.

---

## 🚀 Installation | 설치

```bash
# with npm
npm install @o2-ui/react-icon

# with yarn
yarn add @o2-ui/react-icon
```

---

## 📖 Features | 주요 특징

- ✅ Accessible By Design – ARIA attributes for screen readers
- ✅ Consistent Styling
- ✅ Tree Shakable
- ✅ TypeScript Ready

---

## 📜 License | 라이선스

**English**
This project is licensed under Creative Commons Attribution-NoDerivatives 4.0 International (CC BY-ND 4.0).

**한국어**
공식 라이선스 전문은 [링크](https://github.com/o2-ui/react-icon/blob/main/LICENSE) 에서 확인할 수 있습니다.

---

📌 Status | 현재 상태

> Preview Release – This package is under active development.
> API and components may change before the official stable release.
npm package: @o2designs/design-components
Description: This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Latest version: 0.1.0

# React + TypeScript + Vite

This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.

Currently, two official plugins are available:

- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Babel](https://babeljs.io/) (or [oxc](https://oxc.rs) when used in [rolldown-vite](https://vite.dev/guide/rolldown)) for Fast Refresh
- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh

## React Compiler

The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see [this documentation](https://react.dev/learn/react-compiler/installation).

## Expanding the ESLint configuration

If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:

```js
export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...

      // Remove tseslint.configs.recommended and replace with this
      tseslint.configs.recommendedTypeChecked,
      // Alternatively, use this for stricter rules
      tseslint.configs.strictTypeChecked,
      // Optionally, add this for stylistic rules
      tseslint.configs.stylisticTypeChecked,

      // Other configs...
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```

You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:

```js
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'

export default defineConfig([
  globalIgnores(['dist']),
  {
    files: ['**/*.{ts,tsx}'],
    extends: [
      // Other configs...
      // Enable lint rules for React
      reactX.configs['recommended-typescript'],
      // Enable lint rules for React DOM
      reactDom.configs.recommended,
    ],
    languageOptions: {
      parserOptions: {
        project: ['./tsconfig.node.json', './tsconfig.app.json'],
        tsconfigRootDir: import.meta.dirname,
      },
      // other options...
    },
  },
])
```