import 'package:flutter/material.dart';
import 'package:rasadyar_core/core.dart';

class ExpandableListItem2 extends StatelessWidget {
  const ExpandableListItem2({
    super.key,
    required this.index,
    required this.child,
    required this.secondChild,
    required this.labelColor,
    required this.labelIcon,
    required this.onTap,
    required this.selected,
    this.isTag = false,
    this.labelIconColor = AppColor.mediumGreyDarkHover,
  });

  final int index;
  final Widget child;
  final Widget secondChild;
  final Color labelColor;
  final String labelIcon;
  final Color? labelIconColor;
  final VoidCallback onTap;
  final bool selected;
  final bool isTag;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: Get.width,
        margin: const EdgeInsets.fromLTRB(0, 0, 10, 0),
        decoration: BoxDecoration(
          color: labelColor,
          borderRadius: BorderRadius.circular(8),
          border: Border.all(width: 1, color: AppColor.lightGreyNormalHover),
        ),
        child: AnimatedSize(
          duration: Duration(milliseconds: 400),
          alignment: Alignment.center,
          child: Stack(
            clipBehavior: Clip.none,
            alignment: Alignment.centerRight,
            children: [
              AnimatedCrossFade(
                firstChild: Row(
                  children: [
                    Expanded(
                      child: Container(
                        height: 50.h,
                        decoration: BoxDecoration(
                          color: Colors.white,
                          borderRadius: BorderRadius.only(
                            bottomLeft: Radius.zero,
                            bottomRight: Radius.circular(8),
                            topLeft: Radius.zero,
                            topRight: Radius.circular(8),
                          ),
                        ),
                        clipBehavior: Clip.antiAlias,
                        child: child,
                      ),
                    ),
                    SizedBox(
                      width: 20.w,
                      child: Center(
                        child: SvgGenImage.vec(labelIcon).svg(
                          width: 16.w,
                          height: 16.h,
                          //TODO
                          colorFilter: ColorFilter.mode(
                            labelIconColor ?? AppColor.mediumGreyDarkActive,
                            BlendMode.srcIn,
                          ),
                        ),
                      ),
                    ),
                  ],
                ),
                secondChild: Container(
                  padding: EdgeInsets.fromLTRB(8, 8, 12, 12),
                  clipBehavior: Clip.antiAlias,
                  decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(8),
                  ),
                  child: secondChild,
                ),
                crossFadeState: selected ? CrossFadeState.showSecond : CrossFadeState.showFirst,
                duration: Duration(milliseconds: 300),
              ),

              Positioned(
                right: -12,
                child: isTag
                    ? Container(
                        width: index < 999 ? 24 : 34,
                        height: index < 999 ? 34 : 34,
                        alignment: Alignment.center,
                        child: Stack(
                          alignment: Alignment.center,
                          children: [
                            Assets.vec.tagLabelSvg.svg(),
                            Positioned(
                              top: 15,
                              child: Text(
                                (index + 1).toString(),
                                style: AppFonts.yekan10.copyWith(color: Colors.black),
                              ),
                            )
                          ],
                        ),
                      )
                    : Container(
                        width: index < 999 ? 24 : null,
                        height: index < 999 ? 24 : null,
                        padding: EdgeInsets.all(2),
                        decoration: BoxDecoration(
                          color: AppColor.greenLightHover,
                          borderRadius: BorderRadius.circular(4),
                          border: Border.all(width: 0.50, color: AppColor.greenDarkActive),
                        ),
                        alignment: Alignment.center,
                        child: Text(
                          (index + 1).toString(),
                          style: AppFonts.yekan12.copyWith(color: Colors.black),
                        ),
                      ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

class ListItem2 extends StatelessWidget {
  const ListItem2({
    super.key,
    required this.index,
    required this.child,
    required this.labelColor,
    required this.labelIcon,
    this.onTap,

    this.labelIconColor = AppColor.mediumGreyDarkHover,
  });

  final int index;
  final Widget child;
  final Color labelColor;
  final String labelIcon;
  final Color? labelIconColor;
  final VoidCallback? onTap;

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Container(
        width: Get.width,
        margin: const EdgeInsets.fromLTRB(0, 0, 10, 0),
        decoration: BoxDecoration(
          color: labelColor,
          borderRadius: BorderRadius.circular(8),
          border: Border.all(width: 1, color: AppColor.lightGreyNormalHover),
        ),
        child: Stack(
          clipBehavior: Clip.none,
          alignment: Alignment.centerRight,
          children: [
            Row(
              children: [
                Expanded(
                  child: Container(
                    height: 75,
                    decoration: BoxDecoration(
                      color: Colors.white,
                      borderRadius: BorderRadius.only(
                        bottomLeft: Radius.zero,
                        bottomRight: Radius.circular(8),
                        topLeft: Radius.zero,
                        topRight: Radius.circular(8),
                      ),
                    ),
                    clipBehavior: Clip.antiAlias,
                    child: child,
                  ),
                ),
                Container(
                  width: 20,
                  child: Center(
                    child: SvgGenImage.vec(labelIcon).svg(
                      width: 16.w,
                      height: 16.h,
                      //TODO
                      colorFilter: ColorFilter.mode(
                        labelIconColor ?? AppColor.mediumGreyDarkActive,
                        BlendMode.srcIn,
                      ),
                    ),
                  ),
                ),
              ],
            ),

            Positioned(
              right: -12,
              child: Container(
                width: index < 999 ? 24 : null,
                height: index < 999 ? 24 : null,
                padding: EdgeInsets.all(2),
                decoration: BoxDecoration(
                  color: AppColor.greenLightHover,
                  borderRadius: BorderRadius.circular(4),
                  border: Border.all(width: 0.50, color: AppColor.greenDarkActive),
                ),
                alignment: Alignment.center,
                child: Text(
                  (index + 1).toString(),
                  style: AppFonts.yekan12.copyWith(color: Colors.black),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
