import 'dart:ui';

import 'package:component_library/component_library.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class InputField<T> extends StatefulWidget {
  final String label;
  final String placeholder;
  final Widget? suffixIcon;
  final Widget? suffix;
  final Widget? prefix;
  final Widget? prefixIcon;
  final String? errorMessage;
  final bool obscureText;
  final TextInputType textInputType;
  final bool isDisabled;
  final bool isTouched;
  final bool isError;
  final List<TextInputFormatter>? inputFormatters;
  final void Function(String)? onChange;

  const InputField({
    Key? key,
    required this.placeholder,
    required this.label,
    this.suffixIcon,
    this.suffix,
    this.prefix,
    this.prefixIcon,
    this.obscureText = false,
    this.textInputType = TextInputType.text,
    this.inputFormatters = const [],
    this.errorMessage,
    required this.isDisabled,
    required this.isTouched,
    required this.isError,
    this.onChange,
  }) : super(key: key);

  @override
  State<InputField> createState() => _InputFieldState();
}

class _InputFieldState extends State<InputField> {
  final _controller = TextEditingController();
  bool _hasFocus = false;

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

  @override
  Widget build(BuildContext context) {
    final theme = GolekTheme.of(context);

    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      mainAxisSize: MainAxisSize.min,
      children: [
        if (widget.label.isEmpty == false) ...[
          Text(
            widget.label,
            style: theme.textStyle.copyWith(fontSize: FontSize.style14),
          ),
        ],
        Focus(
          onFocusChange: (value) {
            setState(() => _hasFocus = value);
          },
          child: Container(
            height: 52,
            decoration: BoxDecoration(
              border: Border.all(
                color:
                    _hasFocus ? theme.successBorderColor : Colors.transparent,
                width: 3,
              ),
              borderRadius: BorderRadius.circular(8.0),
            ),
            child: TextField(
              controller: _controller,
              onChanged: (value) {
                _controller.text = value;
                _controller.selection = TextSelection.fromPosition(
                  TextPosition(offset: _controller.text.length),
                );
                widget.onChange?.call(value);
              },
              inputFormatters: widget.inputFormatters,
              keyboardType: widget.textInputType,
              obscureText: widget.obscureText,
              selectionHeightStyle: BoxHeightStyle.strut,
              decoration: InputDecoration(
                contentPadding: const EdgeInsets.symmetric(
                  horizontal: 9.5,
                  vertical: 10,
                ),
                counterText: '',
                fillColor: widget.isDisabled
                    ? const Color(0xffededed)
                    : Colors.transparent,
                filled: true,
                prefix: widget.prefix,
                prefixIcon: widget.prefixIcon,
                suffix: widget.suffix,
                suffixIcon: widget.suffixIcon,
                errorStyle: theme.textStyle.copyWith(
                  fontSize: 0,
                ),
                prefixIconConstraints: const BoxConstraints(
                  minHeight: 24,
                  minWidth: 40,
                ),
                focusedErrorBorder: OutlineInputBorder(
                  borderRadius: BorderRadius.circular(6),
                  borderSide: BorderSide(color: theme.primaryBorderColor),
                ),
                label: Text(
                  widget.placeholder,
                  style: theme.textStyle.copyWith(
                    fontSize: FontSize.style14,
                    color: widget.isTouched && widget.isError
                        ? theme.dangerMainColor
                        : theme.neutral70Color,
                  ),
                ),
                floatingLabelBehavior: FloatingLabelBehavior.never,
              ),
              style: theme.textStyle.copyWith(fontSize: FontSize.style14),
            ),
          ),
        ),
        ErrorMessageBuilder(
          inputLabel: widget.label,
          messageError: widget.errorMessage ?? '',
        )
      ],
    );
  }
}
