import 'package:flutter/material.dart';
import 'package:lucide_icons_flutter/lucide_icons.dart';
import '../../../../core/theme/app_spacing.dart';
import '../../../../core/theme/app_theme.dart';
import '../../../../core/theme/app_theme_extension.dart';

/// 單行菜單項：圖標 + 標題 + 尾部組件 (chevron)
///
/// 圖標顏色 (通常是使用主題色)
class MenuRow extends StatelessWidget {
  final IconData icon;
  final Color iconColor;
  final String title;
  final Widget? trailing;
  final VoidCallback? onTap;

  const MenuRow({
    super.key,
    required this.icon,
    required this.iconColor,
    required this.title,
    this.trailing,
    this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: onTap,
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 14),
        child: Row(
          children: [
            // Icon in 36x36 rounded container
            Container(
              width: 36,
              height: 36,
              decoration: BoxDecoration(
                color: context.appColors.surfaceCardHigh,
                borderRadius: BorderRadius.circular(8),
              ),
              child: Center(
                child: Icon(icon, size: 18, color: iconColor),
              ),
            ),
            const SizedBox(width: 10),
            // Title
            Expanded(
              child: Text(
                title,
                style: AppTextStyles.headlineMedium(context),
              ),
            ),
            // Trailing
            if (trailing != null)
              Icon(
                LucideIcons.chevronRight,
                size: 16,
                color: context.colors.onSurfaceVariant,
              ),
          ],
        ),
      ),
    );
  }
}