2026-01-14 13:47:03 +01:00

28 lines
859 B
TypeScript

import { Button, Card } from '../ui'
export function WordSuggestions(params: {
showSuggestions: boolean
suggestions: string[]
selectedIndex: number
onSuggestionClick: (suggestion: string) => void
}): React.ReactElement | null {
if (!params.showSuggestions || params.suggestions.length === 0) {
return null
}
return (
<Card variant="default" className="absolute z-10 w-full mt-1 bg-white border-gray-300 shadow-lg max-h-40 overflow-y-auto">
{params.suggestions.map((suggestion, idx) => (
<Button
key={suggestion}
type="button"
variant="ghost"
onClick={() => params.onSuggestionClick(suggestion)}
className={`w-full text-left justify-start ${idx === params.selectedIndex ? 'bg-gray-100' : ''}`}
>
{suggestion}
</Button>
))}
</Card>
)
}