boottent-design 0.1.260 → 0.1.262
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/dist/design-system/components/article-asset-card.md +1 -1
- package/dist/design-system/components/blog-review-card.md +1 -1
- package/dist/design-system/components/camp-card.md +1 -1
- package/dist/design-system/components/company-info-card.md +1 -1
- package/dist/design-system/components/dday-card.md +1 -1
- package/dist/design-system/components/environment-asset-photo.md +1 -1
- package/dist/design-system/components/event-asset-banner.md +1 -1
- package/dist/design-system/components/event-card.md +1 -1
- package/dist/design-system/components/lecturer-card.md +1 -1
- package/dist/design-system/components/main-banner-image.md +1 -1
- package/dist/design-system/components/mobile-camp-card.md +1 -1
- package/dist/design-system/components/partner-list-card.md +1 -1
- package/dist/design-system/components/portfolio-asset-card.md +1 -1
- package/dist/design-system/components/premium-card.md +1 -1
- package/dist/design-system/components/title-tag-card.md +1 -1
- package/dist/design-system/components/youtube-video-modal.md +1 -1
- package/dist/design-system/design-system.md +3 -2
- package/dist/design-system/tokens.md +1 -1
- package/dist/design-system/ui/accordion.md +1 -1
- package/dist/design-system/ui/alert-dialog.md +1 -1
- package/dist/design-system/ui/anchor.md +1 -1
- package/dist/design-system/ui/aspect-ratio.md +1 -1
- package/dist/design-system/ui/avatar.md +1 -1
- package/dist/design-system/ui/badge.md +1 -1
- package/dist/design-system/ui/button.md +1 -1
- package/dist/design-system/ui/calendar.md +1 -1
- package/dist/design-system/ui/callout.md +1 -1
- package/dist/design-system/ui/card-label.md +1 -1
- package/dist/design-system/ui/card.md +1 -1
- package/dist/design-system/ui/checkbox.md +1 -1
- package/dist/design-system/ui/circled-check-button.md +1 -1
- package/dist/design-system/ui/command.md +1 -1
- package/dist/design-system/ui/dialog.md +1 -1
- package/dist/design-system/ui/dropdown-menu.md +1 -1
- package/dist/design-system/ui/file-uploader.md +1 -1
- package/dist/design-system/ui/form.md +1 -1
- package/dist/design-system/ui/highlight-text.md +1 -1
- package/dist/design-system/ui/icons.md +1 -1
- package/dist/design-system/ui/image.md +1 -1
- package/dist/design-system/ui/input.md +1 -1
- package/dist/design-system/ui/label.md +1 -1
- package/dist/design-system/ui/month-picker.md +1 -1
- package/dist/design-system/ui/multi-select.md +1 -1
- package/dist/design-system/ui/navigation-menu.md +1 -1
- package/dist/design-system/ui/popover.md +1 -1
- package/dist/design-system/ui/portal.md +64 -0
- package/dist/design-system/ui/progress.md +1 -1
- package/dist/design-system/ui/radio-group.md +1 -1
- package/dist/design-system/ui/scroll-area.md +1 -1
- package/dist/design-system/ui/select.md +1 -1
- package/dist/design-system/ui/separator.md +1 -1
- package/dist/design-system/ui/simple-table.md +1 -1
- package/dist/design-system/ui/skeleton.md +1 -1
- package/dist/design-system/ui/slider.md +1 -1
- package/dist/design-system/ui/switch.md +1 -1
- package/dist/design-system/ui/symbols.md +1 -1
- package/dist/design-system/ui/tabs.md +1 -1
- package/dist/design-system/ui/tag.md +1 -1
- package/dist/design-system/ui/text.md +1 -1
- package/dist/design-system/ui/textarea.md +1 -1
- package/dist/design-system/ui/toast.md +9 -3
- package/dist/design-system/ui/toggle-group.md +1 -1
- package/dist/design-system/ui/toggle.md +1 -1
- package/dist/design-system/ui/tooltip.md +3 -1
- package/dist/design-system/usage.md +1 -1
- package/dist/design-system/when-to-use.md +3 -2
- package/dist/styles.css +1 -1
- package/dist/types/button.d.ts +1 -1
- package/dist/types/command.d.ts +6 -6
- package/dist/types/multi-select.d.ts +2 -2
- package/dist/types/portal.d.ts +179 -0
- package/dist/types/toast.d.ts +31 -2
- package/dist/types/toggle-group.d.ts +2 -2
- package/dist/types/toggle.d.ts +2 -2
- package/dist/types/tooltip.d.ts +2 -0
- package/dist/types/ui/accordion.d.ts +1 -1
- package/dist/types/ui/alert-dialog.d.ts +1 -1
- package/dist/types/ui/anchor.d.ts +1 -1
- package/dist/types/ui/aspect-ratio.d.ts +1 -1
- package/dist/types/ui/avatar.d.ts +1 -1
- package/dist/types/ui/badge.d.ts +1 -1
- package/dist/types/ui/button.d.ts +1 -1
- package/dist/types/ui/calendar.d.ts +1 -1
- package/dist/types/ui/callout.d.ts +1 -1
- package/dist/types/ui/card-label.d.ts +1 -1
- package/dist/types/ui/card.d.ts +1 -1
- package/dist/types/ui/checkbox.d.ts +1 -1
- package/dist/types/ui/circled-check-button.d.ts +1 -1
- package/dist/types/ui/command.d.ts +1 -1
- package/dist/types/ui/dialog.d.ts +1 -1
- package/dist/types/ui/dropdown-menu.d.ts +1 -1
- package/dist/types/ui/file-uploader.d.ts +1 -1
- package/dist/types/ui/form.d.ts +1 -1
- package/dist/types/ui/highlight-text.d.ts +1 -1
- package/dist/types/ui/icons.d.ts +1 -1
- package/dist/types/ui/image.d.ts +1 -1
- package/dist/types/ui/input.d.ts +1 -1
- package/dist/types/ui/label.d.ts +1 -1
- package/dist/types/ui/month-picker.d.ts +1 -1
- package/dist/types/ui/multi-select.d.ts +1 -1
- package/dist/types/ui/navigation-menu.d.ts +1 -1
- package/dist/types/ui/popover.d.ts +1 -1
- package/dist/types/ui/portal.d.ts +2 -0
- package/dist/types/ui/progress.d.ts +1 -1
- package/dist/types/ui/radio-group.d.ts +1 -1
- package/dist/types/ui/scroll-area.d.ts +1 -1
- package/dist/types/ui/select.d.ts +1 -1
- package/dist/types/ui/separator.d.ts +1 -1
- package/dist/types/ui/simple-table.d.ts +1 -1
- package/dist/types/ui/skeleton.d.ts +1 -1
- package/dist/types/ui/slider.d.ts +1 -1
- package/dist/types/ui/switch.d.ts +1 -1
- package/dist/types/ui/symbols.d.ts +1 -1
- package/dist/types/ui/tabs.d.ts +1 -1
- package/dist/types/ui/tag.d.ts +1 -1
- package/dist/types/ui/text.d.ts +1 -1
- package/dist/types/ui/textarea.d.ts +1 -1
- package/dist/types/ui/toast.d.ts +1 -1
- package/dist/types/ui/toggle-group.d.ts +1 -1
- package/dist/types/ui/toggle.d.ts +1 -1
- package/dist/types/ui/tooltip.d.ts +1 -1
- package/dist/types/ui.d.ts +44 -14
- package/dist/ui/portal.cjs.js +1 -0
- package/dist/ui/portal.es.js +561 -0
- package/dist/ui/toast.cjs.js +1 -1
- package/dist/ui/toast.es.js +202 -47
- package/dist/ui/tooltip.cjs.js +1 -1
- package/dist/ui/tooltip.es.js +48 -47
- package/dist/ui.cjs.js +1 -1
- package/dist/ui.es.js +61 -57
- package/package.json +1 -1
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — article-asset-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — blog-review-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — camp-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — company-info-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — dday-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — environment-asset-photo.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — event-asset-banner.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — event-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — lecturer-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — main-banner-image.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — mobile-camp-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — partner-list-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — portfolio-asset-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — premium-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — title-tag-card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> 조합형 컴포넌트 — youtube-video-modal.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> boottent-design 허브 — 먼저 이 문서를 읽고 필요한 스포크 문서로 이동하라.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
## 0. 원칙 (먼저 읽어라)
|
|
9
9
|
|
|
@@ -41,7 +41,7 @@ boottent-design은 모든 소비 앱의 **단일 진실 원천(SSOT)** 이다. U
|
|
|
41
41
|
|
|
42
42
|
## 4. 인벤토리
|
|
43
43
|
|
|
44
|
-
### 4.1 UI 프리미티브 (
|
|
44
|
+
### 4.1 UI 프리미티브 (46종)
|
|
45
45
|
|
|
46
46
|
| 컴포넌트 | 설명 | 문서 |
|
|
47
47
|
|----------|------|------|
|
|
@@ -72,6 +72,7 @@ boottent-design은 모든 소비 앱의 **단일 진실 원천(SSOT)** 이다. U
|
|
|
72
72
|
| `multi-select` | 여러 개의 옵션을 검색하고 칩(Badge) 형태로 다중 선택할 수 있는 컴포넌트입니다. | [ui/multi-select.md](./ui/multi-select.md) |
|
|
73
73
|
| `navigation-menu` | 웹사이트 전반에 걸친 상위 내비게이션 구조를 제공하며, 호버 시 하위 메뉴를 시각적으로 풍부하게 보여주… | [ui/navigation-menu.md](./ui/navigation-menu.md) |
|
|
74
74
|
| `popover` | 클릭이나 클릭 이외의 트리거로 인해 요소 근처에 부유하는 콘텐츠 박스를 보여주는 컴포넌트입니다. | [ui/popover.md](./ui/popover.md) |
|
|
75
|
+
| `portal` | 모달 · 다이얼로그 · 알럿 · 커스텀 오버레이를 명령형(imperative)으로 열고 닫는 포털 런타… | [ui/portal.md](./ui/portal.md) |
|
|
75
76
|
| `progress` | 작업의 완료율이나 진행 상태를 시각적으로 보여주는 프로그레스 바 컴포넌트입니다. | [ui/progress.md](./ui/progress.md) |
|
|
76
77
|
| `radio-group` | 여러 옵션 중 하나만 선택할 수 있게 하는 라디오 버튼 그룹 컴포넌트입니다. | [ui/radio-group.md](./ui/radio-group.md) |
|
|
77
78
|
| `scroll-area` | 브라우저 기본 스크롤바 대신 커스터마이징 가능한 세련된 스크롤바를 제공하는 컴포넌트입니다. | [ui/scroll-area.md](./ui/scroll-area.md) |
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — accordion.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — alert-dialog.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — anchor.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — aspect-ratio.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — avatar.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — badge.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — button.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — calendar.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — callout.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — card-label.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — card.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — checkbox.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — circled-check-button.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — command.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — dialog.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — dropdown-menu.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — file-uploader.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — form.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — highlight-text.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — icons.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — image.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — input.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — label.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — month-picker.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — multi-select.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — navigation-menu.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — popover.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
# ui/portal.md — boottent-design
|
|
2
|
+
|
|
3
|
+
> [!WARNING]
|
|
4
|
+
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
|
+
> UI 프리미티브 — portal.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
|
+
|
|
8
|
+
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
|
+
|
|
10
|
+
## portal
|
|
11
|
+
|
|
12
|
+
> 모달 · 다이얼로그 · 알럿 · 커스텀 오버레이를 명령형(imperative)으로 열고 닫는 포털 런타임입니다.
|
|
13
|
+
상태를 직접 관리하지 않고 `usePortal()`의 `confirm`/`alert`/`dialog`/`custom`을 호출하면 됩니다.
|
|
14
|
+
앱 루트에 `<PortalProvider />`를 한 번 mount 하면 됩니다. (토스트는 별도 시스템 `boottent-design/ui/toast` 를 사용하세요.)
|
|
15
|
+
|
|
16
|
+
### ✅ 언제 사용
|
|
17
|
+
- 삭제·결제 등 확인이 필요한 작업을 명령형으로 띄울 때 (`confirm`)
|
|
18
|
+
- 단순 안내/경고를 단일 버튼으로 띄울 때 (`alert`)
|
|
19
|
+
- 폼·상세 등 임의 콘텐츠를 헤더/푸터가 있는 다이얼로그로 띄울 때 (`dialog`)
|
|
20
|
+
- 완전히 자유로운 레이아웃의 오버레이가 필요할 때 (`custom`)
|
|
21
|
+
|
|
22
|
+
### 🚫 주의
|
|
23
|
+
- 컴포넌트 트리 안에서 선언적으로 여닫는 단순 모달이면 `boottent-design/ui/dialog`(Radix Dialog)를 직접 쓰는 편이 낫습니다.
|
|
24
|
+
- 앱 루트에 `<PortalProvider />`는 **정확히 한 번만** mount 하세요(중복 mount 시 오버레이가 두 번 렌더됩니다).
|
|
25
|
+
- `forceMount: true` 오버레이는 사용자가 닫을 수 없으며, `forceClosePortal(id)`로만 닫힙니다.
|
|
26
|
+
|
|
27
|
+
### Import
|
|
28
|
+
```tsx
|
|
29
|
+
import { /* ... */ } from "boottent-design/ui/portal";
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### 예시
|
|
33
|
+
```tsx
|
|
34
|
+
// 1) 앱 루트(레이아웃)에 한 번 mount
|
|
35
|
+
import { PortalProvider } from "boottent-design/ui/portal";
|
|
36
|
+
// <PortalProvider />
|
|
37
|
+
// 2) 어디서든 명령형으로 호출
|
|
38
|
+
import { usePortal } from "boottent-design/ui/portal";
|
|
39
|
+
function DeleteButton() {
|
|
40
|
+
const { confirm } = usePortal();
|
|
41
|
+
return (
|
|
42
|
+
<button
|
|
43
|
+
onClick={() =>
|
|
44
|
+
confirm({
|
|
45
|
+
title: "삭제하시겠어요?",
|
|
46
|
+
description: "이 작업은 되돌릴 수 없습니다.",
|
|
47
|
+
confirmText: "삭제",
|
|
48
|
+
onConfirm: () => {
|
|
49
|
+
// delete...
|
|
50
|
+
},
|
|
51
|
+
})
|
|
52
|
+
}
|
|
53
|
+
>
|
|
54
|
+
삭제
|
|
55
|
+
</button>
|
|
56
|
+
);
|
|
57
|
+
}
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
### 🔗 관련 · 대안
|
|
61
|
+
- Dialog
|
|
62
|
+
- AlertDialog
|
|
63
|
+
- ui/toast (useToast)
|
|
64
|
+
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — progress.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — radio-group.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — scroll-area.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — select.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — separator.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — simple-table.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
> [!WARNING]
|
|
4
4
|
> **자동 생성된 파일 — 직접 수정 금지** (`yarn docs:gen` 으로 재생성)
|
|
5
5
|
> UI 프리미티브 — skeleton.
|
|
6
|
-
> 버전: boottent-design v0.1.
|
|
6
|
+
> 버전: boottent-design v0.1.261 · 생성: 2026. 6. 29. 오후 4:02:50
|
|
7
7
|
|
|
8
8
|
[← 허브](../design-system.md) · [언제 무엇을 쓰나](../when-to-use.md)
|
|
9
9
|
|