# SPopover

> 자동 생성 문서 — `npm run docs:gen`. 소스: 각 컴포넌트의 Props/Handle 인터페이스 + import 의존성.

### SPopover

#### Props

| Prop | Type | Default | Description |
|------|------|---------|-------------|
| `open?` | `boolean` | — | 표시 여부 (제어). onOpenChange 와 함께 사용 |
| `defaultOpen?` | `boolean` | — | 기본 표시 여부 (비제어) |
| `placement?` | `SPopoverPlacement` | `'bottom'` | 표시 방향 |
| `type?` | `SPopoverType` | `'default'` | 색상 타입 (default: 다크 / danger·warning·accent: 라이트 배경) |
| `menuTitle` | `string` | — | 메뉴 제목 (필수) |
| `titleIcon?` | `SIconName` | — | 제목 좌측 아이콘 (선택) |
| `children?` | `ReactNode` | — | 본문 내용 |
| `trigger?` | `ReactNode` | — | 커스텀 트리거. 없으면 아이콘 트리거 렌더 |
| `icon?` | `SIconName` | `'helpOutline'` | 기본(아이콘) 트리거 설정 |
| `iconSize?` | `number` | `12` |  |
| `color?` | `SColor` | `'#01BB4B'` | 트리거 아이콘 색상. 팔레트 키(`grey_65`, `red_95` …) 또는 임의 CSS 색상 |
| `leftLinkLabel?` | `string` | — | 하단 좌측 링크 레이블 (선택). 스타일은 chevron 링크로 고정 |
| `buttonLabel` | `string` | — | 하단 우측 버튼 레이블 (필수). 색상/스타일은 type 별로 고정 |
| `ariaLabel?` | `string` | — |  |
| `menuClassName?` | `string` | — |  |
| `style?` | `CSSProperties` | — |  |

#### Events

| Event | Type | Description |
|-------|------|-------------|
| `onOpenChange` | `(open: boolean) => void` | 표시 상태 변경 (sdShowChange) |
| `onLeftLinkClick` | `() => void` | 하단 좌측 링크 클릭 |
| `onButtonClick` | `() => void` | 하단 우측 버튼 클릭 |

## Dependencies

### Depends on

- [SButton](../SButton)
- [SGhostButton](../SGhostButton)
- [SIcon](../SIcon)
- [STextLink](../STextLink)

### Graph

```mermaid
graph TD;
  SPopover --> SButton
  SPopover --> SGhostButton
  SPopover --> SIcon
  SPopover --> STextLink
  style SPopover fill:#f9f,stroke:#333,stroke-width:4px
```