import 'package:flutter/material.dart';
import 'package:pinput/pinput.dart';

class PinPutWidget extends StatelessWidget {
  final void Function(String)? onCompleted;
  final void Function(String)? onChanged;

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

  @override
  Widget build(BuildContext context) {
    final defaultPinTheme = PinTheme(
      width: 50,
      height: 50,
      textStyle: const TextStyle(
        fontSize: 20,
        color: Color.fromRGBO(30, 60, 87, 1),
        fontWeight: FontWeight.w600,
      ),
      decoration: BoxDecoration(
        borderRadius: BorderRadius.circular(5),
        color: Colors.white,
        border: Border.all(
          color: Colors.grey.withOpacity(0.7),
        ),
      ),
    );
    return Pinput(
      onCompleted: onCompleted,
      onChanged: onChanged,
      defaultPinTheme: defaultPinTheme,
      length: 6,
      separatorBuilder: (index) => const Padding(
        padding: EdgeInsets.only(left: 5, right: 5),
      ),
    );
  }
}
