When I entering an OTP it continuously adding numbers from the beginning but how do I change the middle number from entered 6 digit OTP I have used this in Model Bottom Sheet

Column( children: [ SizedBox( height: 50, child: PinFieldAutoFill( textInputAction: TextInputAction.previous, keyboardType: TextInputType.number, autoFocus: true, focusNode: FocusNode(), cursor: Cursor( width: 2, height: 40, color: Colors.red, radius: const Radius.circular(5), enabled: true, ), decoration: UnderlineDecoration( textStyle: const TextStyle( fontSize: 20, color: Colors.black), colorBuilder: FixedColorBuilder( Colors.black.withOpacity(0.3)), ), currentCode: code, codeLength: 6, onCodeSubmitted: (verificationCode) { debugPrint("CURRENT CODE CHANGES 2: " + verificationCode.toString()); otpNumber = verificationCode; }, onCodeChanged: (verificationCode) { debugPrint("CURRENT CODE CHANGES 3: " + verificationCode.toString()); if (verificationCode.toString().length == 6) { // FocusScope.of(context) // .requestFocus(FocusNode()); setState(() { code = verificationCode.toString(); otpNumber = verificationCode.toString(); }); } }, ), // child: OtpTextField( // onSubmit: (String verificationCode) { // setState(() { // otpNumber = verificationCode; // debugPrint(otpNumber); // }); // }, // cursorColor: primaryDarkColor, // numberOfFields: 6, // borderColor: primaryDarkColor, // focusedBorderColor: primaryColor, // enabledBorderColor: primaryDarkColor, // fillColor: hintColor, // borderWidth: 2.0, // fieldWidth: 40, // mainAxisAlignment: // MainAxisAlignment.spaceEvenly, // filled: true, // showFieldAsBox: true, // textStyle: kkTitleTextStyle, // ), ), const SizedBox(height: 20), SizedBox( height: 45, width: MediaQuery.of(context).size.width * 0.43, child: ElevatedButton( onPressed: () { verify(); }, child: const Text('Submit OTP'), style: ElevatedButton.styleFrom( padding: const EdgeInsets.symmetric( horizontal: 20.0), primary: primaryDarkColor, textStyle: kkTitleTextStyle, ), ), ), const SizedBox(height: 20), isResend ? const Center( child: Text( 'Didn't receive any OTP ?', style: kkMediumGrayTextStyle, ), ) : const Center( child: Text( '', style: kkMediumGrayTextStyle, ), ), const SizedBox(height: 5), isResend ? GestureDetector( onTap: () { setModalState(() { if (_controller.isCompleted) { fetchOtp(phoneNumberController.text .toString()); _controller = AnimationController( duration: const Duration(seconds: 30), vsync: this); _controller.forward(); isResend = false; } else { debugPrint('TIME IS RUNNING'); } debugPrint( 'VALUE: ${_controller.value}'); debugPrint( 'STATUS: ${_controller.status}');

                                    debugPrint(
                                        'IS_ANIMATING: ${_controller.isAnimating}');

                                    debugPrint(
                                        'IS_COMPLETED: ${_controller.isCompleted}');
                                  });
                                },
                                child: Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.center,
                                  children: [
                                    const Text(
                                      'Resend OTP',
                                      style: kkTitleTextStyle,
                                    ),
                                    const SizedBox(width: 10.0),
                                    CountDown(
                                      animation: StepTween(
                                        begin: 30,
                                        end: 0,
                                      ).animate(_controller),
                                    ),
                                  ],
                                ),
                              )
                            : GestureDetector(
                                onTap: () {
                                  // setState(() {
                                  //   if (_controller.isCompleted) {
                                  //     fetchOtp(
                                  //         phoneNumberController.text.toString());
                                  //     _controller = AnimationController(
                                  //         duration: const Duration(seconds: 30),
                                  //         vsync: this);
                                  //     _controller.forward();
                                  //   } else {
                                  //     debugPrint('TIME IS RUNNING');
                                  //   }
                                  //
                                  // });
                                  debugPrint('VALUE: ${_controller.value}');
                                  debugPrint(
                                      'STATUS: ${_controller.status}');
                                  debugPrint(
                                      'IS_ANIMATING: ${_controller.isAnimating}');
                                  debugPrint(
                                      'IS_COMPLETED: ${_controller.isCompleted}');
                                },
                                child: Row(
                                  mainAxisAlignment:
                                      MainAxisAlignment.center,
                                  children: [
                                    const Text(
                                      'Seconds Remaining',
                                      style: kkTitleTextStyle,
                                    ),
                                    const SizedBox(width: 10.0),
                                    CountDown(
                                      animation: StepTween(
                                        begin: 30,
                                        end: 0,
                                      ).animate(_controller),
                                    ),
                                  ],
                                ),
                              ),
                      ],
                    )