"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.MentionSuggestions = MentionSuggestions;
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const react_native_1 = require("react-native");
const __1 = require("../..");
const atoms_1 = require("../../lib/theme/atoms");
function MentionSuggestions({ authors, onSelect, highlightedIndex, }) {
    if (!authors || authors.size === 0) {
        return null; // No authors to display
    }
    const authorHandles = Array.from(authors.keys());
    const itemRefs = (0, react_1.useRef)(new Map());
    (0, react_1.useEffect)(() => {
        if (react_native_1.Platform.OS === "web") {
            const el = itemRefs.current.get(highlightedIndex);
            if (el) {
                el.scrollIntoView({ behavior: "smooth", block: "nearest" });
            }
        }
    }, [highlightedIndex]);
    return ((0, jsx_runtime_1.jsx)(__1.View, { style: [
            atoms_1.bg.gray[800],
            atoms_1.layout.position.absolute,
            atoms_1.left[0],
            atoms_1.right[0],
            {
                bottom: "100%",
                borderRadius: 8,
                boxShadow: "0px 4px 6px rgba(0, 0, 0, 0.1)",
                maxHeight: 200,
                zIndex: 999999,
            },
        ], children: (0, jsx_runtime_1.jsx)(react_native_1.ScrollView, { children: authorHandles.map((handle, index) => {
                let profile = authors.get(handle);
                return ((0, jsx_runtime_1.jsx)(react_native_1.Pressable, { onPress: () => onSelect(handle), ref: (ref) => {
                        const el = ref;
                        if (el)
                            itemRefs.current.set(index, el);
                    }, style: [
                        {
                            padding: 8,
                            flexDirection: "row",
                            alignItems: "center",
                            backgroundColor: index === highlightedIndex
                                ? "rgba(0, 0, 0, 0.1)"
                                : "rgba(0, 0, 0, 0.5)",
                        },
                    ], children: (0, jsx_runtime_1.jsxs)(__1.Text, { style: {
                            color: profile?.color
                                ? `rgb(${profile.color.red}, ${profile.color.green}, ${profile.color.blue})`
                                : "black",
                            fontWeight: "bold",
                        }, children: ["@", handle] }) }, handle));
            }) }) }));
}
//# sourceMappingURL=mention-suggestions.js.map