Fix: Correct semantic binding issue

CHANGELOG.md

@@ -1,3 +1,8 @@
+## [10.0.17]
+
+- Fixes issues with semantics
+- Upgraded the [flutter_country_selector](https://github.com/cedvdb/flutter_country_selector) to 1.0.19 to address semantic focus issues
+
 ## [10.0.16]
 
 - Fixes build runner issue by updating circle_flags dependency version.

lib/src/country_button.dart

@@ -43,52 +43,54 @@ class CountryButton extends StatelessWidget {
     final countryLocalization = CountrySelectorLocalization.of(context) ??
         CountrySelectorLocalizationEn();
     final countryDialCode = '+ ${countryLocalization.countryDialCode(isoCode)}';
+    final countryName = countryLocalization.countryName(isoCode);
 
-    return InkWell(
-      onTap: onTap,
-      borderRadius: borderRadius,
-      child: Padding(
-        padding: padding,
-        child: Row(
-          mainAxisSize: MainAxisSize.min,
-          children: <Widget>[
-            if (showIsoCode) ...[
-              Text(
-                isoCode.name,
-                style: textStyle.copyWith(
-                  color: enabled ? null : Theme.of(context).disabledColor,
+    return Semantics(
+      label: '$countryName $countryDialCode',
+      button: true,
+      enabled: enabled,
+      child: InkWell(
+        onTap: onTap,
+        borderRadius: borderRadius,
+        child: Padding(
+          padding: padding,
+          child: Row(
+            mainAxisSize: MainAxisSize.min,
+            children: <Widget>[
+              if (showIsoCode) ...[
+                Text(
+                  isoCode.name,
+                  style: textStyle.copyWith(
+                    color: enabled ? null : Theme.of(context).disabledColor,
+                  ),
                 ),
-              ),
-              const SizedBox(width: 8),
-            ],
-            if (showFlag) ...[
-              ExcludeSemantics(
-                child: GrayScale(
+                const SizedBox(width: 8),
+              ],
+              if (showFlag) ...[
+                GrayScale(
                   visible: !enabled,
                   child: CircleFlag(
                     isoCode.name,
                     size: flagSize,
                   ),
                 ),
-              ),
-              const SizedBox(width: 8),
-            ],
-            if (showDialCode) ...[
-              Text(
-                countryDialCode,
-                style: textStyle.copyWith(
-                  color: enabled ? null : Theme.of(context).disabledColor,
+                const SizedBox(width: 8),
+              ],
+              if (showDialCode) ...[
+                Text(
+                  countryDialCode,
+                  style: textStyle.copyWith(
+                    color: enabled ? null : Theme.of(context).disabledColor,
+                  ),
                 ),
-              ),
-            ],
-            if (showDropdownIcon)
-              ExcludeSemantics(
-                child: Icon(
+              ],
+              if (showDropdownIcon)
+                Icon(
                   Icons.arrow_drop_down,
                   color: dropdownIconColor,
                 ),
-              ),
-          ],
+            ],
+          ),
         ),
       ),
     );

lib/src/phone_form_field.dart

@@ -4,7 +4,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:flutter_country_selector/flutter_country_selector.dart';
 import 'package:phone_form_field/phone_form_field.dart';
-import 'package:phone_form_field/src/phone_field_semantics.dart';
+
 import 'package:phone_form_field/src/validation/allowed_characters.dart';
 import 'package:phone_form_field/src/validation/limit_max_length_formatter.dart';
 import 'package:phone_numbers_parser/metadata.dart';

lib/src/phone_form_field_state.dart

@@ -95,67 +95,62 @@ class PhoneFormFieldState extends FormFieldState<PhoneNumber> {
     final countryButtonForEachSlot = _buildCountryButtonForEachSlot(
       textAlignment,
     );
-    return PhoneFieldSemantics(
-      hasFocus: focusNode.hasFocus,
-      enabled: widget.enabled,
-      inputDecoration: widget.decoration,
-      child: TextField(
-        decoration: widget.decoration.copyWith(
-          errorText: errorText,
-          prefix: countryButtonForEachSlot[_CountryButtonSlot.prefix],
-          prefixIcon: countryButtonForEachSlot[_CountryButtonSlot.prefixIcon],
-          suffix: countryButtonForEachSlot[_CountryButtonSlot.suffix],
-          suffixIcon: countryButtonForEachSlot[_CountryButtonSlot.suffixIcon],
-        ),
-        controller: controller._formattedNationalNumberController,
-        focusNode: focusNode,
-        enabled: widget.enabled,
-        inputFormatters: widget.inputFormatters ??
-            [
-              if (widget.shouldLimitLengthByCountry && _maxValidLength != null)
-                LimitMaxLengthFormatter(_maxValidLength!),
-              FilteringTextInputFormatter.allow(RegExp(
-                  '[${AllowedCharacters.plus}${AllowedCharacters.digits}${AllowedCharacters.punctuation}]')),
-            ],
-        onChanged: _onTextfieldChanged,
-        textAlign: _computeTextAlign(),
-        autofillHints: widget.autofillHints,
-        keyboardType: widget.keyboardType,
-        textInputAction: widget.textInputAction,
-        style: widget.style,
-        strutStyle: widget.strutStyle,
-        textAlignVertical: widget.textAlignVertical,
-        autofocus: widget.autofocus,
-        obscuringCharacter: widget.obscuringCharacter,
-        obscureText: widget.obscureText,
-        autocorrect: widget.autocorrect,
-        smartDashesType: widget.smartDashesType,
-        smartQuotesType: widget.smartQuotesType,
-        enableSuggestions: widget.enableSuggestions,
-        showCursor: widget.showCursor,
-        onEditingComplete: widget.onEditingComplete,
-        onSubmitted: (_) => widget.onSubmitted?.call(controller.value),
-        onAppPrivateCommand: widget.onAppPrivateCommand,
-        cursorWidth: widget.cursorWidth,
-        cursorHeight: widget.cursorHeight,
-        cursorRadius: widget.cursorRadius,
-        cursorColor: widget.cursorColor,
-        onTapOutside: widget.onTapOutside,
-        onTapUpOutside: widget.onTapUpOutside,
-        selectionHeightStyle: widget.selectionHeightStyle,
-        selectionWidthStyle: widget.selectionWidthStyle,
-        keyboardAppearance: widget.keyboardAppearance,
-        scrollPadding: widget.scrollPadding,
-        enableInteractiveSelection: widget.enableInteractiveSelection,
-        selectionControls: widget.selectionControls,
-        mouseCursor: widget.mouseCursor,
-        scrollController: widget.scrollController,
-        scrollPhysics: widget.scrollPhysics,
-        restorationId: widget.restorationId,
-        enableIMEPersonalizedLearning: widget.enableIMEPersonalizedLearning,
-        readOnly: widget.readOnly,
-        canRequestFocus: widget.canRequestFocus,
+    return TextField(
+      decoration: widget.decoration.copyWith(
+        errorText: errorText,
+        prefix: countryButtonForEachSlot[_CountryButtonSlot.prefix],
+        prefixIcon: countryButtonForEachSlot[_CountryButtonSlot.prefixIcon],
+        suffix: countryButtonForEachSlot[_CountryButtonSlot.suffix],
+        suffixIcon: countryButtonForEachSlot[_CountryButtonSlot.suffixIcon],
       ),
+      controller: controller._formattedNationalNumberController,
+      focusNode: focusNode,
+      enabled: widget.enabled,
+      inputFormatters: widget.inputFormatters ??
+          [
+            if (widget.shouldLimitLengthByCountry && _maxValidLength != null)
+              LimitMaxLengthFormatter(_maxValidLength!),
+            FilteringTextInputFormatter.allow(RegExp(
+                '[${AllowedCharacters.plus}${AllowedCharacters.digits}${AllowedCharacters.punctuation}]')),
+          ],
+      onChanged: _onTextfieldChanged,
+      textAlign: _computeTextAlign(),
+      autofillHints: widget.autofillHints,
+      keyboardType: widget.keyboardType,
+      textInputAction: widget.textInputAction,
+      style: widget.style,
+      strutStyle: widget.strutStyle,
+      textAlignVertical: widget.textAlignVertical,
+      autofocus: widget.autofocus,
+      obscuringCharacter: widget.obscuringCharacter,
+      obscureText: widget.obscureText,
+      autocorrect: widget.autocorrect,
+      smartDashesType: widget.smartDashesType,
+      smartQuotesType: widget.smartQuotesType,
+      enableSuggestions: widget.enableSuggestions,
+      showCursor: widget.showCursor,
+      onEditingComplete: widget.onEditingComplete,
+      onSubmitted: (_) => widget.onSubmitted?.call(controller.value),
+      onAppPrivateCommand: widget.onAppPrivateCommand,
+      cursorWidth: widget.cursorWidth,
+      cursorHeight: widget.cursorHeight,
+      cursorRadius: widget.cursorRadius,
+      cursorColor: widget.cursorColor,
+      onTapOutside: widget.onTapOutside,
+      onTapUpOutside: widget.onTapUpOutside,
+      selectionHeightStyle: widget.selectionHeightStyle,
+      selectionWidthStyle: widget.selectionWidthStyle,
+      keyboardAppearance: widget.keyboardAppearance,
+      scrollPadding: widget.scrollPadding,
+      enableInteractiveSelection: widget.enableInteractiveSelection,
+      selectionControls: widget.selectionControls,
+      mouseCursor: widget.mouseCursor,
+      scrollController: widget.scrollController,
+      scrollPhysics: widget.scrollPhysics,
+      restorationId: widget.restorationId,
+      enableIMEPersonalizedLearning: widget.enableIMEPersonalizedLearning,
+      readOnly: widget.readOnly,
+      canRequestFocus: widget.canRequestFocus,
     );
   }
 

pubspec.yaml

@@ -1,6 +1,6 @@
 name: phone_form_field
 description: Flutter phone input integrated with flutter internationalization
-version: 10.0.16
+version: 10.0.17
 homepage: https://github.com/cedvdb/phone_form_field
 
 environment:
@@ -13,7 +13,7 @@ dependencies:
   flutter_localizations:
     sdk: flutter
   intl: ">=0.18.0 <=1.0.0"
-  flutter_country_selector: ^1.0.17
+  flutter_country_selector: ^1.0.19
   circle_flags: ^5.0.1
   phone_numbers_parser: ^9.0.11