import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:pin_code_fields/pin_code_fields.dart';

import '../../../constants/font_constants.dart';
import '../../../res/app_color_text_size.dart';
import '../../../utils/res/styles.dart';
import '../controller/verify_otp_controller.dart';

Widget pinCodeField(VerifyOtpController controller,BuildContext context) {
  return PinCodeTextField(
    keyboardType: TextInputType.number,
    length: 4,
    enablePinAutofill: true,
    enableActiveFill: true,
    cursorColor: Colors.black,
    textStyle: Styles.pinCodeText,
    pinTheme: PinTheme(
      shape: PinCodeFieldShape.box,
      selectedFillColor: AppColor.lightWhite,
      inactiveFillColor: AppColor.lightWhite,
      activeColor: AppColor.lightWhite,
      borderRadius: BorderRadius.circular(10),
      fieldHeight: 50,
      fieldWidth: 50,
      selectedColor: AppColor.lightWhite,
      activeFillColor: AppColor.lightWhite,
      inactiveColor: AppColor.lightWhite,
    ),
    animationType: AnimationType.fade,
    animationDuration: const Duration(milliseconds: 300),
    errorAnimationController: controller.errorController,
    controller: controller.otpTextController,
    // Pass it here
    onChanged: (text) {
      controller.enteredOtp(text);
    },
    appContext: context,
  ).paddingOnly(top: 8.0.h, bottom: 16.0.h, right: 92.w);
}