// Form input widgets
import 'package:flutter/material.dart';
import 'package:inou_app/design/inou_theme.dart';
import 'package:inou_app/design/inou_text.dart';

/// Text input field with validation support
class InouTextField extends StatelessWidget {
  final String? label;
  final String? placeholder;
  final TextEditingController? controller;
  final bool obscureText;
  final TextInputType? keyboardType;
  final int? maxLength;
  final int? maxLines;
  final bool isCode;
  final ValueChanged<String>? onChanged;
  final FormFieldValidator<String>? validator;
  final Widget? suffixIcon;
  final Iterable<String>? autofillHints;
  final bool enabled;

  const InouTextField({
    super.key,
    this.label,
    this.placeholder,
    this.controller,
    this.obscureText = false,
    this.keyboardType,
    this.maxLength,
    this.maxLines = 1,
    this.isCode = false,
    this.onChanged,
    this.validator,
    this.suffixIcon,
    this.autofillHints,
    this.enabled = true,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (label != null) ...[
          Text(
            label!,
            style: InouText.label,
          ),
          const SizedBox(height: 4),
        ],
        TextFormField(
          controller: controller,
          obscureText: obscureText,
          keyboardType: keyboardType,
          maxLength: maxLength,
          maxLines: maxLines,
          enabled: enabled,
          textAlign: isCode ? TextAlign.center : TextAlign.start,
          onChanged: onChanged,
          validator: validator,
          autofillHints: autofillHints,
          style: isCode
              ? const TextStyle(
                  fontSize: 22,
                  fontWeight: FontWeight.w500,
                  letterSpacing: 8,
                  fontFamily: 'SF Mono',
                )
              : InouText.body,
          decoration: InputDecoration(
            hintText: placeholder,
            counterText: '',
            suffixIcon: suffixIcon,
            filled: true,
            fillColor: InouTheme.bgCard,
            border: OutlineInputBorder(
              borderRadius: InouTheme.borderRadiusMd,
              borderSide: BorderSide(color: InouTheme.border),
            ),
            enabledBorder: OutlineInputBorder(
              borderRadius: InouTheme.borderRadiusMd,
              borderSide: BorderSide(color: InouTheme.border),
            ),
            focusedBorder: OutlineInputBorder(
              borderRadius: InouTheme.borderRadiusMd,
              borderSide: BorderSide(color: InouTheme.accent, width: 1),  // 1px per styleguide
            ),
            errorBorder: OutlineInputBorder(
              borderRadius: InouTheme.borderRadiusMd,
              borderSide: BorderSide(color: InouTheme.danger),
            ),
            focusedErrorBorder: OutlineInputBorder(
              borderRadius: InouTheme.borderRadiusMd,
              borderSide: BorderSide(color: InouTheme.danger, width: 1),  // 1px per styleguide
            ),
            contentPadding: EdgeInsets.symmetric(
              horizontal: 12,
              vertical: maxLines != null && maxLines! > 1 ? 12 : 14,
            ),
          ),
        ),
      ],
    );
  }
}

/// Dropdown select
class InouSelect<T> extends StatelessWidget {
  final String? label;
  final T? value;
  final List<InouSelectOption<T>> options;
  final ValueChanged<T?>? onChanged;

  const InouSelect({
    super.key,
    this.label,
    this.value,
    required this.options,
    this.onChanged,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (label != null) ...[
          Text(label!, style: InouText.label),
          const SizedBox(height: 4),
        ],
        Container(
          padding: const EdgeInsets.symmetric(horizontal: 12),
          decoration: BoxDecoration(
            color: InouTheme.bgCard,
            border: Border.all(color: InouTheme.border),
            borderRadius: InouTheme.borderRadiusMd,
          ),
          child: DropdownButtonHideUnderline(
            child: DropdownButton<T>(
              value: value,
              isExpanded: true,
              items: options
                  .map((o) => DropdownMenuItem(
                        value: o.value,
                        child: Text(o.label),
                      ))
                  .toList(),
              onChanged: onChanged,
            ),
          ),
        ),
      ],
    );
  }
}

class InouSelectOption<T> {
  final T value;
  final String label;

  const InouSelectOption({required this.value, required this.label});
}

/// Radio group
class InouRadioGroup<T> extends StatelessWidget {
  final String? label;
  final String? hint;
  final T? value;
  final List<InouRadioOption<T>> options;
  final ValueChanged<T?>? onChanged;
  final Axis direction;

  const InouRadioGroup({
    super.key,
    this.label,
    this.hint,
    this.value,
    required this.options,
    this.onChanged,
    this.direction = Axis.horizontal,
  });

  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        if (label != null) ...[
          Text(label!, style: InouText.label),
          if (hint != null) ...[
            const SizedBox(height: 2),
            Text(
              hint!,
              style: InouText.bodySmall.copyWith(color: InouTheme.textMuted),
            ),
          ],
          const SizedBox(height: 8),
        ],
        direction == Axis.horizontal
            ? Row(
                children: _buildOptions(),
              )
            : Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: _buildOptions(),
              ),
      ],
    );
  }

  List<Widget> _buildOptions() {
    return options.map((option) {
      return Padding(
        padding: EdgeInsets.only(
          right: direction == Axis.horizontal ? 16 : 0,
          bottom: direction == Axis.vertical ? 8 : 0,
        ),
        child: InkWell(
          onTap: () => onChanged?.call(option.value),
          borderRadius: BorderRadius.circular(4),
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              Radio<T>(
                value: option.value,
                groupValue: value,
                onChanged: onChanged,
                activeColor: InouTheme.accent,
                materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
              ),
              Text(option.label, style: InouText.body),
            ],
          ),
        ),
      );
    }).toList();
  }
}

class InouRadioOption<T> {
  final T value;
  final String label;

  const InouRadioOption({required this.value, required this.label});
}

/// Checkbox with optional custom child
class InouCheckbox extends StatelessWidget {
  final bool value;
  final String? label;
  final Widget? child;
  final ValueChanged<bool?>? onChanged;

  const InouCheckbox({
    super.key,
    required this.value,
    this.label,
    this.child,
    this.onChanged,
  }) : assert(label != null || child != null, 'Provide either label or child');

  @override
  Widget build(BuildContext context) {
    return InkWell(
      onTap: () => onChanged?.call(!value),
      borderRadius: BorderRadius.circular(4),
      child: Row(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          SizedBox(
            width: 24,
            height: 24,
            child: Checkbox(
              value: value,
              onChanged: onChanged,
              activeColor: InouTheme.accent,
              materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
            ),
          ),
          const SizedBox(width: 8),
          Expanded(
            child: child ??
                Text(
                  label!,
                  style: InouText.body.copyWith(color: InouTheme.textMuted),
                ),
          ),
        ],
      ),
    );
  }
}