@idbrnd/design-system 1.3.2 → 1.3.4

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/README.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @idbrnd/design-system
2
2
 
3
- ![Version](https://img.shields.io/badge/version-1.3.2-4B5FE1?style=flat-square)
3
+ ![Version](https://img.shields.io/badge/version-1.3.4-4B5FE1?style=flat-square)
4
4
  ![React](https://img.shields.io/badge/React-18.3.1-61DAFB?style=flat-square&logo=react&logoColor=white)
5
5
  ![Vite](https://img.shields.io/badge/Vite-7.3.0-646CFF?style=flat-square&logo=vite&logoColor=white)
6
6
  ![TypeScript](https://img.shields.io/badge/TypeScript-5.9.3-3178C6?style=flat-square&logo=typescript&logoColor=white)
@@ -552,7 +552,7 @@ function SelectExample() {
552
552
  | `required` | `boolean` | `false` | 라벨 우측 `*` 표시 여부 |
553
553
  | `leadingContent` | `ReactNode` | — | 트리거 텍스트 좌측에 표시할 아이콘 등 |
554
554
  | `description` | `ReactNode` | — | 하단 안내 문구 |
555
- | `placeholder` | `string` | `"선택해주세요."` | 미선택 시 표시할 텍스트 |
555
+ | `placeholder` | `ReactNode` | `"선택해주세요."` | 미선택 시 표시할 콘텐츠. 문자열 또는 JSX 전달 가능 |
556
556
  | `disabled` | `boolean` | `false` | 비활성화 |
557
557
  | `type` | `"basic"` \| `"search"` | `"basic"` | `"search"` 시 드롭다운 상단에 검색 입력란 표시, 실시간 필터링 |
558
558
  | `align` | `"left"` \| `"center"` | `"left"` | 옵션 텍스트 정렬 |
@@ -567,7 +567,9 @@ function SelectExample() {
567
567
  - `variant`를 직접 지정하지 않아도 열림/선택 상태에 따라 `choosing` → `selected`로 자동 전환됩니다.
568
568
  - `variant="error"`는 자동 전환되지 않으므로 직접 지정해야 합니다.
569
569
  - 드롭다운 목록은 `document.body`에 포탈로 렌더링됩니다.
570
- - 긴 옵션 라벨은 말줄임 처리되며, hover 시 툴팁으로 전체 텍스트가 표시됩니다.
570
+ - 긴 옵션 라벨은 말줄임 처리되며, hover 시 툴팁으로 전체 텍스트가 표시됩니다. 트리거 버튼의 선택된 값도 동일하게 동작합니다.
571
+ - `placeholder`에 문자열 대신 JSX를 전달하면 커스텀 플레이스홀더를 렌더링할 수 있습니다.
572
+ - 옵션이 비어있을 때: `type="search"`에서 검색어가 있으면 "검색 결과가 없습니다.", 그 외에는 `-`가 표시됩니다.
571
573
 
572
574
  ---
573
575
 
@@ -38,10 +38,11 @@ export interface SelectProps {
38
38
  * - `true`: 비활성화
39
39
  */
40
40
  disabled?: boolean;
41
- /** 플레이스홀더 텍스트.
42
- * - 플레이스홀더 텍스트 없으면 미표시 (기본값)
41
+ /** 플레이스홀더.
42
+ * - 문자열 또는 ReactNode를 전달할 수 있음
43
+ * - 미전달 시 '선택해주세요.' 표시 (기본값)
43
44
  */
44
- placeholder?: string;
45
+ placeholder?: ReactNode;
45
46
  /** 현재 선택된 옵션. */
46
47
  value?: DropdownOption | null;
47
48
  /** 옵션 선택 시 콜백. */