import 'package:flutter/material.dart';
import '../../core/theme/design_tokens.dart';

class PhonePrefixSelector extends StatelessWidget {
  const PhonePrefixSelector({
    super.key,
    required this.value,
    required this.items,
    this.onChanged,
  });

  final String value;
  final List<String> items;
  final ValueChanged<String>? onChanged;

  @override
  Widget build(BuildContext context) {
    return Padding(
      padding: const EdgeInsets.only(left: AppSpacing.md, right: AppSpacing.sm),
      child: PopupMenuButton<String>(
        onSelected: onChanged,
        itemBuilder: (context) => items
            .map(
              (item) => PopupMenuItem<String>(value: item, child: Text(item)),
            )
            .toList(growable: false),
        color: AppColors.white,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(AppRadius.md),
        ),
        child: Row(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text(
              value,
              style: const TextStyle(
                fontSize: 15,
                fontWeight: FontWeight.w500,
                color: AppColors.slate700,
              ),
            ),
            const SizedBox(width: AppSpacing.xs),
            const Icon(
              Icons.arrow_drop_down,
              size: 18,
              color: AppColors.slate500,
            ),
          ],
        ),
      ),
    );
  }
}