Releases: DaleStudy/daleui
v1.0.0
🎉 달레 UI v1.0.0 첫 메이저 릴리즈
달레 UI v1.0이 나왔습니다.
달레 UI는 한국어 사용자를 위한 React 디자인 시스템입니다. 한국어 본문이 어색해 보이지 않게 타이포그래피를 다듬었고 접근성은 처음부터 기본으로 챙겼습니다. 무엇보다 디자이너와 개발자가 같은 시스템 위에서 함께 일할 수 있게 만드는 데 신경을 썼고요.
이번 v1.0은 그동안 19분이 함께 만들어 온 컴포넌트와 토큰, 문서와 테스트를 안정 버전으로 묶은 결과입니다. 이제 React 프로젝트에서 편하게 가져다 쓰실 수 있습니다. 🚀
🚀 빠른 시작
원하는 패키지 매니저로 설치하세요.
# Bun
bun add daleui pretendard @fontsource-variable/jetbrains-mono
# npm
npm install daleui pretendard @fontsource-variable/jetbrains-mono
# pnpm
pnpm add daleui pretendard @fontsource-variable/jetbrains-mono
# Yarn
yarn add daleui pretendard @fontsource-variable/jetbrains-mono앱 진입점(main.tsx, App.tsx 등)에서 스타일을 한 줄로 불러오면 끝입니다.
import "daleui/styles.css";이제 컴포넌트를 가져와서 바로 사용해 보세요.
import { Button, TextInput } from "daleui";
export default function App() {
return (
<>
<TextInput placeholder="이름을 입력해 주세요" />
<Button size="md" tone="brand" variant="solid">
시작하기
</Button>
</>
);
}💎 핵심 가치
1. 한국어 사용자 중심 설계
기본 폰트로 Pretendard Variable을 썼고 자간과 행간도 한글에 맞게 다듬었습니다. 영어권 디자인 시스템을 그대로 가져다 쓸 때 흔히 마주치는 "한국어만 좀 어색한" 문제를 처음부터 줄이고 싶었거든요.
2. 신뢰할 수 있는 시스템
Ark UI 헤드리스 컴포넌트 위에서 동작하기 때문에 WAI-ARIA 속성과 키보드 인터랙션이 자동으로 따라옵니다. 테스트 커버리지는 90%를 넘고, axe-playwright로 접근성 검사도 CI에서 매번 자동으로 돌아갑니다.
3. 커뮤니티 중심 발전
19분이 코드와 디자인, 문서와 블로그, 프로젝트 관리까지 각자 잘하는 부분을 맡아 v1.0을 함께 만들었습니다. All Contributors 관례에 따라 어떤 형태의 기여든 같은 무게로 봅니다. 새로운 분이 합류하셔도 언제든 환영입니다.
🧩 컴포넌트 카탈로그 (총 19종)
v1.0에 포함된 컴포넌트 전체입니다. Storybook에서 직접 만져보실 수 있어요.
기본 (7)
| 컴포넌트 | 용도 |
|---|---|
Button |
액션 트리거. solid / outline / ghost 변형, brand / neutral / danger 톤 지원 |
Link |
페이지 이동 및 외부 링크 |
Text |
본문 텍스트. 사이즈, 굵기, 색상 토큰 통합 |
Heading |
의미 있는 제목. 시맨틱 레벨(h1~h6) 강제 |
Icon |
Lucide React 아이콘 래퍼. 토큰 기반 크기, 색상 |
Label |
폼 필드 라벨 |
Tag |
카테고리, 상태, 메타정보 표시 |
양식 (6)
| 컴포넌트 | 용도 |
|---|---|
TextInput |
한 줄 텍스트 입력. 선행·후행 아이콘 슬롯 |
PasswordInput |
비밀번호 입력. 표시 토글 내장 |
Checkbox |
단일 체크박스. Ark UI 기반 |
CheckboxGroup |
다중 선택 그룹. 부분 체크 상태 지원 |
RadioGroup |
라디오 버튼 그룹. 키보드 탐색 내장 |
Select |
드롭다운 선택. 검색 가능한 옵션 |
레이아웃 (5)
| 컴포넌트 | 용도 |
|---|---|
Box |
가장 기본적인 컨테이너 |
Flex |
Flexbox 레이아웃 헬퍼 |
Grid |
CSS Grid 레이아웃 (GridItem 포함) |
HStack |
수평 스택. 자동 간격 |
VStack |
수직 스택. 자동 간격 |
복합 (1)
| 컴포넌트 | 용도 |
|---|---|
Card |
카드 UI. CardRoot, CardBody, CardTitle, CardDescription, CardIcon, CardLink 6종 서브 컴포넌트 조합 |
폼 필드는 FieldProps 공통 인터페이스로 label, helperText, error, disabled, required 같은 속성이 통일되어 있어 한 번 익히면 모든 입력 컴포넌트에서 동일한 방식으로 쓸 수 있습니다.
🎨 디자인 토큰 시스템
스타일에 관한 결정을 매번 반복하지 않도록 시각 속성을 모두 토큰으로 정의해 두었습니다.
- 시맨틱 컬러 6톤:
brand,neutral,danger,success,warning,info - 라이트/다크 자동 전환: Radix Color 기반 3~12단계 스케일을 양쪽 모드에 맞춰 매핑
- 타이포그래피: Pretendard Variable(본문) + JetBrains Mono(코드).
textStyle토큰으로 한 번에 적용 - 간격(spacing), 라운딩(radii), 테두리(borders): 일관된 스케일로 디자인 결정 부담 최소화
- 아이콘: Iconography 토큰으로 크기와 색상이 컴포넌트 토큰과 자동 동기화
Panda CSS 위에서 동작해서 런타임 비용 없이 정적 CSS로 빌드됩니다. TypeScript 타입이 토큰 키까지 자동완성해 주는 점도 같이 챙기실 만합니다.
♿ 접근성 (Accessibility)
접근성은 나중에 덧붙이는 게 아니라 처음부터 기본으로 들어가 있어야 한다고 생각합니다.
- Ark UI 헤드리스 기반: 모든 인터랙티브 컴포넌트가 ARIA 속성과 키보드 탐색을 자동 처리
- 시맨틱 강제:
Heading컴포넌트는 잘못된 레벨 사용 시 콘솔 경고로 안내 - 자동 감사: axe-playwright로 모든 스토리에 접근성 검사 통합. CI에서 회귀 자동 감지
- 사용자 상호작용 기반 테스트: Testing Library 패턴으로 "보이는 것"이 아니라 "쓰는 것"을 테스트
🛠️ 개발자 경험 (DX)
매일 쓰는 도구라면 작업하는 시간이 즐거워야지요.
- React 19 지원
- TypeScript 5 완전 지원. props 타입과 토큰 키까지 자동완성
- Storybook 10 + Chromatic: 모든 변형을 시각적으로 확인하고, PR마다 비주얼 회귀를 자동 감지
- Vitest + Testing Library: 빠른 단위 테스트와 90%+ 커버리지
- ESLint + Prettier: 일관된 코드 스타일을 자동으로 유지
- ESM 빌드 + Tree-shaking: 사용한 컴포넌트만 번들에 포함
🙏 기여해 주신 분들
이번 릴리즈는 다음 19분의 손과 마음이 모여서 완성되었습니다. 코드뿐 아니라 디자인과 문서, 블로그, 프로젝트 관리까지 어떤 형태의 기여든 모두 같은 무게로 감사드립니다.
- Dale Seo (@DaleSeo) · 코드, 문서
- Helena Park (@yolophg) · 코드, 문서
- hyoseong (@hyoseong1994) · 블로그, 코드, 문서
- 오예림 Ria Oh (@RiaOh) · 코드, 문서
- seunghyun (@sseung30) · 디자인, 문서
- Jahye (@jj5u) · 디자인, 문서
- Yunsup Sim 심윤섭 (@SimYunSup) · 코드, 문서
- Evan Suhyeong Lee (@sounmind) · 블로그, 코드, 문서
- 최진욱 (@JJinuk) · 프로젝트 관리
- Hansaem.so (@Hecklebot) · 코드, 문서
- 서진혁 Aka (@HowToBeAHappyBoy) · 코드, 문서
- 유은지 (@y00eunji) · 코드, 문서
- Tasha 살미 (@Lustellz) · 코드, 문서
- mkang (@boldkang) · 블로그, 디자인
- 이선재 (@Sunjae95) · 블로그, 코드, 문서
- Sehwan (@nhistory) · 블로그, 코드, 문서
- BK LEE (@bkidea) · 디자인
- graycrisp (@graycrisp) · 디자인
- Lyla (Minju) Park (@lylaminju) · 코드
이분들이 없었다면 v1.0도 없었습니다. 진심으로 감사드립니다. 💝
🔗 다음 단계와 더 알아보기
- 📖 Storybook: https://main--675790d317ba346348aa3490.chromatic.com
- 📚 Wiki: https://github.com/DaleStudy/daleui/wiki
- 🎨 Figma UI Kit: https://www.figma.com/community/file/1559487636467651573
- 💖 GitHub Sponsors: https://github.com/sponsors/DaleStudy
v1.0이 끝이 아니라 시작입니다. 새 컴포넌트 제안이나 버그 리포트, 디자인 피드백, 문서 개선까지 무엇이든 편하게 알려주세요. 저장소에 ⭐를 눌러 주시면 더 많은 분들이 달레 UI를 알게 됩니다.
Full Changelog: v0.1.2...v1.0.0
v0.1.2
What's Changed
- build(deps-dev): bump @vitejs/plugin-react from 5.1.4 to 5.2.0 by @dependabot[bot] in #973
- build(deps-dev): bump @pandacss/dev from 1.8.2 to 1.9.0 by @dependabot[bot] in #971
- 개정된 미션, 핵심 가치를 문서와 웹사이트에 반영 by @DaleSeo in #968
- build(deps-dev): bump the react group across 1 directory with 2 updates by @dependabot[bot] in #969
- build(deps-dev): bump the vite group across 1 directory with 3 updates by @dependabot[bot] in #970
- build(deps-dev): bump globals from 17.0.0 to 17.4.0 by @dependabot[bot] in #972
- 모든 컴포넌트 ref 전달 지원 by @SimYunSup in #951
- CDN import방식을 local npm 설치 방식으로 변경 by @SimYunSup in #974
- Layout padding prop 지원 by @RiaOh in #954
- build(deps): bump actions/upload-pages-artifact from 4 to 5 in /.github/workflows by @dependabot[bot] in #989
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #990
- build(deps-dev): bump happy-dom from 20.8.3 to 20.8.9 by @dependabot[bot] in #993
- build(deps-dev): bump @pandacss/dev from 1.9.0 to 1.9.1 by @dependabot[bot] in #992
- build(deps-dev): bump the vite group across 1 directory with 2 updates by @dependabot[bot] in #991
- build(deps-dev): bump @chromatic-com/storybook from 4.1.3 to 5.0.0 by @dependabot[bot] in #994
- Checkbox label Prop type ReactNode -> string으로 변경 by @hyoseong1994 in #988
- Input 등 요소 HelpText 및 Error 구조 개선 by @hyoseong1994 in #957
- release: v0.1.2 by @github-actions[bot] in #997
Full Changelog: v0.1.1...v0.1.2
v0.1.1
What's Changed
- Grid 컴포넌트가 메인 진입점에서 export되지 않음 by @DaleSeo in #945
- RSC 지원을 위해 Card 컴포넌트 named-export 추가 by @SimYunSup in #910
- build(deps-dev): bump globals from 16.5.0 to 17.0.0 by @dependabot[bot] in #949
- build(deps): bump @ark-ui/react from 5.34.0 to 5.34.1 by @dependabot[bot] in #948
- build(deps-dev): bump happy-dom from 20.7.2 to 20.8.3 by @dependabot[bot] in #947
- build(deps): bump lucide-react from 0.575.0 to 0.577.0 by @dependabot[bot] in #946
- 불필요한 스토리 제거 by @hyoseong1994 in #922
- chore: add source map files to gitignore by @DaleSeo in #950
- story docs 양식 통일 by @hyoseong1994 in #952
- codecov threshold 조정 by @hyoseong1994 in #955
- release: v0.1.1 by @github-actions[bot] in #961
Full Changelog: v0.1.0...v0.1.1
v0.1.0
What's Changed
- input 종류의 컴포넌트에서 Uncontrolled, controlled 기능 일관성 있게 제공할 수 있도록 검토 by @RiaOh in #783
- package.json에 sideEffects: false 설정 추가 by @DaleSeo in #893
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #903
- build(deps-dev): bump @eslint/js from 9.39.3 to 9.39.4 by @dependabot[bot] in #907
- build(deps-dev): bump eslint-plugin-react-refresh from 0.5.0 to 0.5.2 by @dependabot[bot] in #906
- build(deps-dev): bump typescript-eslint from 8.53.0 to 8.55.0 by @dependabot[bot] in #905
- build(deps-dev): bump eslint from 9.39.3 to 9.39.4 by @dependabot[bot] in #904
- PasswordInput Safari UI 깨짐 이슈 by @hyoseong1994 in #908
- Card Component 문서화 검토 by @hyoseong1994 in #878
- Label 컴포넌트 문서화 검토 by @SimYunSup in #889
- 버튼 내 아이콘 주입 방식 변경 by @SimYunSup in #867
- build(deps): bump lucide-react from 0.563.0 to 0.575.0 by @dependabot[bot] in #915
- build(deps-dev): bump happy-dom from 20.5.5 to 20.7.0 by @dependabot[bot] in #914
- build(deps-dev): bump typescript-eslint from 8.55.0 to 8.56.0 by @dependabot[bot] in #913
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #911
- build(deps-dev): bump eslint-plugin-testing-library from 7.15.4 to 7.16.0 by @dependabot[bot] in #912
- 한샘님 하차 업데이트 by @DaleSeo in #917
- RadioGroup Figma 디자인 불일치 수정 by @sounmind in #894
- build(deps): bump codecov/codecov-action from 5 to 6 in /.github/workflows by @dependabot[bot] in #924
- build(deps): bump actions/configure-pages from 4 to 6 in /.github/workflows by @dependabot[bot] in #925
- build(deps): bump actions/deploy-pages from 4 to 5 in /.github/workflows by @dependabot[bot] in #926
- build(deps-dev): bump typescript-eslint from 8.56.0 to 8.56.1 by @dependabot[bot] in #928
- build(deps-dev): bump @storybook/addon-designs from 11.1.2 to 11.1.3 in the storybook group by @dependabot[bot] in #927
- build(deps-dev): bump eslint-plugin-testing-library from 7.16.0 to 7.16.2 by @dependabot[bot] in #929
- build(deps-dev): bump happy-dom from 20.7.0 to 20.7.2 by @dependabot[bot] in #930
- build(deps): bump @ark-ui/react from 5.31.0 to 5.34.0 by @dependabot[bot] in #931
- VStack 교차축(가로) 정렬 고정값 제거 by @hyoseong1994 in #921
- 폼 필드 컴포넌트 공통 인터페이스 추가 by @DaleSeo in #936
- release: v0.1.0 by @github-actions[bot] in #940
Full Changelog: v0.0.10...v0.1.0
v0.0.10
v0.0.9
What's Changed
- Grid 컴포넌트 Description 간소화 by @Hecklebot in #887
- npm trusted publishing 이슈 조치 by @DaleSeo in #896
- release: v0.0.9 by @github-actions[bot] in #897
Full Changelog: v0.0.8...v0.0.9
v0.0.8
What's Changed
- Tag에서 tag안에 interactive content인 을 밖으로 꺼내기 by @SimYunSup in #866
- release: v0.0.8 by @github-actions[bot] in #895
New Contributors
- @SimYunSup made their first contribution in #866
Full Changelog: v0.0.7...v0.0.8
v0.0.7
What's Changed
- 하차 팀원 관련 업데이트 by @DaleSeo in #744
- 크로메틱 워크플로우 수동 실행 by @DaleSeo in #762
- CodeCov 자동 댓글 비활성화 by @DaleSeo in #763
- 컴포넌트 접근성 개선(aria-invalid, aria-required) by @hyoseong1994 in #724
- build(deps-dev): bump @types/react from 19.2.7 to 19.2.8 in the react group by @dependabot[bot] in #764
- build(deps-dev): bump the vite group with 2 updates by @dependabot[bot] in #765
- build(deps-dev): bump typescript-eslint from 8.49.0 to 8.50.0 by @dependabot[bot] in #766
- build(deps-dev): bump eslint-plugin-testing-library from 7.13.6 to 7.15.1 by @dependabot[bot] in #767
- build(deps): bump lucide-react from 0.561.0 to 0.562.0 by @dependabot[bot] in #768
- 팀 소개 섹션 아이콘 컴포넌트 적용 by @Hecklebot in #743
- build(deps-dev): bump @types/react from 19.2.8 to 19.2.9 in the react group by @dependabot[bot] in #776
- build(deps-dev): bump typescript-eslint from 8.50.0 to 8.50.1 by @dependabot[bot] in #779
- build(deps-dev): bump @testing-library/react from 16.3.1 to 16.3.2 by @dependabot[bot] in #778
- build(deps-dev): bump the vite group with 2 updates by @dependabot[bot] in #777
- build(deps-dev): bump eslint-plugin-testing-library from 7.15.1 to 7.15.4 by @dependabot[bot] in #780
- RadioGroup invalid/required 상태 및 스타일 추가 by @sounmind in #769
- hotfix: add peer dependencies for React and ReactDOM by @hyoseong1994 in #782
- build(deps-dev): bump the react group with 3 updates by @dependabot[bot] in #788
- build(deps-dev): bump typescript-eslint from 8.50.1 to 8.51.0 by @dependabot[bot] in #789
- docs: add JJinuk as a contributor for code by @allcontributors[bot] in #790
- Checkbox와 RadioGroup 스타일 통일 by @hyoseong1994 in #771
- Button 스토리 문서 업데이트 by @DaleSeo in #792
- 이슈 템플릿 제거 제안 by @DaleSeo in #791
- CheckboxGroup 컴포넌트 구현 by @yolophg in #711
- 조엘님 웹사이트에 추가 by @DaleSeo in #793
- PR 템플릿 간소화 제안 by @DaleSeo in #794
- Update sponsors by @github-actions[bot] in #805
- Update sponsors by @github-actions[bot] in #806
- README.md에 후원 섹션 추가 by @DaleSeo in #804
- Update sponsors by @github-actions[bot] in #808
- build(deps-dev): bump @types/react from 19.2.10 to 19.2.13 in the react group by @dependabot[bot] in #797
- build(deps-dev): bump @vitejs/plugin-react from 5.1.2 to 5.1.3 by @dependabot[bot] in #798
- build(deps-dev): bump happy-dom from 20.0.11 to 20.1.0 by @dependabot[bot] in #799
- build(deps-dev): bump typescript-eslint from 8.51.0 to 8.52.0 by @dependabot[bot] in #800
- build(deps-dev): bump @faker-js/faker from 10.1.0 to 10.2.0 by @dependabot[bot] in #801
- 스폰서 등급 단순화 by @DaleSeo in #807
- Grid 컴포넌트 구현 by @Hecklebot in #770
- docs: add SimYunSup as a contributor for code by @allcontributors[bot] in #810
- 윤섭님 웹사이트에 추가 by @DaleSeo in #809
- build(deps-dev): bump @storybook/addon-designs from 11.1.1 to 11.1.2 in the storybook group by @dependabot[bot] in #813
- build(deps-dev): bump @types/react from 19.2.13 to 19.2.14 in the react group by @dependabot[bot] in #814
- build(deps-dev): bump happy-dom from 20.1.0 to 20.3.1 by @dependabot[bot] in #815
- build(deps-dev): bump @pandacss/dev from 1.7.3 to 1.8.1 by @dependabot[bot] in #817
- build(deps-dev): bump prettier from 3.7.4 to 3.8.0 by @dependabot[bot] in #816
- build(deps): bump peter-evans/create-pull-request from 7 to 8 in /.github/workflows by @dependabot[bot] in #812
- Update sponsors by @github-actions[bot] in #819
- README.md 개선 by @hyoseong1994 in #818
- Sponshorkit 셋업 제거 by @DaleSeo in #850
- 컴포넌트 접근성 개선 누락된 API 명시 by @hyoseong1994 in #821
- Select 컴포넌트 검토 결과 반영 by @DaleSeo in #820
- fix: typos in korean text by @DaleSeo in #857
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #858
- build(deps-dev): bump prettier from 3.8.0 to 3.8.1 by @dependabot[bot] in #859
- CheckboxGroup 컴포넌트 살짝 개선 by @DaleSeo in #863
- Link 컴포넌트 문서화 검토 by @hyoseong1994 in #854
- build(deps-dev): bump @vitejs/plugin-react from 5.1.3 to 5.1.4 by @dependabot[bot] in #860
- build(deps-dev): bump happy-dom from 20.3.1 to 20.3.9 by @dependabot[bot] in #862
- build(deps-dev): bump @pandacss/dev from 1.8.1 to 1.8.2 by @dependabot[bot] in #861
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #872
- build(deps-dev): bump @eslint/js from 9.39.2 to 9.39.3 by @dependabot[bot] in #873
- build(deps): bump lucide-react from 0.562.0 to 0.563.0 by @dependabot[bot] in #876
- build(deps-dev): bump happy-dom from 20.3.9 to 20.4.0 by @dependabot[bot] in #875
- build(deps-dev): bump eslint from 9.39.2 to 9.39.3 by @dependabot[bot] in #874
- build(deps-dev): bump the storybook group with 6 updates by @dependabot[bot] in #882
- build(deps): bump @ark-ui/react from 5.30.0 to 5.31.0 by @dependabot[bot] in #883
- build(deps-dev): bump happy-dom from 20.5.0 to 20.5.5 by @dependabot[bot] in #884
- build(deps-dev): bump eslint-plugin-react-refresh from 0.4.26 to 0.5.0 by @dependabot[bot] in #885
- build(deps-dev): bump @faker-js/faker from 10.2.0 to 10.3.0 by @dependabot[bot] in #886
- npm Trusted Publishing by @DaleSeo in #891
- release: v0.0.7 by @github-actions[bot] in #892
New Contributors
- @allcontributors[bot] made their first contribution in #790
Full Changelog: v0.0.6...v0.0.7
v0.0.6
What's Changed
- 팀 소개 섹션 개발 by @Hecklebot in #681
- 불필요한 디펜던시 제거 및 dev 로 이동 by @hyoseong1994 in #733
- deprecated 워크플로우 구현 by @hyoseong1994 in #702
- build(deps-dev): bump @pandacss/dev from 1.7.2 to 1.7.3 by @dependabot[bot] in #726
- build(deps-dev): bump typescript-eslint from 8.48.1 to 8.49.0 by @dependabot[bot] in #740
- build(deps-dev): bump vite from 7.3.0 to 7.3.1 in the vite group by @dependabot[bot] in #739
- 타입 충돌 해결을 위해 vite config의 vitest 부분 분리 by @sounmind in #736
- release: v0.0.6 by @github-actions[bot] in #759
Full Changelog: v0.0.5...v0.0.6
v0.0.5
What's Changed
- 발행 워크플로우에서 bun publish 실행 시 scripts 무시 by @DaleSeo in #730
- release: v0.0.5 by @github-actions[bot] in #732
Full Changelog: v0.0.4...v0.0.5