import 'package:flutter/material.dart';

import '../../../config/custom_text.dart';
import '../../../utils/colors.dart';
import '../../../widgets/custom_button.dart';
import 'InputLabel.dart';

class FullNameStep extends StatefulWidget {
  final String initialValue;
  final Function(String) onChanged;
  final VoidCallback onContinue;

  const FullNameStep({
    Key? key,
    required this.initialValue,
    required this.onChanged,
    required this.onContinue,
  }) : super(key: key);

  @override
  _FullNameStepState createState() => _FullNameStepState();
}

class _FullNameStepState extends State<FullNameStep> {
  late final TextEditingController _controller;
  bool isArabic = false;

  @override
  void initState() {
    super.initState();
    _controller = TextEditingController(text: widget.initialValue);
    _controller.addListener(() {
      setState(() {});
    });
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        const SizedBox(height: 40),
        Txt(
          text: "your_full_name",
          style: TextStyle(
            color: Colors.black,
            fontSize: 28,
            fontFamily: isArabic ? "Readex_Pro" : 'Inter',
            fontWeight: FontWeight.w700,
          ),
        ),
        const SizedBox(height: 8),
        Txt(
          text: "whats_your_full_name",
          style: TextStyle(
            color: const Color(0xFF8C929C),
            fontSize: 16,
            fontFamily: isArabic ? "Readex_Pro" : 'Inter',
            fontWeight: FontWeight.w400,
          ),
        ),
        const SizedBox(height: 32),
        const InputLabel(text: "full_name"),
        const SizedBox(height: 8),
        TextField(
          controller: _controller,
          onChanged: widget.onChanged,
          decoration: InputDecoration(
            hintText: "Flen Beb Foulen",
            hintStyle: TextStyle(
              color: AppNewColors.inputTextColor,
              fontSize: 16,
              fontFamily: isArabic ? "Readex_Pro" : 'Inter',
              fontWeight: FontWeight.w400,
            ),
            prefixIcon:
                const Icon(Icons.person_outline, color: Color(0xFF5B616D)),
            filled: true,
            fillColor: const Color(0xFFF5F5F5),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(12),
              borderSide: BorderSide.none,
            ),
            contentPadding:
                const EdgeInsets.symmetric(horizontal: 16, vertical: 13),
          ),
        ),
        const SizedBox(height: 24),
        CustomButton(
          onClick:
              _controller.text.trim().isNotEmpty ? widget.onContinue : null,
          fontSize: 14,
          width: double.infinity,
          height: 40,
          borderRadius: 10,
          txtColor: AppNewColors.white,
          title: 'Next',
          backgroundColor: _controller.text.trim().isNotEmpty
              ? AppNewColors.primaryBtnColor
              : AppNewColors.primaryBtnColor.withOpacity(0.5),
          borderColor: _controller.text.trim().isNotEmpty
              ? AppNewColors.primaryBtnColor
              : AppNewColors.primaryBtnColor.withOpacity(0.5),
        ),
      ],
    );
  }
}