# Component/Button/IconButton

버튼을 눌러 특정한 동작을 수행할 수 있습니다. 위계와 기능에 따라 스타일이 나뉘므로 적절하게 사용해야 합니다.

## Props


| Name | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `variant` | `undefined "outlined"` | No | outlined |  |
| `color` | `undefined "primary" "secondary" "destructive"` | No | secondary |  |
| `icon` | `ReactElement<IconProps, string | JSXElementConstructor<any>> | undefined` | No |  | 렌더링 될 아이콘 요소  - Icon 컴포넌트 color props가 없다면 currentColor가 지정됩니다. |
| `size` | `undefined "small" "medium" "large" "xsmall" "xlarge" "xxlarge" "xxsmall"` | No | medium |  |
| `shape` | `undefined "rounded" "circle"` | No | rounded |  |
| `type` | `undefined "button" "submit" "reset"` | No | button |  |
| `fill` | `boolean | undefined` | No |  |  |
| `asChild` | `boolean | undefined` | No | false | true로 설정 시, 기본 DOM 요소를 렌더링하지 않고 자식 컴포넌트에 props와 동작을 전달합니다.  reference: https://www.radix-ui.com/primitives/docs/guides/composition |