diff --git a/example/widgetbook/pages/components/phone_input_widgetbook.dart b/example/widgetbook/pages/components/phone_input_widgetbook.dart
index c63f423f..1b36f6c0 100644
--- a/example/widgetbook/pages/components/phone_input_widgetbook.dart
+++ b/example/widgetbook/pages/components/phone_input_widgetbook.dart
@@ -22,6 +22,7 @@ Widget phoneInputUseCase(BuildContext context) {
             label: 'Phone number',
             hint: 'Enter your phone number',
             countries: countries.isEmpty ? null : countries.toUpperCase().split(','),
+            useRootNavigator: false,
           ),
         );
       },
diff --git a/lib/src/components/phone_input/phone_input.dart b/lib/src/components/phone_input/phone_input.dart
index 58e80f2f..0ac45469 100644
--- a/lib/src/components/phone_input/phone_input.dart
+++ b/lib/src/components/phone_input/phone_input.dart
@@ -20,6 +20,7 @@ class ZetaPhoneInput extends StatefulWidget {
     this.countryDialCode,
     this.phoneNumber,
     this.countries,
+    this.useRootNavigator = true,
   });
 
   /// If provided, displays a label above the input field.
@@ -55,6 +56,9 @@ class ZetaPhoneInput extends StatefulWidget {
   /// List of countries ISO 3166-1 alpha-2 codes
   final List<String>? countries;
 
+  /// Determines if the root navigator should be used in the [CountriesDialog].
+  final bool useRootNavigator;
+
   @override
   State<ZetaPhoneInput> createState() => _ZetaPhoneInputState();
   @override
@@ -70,7 +74,8 @@ class ZetaPhoneInput extends StatefulWidget {
       ..add(ObjectFlagProperty<void Function(Map<String, String>? p1)?>.has('onChanged', onChanged))
       ..add(StringProperty('countryDialCode', countryDialCode))
       ..add(StringProperty('phoneNumber', phoneNumber))
-      ..add(IterableProperty<String>('countries', countries));
+      ..add(IterableProperty<String>('countries', countries))
+      ..add(DiagnosticsProperty<bool>('useRootNavigator', useRootNavigator));
   }
 }