<!-- source-hash: b3b4c24e822f3ccb1b39897c02cee900 -->
Renders an accessible autocomplete dropdown for slash commands, mapping each command to a `MingoOnboardingCard` row with unified icon resolution, keyboard/mouse highlight sync, and optional inline action buttons.

## Key Components

| Export | Type | Description |
|--------|------|-------------|
| `SlashCommandSuggestions` | `React.FC` | Main dropdown component; returns `null` when `commands` is empty |
| `SlashCommandSuggestionsProps` | `interface` | Props contract covering command list, highlight state, and action callbacks |

**Icon resolution priority (highest → lowest):**
1. `cmd.iconName` → `resolveOnboardingIcon` (v2 registry)
2. `cmd.primarySourceId` → consumer `resolveSourceIcon` (legacy fallback)
3. `FileIcon` (default inside `resolveOnboardingIcon`)

## Usage Example

```typescript
import { SlashCommandSuggestions } from './slash-command-suggestions'
import type { SlashCommandSummary } from './types'

function ChatInput() {
  const [commands, setCommands] = useState<SlashCommandSummary[]>([])
  const [highlightedIdx, setHighlightedIdx] = useState(0)

  return (
    <div className="relative">
      <SlashCommandSuggestions
        commands={commands}
        highlightedIdx={highlightedIdx}
        onHover={(idx) => setHighlightedIdx(idx)}
        onSelect={(cmd) => setValue(`/${cmd.id} `)}
        onAction={(cmd, actionId) => dispatch({ cmd, actionId })}
        className="absolute bottom-full"
      />
      <input ... />
    </div>
  )
}
```

## Accessibility Notes

- Outer container: `role="menu"` with `aria-label`
- Each row: `role="menuitem"` + `aria-current` on the highlighted item
- `Enter`/`Space` activate the focused row; arrow-key navigation is delegated to the parent input
- Action buttons call `stopPropagation` to prevent double-firing the row's `onSelect`