@youngduck/yd-ui 0.1.4 → 0.3.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +168 -0
- package/README.md +222 -223
- package/dist/index.cjs.js +1 -1
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.css +1 -1
- package/dist/index.d.ts +18 -5
- package/dist/index.esm.js +1 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/types/components/Input/Input.d.ts +19 -0
- package/dist/types/components/Input/Input.stories.d.ts +6 -0
- package/dist/types/index.d.ts +1 -0
- package/package.json +79 -79
package/CHANGELOG.md
ADDED
|
@@ -0,0 +1,168 @@
|
|
|
1
|
+
# Changelog
|
|
2
|
+
|
|
3
|
+
## [0.3.1] - 2025-08-27
|
|
4
|
+
|
|
5
|
+
### 변경
|
|
6
|
+
|
|
7
|
+
- **패키지 매니저 마이그레이션**: npm에서 pnpm으로 전환
|
|
8
|
+
- **개발 환경 개선**: pnpm 기반 의존성 관리로 성능 및 안정성 향상
|
|
9
|
+
- **빌드 시스템 최적화**: pnpm의 효율적인 패키지 관리로 빌드 속도 개선
|
|
10
|
+
|
|
11
|
+
### 개선
|
|
12
|
+
|
|
13
|
+
- `package-lock.json` 제거 및 `pnpm-lock.yaml` 적용
|
|
14
|
+
- pnpm의 심볼릭 링크 시스템으로 디스크 공간 절약
|
|
15
|
+
- 의존성 중복 설치 방지로 번들 크기 최적화
|
|
16
|
+
- 일관된 패키지 관리 환경 제공 (사이드프로젝트 pnpm 사용중)
|
|
17
|
+
|
|
18
|
+
## [0.2.1] - 2025-08-27
|
|
19
|
+
|
|
20
|
+
### 변경
|
|
21
|
+
|
|
22
|
+
- **패키지 매니저 마이그레이션**: npm에서 pnpm으로 전환
|
|
23
|
+
- **개발 환경 개선**: pnpm 기반 의존성 관리로 성능 및 안정성 향상
|
|
24
|
+
- **빌드 시스템 최적화**: pnpm의 효율적인 패키지 관리로 빌드 속도 개선
|
|
25
|
+
|
|
26
|
+
### 개선
|
|
27
|
+
|
|
28
|
+
- `package-lock.json` 제거 및 `pnpm-lock.yaml` 적용
|
|
29
|
+
- pnpm의 심볼릭 링크 시스템으로 디스크 공간 절약
|
|
30
|
+
- 의존성 중복 설치 방지로 번들 크기 최적화
|
|
31
|
+
- 일관된 패키지 관리 환경 제공 (사이드프로젝트 pnpm 사용중)
|
|
32
|
+
|
|
33
|
+
## [0.1.4] - 2025-08-05
|
|
34
|
+
|
|
35
|
+
### 수정
|
|
36
|
+
|
|
37
|
+
- yd-ui라이브러리 실행시 로컬에서는 적용, 실서버에서는 미적용 현상 최종 해결
|
|
38
|
+
- `rollup-plugin-postcss` 설정에서 `inject: true`와 `extract: 'index.css'` 동시 적용
|
|
39
|
+
- CSS 파일이 JS에 주입되면서 동시에 별도 파일로도 추출되도록 수정
|
|
40
|
+
- `package.json`의 `exports` 필드에 `"./styles": "./dist/index.css"` 추가로 import 경로 커스텀 제공
|
|
41
|
+
- 사이드 프로젝트에서 `@import "@youngduck/yd-ui/styles";` 형태로 CSS 간편 import 가능
|
|
42
|
+
|
|
43
|
+
### 버그 수정
|
|
44
|
+
|
|
45
|
+
- 개발 환경과 프로덕션 환경 모두에서 YD-UI 적용
|
|
46
|
+
|
|
47
|
+
## [0.1.3] - 2025-08-04
|
|
48
|
+
|
|
49
|
+
### 버그 수정
|
|
50
|
+
|
|
51
|
+
- yd-ui라이브러리 실행시 로컬에서는 적용, 실서버에서는 미적용 현상 발견
|
|
52
|
+
- PostCSS 설정에서 CSS 파일 추출 기능 추가 (`extract: 'index.css'`)
|
|
53
|
+
- `package.json`에서 CSS 파일 배포 설정 추가
|
|
54
|
+
- 빌드 결과물에 CSS 파일이 포함되지 않던 문제 해결
|
|
55
|
+
<!-- - 개발 환경과 빌드 환경 간 스타일 적용 불일치 문제 해결 -->
|
|
56
|
+
|
|
57
|
+
## [0.1.2] - 2025-01-27
|
|
58
|
+
|
|
59
|
+
<!-- Tailwind v4버전 업에 따른 마이너버전 업 -->
|
|
60
|
+
|
|
61
|
+
### 추가
|
|
62
|
+
|
|
63
|
+
- TailwindCSS v4 완전 호환 지원
|
|
64
|
+
- `@tailwindcss/postcss` 플러그인 통합으로 라이브러리 빌드 최적화
|
|
65
|
+
- CSS 파일 기반 설정 시스템 (`@theme`, `@import "tailwindcss"`)
|
|
66
|
+
- PostCSS 기반 스타일 주입 시스템으로 `inject: true` 설정
|
|
67
|
+
|
|
68
|
+
### 변경
|
|
69
|
+
|
|
70
|
+
- TailwindCSS v3.4.1에서 v4.1.11로 메이저 업그레이드
|
|
71
|
+
- `tailwind.config.js` 제거 및 CSS 파일 기반 설정으로 마이그레이션
|
|
72
|
+
- `@tailwindcss/vite` 의존성 제거 (PostCSS 방식으로 통합)
|
|
73
|
+
- Rollup 설정에서 PostCSS 플러그인 설정
|
|
74
|
+
- Storybook 설정에서 TailwindCSS v4 호환 적용
|
|
75
|
+
|
|
76
|
+
### 개선
|
|
77
|
+
|
|
78
|
+
- CSS 변수 시스템 v4양식에 맞게끔 재구성 (`--color-primary-*`, `--font-size-yds-*`)
|
|
79
|
+
|
|
80
|
+
### 수정
|
|
81
|
+
|
|
82
|
+
- ESLint 설정에서 빌드 결과물 및 타입 정의 파일 제외
|
|
83
|
+
- Button 컴포넌트의 CSS 변수 참조 오류 수정
|
|
84
|
+
- Storybook 무한 로딩 문제 해결
|
|
85
|
+
- PostCSS 설정 충돌 문제 해결
|
|
86
|
+
|
|
87
|
+
### 삭제
|
|
88
|
+
|
|
89
|
+
- 불필요한 `@tailwindcss/vite` 의존성 제거
|
|
90
|
+
- 기존 styled-components 관련 캐싱 파일 제거
|
|
91
|
+
- 중복된 TailwindCSS 설정 파일 정리
|
|
92
|
+
|
|
93
|
+
## [0.0.15] - 2025-01-27
|
|
94
|
+
|
|
95
|
+
### 추가
|
|
96
|
+
|
|
97
|
+
- ESLint 및 Prettier 설정 추가
|
|
98
|
+
- `lint`, `lint:fix`, `format`, `format:check`, `check` 스크립트 추가
|
|
99
|
+
- CSS 모듈 시스템 도입으로 스타일 충돌 방지
|
|
100
|
+
- 독립적인 스타일 시스템으로 YD-UI 컴포넌트 스코핑 구현
|
|
101
|
+
|
|
102
|
+
### 변경
|
|
103
|
+
|
|
104
|
+
- ESLint flat config 시스템으로 마이그레이션
|
|
105
|
+
- 롤업 PostCSS 자동주입설정
|
|
106
|
+
- 패키지 이름을 `@yds/yd-ui`에서 `@youngduck/yd-ui`로 복원
|
|
107
|
+
- 버전을 0.0.15로 업데이트
|
|
108
|
+
|
|
109
|
+
|
|
110
|
+
## [0.0.10] - 2025-07-31
|
|
111
|
+
|
|
112
|
+
### 추가
|
|
113
|
+
|
|
114
|
+
- Tokens Studio for Figma 연동을 위한 자동 토큰 동기화 스크립트 추가
|
|
115
|
+
- `auto-token-sync.js` 스크립트로 `tokens.json` → CSS/Tailwind 설정 자동 변환
|
|
116
|
+
- `tokens:test` 스크립트로 테스트 파일 생성 기능 추가
|
|
117
|
+
- Wanted Sans Variable 폰트 통합 및 YDS 디자인 시스템 타이포그래피 적용
|
|
118
|
+
- Toss 패턴 기반 버튼 타이포그래피 시스템 구현
|
|
119
|
+
|
|
120
|
+
### 변경
|
|
121
|
+
|
|
122
|
+
- 패키지 이름을 `@youngduck/yd-ui`에서 `@yds/yd-ui`로 변경
|
|
123
|
+
- 디자인 토큰 기반 색상 시스템 (Primary 50-400) 적용
|
|
124
|
+
- YDS 타이포그래피 토큰 (H1, H2, S1, S2, B1, B2, C1, C2, C3) 적용
|
|
125
|
+
- 버튼 컴포넌트에 인라인 CSS 변수를 통한 동적 타이포그래피 적용
|
|
126
|
+
|
|
127
|
+
### 개선
|
|
128
|
+
|
|
129
|
+
- 디자인 토큰과 컴포넌트 간 일관성 향상
|
|
130
|
+
- Figma Variables와 코드 간 자동 동기화 워크플로우 구축
|
|
131
|
+
|
|
132
|
+
## [0.0.8] - 2025-06-08
|
|
133
|
+
|
|
134
|
+
### 추가
|
|
135
|
+
|
|
136
|
+
- Storybook에 Tailwind CSS 스타일 적용
|
|
137
|
+
- Storybook preview에 전역 CSS 불러오기 설정 추가
|
|
138
|
+
|
|
139
|
+
### 수정
|
|
140
|
+
|
|
141
|
+
- Storybook에서 컴포넌트 스타일이 보이지 않는 문제 해결
|
|
142
|
+
|
|
143
|
+
### 삭제
|
|
144
|
+
|
|
145
|
+
- 테스트로 만든 Input 컴포넌트 제거
|
|
146
|
+
|
|
147
|
+
## [0.0.7] - 2025-06-08
|
|
148
|
+
|
|
149
|
+
### 추가
|
|
150
|
+
|
|
151
|
+
- Tailwind CSS 기반으로 Button 컴포넌트 재구현
|
|
152
|
+
- class-variance-authority(cva)를 사용한 variant 시스템 추가
|
|
153
|
+
- 시그니처 노란색을 primary 색상으로 추가
|
|
154
|
+
- cn() 유틸리티 함수 추가
|
|
155
|
+
|
|
156
|
+
### 변경
|
|
157
|
+
|
|
158
|
+
- styled-components에서 Tailwind CSS로 스타일링 방식 변경
|
|
159
|
+
- Button 컴포넌트 API 개선 (variant, size, fullWidth 속성 추가)
|
|
160
|
+
- 접근성 향상을 위한 aria-label 및 tabIndex 속성 추가
|
|
161
|
+
|
|
162
|
+
### 삭제
|
|
163
|
+
|
|
164
|
+
- ButtonStyle.ts 파일 및 styled-components 종속성 제거
|
|
165
|
+
|
|
166
|
+
## [0.0.6] - 이전 버전
|
|
167
|
+
|
|
168
|
+
초기 릴리스
|
package/README.md
CHANGED
|
@@ -1,223 +1,222 @@
|
|
|
1
|
-
# @youngduck/yd-ui
|
|
2
|
-
|
|
3
|
-
Tailwind CSS와 CVA(Class Variance Authority) 기반의 현대적인 Headless UI 컴포넌트 라이브러리
|
|
4
|
-
|
|
5
|
-
## ✨ 특징
|
|
6
|
-
|
|
7
|
-
- **Headless 컴포넌트** - 완전한 스타일링 자유도와 커스터마이징 가능
|
|
8
|
-
- **CVA 기반 Variant 시스템** - primary, secondary, ghost 등 다양한 스타일 변형 지원
|
|
9
|
-
- **Tailwind CSS 최적화** - 효율적인 클래스 관리와 번들 사이즈 최적화
|
|
10
|
-
- **Design Token 동기화** - 피그마 Variables와 자동 동기화
|
|
11
|
-
- **완전한 TypeScript 지원** - 타입 안전성과 개발자 경험 향상
|
|
12
|
-
- **접근성 중심** - WAI-ARIA 가이드라인 준수
|
|
13
|
-
- **트리 쉐이킹** - 사용하는 컴포넌트만 번들에 포함
|
|
14
|
-
|
|
15
|
-
## 📦 설치
|
|
16
|
-
|
|
17
|
-
```bash
|
|
18
|
-
npm install @youngduck/yd-ui
|
|
19
|
-
# 또는
|
|
20
|
-
yarn add @youngduck/yd-ui
|
|
21
|
-
# 또는
|
|
22
|
-
pnpm add @youngduck/yd-ui
|
|
23
|
-
```
|
|
24
|
-
|
|
25
|
-
## 🎨 CSS 스타일 적용
|
|
26
|
-
|
|
27
|
-
YD-UI를 사용하기 위해서는 CSS 파일을 import해야 합니다:
|
|
28
|
-
|
|
29
|
-
### 방법 1: CSS 파일에서 import (권장)
|
|
30
|
-
```css
|
|
31
|
-
/* your-global-styles.css */
|
|
32
|
-
@import "@youngduck/yd-ui/styles";
|
|
33
|
-
```
|
|
34
|
-
|
|
35
|
-
### 방법 2: JavaScript/TypeScript에서 import
|
|
36
|
-
```typescript
|
|
37
|
-
// App.tsx 또는 main.tsx
|
|
38
|
-
import "@youngduck/yd-ui/styles";
|
|
39
|
-
```
|
|
40
|
-
|
|
41
|
-
### 방법 3: 직접 경로 지정
|
|
42
|
-
```css
|
|
43
|
-
@import "@youngduck/yd-ui/dist/index.css";
|
|
44
|
-
```
|
|
45
|
-
|
|
46
|
-
## 🚀 사용법
|
|
47
|
-
|
|
48
|
-
### 기본 사용
|
|
49
|
-
|
|
50
|
-
```tsx
|
|
51
|
-
import { Button } from "@youngduck/yd-ui";
|
|
52
|
-
|
|
53
|
-
export function App() {
|
|
54
|
-
return (
|
|
55
|
-
<div>
|
|
56
|
-
<Button variant="primary" size="md">
|
|
57
|
-
Primary Button
|
|
58
|
-
</Button>
|
|
59
|
-
<Button variant="
|
|
60
|
-
|
|
61
|
-
</Button>
|
|
62
|
-
</div>
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
### Variant 시스템
|
|
68
|
-
|
|
69
|
-
모든 컴포넌트는 CVA를 활용한 강력한 variant 시스템을 제공합니다:
|
|
70
|
-
|
|
71
|
-
```tsx
|
|
72
|
-
// Button 컴포넌트 variant 예시
|
|
73
|
-
<Button variant="primary"
|
|
74
|
-
<Button variant="
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
<Button
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
<Button size="
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
"
|
|
104
|
-
"
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
--
|
|
121
|
-
--
|
|
122
|
-
--
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
--
|
|
127
|
-
--text-
|
|
128
|
-
--text-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
--spacing-
|
|
133
|
-
--spacing-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
- `
|
|
142
|
-
- `
|
|
143
|
-
- `
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
- `
|
|
149
|
-
- `
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
- `
|
|
155
|
-
- `
|
|
156
|
-
- `
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
- `
|
|
162
|
-
- `
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
{
|
|
192
|
-
|
|
193
|
-
"
|
|
194
|
-
"
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
- [
|
|
217
|
-
- [
|
|
218
|
-
- [
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
**@youngduck/yd-ui**로 더 나은 사용자 경험을 만들어보세요! 🚀
|
|
1
|
+
# @youngduck/yd-ui
|
|
2
|
+
|
|
3
|
+
Tailwind CSS와 CVA(Class Variance Authority) 기반의 현대적인 Headless UI 컴포넌트 라이브러리
|
|
4
|
+
|
|
5
|
+
## ✨ 특징
|
|
6
|
+
|
|
7
|
+
- **Headless 컴포넌트** - 완전한 스타일링 자유도와 커스터마이징 가능
|
|
8
|
+
- **CVA 기반 Variant 시스템** - primary, secondary, ghost 등 다양한 스타일 변형 지원
|
|
9
|
+
- **Tailwind CSS 최적화** - 효율적인 클래스 관리와 번들 사이즈 최적화
|
|
10
|
+
- **Design Token 동기화** - 피그마 Variables와 자동 동기화
|
|
11
|
+
- **완전한 TypeScript 지원** - 타입 안전성과 개발자 경험 향상
|
|
12
|
+
- **접근성 중심** - WAI-ARIA 가이드라인 준수
|
|
13
|
+
- **트리 쉐이킹** - 사용하는 컴포넌트만 번들에 포함
|
|
14
|
+
|
|
15
|
+
## 📦 설치
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
npm install @youngduck/yd-ui
|
|
19
|
+
# 또는
|
|
20
|
+
yarn add @youngduck/yd-ui
|
|
21
|
+
# 또는
|
|
22
|
+
pnpm add @youngduck/yd-ui
|
|
23
|
+
```
|
|
24
|
+
|
|
25
|
+
## 🎨 CSS 스타일 적용
|
|
26
|
+
|
|
27
|
+
YD-UI를 사용하기 위해서는 CSS 파일을 import해야 합니다:
|
|
28
|
+
|
|
29
|
+
### 방법 1: CSS 파일에서 import (권장)
|
|
30
|
+
```css
|
|
31
|
+
/* your-global-styles.css */
|
|
32
|
+
@import "@youngduck/yd-ui/styles";
|
|
33
|
+
```
|
|
34
|
+
|
|
35
|
+
### 방법 2: JavaScript/TypeScript에서 import
|
|
36
|
+
```typescript
|
|
37
|
+
// App.tsx 또는 main.tsx
|
|
38
|
+
import "@youngduck/yd-ui/styles";
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
### 방법 3: 직접 경로 지정
|
|
42
|
+
```css
|
|
43
|
+
@import "@youngduck/yd-ui/dist/index.css";
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
## 🚀 사용법
|
|
47
|
+
|
|
48
|
+
### 기본 사용
|
|
49
|
+
|
|
50
|
+
```tsx
|
|
51
|
+
import { Button } from "@youngduck/yd-ui";
|
|
52
|
+
|
|
53
|
+
export function App() {
|
|
54
|
+
return (
|
|
55
|
+
<div>
|
|
56
|
+
<Button variant="fill" color="primary" size="md">
|
|
57
|
+
Primary Button
|
|
58
|
+
</Button>
|
|
59
|
+
<Button variant="outlined" color="primary" size="sm">
|
|
60
|
+
Outlined Button
|
|
61
|
+
</Button>
|
|
62
|
+
</div>
|
|
63
|
+
);
|
|
64
|
+
}
|
|
65
|
+
```
|
|
66
|
+
|
|
67
|
+
### Variant 시스템
|
|
68
|
+
|
|
69
|
+
모든 컴포넌트는 CVA를 활용한 강력한 variant 시스템을 제공합니다:
|
|
70
|
+
|
|
71
|
+
```tsx
|
|
72
|
+
// Button 컴포넌트 variant 예시
|
|
73
|
+
<Button variant="fill" color="primary">채움 버튼</Button>
|
|
74
|
+
<Button variant="outlined" color="primary">외곽선 버튼</Button>
|
|
75
|
+
|
|
76
|
+
// 크기 조절
|
|
77
|
+
<Button size="sm">작은 버튼</Button>
|
|
78
|
+
<Button size="md">보통 버튼</Button>
|
|
79
|
+
<Button size="lg">큰 버튼</Button>
|
|
80
|
+
<Button size="full">전체 너비 버튼</Button>
|
|
81
|
+
|
|
82
|
+
// 조합 사용
|
|
83
|
+
<Button variant="outlined" color="primary" size="lg" disabled>
|
|
84
|
+
비활성화된 큰 외곽선 버튼
|
|
85
|
+
</Button>
|
|
86
|
+
```
|
|
87
|
+
|
|
88
|
+
### 커스텀 스타일링
|
|
89
|
+
|
|
90
|
+
Headless 설계로 완전한 커스터마이징이 가능합니다:
|
|
91
|
+
|
|
92
|
+
```tsx
|
|
93
|
+
import { Button } from "@youngduck/yd-ui";
|
|
94
|
+
import { cn } from "@/lib/utils";
|
|
95
|
+
|
|
96
|
+
export function CustomButton() {
|
|
97
|
+
return (
|
|
98
|
+
<Button
|
|
99
|
+
variant="fill"
|
|
100
|
+
color="primary"
|
|
101
|
+
className={cn(
|
|
102
|
+
"bg-gradient-to-r from-purple-500 to-pink-500",
|
|
103
|
+
"hover:from-purple-600 hover:to-pink-600",
|
|
104
|
+
"text-white shadow-lg"
|
|
105
|
+
)}
|
|
106
|
+
>
|
|
107
|
+
커스텀 그라데이션 버튼
|
|
108
|
+
</Button>
|
|
109
|
+
);
|
|
110
|
+
}
|
|
111
|
+
```
|
|
112
|
+
|
|
113
|
+
## 🎨 Design Token 시스템
|
|
114
|
+
|
|
115
|
+
피그마 Variables와 동기화된 일관된 디자인 토큰을 제공합니다:
|
|
116
|
+
|
|
117
|
+
```css
|
|
118
|
+
/* 색상 팔레트 */
|
|
119
|
+
--primary: 216 100% 50%;
|
|
120
|
+
--secondary: 214 32% 91%;
|
|
121
|
+
--destructive: 0 85% 60%;
|
|
122
|
+
--muted: 210 40% 98%;
|
|
123
|
+
|
|
124
|
+
/* 타이포그래피 */
|
|
125
|
+
--font-sans: "Inter", sans-serif;
|
|
126
|
+
--text-sm: 0.875rem;
|
|
127
|
+
--text-base: 1rem;
|
|
128
|
+
--text-lg: 1.125rem;
|
|
129
|
+
|
|
130
|
+
/* 간격 시스템 */
|
|
131
|
+
--spacing-1: 0.25rem;
|
|
132
|
+
--spacing-2: 0.5rem;
|
|
133
|
+
--spacing-4: 1rem;
|
|
134
|
+
```
|
|
135
|
+
|
|
136
|
+
## 📖 컴포넌트 카탈로그
|
|
137
|
+
|
|
138
|
+
### 기본 컴포넌트
|
|
139
|
+
|
|
140
|
+
- `Button` - 다양한 variant와 크기를 지원하는 버튼
|
|
141
|
+
- `Input` - 텍스트 입력 필드
|
|
142
|
+
- `Label` - 접근성을 고려한 라벨
|
|
143
|
+
- `Badge` - 상태 표시용 배지
|
|
144
|
+
|
|
145
|
+
### 레이아웃 컴포넌트
|
|
146
|
+
|
|
147
|
+
- `Card` - 콘텐츠 그룹핑용 카드
|
|
148
|
+
- `Separator` - 구분선
|
|
149
|
+
- `Container` - 반응형 컨테이너
|
|
150
|
+
|
|
151
|
+
### 폼 컴포넌트
|
|
152
|
+
|
|
153
|
+
- `Form` - 폼 래퍼 및 검증
|
|
154
|
+
- `Select` - 드롭다운 선택
|
|
155
|
+
- `Checkbox` - 체크박스
|
|
156
|
+
- `RadioGroup` - 라디오 버튼 그룹
|
|
157
|
+
|
|
158
|
+
### 피드백 컴포넌트
|
|
159
|
+
|
|
160
|
+
- `Toast` - 알림 메시지
|
|
161
|
+
- `Alert` - 경고 및 정보 표시
|
|
162
|
+
- `Progress` - 진행률 표시
|
|
163
|
+
|
|
164
|
+
## 🛠️ 개발 환경 설정
|
|
165
|
+
|
|
166
|
+
### Tailwind CSS 설정
|
|
167
|
+
|
|
168
|
+
`tailwind.config.js`에 다음을 추가하세요:
|
|
169
|
+
|
|
170
|
+
```js
|
|
171
|
+
module.exports = {
|
|
172
|
+
content: [
|
|
173
|
+
"./node_modules/@youngduck/yd-ui/dist/**/*.{js,ts,jsx,tsx}",
|
|
174
|
+
// ... 기타 경로
|
|
175
|
+
],
|
|
176
|
+
theme: {
|
|
177
|
+
extend: {
|
|
178
|
+
// yd-ui preset이 자동으로 적용됩니다
|
|
179
|
+
},
|
|
180
|
+
},
|
|
181
|
+
plugins: [],
|
|
182
|
+
};
|
|
183
|
+
```
|
|
184
|
+
|
|
185
|
+
### TypeScript 설정
|
|
186
|
+
|
|
187
|
+
완전한 타입 지원을 위한 설정:
|
|
188
|
+
|
|
189
|
+
```json
|
|
190
|
+
{
|
|
191
|
+
"compilerOptions": {
|
|
192
|
+
"moduleResolution": "node",
|
|
193
|
+
"allowSyntheticDefaultImports": true,
|
|
194
|
+
"esModuleInterop": true
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
```
|
|
198
|
+
|
|
199
|
+
## 🤝 기여하기
|
|
200
|
+
|
|
201
|
+
기여를 환영합니다! 다음 단계를 따라주세요:
|
|
202
|
+
|
|
203
|
+
1. 저장소를 포크합니다
|
|
204
|
+
2. 기능 브랜치를 생성합니다 (`git checkout -b feature/amazing-feature`)
|
|
205
|
+
3. 변경사항을 커밋합니다 (`git commit -m 'Add amazing feature'`)
|
|
206
|
+
4. 브랜치에 푸시합니다 (`git push origin feature/amazing-feature`)
|
|
207
|
+
5. Pull Request를 생성합니다
|
|
208
|
+
|
|
209
|
+
## 📝 라이선스
|
|
210
|
+
|
|
211
|
+
MIT 라이선스 하에 배포됩니다. 자세한 내용은 `LICENSE` 파일을 참조하세요.
|
|
212
|
+
|
|
213
|
+
## 🔗 링크
|
|
214
|
+
|
|
215
|
+
- [공식 문서](https://yd-ui.youngduck.dev)
|
|
216
|
+
- [Storybook](https://storybook.yd-ui.youngduck.dev)
|
|
217
|
+
- [피그마 디자인 시스템](https://figma.com/youngduck-design-system)
|
|
218
|
+
- [GitHub](https://github.com/youngduck/yd-ui)
|
|
219
|
+
|
|
220
|
+
---
|
|
221
|
+
|
|
222
|
+
**@youngduck/yd-ui**로 더 나은 사용자 경험을 만들어보세요! 🚀
|
package/dist/index.cjs.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var r=require("react/jsx-runtime");function a(r){var
|
|
1
|
+
"use strict";var r=require("react/jsx-runtime");function a(r){var t,n,e="";if("string"==typeof r||"number"==typeof r)e+=r;else if("object"==typeof r)if(Array.isArray(r)){var l=r.length;for(t=0;t<l;t++)r[t]&&(n=a(r[t]))&&(e&&(e+=" "),e+=n)}else for(n in r)r[n]&&(e&&(e+=" "),e+=n);return e}const t=r=>"boolean"==typeof r?`${r}`:0===r?"0":r,n=function(){for(var r,t,n=0,e="",l=arguments.length;n<l;n++)(r=arguments[n])&&(t=a(r))&&(e&&(e+=" "),e+=t);return e},e=(r,a)=>e=>{var l;if(null==(null==a?void 0:a.variants))return n(r,null==e?void 0:e.class,null==e?void 0:e.className);const{variants:i,defaultVariants:s}=a,o=Object.keys(i).map(r=>{const a=null==e?void 0:e[r],n=null==s?void 0:s[r];if(null===a)return null;const l=t(a)||t(n);return i[r][l]}),u=e&&Object.entries(e).reduce((r,a)=>{let[t,n]=a;return void 0===n||(r[t]=n),r},{}),c=null==a||null===(l=a.compoundVariants)||void 0===l?void 0:l.reduce((r,a)=>{let{class:t,className:n,...e}=a;return Object.entries(e).every(r=>{let[a,t]=r;return Array.isArray(t)?t.includes({...s,...u}[a]):{...s,...u}[a]===t})?[...r,t,n]:r},[]);return n(r,o,c,null==e?void 0:e.class,null==e?void 0:e.className)},l=e("yds-button-typography",{variants:{size:{sm:"w-20",md:"w-[120px]",lg:"w-40",full:"w-full"},variant:{fill:"",outlined:"bg-transparent border-2"},color:{primary:""}},compoundVariants:[{variant:"fill",color:"primary",class:"bg-primary-400 text-black"},{variant:"outlined",color:"primary",class:"border-primary-400 text-primary-400"}],defaultVariants:{size:"md",variant:"fill",color:"primary"}});function i({size:a="md",variant:t,color:n,children:e,className:i="",ref:s,...o}){return r.jsx("button",{ref:s,className:l({size:a,variant:t,color:n,className:i}),tabIndex:0,"aria-label":o["aria-label"]||("string"==typeof e?e:"button"),...o,children:e})}i.displayName="Button";const s=e("h-12 border-primary-100 border-2 focus:outline-none px-3",{variants:{variant:{default:"yds-input-typography ",outlined:"yds-input-typography2 bg-transparent"}},defaultVariants:{variant:"default"}});function o({variant:a,className:t="",...n}){return r.jsx("input",{className:s({variant:a,className:t}),...n})}o.displayName="Input",exports.Button=i,exports.Input=o;
|
|
2
2
|
//# sourceMappingURL=index.cjs.js.map
|
package/dist/index.cjs.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs.js","sources":["../node_modules/clsx/dist/clsx.mjs","../node_modules/class-variance-authority/dist/index.mjs","../src/components/Button/Button.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null],"names":["r","e","t","f","n","Array","isArray","o","length","falsyToString","value","cx","arguments","
|
|
1
|
+
{"version":3,"file":"index.cjs.js","sources":["../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.mjs","../src/components/Button/Button.tsx","../src/components/Input/Input.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null,null],"names":["r","e","t","f","n","Array","isArray","o","length","falsyToString","value","cx","arguments","cva","base","config","props","_config_compoundVariants","variants","class","className","defaultVariants","getVariantClassNames","Object","keys","map","variant","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","entries","reduce","acc","param","key","undefined","getCompoundVariantClassNames","compoundVariants","cvClass","cvClassName","compoundVariantOptions","every","includes","buttonVariants","size","sm","md","lg","full","fill","outlined","color","primary","Button","children","ref","_jsx","tabIndex","displayName","inputVariants","default","Input"],"mappings":"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","x_google_ignoreList":[0,1]}
|
package/dist/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
/*! tailwindcss v4.1.11 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-yellow-300:oklch(90.5% 0.182 98.111);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-pink-500:oklch(65.6% 0.241 354.308);--color-pink-600:oklch(59.2% 0.249 0.584);--color-gray-600:oklch(44.6% 0.03 256.802);--color-black:#000;--color-white:#fff;--spacing:0.25rem;--container-2xl:42rem;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-lg:1.125rem;--text-lg--line-height:1.55556;--font-weight-bold:700;--radius-lg:0.5rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-primary-400:#e9be11;--font-size-yds-s2:20px;--line-height-yds-s2:26px;--font-weight-yds-s2:600;--font-yds-wanted:"Wanted Sans Variable"}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.flex{display:flex}.w-20{width:calc(var(--spacing)*20)}.w-40{width:calc(var(--spacing)*40)}.w-\[120px\]{width:120px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.flex-1{flex:1}.gap-2{gap:calc(var(--spacing)*2)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-8{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*8*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*8*var(--tw-space-y-reverse))}}.rounded-lg{border-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-gray-600{border-color:var(--color-gray-600)}.border-primary-400{border-color:var(--color-primary-400)}.bg-primary-400{background-color:var(--color-primary-400)}.bg-transparent{background-color:transparent}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-purple-500{--tw-gradient-from:var(--color-purple-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-pink-500{--tw-gradient-to:var(--color-pink-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}.p-4{padding:calc(var(--spacing)*4)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-black{color:var(--color-black)}.text-primary-400{color:var(--color-primary-400)}.text-white{color:var(--color-white)}.text-yellow-300{color:var(--color-yellow-300)}.capitalize{text-transform:capitalize}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.hover\:from-purple-600{&:hover{@media (hover:hover){--tw-gradient-from:var(--color-purple-600);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}}}.hover\:to-pink-600{&:hover{@media (hover:hover){--tw-gradient-to:var(--color-pink-600);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}}}}@import url("https://fastly.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.1/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.min.css");@layer components{.yds-button-typography{align-items:center;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-family:var(--font-yds-wanted);font-size:var(--font-size-yds-s2);font-weight:var(--font-weight-yds-s2);height:calc(var(--spacing)*12);justify-content:center;line-height:var(--line-height-yds-s2)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid}}}
|
|
1
|
+
/*! tailwindcss v4.1.12 | MIT License | https://tailwindcss.com */@layer theme, base, components, utilities;@layer theme{:host,:root{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-yellow-300:oklch(90.5% 0.182 98.111);--color-purple-500:oklch(62.7% 0.265 303.9);--color-purple-600:oklch(55.8% 0.288 302.321);--color-pink-500:oklch(65.6% 0.241 354.308);--color-pink-600:oklch(59.2% 0.249 0.584);--color-gray-600:oklch(44.6% 0.03 256.802);--color-black:#000;--color-white:#fff;--spacing:0.25rem;--container-2xl:42rem;--text-sm:0.875rem;--text-sm--line-height:1.42857;--text-base:1rem;--text-lg:1.125rem;--text-lg--line-height:1.55556;--font-weight-bold:700;--radius-lg:0.5rem;--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-background-primary:#19191f;--color-background-secondary:#20242d;--color-background-primary-layer:rgba(25,25,31,.7);--color-background-secondary-layer:rgba(32,36,45,.7);--color-primary-50:#fcf6df;--color-primary-100:#c9bf91;--color-primary-200:#fde68a;--color-primary-300:#eccb43;--color-primary-400:#e9be11;--font-size-yds-h1:48px;--line-height-yds-h1:58px;--font-weight-yds-h1:600;--font-size-yds-h2:40px;--line-height-yds-h2:48px;--font-weight-yds-h2:600;--font-size-yds-s1:24px;--line-height-yds-s1:30px;--font-weight-yds-s1:600;--font-size-yds-s2:20px;--line-height-yds-s2:26px;--font-weight-yds-s2:600;--font-size-yds-b1:18px;--line-height-yds-b1:26px;--font-weight-yds-b1:400;--font-size-yds-b2:16px;--line-height-yds-b2:24px;--font-weight-yds-b2:400;--font-size-yds-c1m:12px;--line-height-yds-c1m:16px;--font-weight-yds-c1m:500;--font-size-yds-c1r:12px;--line-height-yds-c1r:16px;--font-weight-yds-c1r:400;--font-size-yds-c2r:10px;--line-height-yds-c2r:14px;--font-weight-yds-c2r:400;--font-yds-wanted:"Wanted Sans Variable"}}@layer base{*,::backdrop,::file-selector-button,:after,:before{border:0 solid;box-sizing:border-box;margin:0;padding:0}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:var(--default-font-feature-settings,normal);-webkit-tap-highlight-color:transparent;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-variation-settings:var(--default-font-variation-settings,normal);line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:var(--default-mono-font-feature-settings,normal);font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-size:1em;font-variation-settings:var(--default-mono-font-variation-settings,normal)}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}menu,ol,ul{list-style:none}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}::file-selector-button,button,input,optgroup,select,textarea{font-feature-settings:inherit;background-color:transparent;border-radius:0;color:inherit;font:inherit;font-variation-settings:inherit;letter-spacing:inherit;opacity:1}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::-moz-placeholder{opacity:1}::placeholder{opacity:1}@supports (not (-webkit-appearance:-apple-pay-button)) or (contain-intrinsic-size:1px){::-moz-placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}::placeholder{color:currentcolor;@supports (color:color-mix(in lab,red,red)){color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-meridiem-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}::file-selector-button,button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer utilities{.mb-1{margin-bottom:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.flex{display:flex}.h-12{height:calc(var(--spacing)*12)}.w-20{width:calc(var(--spacing)*20)}.w-40{width:calc(var(--spacing)*40)}.w-\[120px\]{width:120px}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.flex-1{flex:1}.gap-2{gap:calc(var(--spacing)*2)}.gap-8{gap:calc(var(--spacing)*8)}.space-y-8{:where(&>:not(:last-child)){--tw-space-y-reverse:0;margin-block-end:calc(var(--spacing)*8*(1 - var(--tw-space-y-reverse)));margin-block-start:calc(var(--spacing)*8*var(--tw-space-y-reverse))}}.rounded-lg{border-radius:var(--radius-lg)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-gray-600{border-color:var(--color-gray-600)}.border-primary-100{border-color:var(--color-primary-100)}.border-primary-400{border-color:var(--color-primary-400)}.bg-primary-400{background-color:var(--color-primary-400)}.bg-transparent{background-color:transparent}.bg-gradient-to-r{--tw-gradient-position:to right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-purple-500{--tw-gradient-from:var(--color-purple-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}.to-pink-500{--tw-gradient-to:var(--color-pink-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}.p-4{padding:calc(var(--spacing)*4)}.px-3{padding-inline:calc(var(--spacing)*3)}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.text-black{color:var(--color-black)}.text-primary-400{color:var(--color-primary-400)}.text-white{color:var(--color-white)}.text-yellow-300{color:var(--color-yellow-300)}.capitalize{text-transform:capitalize}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,rgba(0,0,0,.1)),0 4px 6px -4px var(--tw-shadow-color,rgba(0,0,0,.1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.hover\:from-purple-600{&:hover{@media (hover:hover){--tw-gradient-from:var(--color-purple-600);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}}}.hover\:to-pink-600{&:hover{@media (hover:hover){--tw-gradient-to:var(--color-pink-600);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from) var(--tw-gradient-from-position),var(--tw-gradient-to) var(--tw-gradient-to-position))}}}.focus\:outline-none{&:focus{--tw-outline-style:none;outline-style:none}}}@import url("https://fastly.jsdelivr.net/gh/wanteddev/wanted-sans@v1.0.1/packages/wanted-sans/fonts/webfonts/variable/split/WantedSansVariable.min.css");@layer utilities{.bg-background-primary{background-color:var(--color-background-primary)}.bg-background-secondary{background-color:var(--color-background-secondary)}.bg-background-primary-layer{background-color:var(--color-background-primary-layer)}.bg-background-secondary-layer{background-color:var(--color-background-secondary-layer)}.text-primary-50{color:var(--color-primary-50)}.text-primary-100{color:var(--color-primary-100)}.text-primary-200{color:var(--color-primary-200)}.text-primary-300{color:var(--color-primary-300)}.text-primary-400{color:var(--color-primary-400)}.bg-primary-50{background-color:var(--color-primary-50)}.bg-primary-100{background-color:var(--color-primary-100)}.bg-primary-200{background-color:var(--color-primary-200)}.bg-primary-300{background-color:var(--color-primary-300)}.bg-primary-400{background-color:var(--color-primary-400)}.border-primary-50{border-color:var(--color-primary-50)}.border-primary-100{border-color:var(--color-primary-100)}.border-primary-200{border-color:var(--color-primary-200)}.border-primary-300{border-color:var(--color-primary-300)}.border-primary-400{border-color:var(--color-primary-400)}.text-yds-h1{font-size:var(--font-size-yds-h1);font-weight:var(--font-weight-yds-h1);line-height:var(--line-height-yds-h1)}.text-yds-h2{font-size:var(--font-size-yds-h2);font-weight:var(--font-weight-yds-h2);line-height:var(--line-height-yds-h2)}.text-yds-s1{font-size:var(--font-size-yds-s1);font-weight:var(--font-weight-yds-s1);line-height:var(--line-height-yds-s1)}.text-yds-s2{font-size:var(--font-size-yds-s2);font-weight:var(--font-weight-yds-s2);line-height:var(--line-height-yds-s2)}.text-yds-b1{font-size:var(--font-size-yds-b1);font-weight:var(--font-weight-yds-b1);line-height:var(--line-height-yds-b1)}.text-yds-b2{font-size:var(--font-size-yds-b2);font-weight:var(--font-weight-yds-b2);line-height:var(--line-height-yds-b2)}.text-yds-c1m{font-size:var(--font-size-yds-c1m);font-weight:var(--font-weight-yds-c1m);line-height:var(--line-height-yds-c1m)}.text-yds-c1r{font-size:var(--font-size-yds-c1r);font-weight:var(--font-weight-yds-c1r);line-height:var(--line-height-yds-c1r)}.text-yds-c2r{font-size:var(--font-size-yds-c2r);font-weight:var(--font-weight-yds-c2r);line-height:var(--line-height-yds-c2r)}.font-yds-wanted{font-family:var(--font-yds-wanted)}}@layer components{.yds-button-typography{align-items:center;border-radius:var(--radius-lg);cursor:pointer;display:flex;font-family:var(--font-yds-wanted);font-size:var(--font-size-yds-s2);font-weight:var(--font-weight-yds-s2);height:calc(var(--spacing)*12);justify-content:center;line-height:var(--line-height-yds-s2)}.yds-input-typography{font-size:var(--font-size-yds-b2);font-weight:var(--font-weight-yds-b2);line-height:var(--line-height-yds-b2)}}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@layer properties{@supports ((-webkit-hyphens:none) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}
|
package/dist/index.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
3
|
-
import React from 'react';
|
|
3
|
+
import React$1 from 'react';
|
|
4
4
|
import { VariantProps } from 'class-variance-authority';
|
|
5
5
|
|
|
6
6
|
declare const buttonVariants: (props?: ({
|
|
@@ -9,13 +9,26 @@ declare const buttonVariants: (props?: ({
|
|
|
9
9
|
color?: "primary" | null | undefined;
|
|
10
10
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
11
11
|
type ButtonProps = {
|
|
12
|
-
ref?: React.Ref<HTMLButtonElement>;
|
|
12
|
+
ref?: React$1.Ref<HTMLButtonElement>;
|
|
13
13
|
isActive?: boolean;
|
|
14
|
-
children: React.ReactNode;
|
|
15
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonVariants>;
|
|
14
|
+
children: React$1.ReactNode;
|
|
15
|
+
} & React$1.ButtonHTMLAttributes<HTMLButtonElement> & VariantProps<typeof buttonVariants>;
|
|
16
16
|
declare function Button({ size, variant, color, children, className, ref, ...props }: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
17
17
|
declare namespace Button {
|
|
18
18
|
var displayName: string;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
|
|
21
|
+
declare const inputVariants: (props?: ({
|
|
22
|
+
variant?: "default" | "outlined" | null | undefined;
|
|
23
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
24
|
+
type InputVariant = VariantProps<typeof inputVariants>['variant'];
|
|
25
|
+
type InputProps = {
|
|
26
|
+
variant?: InputVariant;
|
|
27
|
+
className?: string;
|
|
28
|
+
} & React.InputHTMLAttributes<HTMLInputElement>;
|
|
29
|
+
declare function Input({ variant, className, ...props }: InputProps): react_jsx_runtime.JSX.Element;
|
|
30
|
+
declare namespace Input {
|
|
31
|
+
var displayName: string;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
export { Button, Input };
|
package/dist/index.esm.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as r}from"react/jsx-runtime";function a(r){var
|
|
1
|
+
import{jsx as r}from"react/jsx-runtime";function a(r){var t,n,e="";if("string"==typeof r||"number"==typeof r)e+=r;else if("object"==typeof r)if(Array.isArray(r)){var l=r.length;for(t=0;t<l;t++)r[t]&&(n=a(r[t]))&&(e&&(e+=" "),e+=n)}else for(n in r)r[n]&&(e&&(e+=" "),e+=n);return e}const t=r=>"boolean"==typeof r?`${r}`:0===r?"0":r,n=function(){for(var r,t,n=0,e="",l=arguments.length;n<l;n++)(r=arguments[n])&&(t=a(r))&&(e&&(e+=" "),e+=t);return e},e=(r,a)=>e=>{var l;if(null==(null==a?void 0:a.variants))return n(r,null==e?void 0:e.class,null==e?void 0:e.className);const{variants:i,defaultVariants:o}=a,s=Object.keys(i).map(r=>{const a=null==e?void 0:e[r],n=null==o?void 0:o[r];if(null===a)return null;const l=t(a)||t(n);return i[r][l]}),u=e&&Object.entries(e).reduce((r,a)=>{let[t,n]=a;return void 0===n||(r[t]=n),r},{}),c=null==a||null===(l=a.compoundVariants)||void 0===l?void 0:l.reduce((r,a)=>{let{class:t,className:n,...e}=a;return Object.entries(e).every(r=>{let[a,t]=r;return Array.isArray(t)?t.includes({...o,...u}[a]):{...o,...u}[a]===t})?[...r,t,n]:r},[]);return n(r,s,c,null==e?void 0:e.class,null==e?void 0:e.className)},l=e("yds-button-typography",{variants:{size:{sm:"w-20",md:"w-[120px]",lg:"w-40",full:"w-full"},variant:{fill:"",outlined:"bg-transparent border-2"},color:{primary:""}},compoundVariants:[{variant:"fill",color:"primary",class:"bg-primary-400 text-black"},{variant:"outlined",color:"primary",class:"border-primary-400 text-primary-400"}],defaultVariants:{size:"md",variant:"fill",color:"primary"}});function i({size:a="md",variant:t,color:n,children:e,className:i="",ref:o,...s}){return r("button",{ref:o,className:l({size:a,variant:t,color:n,className:i}),tabIndex:0,"aria-label":s["aria-label"]||("string"==typeof e?e:"button"),...s,children:e})}i.displayName="Button";const o=e("h-12 border-primary-100 border-2 focus:outline-none px-3",{variants:{variant:{default:"yds-input-typography ",outlined:"yds-input-typography2 bg-transparent"}},defaultVariants:{variant:"default"}});function s({variant:a,className:t="",...n}){return r("input",{className:o({variant:a,className:t}),...n})}s.displayName="Input";export{i as Button,s as Input};
|
|
2
2
|
//# sourceMappingURL=index.esm.js.map
|
package/dist/index.esm.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.esm.js","sources":["../node_modules/clsx/dist/clsx.mjs","../node_modules/class-variance-authority/dist/index.mjs","../src/components/Button/Button.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null],"names":["r","e","t","f","n","Array","isArray","o","length","falsyToString","value","cx","arguments","
|
|
1
|
+
{"version":3,"file":"index.esm.js","sources":["../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.mjs","../node_modules/.pnpm/class-variance-authority@0.7.1/node_modules/class-variance-authority/dist/index.mjs","../src/components/Button/Button.tsx","../src/components/Input/Input.tsx"],"sourcesContent":["function r(e){var t,f,n=\"\";if(\"string\"==typeof e||\"number\"==typeof e)n+=e;else if(\"object\"==typeof e)if(Array.isArray(e)){var o=e.length;for(t=0;t<o;t++)e[t]&&(f=r(e[t]))&&(n&&(n+=\" \"),n+=f)}else for(f in e)e[f]&&(n&&(n+=\" \"),n+=f);return n}export function clsx(){for(var e,t,f=0,n=\"\",o=arguments.length;f<o;f++)(e=arguments[f])&&(t=r(e))&&(n&&(n+=\" \"),n+=t);return n}export default clsx;","/**\n * Copyright 2022 Joe Bell. All rights reserved.\n *\n * This file is licensed to you under the Apache License, Version 2.0\n * (the \"License\"); you may not use this file except in compliance with the\n * License. You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS, WITHOUT\n * WARRANTIES OR REPRESENTATIONS OF ANY KIND, either express or implied. See the\n * License for the specific language governing permissions and limitations under\n * the License.\n */ import { clsx } from \"clsx\";\nconst falsyToString = (value)=>typeof value === \"boolean\" ? `${value}` : value === 0 ? \"0\" : value;\nexport const cx = clsx;\nexport const cva = (base, config)=>(props)=>{\n var _config_compoundVariants;\n if ((config === null || config === void 0 ? void 0 : config.variants) == null) return cx(base, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n const { variants, defaultVariants } = config;\n const getVariantClassNames = Object.keys(variants).map((variant)=>{\n const variantProp = props === null || props === void 0 ? void 0 : props[variant];\n const defaultVariantProp = defaultVariants === null || defaultVariants === void 0 ? void 0 : defaultVariants[variant];\n if (variantProp === null) return null;\n const variantKey = falsyToString(variantProp) || falsyToString(defaultVariantProp);\n return variants[variant][variantKey];\n });\n const propsWithoutUndefined = props && Object.entries(props).reduce((acc, param)=>{\n let [key, value] = param;\n if (value === undefined) {\n return acc;\n }\n acc[key] = value;\n return acc;\n }, {});\n const getCompoundVariantClassNames = config === null || config === void 0 ? void 0 : (_config_compoundVariants = config.compoundVariants) === null || _config_compoundVariants === void 0 ? void 0 : _config_compoundVariants.reduce((acc, param)=>{\n let { class: cvClass, className: cvClassName, ...compoundVariantOptions } = param;\n return Object.entries(compoundVariantOptions).every((param)=>{\n let [key, value] = param;\n return Array.isArray(value) ? value.includes({\n ...defaultVariants,\n ...propsWithoutUndefined\n }[key]) : ({\n ...defaultVariants,\n ...propsWithoutUndefined\n })[key] === value;\n }) ? [\n ...acc,\n cvClass,\n cvClassName\n ] : acc;\n }, []);\n return cx(base, getVariantClassNames, getCompoundVariantClassNames, props === null || props === void 0 ? void 0 : props.class, props === null || props === void 0 ? void 0 : props.className);\n };\n\n",null,null],"names":["r","e","t","f","n","Array","isArray","o","length","falsyToString","value","cx","arguments","cva","base","config","props","_config_compoundVariants","variants","class","className","defaultVariants","getVariantClassNames","Object","keys","map","variant","variantProp","defaultVariantProp","variantKey","propsWithoutUndefined","entries","reduce","acc","param","key","undefined","getCompoundVariantClassNames","compoundVariants","cvClass","cvClassName","compoundVariantOptions","every","includes","buttonVariants","size","sm","md","lg","full","fill","outlined","color","primary","Button","children","ref","_jsx","tabIndex","displayName","inputVariants","default","Input"],"mappings":"wCAAA,SAASA,EAAEC,GAAG,IAAIC,EAAEC,EAAEC,EAAE,GAAG,GAAG,iBAAiBH,GAAG,iBAAiBA,EAAEG,GAAGH,OAAO,GAAG,iBAAiBA,EAAE,GAAGI,MAAMC,QAAQL,GAAG,CAAC,IAAIM,EAAEN,EAAEO,OAAO,IAAIN,EAAE,EAAEA,EAAEK,EAAEL,IAAID,EAAEC,KAAKC,EAAEH,EAAEC,EAAEC,OAAOE,IAAIA,GAAG,KAAKA,GAAGD,EAAE,MAAM,IAAIA,KAAKF,EAAEA,EAAEE,KAAKC,IAAIA,GAAG,KAAKA,GAAGD,GAAG,OAAOC,CAAC,CCehP,MAAMK,EAAiBC,GAAyB,kBAAVA,EAAsB,GAAGA,IAAoB,IAAVA,EAAc,IAAMA,EAChFC,EDhB2O,WAAgB,IAAI,IAAIV,EAAEC,EAAEC,EAAE,EAAEC,EAAE,GAAGG,EAAEK,UAAUJ,OAAOL,EAAEI,EAAEJ,KAAKF,EAAEW,UAAUT,MAAMD,EAAEF,EAAEC,MAAMG,IAAIA,GAAG,KAAKA,GAAGF,GAAG,OAAOE,CAAC,ECiBlWS,EAAM,CAACC,EAAMC,IAAUC,IAC5B,IAAIC,EACJ,GAAyE,OAApEF,aAAuC,EAASA,EAAOG,UAAmB,OAAOP,EAAGG,EAAME,aAAqC,EAASA,EAAMG,MAAOH,aAAqC,EAASA,EAAMI,WAC9M,MAAMF,SAAEA,EAAQG,gBAAEA,GAAoBN,EAChCO,EAAuBC,OAAOC,KAAKN,GAAUO,IAAKC,IACpD,MAAMC,EAAcX,aAAqC,EAASA,EAAMU,GAClEE,EAAqBP,aAAyD,EAASA,EAAgBK,GAC7G,GAAoB,OAAhBC,EAAsB,OAAO,KACjC,MAAME,EAAapB,EAAckB,IAAgBlB,EAAcmB,GAC/D,OAAOV,EAASQ,GAASG,KAEvBC,EAAwBd,GAASO,OAAOQ,QAAQf,GAAOgB,OAAO,CAACC,EAAKC,KACtE,IAAKC,EAAKzB,GAASwB,EACnB,YAAcE,IAAV1B,IAGJuB,EAAIE,GAAOzB,GAFAuB,GAIZ,CAAA,GACGI,EAA+BtB,SAAyG,QAAxDE,EAA2BF,EAAOuB,wBAA2D,IAA7BrB,OAA1E,EAAyHA,EAAyBe,OAAO,CAACC,EAAKC,KACvO,IAAMf,MAAOoB,EAASnB,UAAWoB,KAAgBC,GAA2BP,EAC5E,OAAOX,OAAOQ,QAAQU,GAAwBC,MAAOR,IACjD,IAAKC,EAAKzB,GAASwB,EACnB,OAAO7B,MAAMC,QAAQI,GAASA,EAAMiC,SAAS,IACtCtB,KACAS,GACLK,IAAQ,IACHd,KACAS,GACJK,KAASzB,IACX,IACEuB,EACHM,EACAC,GACAP,GACL,IACH,OAAOtB,EAAGG,EAAMQ,EAAsBe,EAA8BrB,aAAqC,EAASA,EAAMG,MAAOH,aAAqC,EAASA,EAAMI,YChDrLwB,EAAiB/B,EAAI,wBAAyB,CAClDK,SAAU,CACR2B,KAAM,CACJC,GAAI,OACJC,GAAI,YACJC,GAAI,OACJC,KAAM,UAERvB,QAAS,CACPwB,KAAM,GACNC,SAAU,2BAEZC,MAAO,CACLC,QAAS,KAGbf,iBAAkB,CAEhB,CACEZ,QAAS,OACT0B,MAAO,UACPjC,MAAO,6BAGT,CACEO,QAAS,WACT0B,MAAO,UACPjC,MAAO,wCAGXE,gBAAiB,CACfwB,KAAM,KACNnB,QAAS,OACT0B,MAAO,aAgBL,SAAUE,GAAOT,KAAEA,EAAO,KAAInB,QAAEA,EAAO0B,MAAEA,EAAKG,SAAEA,EAAQnC,UAAEA,EAAY,GAAEoC,IAAEA,KAAQxC,IACtF,OACEyC,YACED,IAAKA,EACLpC,UAAWwB,EAAe,CAAEC,OAAMnB,UAAS0B,QAAOhC,cAClDsC,SAAU,EAAC,aACC1C,EAAM,gBAAsC,iBAAbuC,EAAwBA,EAAW,aAC1EvC,EAAKuC,SAERA,GAGP,CAEAD,EAAOK,YAAc,SC5DrB,MAAMC,EAAgB/C,EAAI,2DAA4D,CACpFK,SAAU,CACRQ,QAAS,CACPmC,QAAS,wBACTV,SAAU,yCAGd9B,gBAAiB,CACfK,QAAS,aAaP,SAAUoC,GAAMpC,QAAEA,EAAON,UAAEA,EAAY,MAAOJ,IAClD,OAAOyC,EAAA,QAAA,CAAOrC,UAAWwC,EAAc,CAAElC,UAASN,iBAAkBJ,GACtE,CAEA8C,EAAMH,YAAc","x_google_ignoreList":[0,1]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* 작성자: KYD
|
|
3
|
+
* 기능:
|
|
4
|
+
* 프로세스 설명: 프로세스 복잡시 노션링크 첨부권장
|
|
5
|
+
*/
|
|
6
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
7
|
+
declare const inputVariants: (props?: ({
|
|
8
|
+
variant?: "default" | "outlined" | null | undefined;
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
|
+
type InputVariant = VariantProps<typeof inputVariants>['variant'];
|
|
11
|
+
type InputProps = {
|
|
12
|
+
variant?: InputVariant;
|
|
13
|
+
className?: string;
|
|
14
|
+
} & React.InputHTMLAttributes<HTMLInputElement>;
|
|
15
|
+
export declare function Input({ variant, className, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare namespace Input {
|
|
17
|
+
var displayName: string;
|
|
18
|
+
}
|
|
19
|
+
export {};
|
package/dist/types/index.d.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,79 +1,79 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "@youngduck/yd-ui",
|
|
3
|
-
"version": "0.1
|
|
4
|
-
"type": "module",
|
|
5
|
-
"main": "./dist/index.cjs.js",
|
|
6
|
-
"module": "./dist/index.esm.js",
|
|
7
|
-
"types": "./dist/index.d.ts",
|
|
8
|
-
"exports": {
|
|
9
|
-
".": {
|
|
10
|
-
"import": "./dist/index.esm.js",
|
|
11
|
-
"require": "./dist/index.cjs.js",
|
|
12
|
-
"types": "./dist/index.d.ts"
|
|
13
|
-
},
|
|
14
|
-
"./styles": "./dist/index.css",
|
|
15
|
-
"./dist/*": "./dist/*",
|
|
16
|
-
"./package.json": "./package.json"
|
|
17
|
-
},
|
|
18
|
-
"files": ["dist", "dist/index.css"],
|
|
19
|
-
"scripts": {
|
|
20
|
-
"build": "rollup -c",
|
|
21
|
-
"watch": "rollup -c -w",
|
|
22
|
-
"storybook": "storybook dev -p 6006",
|
|
23
|
-
"build-storybook": "storybook build",
|
|
24
|
-
"lint": "eslint src --ext .js,.jsx,.ts,.tsx",
|
|
25
|
-
"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
|
|
26
|
-
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
|
|
27
|
-
"format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx}\"",
|
|
28
|
-
"check": "npm run lint && npm run format:check"
|
|
29
|
-
},
|
|
30
|
-
"peerDependencies": {
|
|
31
|
-
"react": "^
|
|
32
|
-
"react-dom": "^
|
|
33
|
-
},
|
|
34
|
-
"devDependencies": {
|
|
35
|
-
"@babel/core": "^7.26.0",
|
|
36
|
-
"@babel/preset-env": "^7.26.0",
|
|
37
|
-
"@babel/preset-react": "^7.26.3",
|
|
38
|
-
"@chromatic-com/storybook": "^3.2.3",
|
|
39
|
-
"@eslint/js": "^9.32.0",
|
|
40
|
-
"@rollup/plugin-babel": "^6.0.4",
|
|
41
|
-
"@rollup/plugin-commonjs": "^28.0.2",
|
|
42
|
-
"@rollup/plugin-json": "^6.1.0",
|
|
43
|
-
"@rollup/plugin-node-resolve": "^16.0.0",
|
|
44
|
-
"@rollup/plugin-terser": "^0.4.4",
|
|
45
|
-
"@rollup/plugin-typescript": "^12.1.2",
|
|
46
|
-
"@storybook/addon-essentials": "^8.4.7",
|
|
47
|
-
"@storybook/addon-interactions": "^8.4.7",
|
|
48
|
-
"@storybook/addon-onboarding": "^8.4.7",
|
|
49
|
-
"@storybook/blocks": "^8.4.7",
|
|
50
|
-
"@storybook/react": "^8.4.7",
|
|
51
|
-
"@storybook/react-vite": "^8.4.7",
|
|
52
|
-
"@storybook/test": "^8.4.7",
|
|
53
|
-
"@types/react": "^19.0.2",
|
|
54
|
-
"@types/react-dom": "^19.0.2",
|
|
55
|
-
"autoprefixer": "^10.4.19",
|
|
56
|
-
"class-variance-authority": "^0.7.1",
|
|
57
|
-
"clsx": "^2.1.0",
|
|
58
|
-
"eslint": "^9.32.0",
|
|
59
|
-
"eslint-config-prettier": "^10.1.8",
|
|
60
|
-
"globals": "^16.3.0",
|
|
61
|
-
"jiti": "^2.5.1",
|
|
62
|
-
"prettier": "^3.6.2",
|
|
63
|
-
"react": "^19.
|
|
64
|
-
"react-dom": "^19.
|
|
65
|
-
"rollup": "^4.29.1",
|
|
66
|
-
"rollup-plugin-dts": "^6.1.1",
|
|
67
|
-
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
68
|
-
"rollup-plugin-postcss": "^4.0.2",
|
|
69
|
-
"storybook": "^8.4.7",
|
|
70
|
-
"tslib": "^2.8.1",
|
|
71
|
-
"typescript": "^5.7.2",
|
|
72
|
-
"typescript-eslint": "^8.38.0"
|
|
73
|
-
},
|
|
74
|
-
"dependencies": {
|
|
75
|
-
"@tailwindcss/postcss": "^4.1.11",
|
|
76
|
-
"postcss": "^8.5.6",
|
|
77
|
-
"tailwindcss": "^4.1.11"
|
|
78
|
-
}
|
|
79
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "@youngduck/yd-ui",
|
|
3
|
+
"version": "0.3.1",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"main": "./dist/index.cjs.js",
|
|
6
|
+
"module": "./dist/index.esm.js",
|
|
7
|
+
"types": "./dist/index.d.ts",
|
|
8
|
+
"exports": {
|
|
9
|
+
".": {
|
|
10
|
+
"import": "./dist/index.esm.js",
|
|
11
|
+
"require": "./dist/index.cjs.js",
|
|
12
|
+
"types": "./dist/index.d.ts"
|
|
13
|
+
},
|
|
14
|
+
"./styles": "./dist/index.css",
|
|
15
|
+
"./dist/*": "./dist/*",
|
|
16
|
+
"./package.json": "./package.json"
|
|
17
|
+
},
|
|
18
|
+
"files": ["dist", "dist/index.css"],
|
|
19
|
+
"scripts": {
|
|
20
|
+
"build": "rollup -c",
|
|
21
|
+
"watch": "rollup -c -w",
|
|
22
|
+
"storybook": "storybook dev -p 6006",
|
|
23
|
+
"build-storybook": "storybook build",
|
|
24
|
+
"lint": "eslint src --ext .js,.jsx,.ts,.tsx",
|
|
25
|
+
"lint:fix": "eslint src --ext .js,.jsx,.ts,.tsx --fix",
|
|
26
|
+
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx}\"",
|
|
27
|
+
"format:check": "prettier --check \"src/**/*.{js,jsx,ts,tsx}\"",
|
|
28
|
+
"check": "npm run lint && npm run format:check"
|
|
29
|
+
},
|
|
30
|
+
"peerDependencies": {
|
|
31
|
+
"react": "^19.1.0",
|
|
32
|
+
"react-dom": "^19.1.0"
|
|
33
|
+
},
|
|
34
|
+
"devDependencies": {
|
|
35
|
+
"@babel/core": "^7.26.0",
|
|
36
|
+
"@babel/preset-env": "^7.26.0",
|
|
37
|
+
"@babel/preset-react": "^7.26.3",
|
|
38
|
+
"@chromatic-com/storybook": "^3.2.3",
|
|
39
|
+
"@eslint/js": "^9.32.0",
|
|
40
|
+
"@rollup/plugin-babel": "^6.0.4",
|
|
41
|
+
"@rollup/plugin-commonjs": "^28.0.2",
|
|
42
|
+
"@rollup/plugin-json": "^6.1.0",
|
|
43
|
+
"@rollup/plugin-node-resolve": "^16.0.0",
|
|
44
|
+
"@rollup/plugin-terser": "^0.4.4",
|
|
45
|
+
"@rollup/plugin-typescript": "^12.1.2",
|
|
46
|
+
"@storybook/addon-essentials": "^8.4.7",
|
|
47
|
+
"@storybook/addon-interactions": "^8.4.7",
|
|
48
|
+
"@storybook/addon-onboarding": "^8.4.7",
|
|
49
|
+
"@storybook/blocks": "^8.4.7",
|
|
50
|
+
"@storybook/react": "^8.4.7",
|
|
51
|
+
"@storybook/react-vite": "^8.4.7",
|
|
52
|
+
"@storybook/test": "^8.4.7",
|
|
53
|
+
"@types/react": "^19.0.2",
|
|
54
|
+
"@types/react-dom": "^19.0.2",
|
|
55
|
+
"autoprefixer": "^10.4.19",
|
|
56
|
+
"class-variance-authority": "^0.7.1",
|
|
57
|
+
"clsx": "^2.1.0",
|
|
58
|
+
"eslint": "^9.32.0",
|
|
59
|
+
"eslint-config-prettier": "^10.1.8",
|
|
60
|
+
"globals": "^16.3.0",
|
|
61
|
+
"jiti": "^2.5.1",
|
|
62
|
+
"prettier": "^3.6.2",
|
|
63
|
+
"react": "^19.1.0",
|
|
64
|
+
"react-dom": "^19.1.0",
|
|
65
|
+
"rollup": "^4.29.1",
|
|
66
|
+
"rollup-plugin-dts": "^6.1.1",
|
|
67
|
+
"rollup-plugin-peer-deps-external": "^2.2.4",
|
|
68
|
+
"rollup-plugin-postcss": "^4.0.2",
|
|
69
|
+
"storybook": "^8.4.7",
|
|
70
|
+
"tslib": "^2.8.1",
|
|
71
|
+
"typescript": "^5.7.2",
|
|
72
|
+
"typescript-eslint": "^8.38.0"
|
|
73
|
+
},
|
|
74
|
+
"dependencies": {
|
|
75
|
+
"@tailwindcss/postcss": "^4.1.11",
|
|
76
|
+
"postcss": "^8.5.6",
|
|
77
|
+
"tailwindcss": "^4.1.11"
|
|
78
|
+
}
|
|
79
|
+
}
|