# Component/Button/PopoverButton

버튼을 밖에 모두 꺼내놓기에 공간이 부족한 경우 유사한 기능들을 하나의 그룹으로 묶어서 보여줄 때 사용합니다. 단순히 여러 항목 중 하나를 선택하는 거라면 Dropdown을 사용해주세요.

## Props


| Name | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `useIconButton` | `boolean | undefined` | No | false |  |
| `size` | `undefined "xsmall" "small" "medium" "large"` | No | 'medium' |  |
| `autoPlacement` | `boolean | undefined` | No | true | floating 요소가 reference 영역을 넘어갈 경우 자동 위치 처리 사용 유무  - 자동 위치 상/하만 적용됩니다. |
| `zIndex` | `number | undefined` | No | getZIndex('dropdown') |  |
| `optionsMatchRefWidth` | `boolean | undefined` | No | false |  |
| `maxHeight` | `number | undefined` | No | 400 | Popover OptionList maxHeight값 |
| `disabled` | `boolean | undefined` | No |  |  |
| `value` | `string | number | undefined` | No |  |  |
| `kind` | `undefined "primary" "secondary" "black" "negative" "outlined_primary" "outlined_secondary" "outlined_black" "outlined_negative"` | No | outlined_secondary | IconButton과 동시 지원을 위해 IconButtonKind로 제한합니다. |
| `icon` | `ReactElement<IconProps, string | JSXElementConstructor<unknown>> | undefined` | No |  |  |
| `onChange` | `((value: OptionValue) => void) | undefined` | No |  |  |
| `options` | `DropdownOption<OptionValue>[]` | Yes |  |  |
| `renderButton` | `(({ buttonProps, }: { buttonProps: { onClick: (e: MouseEvent<Element, MouseEvent>) => void; } & Record<string, unknown>; }) => ReactNode) | undefined` | No |  | 커스텀 버튼 렌더링 함수 |
| `type` | `undefined "button" "submit" "reset"` | No | 'button' |  |
| `fill` | `boolean | undefined` | No |  |  |
| `startIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 좌측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
| `loading` | `boolean | undefined` | No | false |  |
| `endIcon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 버튼 우측 영역에 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 있더라도 kind 따라 currentColor가 지정됩니다.  - Icon 컴포넌트 size props가 있더라도 Icon 사이즈는 ButtonSize에 따라 고정됩니다. |
| `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 반환값을 제어할 수 있습니다. |