@croquiscom/pds 16.56.1 → 16.56.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@croquiscom/pds",
-  "version": "16.56.1",
+  "version": "16.56.2",
   "description": "Design system for Zigzag's Partner Center",
   "main": "./dist/index.js",
   "module": "./dist/index.es.js",

package/pds-skills/SKILL.md

@@ -167,17 +167,32 @@ import { semantic_colors, spacing, shapes } from '@croquiscom/pds';
 
 ---
 
+## 아이콘 선택
+
+이모지 대신 정의된 PDS 아이콘 컴포넌트를 사용하라. 다른 오픈소스 라이브러리의 아이콘 이름을 추측하지 마라.
+
+- 아이콘 컴포넌트 선택: `resources/guides/guide-icon-mapping.md`
+  - **Read 전에 Grep**. 사용 맥락 키워드(예: `"닫기"`, `"더보기"`, `"알림"`, `"햄버거"`)로 검색하라.
+  - 표 첫 컬럼이 카테고리(`방향`, `액션`, `UI` 등 20종)이므로 매치 행만으로 분류·코드명·사용 맥락 즉시 파악.
+- 이모지/Unicode 기호 → 코드 매핑: `resources/guides/guide-icon-unicode-lookup.md`
+  - **Read 전에 Grep**. Unicode 문자나 이모지(예: `"⚠️"`, `"🔍"`, `"←"`, `"☰"`)로 직접 검색하라.
+  - 표 첫 컬럼이 Unicode 기호이므로 매치 행에 대응하는 PDS 아이콘 후보가 즉시 나온다.
+
+---
+
 ## Resources
 
 ### 가이드 문서 (`resources/guides/`)
 - `guide-common-mistakes.md`: 흔한 실수 (Common Mistakes)
 - `guide-foundation-usage.md`: Foundation 토큰 사용법
 - `guide-getting-started.md`: 시작하기
+- `guide-icon-mapping.md`: 아이콘 매핑 및 사용 가이드
+- `guide-icon-unicode-lookup.md`: 아이콘 Unicode 역방향 인덱스
 - `guide-style-utilities.md`: 스타일 유틸리티
 
 ### 컴포넌트 레퍼런스 (`resources/components/`)
 
-**인덱스**: `resources/index.txt` - 전체 컴포넌트 목록 (103개)
+**인덱스**: `resources/index.txt` - 전체 컴포넌트 목록 (105개)
 
 **파일 패턴** (Quick Reference의 "리소스" 컬럼 참조):
 - `{리소스}.props.txt` — Tier 1: Props 상세 (타입, 기본값, 설명)
@@ -194,8 +209,9 @@ import { semantic_colors, spacing, shapes } from '@croquiscom/pds';
 - [ ] Foundation 토큰을 사용했는가? (하드코딩 금지)
 - [ ] VStack/HStack 대신 Stack을 사용했는가?
 - [ ] CheckboxGroup, RadioGroup, Divider에 gap 대신 spacing을 사용했는가?
+- [ ] 이모지 대신 정의된 PDS 아이콘을 사용했는가? (mapping guide 참조)
 
 ---
 
-**문서 버전**: v16.56.1
-**마지막 업데이트**: 2026-04-23
+**문서 버전**: v16.56.2
+**마지막 업데이트**: 2026-05-04

package/pds-skills/resources/components/component-banner.props.txt

@@ -7,7 +7,7 @@
 |------|------|----------|---------|-------------|
 | `className` | `string | undefined` | No |  |  |
 | `kind` | `undefined "neutral" "info" "error" "warning" "success"` | No | info |  |
-| `size` | `undefined "xsmall" "small" "medium"` | No | medium |  |
+| `size` | `undefined "small" "medium" "xsmall"` | No | medium |  |
 | `direction` | `undefined "horizontal" "vertical"` | No | horizontal |  |
 | `iconComponent` | `ComponentType<IconProps> | undefined` | No |  | title 좌측에 렌더링 될 아이콘 요소  - title이 없을 경우 렌더되지 않습니다.  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 banner size 'medium'일경우 16, 'small'일경우 12로 고정됩니다. |
 | `showIcon` | `boolean | undefined` | No | true |  |

