# Component/Banner

## Props


| Name | Type | Required | Default | Description |
|------|------|----------|---------|-------------|
| `className` | `string | undefined` | No |  |  |
| `kind` | `undefined "info" "success" "error" "neutral" "warning"` | No | info |  |
| `size` | `undefined "xsmall" "medium" "small"` | 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 |  |
| `title` | `string | undefined` | No |  |  |
| `message` | `ReactNode` | No |  |  |
| `actions` | `ReactNode` | No |  | 배너 우측에 렌더링 될 extra actions |
| `closeButton` | `boolean | undefined` | No | false | 배너 우측에 렌더링 될 CloseButton 사용 유무 |
| `onClose` | `(() => void) | undefined` | No |  |  |
