import 'package:flutter/material.dart';
import 'package:syncrow_web/utils/color_manager.dart';
import 'package:syncrow_web/utils/extension/build_context_x.dart';
import 'package:syncrow_web/utils/style.dart';

class CustomWebTextField extends StatelessWidget {
  const CustomWebTextField({
    super.key,
    required this.isRequired,
    required this.textFieldName,
    required this.controller,
    this.description,
    this.validator,
    this.hintText,
    this.height,
    this.onSubmitted,
  });

  final bool isRequired;
  final String textFieldName;
  final String? description;
  final TextEditingController? controller;
  final String? Function(String?)? validator;
  final String? hintText;
  final double? height;
  final ValueChanged<String>? onSubmitted;

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisAlignment: MainAxisAlignment.start,
      children: [
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Row(
              children: [
                if (isRequired)
                  Text(
                    '* ',
                    style: Theme.of(context)
                        .textTheme
                        .bodyMedium!
                        .copyWith(color: Colors.red),
                  ),
                Text(
                  textFieldName,
                  style: Theme.of(context)
                      .textTheme
                      .bodySmall!
                      .copyWith(color: Colors.black, fontSize: 13),
                ),
              ],
            ),
            const SizedBox(
              width: 10,
            ),
            Expanded(
              child: Text(
                description ?? '',
                style: Theme.of(context).textTheme.bodySmall!.copyWith(
                    fontSize: 9,
                    fontWeight: FontWeight.w400,
                    color: ColorsManager.textGray),
              ),
            ),
          ],
        ),
        const SizedBox(
          height: 7,
        ),
        Container(
          height: height ?? 35,
          decoration: containerDecoration,
          child: TextFormField(
            validator: validator,
            controller: controller,
            style: const TextStyle(color: Colors.black),
            decoration: textBoxDecoration()!.copyWith(
                errorStyle: const TextStyle(height: 0.01),
                hintStyle: context.textTheme.titleSmall!
                    .copyWith(color: Colors.grey, fontSize: 12),
                hintText: hintText ?? 'Please enter'),
            onFieldSubmitted: onSubmitted,
          ),
        ),
      ],
    );
  }
}