import 'package:flutter/material.dart';
import 'package:food_delivery_client/core/core.dart';

import '../../../../core/theme/app_colors.dart';

/// A simple animated dot indicator that uses AnimatedContainer.
/// Update [activeIndex] to animate which dot is active.
class AnimatedDotsIndicator extends StatelessWidget {
  final int count;
  final int activeIndex;
  final double dotSize;
  final double activeDotWidth;
  final double spacing;
  final Duration duration;
  final Curve curve;
  final Color activeColor;
  final Color inactiveColor;
  final BorderRadius borderRadius;

  const AnimatedDotsIndicator({
    Key? key,
    required this.count,
    required this.activeIndex,
    this.dotSize = 4,
    this.activeDotWidth = 32.0,
    this.spacing =4,
    this.duration = const Duration(milliseconds: 300),
    this.curve = Curves.easeInOut,
    this.activeColor = AppColors.cFF6F00,
    this.inactiveColor = AppColors.cFFEDCC,
    this.borderRadius = const BorderRadius.all(Radius.circular(12)),
  }) : assert(count >= 0),
       assert(activeIndex >= 0),
       super(key: key);

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisSize: MainAxisSize.min,
      children: List.generate(count, (index) {
        final bool isActive = index == activeIndex;
        return Padding(
          padding: EdgeInsets.only(right: index == count - 1 ? 0 : spacing),
          child: AnimatedContainer(
            duration: duration,
            curve: curve,
            width: activeDotWidth,
            height: dotSize,
            decoration: BoxDecoration(
              color: isActive ? activeColor : inactiveColor,
              borderRadius: borderRadius,
            ),
          ),
        );
      }),
    );
  }
}