package/pds-skills/resources/components/component-button-accordionbutton.props.txt

@@ -5,7 +5,7 @@
 
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `size` | `undefined "xsmall" "medium"` | No | medium |  |
+| `size` | `undefined "medium" "xsmall"` | No | medium |  |
 | `leftAddon` | `ReactNode` | No |  | Label 좌측 렌더링될 Addon 요소 |
 | `opened` | `boolean | undefined` | No |  | Label 우측 화살표 오픈 상태 여부 |
 | `fill` | `boolean | undefined` | No | false | 너비 100% 사용 여부 |

package/pds-skills/resources/components/component-button-button.props.txt

@@ -7,7 +7,7 @@
 |------|------|----------|---------|-------------|
 | `fill` | `boolean | undefined` | No |  |  |
 | `kind` | `undefined "primary" "secondary" "black" "negative" "outlined_primary" "outlined_secondary" "outlined_black" "outlined_negative"` | No | secondary |  |
-| `size` | `undefined "xsmall" "medium" "large" "xlarge" "xxlarge"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall" "xlarge" "xxlarge"` | No | medium |  |
 | `loading` | `boolean | undefined` | No | false |  |
 | `startIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 좌측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
 | `endIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 우측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |

package/pds-skills/resources/components/component-button-iconbutton.props.txt

@@ -7,7 +7,7 @@
 |------|------|----------|---------|-------------|
 | `kind` | `undefined "outlined_primary" "outlined_secondary" "outlined_negative"` | No | outlined_secondary | shape 속성이 'circle'의 경우 적용되지 않습니다. |
 | `icon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 없다면 currentColor가 지정됩니다. |
-| `size` | `undefined "xsmall" "medium" "large" "xlarge" "xxlarge" "xxsmall"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall" "xxsmall" "xlarge" "xxlarge"` | No | medium |  |
 | `shape` | `undefined "rectangle" "circle"` | No | rectangle |  |
 | `fill` | `boolean | undefined` | No |  |  |
 | `type` | `undefined "submit" "reset" "button"` | No | button |  |

package/pds-skills/resources/components/component-button-popoverbutton.props.txt

@@ -6,7 +6,7 @@
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
 | `useIconButton` | `boolean | undefined` | No | false |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium' |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium' |  |
 | `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
 | `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
 | `optionsMatchRefWidth` | `boolean | undefined` | No | false |  |
@@ -21,7 +21,7 @@
 | `fill` | `boolean | undefined` | No |  |  |
 | `startIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 좌측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
 | `endIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 우측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
-| `loading` | `boolean | undefined` | No | false |  |
 | `type` | `undefined "submit" "reset" "button"` | No | 'button' |  |
+| `loading` | `boolean | undefined` | No | false |  |
 | `asChild` | `boolean | undefined` | No | false | true로 설정 시, 기본 DOM 요소를 렌더링하지 않고 자식 컴포넌트에 props와 동작을 전달합니다.  reference: https://www.radix-ui.com/primitives/docs/guides/composition |
 | `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |

package/pds-skills/resources/components/component-chip-inputchip.props.txt

@@ -5,6 +5,6 @@
 
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium |  |
 | `canDelete` | `boolean | undefined` | No | true |  |
 | `onDelete` | `(() => void) | undefined` | No |  |  |

package/pds-skills/resources/components/component-chipinput.props.txt

@@ -8,7 +8,7 @@
 | `value` | `ChipInputValue[] | undefined` | No |  |  |
 | `disabled` | `boolean | undefined` | No |  |  |
 | `placeholder` | `string | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium |  |
 | `status` | `undefined "info" "error" "success"` | No | info | `error` 이외에 상태는 별도로 UI상 표시되지 않습니다. |
 | `wrap` | `undefined "wrap" "nowrap"` | No | nowrap | 칩 목록은 한 줄로 제한하거나 개행되도록 할 수 있습니다.  - `nowrap`: 칩이 인풋의 너비를 초과하면 수평으로 스크롤됩니다. - `wrap`: 칩이 인풋의 너비를 초과하면 수직으로 스크롤됩니다. |
 | `width` | `number | undefined` | No |  |  |

