petitspas/frontend/lib/widgets/custom_app_text_field.dart

import 'package:flutter/material.dart';
import 'package:google_fonts/google_fonts.dart';

// Définition de l'enum pour les styles de couleur/fond
enum CustomAppTextFieldStyle {
  beige,
  lavande,
  jaune,
}

class CustomAppTextField extends StatefulWidget {
  final TextEditingController controller;
  final String labelText;
  final String hintText;
  final double fieldHeight;
  final double fieldWidth;
  final bool obscureText;
  final TextInputType keyboardType;
  final String? Function(String?)? validator;
  final CustomAppTextFieldStyle style;
  final bool isRequired;
  final bool enabled;
  final bool readOnly;
  final VoidCallback? onTap;
  final IconData? suffixIcon;

  const CustomAppTextField({
    super.key,
    required this.controller,
    required this.labelText,
    this.hintText = '',
    this.fieldHeight = 50.0,
    this.fieldWidth = 300.0,
    this.obscureText = false,
    this.keyboardType = TextInputType.text,
    this.validator,
    this.style = CustomAppTextFieldStyle.beige,
    this.isRequired = false,
    this.enabled = true,
    this.readOnly = false,
    this.onTap,
    this.suffixIcon,
  });

  @override
  State<CustomAppTextField> createState() => _CustomAppTextFieldState();
}

class _CustomAppTextFieldState extends State<CustomAppTextField> {
  String getBackgroundImagePath() {
    switch (widget.style) {
      case CustomAppTextFieldStyle.lavande:
        return 'assets/images/input_field_lavande.png';
      case CustomAppTextFieldStyle.jaune:
        return 'assets/images/input_field_jaune.png';
      case CustomAppTextFieldStyle.beige:
      default:
        return 'assets/images/input_field_bg.png';
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisSize: MainAxisSize.min,
      children: [
        Text(
          widget.labelText,
          style: GoogleFonts.merienda(
            fontSize: 14,
            color: Colors.black87,
            fontWeight: FontWeight.w500,
          ),
        ),
        const SizedBox(height: 6), 
        SizedBox(
          width: widget.fieldWidth,
          height: widget.fieldHeight,
          child: Stack(
            alignment: Alignment.centerLeft, 
            children: [
              Positioned.fill(
                child: Image.asset(
                  getBackgroundImagePath(),
                  fit: BoxFit.fill,
                ),
              ),
              Padding(
                padding: const EdgeInsets.only(left: 18.0, right: 18.0, bottom: 2.0), 
                child: TextFormField(
                  controller: widget.controller,
                  obscureText: widget.obscureText,
                  keyboardType: widget.keyboardType,
                  enabled: widget.enabled,
                  readOnly: widget.readOnly,
                  onTap: widget.onTap,
                  style: GoogleFonts.merienda(fontSize: 15, color: widget.enabled ? Colors.black87 : Colors.grey),
                  validator: widget.validator ??
                      (value) {
                    if (!widget.enabled || widget.readOnly) return null;
                    if (widget.isRequired && (value == null || value.isEmpty)) {
                      return 'Ce champ est obligatoire';
                    }
                    return null;
                  },
                  decoration: InputDecoration(
                    hintText: widget.hintText,
                    hintStyle: GoogleFonts.merienda(fontSize: 15, color: Colors.black54.withOpacity(0.7)),
                    border: InputBorder.none,
                    contentPadding: EdgeInsets.zero, 
                    suffixIcon: widget.suffixIcon != null 
                        ? Padding(
                            padding: const EdgeInsets.only(right: 0.0),
                            child: Icon(widget.suffixIcon, color: Colors.black54, size: 20),
                          )
                        : null,
                    isDense: true,
                  ),
                  textAlignVertical: TextAlignVertical.center, 
                ),
              ),
            ],
          ),
        ),
      ],
    );
  }
}