Using Wrap to allow longer pin codes to wrap into another row

lib/src/pinput.dart

@@ -67,7 +67,7 @@ class Pinput extends StatefulWidget {
     this.senderPhoneNumber,
     this.androidSmsAutofillMethod = AndroidSmsAutofillMethod.none,
     this.listenForMultipleSmsOnAndroid = false,
-    this.mainAxisAlignment = MainAxisAlignment.center,
+    this.mainAxisAlignment = WrapAlignment.center,
     this.crossAxisAlignment = CrossAxisAlignment.start,
     this.pinContentAlignment = Alignment.center,
     this.animationCurve = Curves.easeIn,
@@ -207,8 +207,8 @@ class Pinput extends StatefulWidget {
   /// If null SizedBox(width: 8) will be used
   final JustIndexedWidgetBuilder? separatorBuilder;
 
-  /// Defines how [Pinput] fields are being placed inside [Row]
-  final MainAxisAlignment mainAxisAlignment;
+  /// Defines how [Pinput] fields are being placed inside [Wrap]
+  final WrapAlignment mainAxisAlignment;
 
   /// Defines how [Pinput] and ([errorText] or [errorBuilder]) are being placed inside [Column]
   final CrossAxisAlignment crossAxisAlignment;
@@ -513,10 +513,10 @@ class Pinput extends StatefulWidget {
     );
 
     properties.add(
-      DiagnosticsProperty<MainAxisAlignment>(
+      DiagnosticsProperty<WrapAlignment>(
         'mainAxisAlignment',
         mainAxisAlignment,
-        defaultValue: MainAxisAlignment.center,
+        defaultValue: WrapAlignment.center,
       ),
     );
     properties.add(

lib/src/pinput_state.dart

@@ -300,7 +300,7 @@ class _PinputState extends State<Pinput>
     assert(debugCheckHasMaterial(context));
     assert(debugCheckHasMaterialLocalizations(context));
     assert(debugCheckHasDirectionality(context));
-    final isDense = widget.mainAxisAlignment == MainAxisAlignment.center;
+    final isDense = widget.mainAxisAlignment == WrapAlignment.center;
 
     return isDense ? IntrinsicWidth(child: _buildPinput()) : _buildPinput();
   }

lib/src/widgets/_pin_item.dart

@@ -10,24 +10,22 @@ class _PinItem extends StatelessWidget {
   Widget build(BuildContext context) {
     final pinTheme = _pinTheme(index);
 
-    return Flexible(
-      child: AnimatedContainer(
-        height: pinTheme.height,
-        width: pinTheme.width,
-        constraints: pinTheme.constraints,
-        padding: pinTheme.padding,
-        margin: pinTheme.margin,
-        decoration: pinTheme.decoration,
-        alignment: state.widget.pinContentAlignment,
+    return AnimatedContainer(
+      height: pinTheme.height,
+      width: pinTheme.width,
+      constraints: pinTheme.constraints,
+      padding: pinTheme.padding,
+      margin: pinTheme.margin,
+      decoration: pinTheme.decoration,
+      alignment: state.widget.pinContentAlignment,
+      duration: state.widget.animationDuration,
+      curve: state.widget.animationCurve,
+      child: AnimatedSwitcher(
+        switchInCurve: state.widget.animationCurve,
+        switchOutCurve: state.widget.animationCurve,
         duration: state.widget.animationDuration,
-        curve: state.widget.animationCurve,
-        child: AnimatedSwitcher(
-          switchInCurve: state.widget.animationCurve,
-          switchOutCurve: state.widget.animationCurve,
-          duration: state.widget.animationDuration,
-          transitionBuilder: _getTransition,
-          child: _buildFieldContent(index, pinTheme),
-        ),
+        transitionBuilder: _getTransition,
+        child: _buildFieldContent(index, pinTheme),
       ),
     );
   }

lib/src/widgets/widgets.dart

@@ -21,7 +21,7 @@ class _PinputFormField extends FormField<String> {
 
 class _SeparatedRaw extends StatelessWidget {
   final List<Widget> children;
-  final MainAxisAlignment mainAxisAlignment;
+  final WrapAlignment mainAxisAlignment;
   final JustIndexedWidgetBuilder? separatorBuilder;
 
   const _SeparatedRaw({
@@ -35,12 +35,10 @@ class _SeparatedRaw extends StatelessWidget {
   Widget build(BuildContext context) {
     final itemCount = max(0, children.length * 2 - 1);
     final indexedList = [for (int i = 0; i < itemCount; i += 1) i];
-    return Row(
-      crossAxisAlignment: CrossAxisAlignment.center,
-      mainAxisAlignment: mainAxisAlignment,
-      mainAxisSize: mainAxisAlignment == MainAxisAlignment.center
-          ? MainAxisSize.min
-          : MainAxisSize.max,
+    return Wrap(
+      direction: Axis.horizontal,
+      crossAxisAlignment: WrapCrossAlignment.center,
+      alignment: mainAxisAlignment,
       children: indexedList.map((index) {
         final itemIndex = index ~/ 2;
         return index.isEven ? children[itemIndex] : _separator(itemIndex);