import React from "react";
import { View } from "react-native";
import { useColorScheme } from "nativewind";
import { cn } from "../utils/cn";
import { useAuth } from "../hooks/useAuth";
import { Text } from "./text";
/**
 * Initial-letter circular avatar. Pulls the current user from
 * `useAuth()` and renders a foreground-on-primary disc. Apps that want
 * a static initial (e.g. an icon strip) pass `initial` explicitly.
 */
export const UserAvatar = React.memo(function UserAvatar({ size = 36, initial }) {
    const { user } = useAuth();
    const { colorScheme } = useColorScheme();
    const isDark = colorScheme === "dark";
    const resolved = initial ??
        (user?.display_name || user?.username || user?.email || "?")[0]?.toUpperCase() ??
        "?";
    return (<View className={cn("items-center justify-center rounded-full", isDark ? "bg-white" : "bg-black")} style={{ width: size, height: size }}>
      <Text className="font-bold" style={{ fontSize: size * 0.44, color: isDark ? "#000000" : "#FFFFFF" }}>
        {resolved}
      </Text>
    </View>);
});
//# sourceMappingURL=user-avatar.jsx.map