# @autopedia/react-native-ui > A React Native UI components for React Native apps of doctor-cha services. Latest version **2.1.0** (published 2022-09-07) · 0 weekly downloads ## Install ```sh npm install @autopedia/react-native-ui pnpm add @autopedia/react-native-ui yarn add @autopedia/react-native-ui bun add @autopedia/react-native-ui ``` ## Health **Score 25/100 (F)** — status: abandoned. Positive: has types; no vulnerabilities; high quality score. Warnings: low downloads; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 2.1.0 | | Published | 2022-09-07 | | First published | 2021-07-28 | | Weekly downloads | 0 | | TypeScript types | bundled | | Module format | CommonJS | | Dependencies | 8 | | Unpacked size | 211.4 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 2 | | Maintainers | hemistone, sunghoon.moon, autopedia-development, seungsu0407, funo | ## Links - npm: https://www.npmjs.com/package/@autopedia/react-native-ui - Repository: https://github.com/Autopedia/react-native-ui - Homepage: https://github.com/Autopedia/react-native-ui#readme - Issues: https://github.com/Autopedia/react-native-ui/issues - npm.io page: https://npm.io/package/@autopedia/react-native-ui ## Dependencies (8) - [color](https://npm.io/package/color.md) ^3.1.3 - [lodash](https://npm.io/package/lodash.md) ^4.17.21 - [validate-color](https://npm.io/package/validate-color.md) ^2.1.1 - [react-hook-form](https://npm.io/package/react-hook-form.md) ^7.8.4 - [styled-components](https://npm.io/package/styled-components.md) ^5.3.0 - [react-native-fast-image](https://npm.io/package/react-native-fast-image.md) ^8.3.4 - [react-native-parsed-text](https://npm.io/package/react-native-parsed-text.md) ^0.0.22 - [react-native-linear-gradient](https://npm.io/package/react-native-linear-gradient.md) ^2.5.6 ## Recent versions - 2.1.0 (latest) — 2022-09-07 - 2.0.8 — 2022-08-03 - 2.0.7 — 2022-06-21 - 2.0.6 — 2022-06-20 - 2.0.5 — 2021-12-28 - 2.0.4 — 2021-11-30 - 2.0.3 — 2021-11-01 - 2.0.2 — 2021-10-14 - 2.0.1 — 2021-10-14 - 2.0.0 — 2021-10-13 - 1.2.11 — 2021-10-08 - 1.2.10 — 2021-10-06 - 1.2.9 — 2021-10-06 - 1.2.8 — 2021-09-30 - 1.2.7 — 2021-09-30 - … 6 more at https://npm.io/package/@autopedia/react-native-ui/versions ## README # React Native UI ![CI](https://github.com/Autopedia/react-native-ui/actions/workflows/main.yml/badge.svg) [![codecov](https://codecov.io/gh/Autopedia/react-native-ui/branch/master/graph/badge.svg?token=982D9YJDJI)](https://codecov.io/gh/Autopedia/react-native-ui) [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) 닥터차 앱을 위한 React Native UI 컴포넌트 라이브러리 입니다. ## 업데이트 - `v1.0.0` : 2021.06.21 - `v1.1.0` : 2021.06.25 - [닥터차 2.0용 UI 업데이트 (1차)](https://docs.google.com/document/d/1Kx-2GRcfI4oOF1b7yCWmUb4L9-bbQubQdiB9P4mMHt4/edit) - `v1.2.0` : 2021.07.22 - 신규 컴포넌트 구현 - [Toast](https://docs.google.com/document/d/1BHkyeh_1XXIXRqIs2dA5PEJTSHL9IWDaY9ptZpxUiEM/edit) - [LoadingDots](https://docs.google.com/document/d/1BHkyeh_1XXIXRqIs2dA5PEJTSHL9IWDaY9ptZpxUiEM/edit) - [Alert](https://docs.google.com/document/d/1VceAbGqxjaTrtVe-A6lcW3WqtcThgzPoJaV26hhxZZg/edit) - [Tooltip](https://docs.google.com/document/d/1mRcigecFJY5QoK3cPxb2KITGSNVIrSXPeeCwWLQjylQ/edit) - 기존 컴포넌트 수정 - [Button, Icon, Typography](https://docs.google.com/document/d/10oiqZ-lLql5v4gNO-X3vF-aue9uDXUeeR9nrgUnOLfw/edit#heading=h.bqfs6i8j7ud5) - [TextInput](https://docs.google.com/document/d/1YNn6NmqP2v-MbngT72wdEpkwSpAhukDiRIa2G6kQtx4/edit#) - 사용하지 않는 컴포넌트 제거 - `v1.2.1` : 2021.07.28 - import, export 구조 정리 - 코드 리팩터링 - `v1.2.2` : 2021.08.04 - [Tooltip 업데이트](https://docs.google.com/document/d/1I83eZ3mjerENqyh6B91ohNUWS2H9F_Rl8e8ZRRVa5VQ/edit) - `v1.2.3` : 2021.08.16 - [1차 QA 수정사항 반영](https://docs.google.com/document/d/1hmMIlYXe-M7M_q2eLDeJRA8iX2duu7KD-vI8jL3E14I/edit) - `v1.2.4` : 2021.08.24 - RNDebugger 관련 이슈 해결 (dependency 문제) - 사용하지 않는 아이콘 제거 - `v2.0.0` : 2021.10.13 - Markdown 업데이트 - TextInput 업데이트 - `v2.0.2` : 2021.10.14 - Markdown 링크 연결 이슈 해결 - Toast 컴포넌트 제거 - `v2.0.3` : 2021.10.14 - ProgressiveImage refresh 기능 추가 - `v2.0.4` : 2021.11.30 - ProgressiveImage source변경시 리렌더 처리 추가 - `v2.0.5` : 2021.12.28 - Tooltip color, textStyle prop 추가 - `v2.0.6` : 2022.06.20 - Markdown 업데이트(Heading, Italic, Link, Mention, Hashtag 지원) - `v2.0.7` : 2022.06.21 - lib 배포 이슈 핫픽스 - `v2.0.8` : 2022.08.03 - Markdown 업데이트(PhoneNumber 0507, 1588 번호 지원) - `v2.1.0` : 2022.09.07 - Message Atom 삭제 - NotoSans KR 폰트 삭제 (Pretendard 본 앱 반영을 위한 삭제) - 사용하지 않는 라이브러리 삭제 --- ## 사용 가이드라인 React Native UI를 사용할 프로젝트에서 설정하세요. 1. [구글 Fonts](https://fonts.google.com/specimen/Noto+Sans+KR)에서 NotoSansKR 폰트를 다운로드합니다. (우측 상단 Download family) 2. `src/assets/fonts`폴더에 다운로드한 폰트파일을 넣습니다. 3. `react-native.config.js`을 다음과 같이 설정합니다. ```javascript module.exports = { assets: ['./src/assets/fonts/'], }; ``` 4. `react-native link` 명령어를 실행합니다. --- ## 개발 가이드라인 이 가이드라인은 당신이 React Native 개발 환경을 정상적으로 구동시킬 수 있다고 가정합니다. 총 3개의 터미널 탭이 필요합니다. 첫번째 탭에 하단의 명령어를 실행하세요. ```bash git clone https://github.com/Autopedia/react-native-ui.git cd react-native-ui yarn install npx react-native link cd ios npx pod-install cd .. yarn storybook ``` 성공적으로 실행되었다면, 브라우저에 storybook UI가 열립니다. 두번째 탭에 다음과 같이 명령어를 실행하세요. ```bash yarn start ``` 해당 명령어는 React Native metro 서버를 실행합니다. 마지막 탭에 다음과 같이 명령어를 실행하세요. ```bash yarn ios #IOS yarn android #Android ``` 이 명령어는 프로젝트를 빌드하여 시뮬레이터에 storybook UI를 실행합니다. --- ## 테스트 가이드라인 모든 테스트 코드를 실행하려면, ```bash yarn test ``` 특정한 테스트 코드를 실행하려면, ```bash yarn test path/to/test/file ``` 테스트 스냅샷을 업데이트 하려면, ```bash yarn test -u ``` 코드 커버리지를 보려면, ```bash yarn test --coverage ``` --- ## 규칙 - master/develop 브랜치에 직접 커밋 금지. 반드시 다른 브랜치에 작업하시고 PR을 만들어주세요. - 반드시 개발 후에 테스트 해주세요. 테스트 코드를 업데이트하지 않는 한, 모든 테스트를 통과해야합니다. - 코드 커버리지는 반드시 이전 이상이어야 합니다. 불가피한 경우가 생겼을 경우, PR에 기술해주세요. - 만일 테스트 코드를 업데이트 했다면 어떤 테스트를 수정했는지, 왜 수정했는지를 PR에 기술해주세요. --- _Source: https://npm.io/package/@autopedia/react-native-ui · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._