import 'package:flutter/material.dart';

class PillTabBar extends StatelessWidget {
  final TabController controller;
  final List<String> tabs;
  final Color selectedColor;
  final Color unselectedColor;
  final Color indicatorColor;
  final double height;
  final ValueChanged<int>? onTap;

  const PillTabBar({
    Key? key,
    required this.controller,
    required this.tabs,
    this.selectedColor = Colors.blue,
    this.unselectedColor = Colors.grey,
    this.indicatorColor = Colors.blueAccent,
    this.height = 48,
    this.onTap,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // Dynamic horizontal padding between tabs
    final screenWidth = MediaQuery.of(context).size.width;
    final tabSpacing = (screenWidth / (tabs.length * 12)).clamp(8.0, 24.0);

    return Padding(
      padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
      child: Container(
        height: height,
        decoration: BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.circular(height / 2),
          boxShadow: [
            BoxShadow(
              color: Colors.grey.withOpacity(0.15),
              blurRadius: 4,
              offset: const Offset(0, 2),
            ),
          ],
        ),
        child: TabBar(
          controller: controller,
          indicator: BoxDecoration(
            color: indicatorColor.withOpacity(0.2),
            borderRadius: BorderRadius.circular(height / 2),
          ),
          indicatorSize: TabBarIndicatorSize.tab,
          indicatorPadding: EdgeInsets.symmetric(
            horizontal: tabSpacing / 2,
            vertical: 4,
          ),
          labelColor: selectedColor,
          unselectedLabelColor: unselectedColor,
          labelStyle: const TextStyle(
            fontWeight: FontWeight.bold,
            fontSize: 13,
          ),
          unselectedLabelStyle: const TextStyle(
            fontWeight: FontWeight.w500,
            fontSize: 13,
          ),
          tabs: tabs
              .map(
                (text) => Tab(
                  child: Padding(
                    padding: EdgeInsets.symmetric(horizontal: tabSpacing),
                    child: Text(
                      text,
                      overflow: TextOverflow.ellipsis,
                      maxLines: 2,
                    ),
                  ),
                ),
              )
              .toList(),
          onTap: onTap,
        ),
      ),
    );
  }
}