import 'package:flutter/material.dart';
import 'package:dropdown_button2/dropdown_button2.dart';
import 'package:dropdown_textfield/dropdown_textfield.dart';

class CommanDropdown extends StatefulWidget {
  final List<String> items;
  final String? value;
  final Function(String?) onChanged;
  final String hint;
  final bool useTextFieldType;

  const CommanDropdown({
    Key? key,
    required this.items,
    this.value,
    required this.onChanged,
    this.hint = 'Select an option',
    this.useTextFieldType = false,
  }) : super(key: key);

  @override
  State<CommanDropdown> createState() => _CommanDropdownState();
}

class _CommanDropdownState extends State<CommanDropdown> {
  @override
  Widget build(BuildContext context) {
    if (widget.useTextFieldType) {
      return Container(
        width: double.infinity,
        height: 56,
        decoration: _boxDecoration(),
        child: DropDownTextField(
          textFieldDecoration: const InputDecoration(
            border: InputBorder.none,
            contentPadding: EdgeInsets.symmetric(horizontal: 0, vertical: 16),
          ),
          clearOption: false,
          dropDownList: widget.items
              .map((e) => DropDownValueModel(name: e, value: e))
              .toList(),
          dropDownItemCount: widget.items.length > 6 ? 6 : widget.items.length,
          // dropdownHeight: 200, // Limit the dropdown height
          isEnabled: true,
          onChanged: (value) {
            widget.onChanged(value?.value);
          },
        ),
      );
    } else {
      return Container(
        width: double.infinity,
        height: 56,
        decoration: _boxDecoration(),
        padding: const EdgeInsets.symmetric(horizontal: 0),
        child: DropdownButtonHideUnderline(
          child: DropdownButton2<String>(
            value: widget.value,
            isExpanded: true,
            hint: Text(widget.hint, style: const TextStyle(color: Colors.grey)),
            items: widget.items
                .map(
                  (item) => DropdownMenuItem(
                    value: item,
                    child: Text(item, style: const TextStyle(fontSize: 14)),
                  ),
                )
                .toList(),
            onChanged: widget.onChanged,
            buttonStyleData: const ButtonStyleData(height: 56),
            iconStyleData: const IconStyleData(
              icon: Icon(Icons.arrow_drop_down),
            ),
            dropdownStyleData: DropdownStyleData(
              maxHeight: 300, // Limit dropdown menu height
              decoration: BoxDecoration(borderRadius: BorderRadius.circular(6)),
            ),
            menuItemStyleData: const MenuItemStyleData(
              height: 48, // Set individual item height
            ),
          ),
        ),
      );
    }
  }

  BoxDecoration _boxDecoration() {
    return BoxDecoration(
      color: Colors.white,
      borderRadius: BorderRadius.circular(6),
      border: Border.all(color: const Color(0xFFDFDFDF), width: 1),
      boxShadow: [
        BoxShadow(
          color: const Color(0x40BDBDBD),
          blurRadius: 7,
          offset: const Offset(0, 1),
        ),
      ],
    );
  }
}