import 'package:flutter/material.dart';

import 'package:pin_code_fields/pin_code_fields.dart';


class TwoFactorCodeInput extends StatelessWidget {
  final void Function(String) onCompleted;

  const TwoFactorCodeInput({super.key, required this.onCompleted});

  @override
  Widget build(BuildContext context) => Center(
    child: ConstrainedBox(
      constraints: const BoxConstraints(maxWidth: 300),
      child: PinCodeTextField(
        length: 6,
        appContext: context,
        autoFocus: true,
        keyboardType: TextInputType.number,
        animationType: AnimationType.fade,
        cursorColor: Theme.of(context).colorScheme.primary,
        pinTheme: PinTheme(
          shape: PinCodeFieldShape.box,
          borderRadius: BorderRadius.circular(4),
          fieldHeight: 48,
          fieldWidth: 40,
          inactiveColor: Theme.of(context).colorScheme.primaryContainer,
          activeColor: Theme.of(context).colorScheme.primary,
          selectedColor: Theme.of(context).colorScheme.primary,
        ),
        onCompleted: onCompleted,
        onChanged: (_) {},
      ),
    ),
  );
}
