# Component/ChipInput

내용을 직접 입력하여 칩 형태로 추가할 수 있습니다.

## Props


| Name | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `value` | `ChipInputValue[] | undefined` | No |  |  |
| `disabled` | `boolean | undefined` | No |  |  |
| `placeholder` | `string | undefined` | No |  |  |
| `size` | `undefined "xsmall" "small" "medium" "large"` | No | medium |  |
| `status` | `undefined "info" "error" "success"` | No | info | `error` 이외에 상태는 별도로 UI상 표시되지 않습니다. |
| `wrap` | `undefined "wrap" "nowrap"` | No | nowrap | 칩 목록은 한 줄로 제한하거나 개행되도록 할 수 있습니다.  - `nowrap`: 칩이 인풋의 너비를 초과하면 수평으로 스크롤됩니다. - `wrap`: 칩이 인풋의 너비를 초과하면 수직으로 스크롤됩니다. |
| `width` | `number | undefined` | No |  |  |
| `maxHeight` | `number | "infinite" | undefined` | No |  | `wrap` prop이 `"wrap"`인 경우 최대 높이를 지정할 수 있습니다. 최대 높이를 초과하면 수직으로 스크롤됩니다. `maxHeight` prop이 지정되지 않으면 `size` prop에 따라 기본 높이가 적용됩니다.(small: 66px, medium: 80px, large: 90px) infinite 적용시 value 만큼 높이가 증가합니다. |
| `draggable` | `boolean | undefined` | No | false | draggable이 true인 경우 칩을 드래그하여 재정렬할 수 있습니다. |
| `className` | `string | undefined` | No |  |  |
| `style` | `CSSProperties | undefined` | No |  |  |
| `z_index` | `number | undefined` | No | getZIndex('draggable') | DragOverlay의 z-index를 지정합니다. |
| `onChange` | `((value: ChipInputValue[]) => void) | undefined` | No |  |  |
| `unstableFocusVisible` | `boolean | undefined` | No |  | react-aria useFocusRing isFocusVisible 반환값을 제어할 수 있습니다. |