import { Ionicons } from '@expo/vector-icons';
import React from 'react';
import { Pressable, Text, View } from 'react-native';

interface ActionIconButtonProps {
  icon: keyof typeof Ionicons.glyphMap;
  label: string;
  onPress?: () => void;
}

/** 快捷操作按钮 — 圆角图标 + 底部文字 */
export function ActionIconButton({ icon, label, onPress }: ActionIconButtonProps) {
  return (
    <Pressable
      onPress={onPress}
      className="items-center gap-2"
      style={({ pressed }) => ({ opacity: pressed ? 0.7 : 1, transform: [{ scale: pressed ? 0.95 : 1 }] })}
    >
      <View className="w-14 h-14 rounded-2xl bg-surface-container-high items-center justify-center">
        <Ionicons name={icon} size={24} color="#004ac6" />
      </View>
      <Text className="text-xs font-medium text-on-surface-variant">{label}</Text>
    </Pressable>
  );
}
