Eric Bailey
31 lines
768 B
TypeScript
31 lines
768 B
TypeScript
import {SiftItem} from '@bsky.app/sift'
|
|
|
|
import {atoms as a, useTheme} from '#/alf'
|
|
import {Text} from '#/components/Typography'
|
|
import {type AutocompleteItemProps} from './types'
|
|
|
|
export function AutocompleteItemEmoji({
|
|
active,
|
|
props,
|
|
item,
|
|
}: AutocompleteItemProps) {
|
|
const t = useTheme()
|
|
|
|
if (item.type !== 'emoji') return null
|
|
|
|
return (
|
|
<SiftItem
|
|
{...props}
|
|
style={s => [
|
|
{paddingVertical: 6, paddingHorizontal: 10},
|
|
a.flex_row,
|
|
a.align_center,
|
|
a.gap_sm,
|
|
active || s.hovered || s.pressed ? [t.atoms.bg_contrast_25] : [],
|
|
]}>
|
|
<Text style={[a.text_xl, a.leading_tight]}>{item.value}</Text>
|
|
<Text style={[a.text_md, a.leading_tight]}>:{item.emoji.id}:</Text>
|
|
</SiftItem>
|
|
)
|
|
}
|