import React from 'react';
import { Pressable, Text, View } from 'react-native';

interface SectionHeaderProps {
  title: string;
  actionText?: string;
  onAction?: () => void;
}

/** 区域标题 — 左侧加粗标题 + 右侧可选操作文字 */
export function SectionHeader({ title, actionText, onAction }: SectionHeaderProps) {
  return (
    <View className="flex-row items-center justify-between mb-5">
      <Text className="text-xl font-bold tracking-tight text-on-surface">{title}</Text>
      {actionText && (
        <Pressable onPress={onAction} hitSlop={8}>
          <Text className="text-primary text-sm font-medium">{actionText}</Text>
        </Pressable>
      )}
    </View>
  );
}
