import 'dart:ui';
import 'package:flutter/material.dart';
import '../ui_colors.dart';
import '../ui_constants.dart';

/// A custom icon button with blur effect and different variants.
class UiIconButton extends StatelessWidget {
  /// The icon to display.
  final IconData icon;

  /// The size of the icon button.
  final double size;

  /// The size of the icon.
  final double iconSize;

  /// The background color of the button.
  final Color backgroundColor;

  /// The color of the icon.
  final Color iconColor;

  /// Whether to apply blur effect.
  final bool useBlur;

  /// Callback when the button is tapped.
  final VoidCallback? onTap;

  /// Creates a [UiIconButton] with custom properties.
  const UiIconButton({
    super.key,
    required this.icon,
    this.size = 40,
    this.iconSize = 20,
    required this.backgroundColor,
    required this.iconColor,
    this.useBlur = false,
    this.onTap,
  });

  /// Creates a primary variant icon button with solid background.
  const UiIconButton.primary({
    super.key,
    required this.icon,
    this.size = 40,
    this.iconSize = 20,
    this.onTap,
  }) : backgroundColor = UiColors.primary,
       iconColor = UiColors.white,
       useBlur = false;

  /// Creates a secondary variant icon button with blur effect.
  UiIconButton.secondary({
    super.key,
    required this.icon,
    this.size = 40,
    this.iconSize = 20,
    this.onTap,
  }) : backgroundColor = UiColors.primary.withAlpha(96),
       iconColor = UiColors.primary,
       useBlur = true;

  @override
  /// Builds the icon button UI.
  Widget build(BuildContext context) {
    final Widget button = Container(
      width: size,
      height: size,
      decoration: BoxDecoration(color: backgroundColor, shape: BoxShape.circle),
      child: Icon(icon, color: iconColor, size: iconSize),
    );

    final Widget content = useBlur
        ? ClipRRect(
            borderRadius: UiConstants.radiusFull,
            child: BackdropFilter(
              filter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
              child: button,
            ),
          )
        : button;

    if (onTap != null) {
      return GestureDetector(onTap: onTap, child: content);
    }

    return content;
  }
}