package/pds-skills/resources/components/component-colorpicker.props.txt

@@ -9,7 +9,7 @@
 | `value` | `string | undefined` | No | defaultValue || '' | hex color code (ex: #FFFFFF) |
 | `onChange` | `(code: string) => void` | Yes |  | @param code hex color code (ex: FFFFFF, #FFFFFF6D) |
 | `disabled` | `boolean | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "xxsmall"` | No | 'medium' |  |
+| `size` | `undefined "medium" "xsmall" "xxsmall"` | No | 'medium' |  |
 | `layout` | `undefined "preset" "custom"` | No | custom | preset props이 없으면 layout=preset이 적용되지 않습니다. |
 | `alpha` | `boolean | undefined` | No |  |  |
 | `hueOnly` | `boolean | undefined` | No | false |  |

package/pds-skills/resources/components/component-control-radio.props.txt

@@ -10,4 +10,4 @@
 | `className` | `string | undefined` | No |  |  |
 | `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |
 | `radioItemType` | `undefined "default" "box"` | No | default |  |
-| `size` | `undefined "xsmall" "small" "medium" "large"` | No | medium | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |
+| `size` | `undefined "small" "medium" "large" "xsmall"` | No | medium | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |

package/pds-skills/resources/components/component-control-radiogroup-boxradio.props.txt

@@ -18,5 +18,5 @@
 | `keyExtractor` | `((item: RadioItem<RadioValue>, index: number) => string | number) | undefined` | No |  |  |
 | `onChange` | `((value: RadioValue) => void) | undefined` | No |  |  |
 | `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |
-| `size` | `undefined "xsmall" "small" "medium" "large"` | No |  | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |
+| `size` | `undefined "small" "medium" "large" "xsmall"` | No |  | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |
 | `ref` | `Ref<RadioGroupInstance<RadioValue>> | undefined` | No |  |  |

package/pds-skills/resources/components/component-control-radiogroup-radio.props.txt

@@ -18,5 +18,5 @@
 | `keyExtractor` | `((item: RadioItem<RadioValue>, index: number) => string | number) | undefined` | No |  |  |
 | `onChange` | `((value: RadioValue) => void) | undefined` | No |  |  |
 | `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |
-| `size` | `undefined "xsmall" "small" "medium" "large"` | No |  | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |
+| `size` | `undefined "small" "medium" "large" "xsmall"` | No |  | radioItemType - default일 경우 'small', 'medium', 'large'만 적용되며 default값은 'medium'입니다.  radioItemType - box일 경우 'xsmall', 'medium', 'large'만 적용되며 default값은 'medium'입니다. |
 | `ref` | `Ref<RadioGroupInstance<RadioValue>> | undefined` | No |  |  |

package/pds-skills/resources/components/component-control-segmentedcontrol.props.txt

@@ -8,7 +8,7 @@
 | `className` | `string | undefined` | No |  |  |
 | `defaultValue` | `string | undefined` | No |  |  |
 | `value` | `string | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium |  |
 | `items` | `SegmentedControlOptionType[]` | Yes |  |  |
 | `width` | `undefined "fill" "auto"` | No | auto |  |
 | `disabled` | `boolean | undefined` | No | false |  |

package/pds-skills/resources/components/component-datepickerv2-datepickerv2.props.txt

@@ -11,7 +11,7 @@
 | `unit` | `undefined "month" "week" "day" "decade" "year" "minute" "second"` | No | day | 달력의 최소 시간 단위를 설정합니다. 시간을 선택하려면 "minute" 또는 "second"를 지정합니다. |
 | `target` | `undefined "all" "from" "to"` | No |  | 달력이 편집할 수 있는 항목을 지정합니다. - 지정하지 않으면 range 입력으로 구성되어 시작일, 종료일을 차례대로 선택할 수 있습니다. - "from"으로 지정하면 range 입력에서 시작일만 선택할 수 있고, 종료일은 비활성화됩니다. - "to"로 지정하면 range 입력에서 종료일만 선택할 수 있고, 시작일은 비활성화됩니다. - "all"로 지정하면 단일 날짜 선택으로 인식해서, 시작일/종료일을 모두 한 번에 선택합니다. |
 | `width` | `CSSValueWithLength | undefined` | No | 100% | Input 너비를 지정할 수 있습니다. |
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium | Input size를 지정할 수 있습니다. |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium | Input size를 지정할 수 있습니다. |
 | `error` | `boolean | undefined` | No |  | Input의 에러 표시 여부를 지정합니다. |
 | `disabled` | `boolean | undefined` | No |  |  |
 | `className` | `string | undefined` | No |  |  |

package/pds-skills/resources/components/component-dropdown.props.txt

@@ -9,7 +9,7 @@
 | `width` | `CSSValueWithLength | undefined` | No |  |  |
 | `maxHeight` | `number | undefined` | No | 400 |  |
 | `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium' |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium' |  |
 | `labelHeight` | `CSSValueWithLength | undefined` | No |  |  |
 | `optionItemHeight` | `number | undefined` | No |  |  |
 | `disabled` | `boolean | undefined` | No |  |  |

package/pds-skills/resources/components/component-dropdowncomposite.props.txt

@@ -6,7 +6,7 @@
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
 | `dropdownProps` | `DropdownCompositeDropdownOption<OptionValue>` | Yes |  |  |
-| `inputProps` | `Pick<InputProps, "value" | "onChange" | "placeholder" | "width">` | Yes |  |  |
+| `inputProps` | `Pick<InputProps, "value" | "onChange" | "width" | "placeholder">` | Yes |  |  |
 | `disabled` | `boolean | undefined` | No |  |  |
 | `onSubmit` | `(({ dropdownValue }: { dropdownValue?: OptionValue | undefined; }) => void) | undefined` | No |  |  |
 | `onReset` | `(({ dropdownValue }: { dropdownValue?: OptionValue | undefined; }) => void) | undefined` | No |  |  |

package/pds-skills/resources/components/component-dropdownfilter.props.txt

@@ -7,7 +7,7 @@
 |------|------|----------|---------|-------------|
 | `value` | `OptionValue[] | undefined` | No |  |  |
 | `label` | `string` | Yes |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium' |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium' |  |
 | `defaultValues` | `OptionValue[] | undefined` | No | [] | DropDownFilter 초기값 초기화시, DefaultValues가 있을 경우 DefaultValues를 사용하고, 없을 경우 빈 배열을 사용합니다. |
 | `selectionGroup` | `DropdownFilterGroupOption<OptionValue>[] | undefined` | No | [] | 옵션을 selection 그룹으로 묶을때 사용합니다. selectionGroup이 있을 경우 options는 무시됩니다. |
 | `options` | `DropdownFilterOption<OptionValue>[] | undefined` | No | [] | 각 옵션 값들은 라벨 앞 자동으로 체크박스가 생성되며, 선택된 옵션값은 체크박스로 표시됩니다. |
@@ -22,11 +22,11 @@
 | `onChange` | `((value: OptionValue[]) => void) | undefined` | No |  |  |
 | `className` | `string | undefined` | No |  |  |
 | `disabled` | `boolean | undefined` | No |  |  |
-| `status` | `undefined "error"` | No |  |  |
-| `width` | `CSSValueWithLength | undefined` | No |  |  |
 | `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
 | `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
 | `maxHeight` | `number | undefined` | No | DEFAULT_DROPDOWN_MAX_HEIGHT |  |
+| `status` | `undefined "error"` | No |  |  |
+| `width` | `CSSValueWithLength | undefined` | No |  |  |
 | `keyExtractor` | `((item: DropdownOption<OptionValue>, index: number) => string | number) | undefined` | No |  |  |
 | `labelHeight` | `CSSValueWithLength | undefined` | No |  |  |
 | `optionItemHeight` | `number | undefined` | No |  |  |

package/pds-skills/resources/components/component-dropdowninput.props.txt

@@ -14,14 +14,14 @@
 | `options` | `DropdownInputOption<OptionValue>[]` | Yes |  |  |
 | `keyExtractor` | `((item: DropdownInputOption<OptionValue>, index: number) => string | number) | undefined` | No |  |  |
 | `optionFilter` | `((inputValue: string, item: DropdownInputOption<OptionValue>, index: number) => boolean) | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium' |  |
-| `disabled` | `boolean | undefined` | No |  |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium' |  |
 | `value` | `string | number | undefined` | No |  |  |
-| `status` | `undefined "error"` | No |  |  |
-| `placeholder` | `string | undefined` | No |  |  |
-| `width` | `CSSValueWithLength | undefined` | No |  |  |
+| `disabled` | `boolean | undefined` | No |  |  |
 | `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
 | `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
+| `status` | `undefined "error"` | No |  |  |
+| `width` | `CSSValueWithLength | undefined` | No |  |  |
+| `placeholder` | `string | undefined` | No |  |  |
 | `optionItemHeight` | `number | undefined` | No |  |  |
 | `enableVirtualScroll` | `boolean | undefined` | No | false |  |
 | `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |

package/pds-skills/resources/components/component-dropdownmultiselect.props.txt

@@ -11,14 +11,14 @@
 | `allCheck` | `boolean | undefined` | No | false | DropdownFilter Option들의 전체 선택 여부 |
 | `onChange` | `((value: OptionValue[]) => void) | undefined` | No |  |  |
 | `className` | `string | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium' |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium' |  |
 | `disabled` | `boolean | undefined` | No |  |  |
-| `status` | `undefined "error"` | No |  |  |
-| `placeholder` | `string | undefined` | No |  |  |
-| `width` | `CSSValueWithLength | undefined` | No |  |  |
 | `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
 | `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
 | `optionsMatchRefWidth` | `boolean | undefined` | No | true |  |
+| `status` | `undefined "error"` | No |  |  |
+| `width` | `CSSValueWithLength | undefined` | No |  |  |
+| `placeholder` | `string | undefined` | No |  |  |
 | `keyExtractor` | `((item: DropdownOption<OptionValue>, index: number) => string | number) | undefined` | No |  |  |
 | `labelHeight` | `CSSValueWithLength | undefined` | No |  |  |
 | `optionItemHeight` | `number | undefined` | No |  |  |

package/pds-skills/resources/components/component-input.props.txt

@@ -5,7 +5,7 @@
 
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium'
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium'
 'medium' |  |
 | `alignment` | `undefined "center" "left" "right"` | No | 'left' |  |
 | `status` | `undefined "info" "error" "success"` | No | info |  |

package/pds-skills/resources/components/component-inputstepper.props.txt

@@ -6,6 +6,6 @@
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
 | `width` | `CSSValueWithLength | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "small" "medium" "large"` | No | medium |  |
+| `size` | `undefined "small" "medium" "large" "xsmall"` | No | medium |  |
 | `status` | `undefined "info" "error"` | No |  | min, max validation보다 우선합니다 |
 | `onChange` | `((value: number | null, validValue?: number | undefined) => void) | undefined` | No |  |  |

package/pds-skills/resources/components/component-modal-alertmodal.props.txt

@@ -18,9 +18,9 @@
 | `__floatingPortalId` | `string | undefined` | No |  | @internal 내부 사용을 위한 floatingPortalId |
 | `className` | `string | undefined` | No |  |  |
 | `fill` | `boolean | undefined` | No | false |  |
+| `zIndex` | `number | undefined` | No | getZIndex('modal') |  |
 | `opened` | `boolean | undefined` | No |  |  |
 | `width` | `CSSValueWithLength | undefined` | No | 480 | Modal 너비를 지정할 수 있습니다. |
-| `zIndex` | `number | undefined` | No | getZIndex('modal') |  |
 | `canClickOutside` | `boolean | undefined` | No | true | outside 영역 클릭시 닫힘 사용 여부 |
 | `canCloseEscapeKey` | `boolean | undefined` | No | true | escapeKey 키이벤트 닫힘 사용 여부 |
 | `returnFocus` | `boolean | undefined` | No | true | reference 요소로 포커스 반환 여부 |

package/pds-skills/resources/components/component-modal-basicmodal.props.txt

@@ -48,7 +48,7 @@
 |------|------|----------|---------|-------------|
 | `fill` | `boolean | undefined` | No |  |  |
 | `kind` | `undefined "primary" "secondary" "black" "negative" "outlined_primary" "outlined_secondary" "outlined_black" "outlined_negative"` | No | secondary |  |
-| `size` | `undefined "xsmall" "medium" "large" "xlarge" "xxlarge"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall" "xlarge" "xxlarge"` | No | medium |  |
 | `loading` | `boolean | undefined` | No | false |  |
 | `startIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 좌측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
 | `endIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 우측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |

package/pds-skills/resources/components/component-modal-confirmmodal.props.txt

@@ -11,20 +11,20 @@
 | `autoFocusButton` | `ModalActionButtonType | null | undefined` | No | 'confirm' | autofocus 지정할 기본 버튼 요소 |
 | `className` | `string | undefined` | No |  |  |
 | `kind` | `undefined "info" "error" "warning" "success"` | No | 'info' |  |
+| `fill` | `boolean | undefined` | No | false |  |
 | `title` | `ReactNode` | Yes |  |  |
 | `onClose` | `(() => void | Promise<void>) | undefined` | No |  | onConfirm/onCancel이 호출된 직후 onClose가 호출됩니다. |
-| `fill` | `boolean | undefined` | No | false |  |
-| `opened` | `boolean | undefined` | No |  |  |
+| `zIndex` | `number | undefined` | No | getZIndex('modal') |  |
 | `text` | `ReactNode` | No |  |  |
+| `opened` | `boolean | undefined` | No |  |  |
 | `width` | `CSSValueWithLength | undefined` | No | 480 | Modal 너비를 지정할 수 있습니다. |
-| `zIndex` | `number | undefined` | No | getZIndex('modal') |  |
 | `canClickOutside` | `boolean | undefined` | No | true | outside 영역 클릭시 닫힘 사용 여부 |
 | `canCloseEscapeKey` | `boolean | undefined` | No | true | escapeKey 키이벤트 닫힘 사용 여부 |
 | `returnFocus` | `boolean | undefined` | No | true | reference 요소로 포커스 반환 여부 |
 | `onExited` | `(() => void) | undefined` | No |  | Modal destroy시 전달합니다. |
-| `subtext` | `ReactNode` | No |  |  |
 | `dense` | `boolean | undefined` | No |  |  |
 | `confirmText` | `string | undefined` | No |  |  |
 | `confirmButtonProps` | `ModalButtonProps | undefined` | No |  |  |
 | `onConfirm` | `(() => void | Promise<void>) | undefined` | No |  | confirmButton 클릭 이벤트 |
+| `subtext` | `ReactNode` | No |  |  |
 | `__floatingPortalId` | `string | undefined` | No |  | @internal 내부 사용을 위한 floatingPortalId |

package/pds-skills/resources/components/component-modal-floatingmodal.props.txt

@@ -45,7 +45,7 @@
 |------|------|----------|---------|-------------|
 | `fill` | `boolean | undefined` | No |  |  |
 | `kind` | `undefined "primary" "secondary" "black" "negative" "outlined_primary" "outlined_secondary" "outlined_black" "outlined_negative"` | No | secondary |  |
-| `size` | `undefined "xsmall" "medium" "large" "xlarge" "xxlarge"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall" "xlarge" "xxlarge"` | No | medium |  |
 | `loading` | `boolean | undefined` | No | false |  |
 | `startIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 좌측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
 | `endIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 우측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |

package/pds-skills/resources/components/component-modal-noticemodal.props.txt

@@ -14,8 +14,8 @@
 | `onCancel` | `((reason: ModalBaseCancelReason) => void) | undefined` | No |  | reason을 포함한 cancel 이벤트를 전달합니다.  - 'cancelClick' | 'escapeKeyPress' | 'overlayClick' |
 | `onChangeCheckReplay` | `((e: ChangeEvent<HTMLInputElement>) => void) | undefined` | No |  | 푸터 영역 좌측 체크박스 change 이벤트를 전달합니다. |
 | `className` | `string | undefined` | No |  |  |
-| `opened` | `boolean | undefined` | No |  |  |
 | `zIndex` | `number | undefined` | No | getZIndex('modal') |  |
+| `opened` | `boolean | undefined` | No |  |  |
 | `canClickOutside` | `boolean | undefined` | No | true | outside 영역 클릭시 닫힘 사용 여부 |
 | `canCloseEscapeKey` | `boolean | undefined` | No | true | escapeKey 키이벤트 닫힘 사용 여부 |
 | `returnFocus` | `boolean | undefined` | No | true | reference 요소로 포커스 반환 여부 |

package/pds-skills/resources/components/component-numericinput.props.txt

@@ -5,10 +5,10 @@
 
 | Name | Type | Required | Default | Description |
 |------|------|----------|---------|-------------|
-| `size` | `undefined "xsmall" "medium" "large"` | No | 'medium'
+| `size` | `undefined "medium" "large" "xsmall"` | No | 'medium'
 'medium' |  |
-| `leftAddon` | `string | undefined` | No |  | Input prefix 요소 |
 | `status` | `undefined "info" "error" "success"` | No | 'info' |  |
+| `leftAddon` | `string | undefined` | No |  | Input prefix 요소 |
 | `width` | `CSSValueWithLength | undefined` | No |  |  |
 | `startElement` | `ReactNode | ReactElement<IconProps, string | JSXElementConstructor<any>>` | No |  | 좌측 영역에 렌더링 될 요소 |
 | `endElement` | `ReactNode | ReactElement<IconProps, string | JSXElementConstructor<any>>` | No |  | 우측 영역에 렌더링 될 요소 |

package/pds-skills/resources/components/component-stack-stack.props.txt

@@ -15,8 +15,8 @@
 | `justify` | `JustifyContent | undefined` | No |  |  |
 | `gap` | `Gap<string | number> | undefined` | No |  |  |
 | `className` | `string | undefined` | No |  |  |
-| `height` | `CSSValueWithLength | undefined` | No |  |  |
 | `width` | `CSSValueWithLength | undefined` | No |  |  |
+| `height` | `CSSValueWithLength | undefined` | No |  |  |
 | `p` | `CSSValueWithLength | undefined` | No |  |  |
 | `mt` | `CSSValueWithLength | undefined` | No |  |  |
 | `m` | `CSSValueWithLength | undefined` | No |  |  |

package/pds-skills/resources/components/component-timepicker.props.txt

@@ -13,7 +13,7 @@
 | `readOnly` | `boolean | undefined` | No | false |  |
 | `disabledTime` | `((value: Date | null) => DisabledTimes) | undefined` | No |  |  |
 | `fill` | `boolean | undefined` | No | false | TimePicker 팝오버 너비 100% 사용여부  - Input 요소 만큼의 100% 너비를 가집니다.  - true 일 경우 footer(확인/취소) 버튼 속성은 자동 fill 처리됩니다. |
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium |  |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium |  |
 | `value` | `Date | undefined` | No |  |  |
 | `onClose` | `(() => void) | undefined` | No |  |  |
 | `onOpen` | `(() => void) | undefined` | No |  |  |

package/pds-skills/resources/components/component-timerangepicker.props.txt

@@ -9,16 +9,16 @@
 | `onChange` | `((start: Date | null, end: Date | null) => void) | undefined` | No |  |  |
 | `disabledTime` | `((value: Date | null, range?: "from" | "to" | undefined) => DisabledTimes) | undefined` | No |  |  |
 | `className` | `string | undefined` | No |  |  |
+| `fill` | `boolean | undefined` | No | false | TimePicker 팝오버 너비 100% 사용여부  - Input 요소 만큼의 100% 너비를 가집니다.  - true 일 경우 footer(확인/취소) 버튼 속성은 자동 fill 처리됩니다. |
+| `size` | `undefined "medium" "large" "xsmall"` | No | medium |  |
 | `error` | `boolean | undefined` | No |  |  |
-| `size` | `undefined "xsmall" "medium" "large"` | No | medium |  |
 | `onClose` | `(() => void) | undefined` | No |  |  |
-| `fill` | `boolean | undefined` | No | false | TimePicker 팝오버 너비 100% 사용여부  - Input 요소 만큼의 100% 너비를 가집니다.  - true 일 경우 footer(확인/취소) 버튼 속성은 자동 fill 처리됩니다. |
 | `disabled` | `boolean | undefined` | No |  |  |
-| `readOnly` | `boolean | undefined` | No | false |  |
-| `width` | `CSSValueWithLength | undefined` | No | 100% | Input 너비를 지정할 수 있습니다. |
 | `zIndex` | `number | undefined` | No | getZIndex('picker') |  |
-| `showRemoveButton` | `boolean | undefined` | No | false | Input 우측에 값 지우기 버튼 표시 여부  true: 값이 있을 때 마우스 호버 시 지우기(X) 버튼 표시 false: 항상 시계 아이콘만 표시 값이 없을 때는 설정과 관계없이 시계 아이콘이 표시됩니다. |
+| `width` | `CSSValueWithLength | undefined` | No | 100% | Input 너비를 지정할 수 있습니다. |
+| `readOnly` | `boolean | undefined` | No | false |  |
 | `onOpen` | `(() => void) | undefined` | No |  |  |
+| `showRemoveButton` | `boolean | undefined` | No | false | Input 우측에 값 지우기 버튼 표시 여부  true: 값이 있을 때 마우스 호버 시 지우기(X) 버튼 표시 false: 항상 시계 아이콘만 표시 값이 없을 때는 설정과 관계없이 시계 아이콘이 표시됩니다. |
 | `incrementMinute` | `number | undefined` | No | 1 | 지정된 배수 단위로 분 설정이 가능합니다. |
 | `hideDisabledMinutes` | `boolean | undefined` | No | false | 비활성화된 분 항목을 목록에서 숨길지 여부  true: disabledMinutes로 비활성화된 분 항목이 목록에서 완전히 제거됩니다. false: 비활성화된 분 항목이 목록에 표시되지만 선택 불가능합니다. |
 | `usePortal` | `boolean | undefined` | No | true |  |

package/pds-skills/resources/components/component-upload-fileuploadbutton.props.txt

@@ -8,5 +8,5 @@
 | `label` | `ReactNode` | Yes | '파일 업로드' |  |
 | `multiple` | `boolean | undefined` | No | false |  |
 | `loading` | `boolean | undefined` | No |  |  |
-| `buttonProps` | `Omit<ButtonProps, "loading" | "disabled" | "onClick"> | undefined` | No |  |  |
+| `buttonProps` | `Omit<ButtonProps, "disabled" | "onClick" | "loading"> | undefined` | No |  |  |
 | `onFileUpload` | `((file: File | File[]) => void) | undefined` | No |  |  |