From 4ea7dc717f652b3ff0999a0a0b7290411e1e4849 Mon Sep 17 00:00:00 2001
From: lordvidex <lordvidex.prime@gmail.com>
Date: Sat, 23 Jan 2021 10:50:56 +0300
Subject: [PATCH 1/2] Added flagDecoration feature to allow for flexibility in
 flag design/shape etc

---
 example/lib/main.dart        | 10 ++++++++++
 lib/country_code_picker.dart | 12 ++++++++++--
 lib/selection_dialog.dart    |  9 +++++++--
 3 files changed, 27 insertions(+), 4 deletions(-)

diff --git a/example/lib/main.dart b/example/lib/main.dart
index 2094ab75..3f4de32b 100644
--- a/example/lib/main.dart
+++ b/example/lib/main.dart
@@ -49,6 +49,16 @@ class _MyAppState extends State<MyApp> {
                 onInit: (code) =>
                     print("on init ${code.name} ${code.dialCode} ${code.name}"),
               ),
+              CountryCodePicker(
+                onChanged: print,
+                // Initial selection and favorite can be one of code ('IT') OR dial_code('+39')
+                initialSelection: 'IT',
+                favorite: ['+39', 'FR'],
+                countryFilter: ['IT', 'FR'],
+                // flag can be styled with BoxDecoration's `borderRadius` and `shape` fields
+                flagDecoration:
+                    BoxDecoration(borderRadius: BorderRadius.circular(7)),
+              ),
               SizedBox(
                 width: 400,
                 height: 60,
diff --git a/lib/country_code_picker.dart b/lib/country_code_picker.dart
index c20b6d29..66c576da 100644
--- a/lib/country_code_picker.dart
+++ b/lib/country_code_picker.dart
@@ -74,6 +74,9 @@ class CountryCodePicker extends StatefulWidget {
   /// Set to true if you want to show drop down button
   final bool showDropDownButton;
 
+  /// [BoxDecoration] for the flag image
+  final Decoration flagDecoration;
+
   CountryCodePicker({
     this.onChanged,
     this.onInit,
@@ -92,6 +95,7 @@ class CountryCodePicker extends StatefulWidget {
     this.showFlagDialog,
     this.hideMainText = false,
     this.showFlagMain,
+    this.flagDecoration,
     this.builder,
     this.flagWidth = 32.0,
     this.enabled = true,
@@ -164,8 +168,11 @@ class CountryCodePickerState extends State<CountryCodePicker> {
               Flexible(
                 flex: widget.alignLeft ? 0 : 1,
                 fit: widget.alignLeft ? FlexFit.tight : FlexFit.loose,
-                child: Padding(
-                  padding: widget.alignLeft
+                child: Container(
+                  clipBehavior:
+                      widget.flagDecoration == null ? Clip.none : Clip.hardEdge,
+                  decoration: widget.flagDecoration,
+                  margin: widget.alignLeft
                       ? const EdgeInsets.only(right: 16.0, left: 8.0)
                       : const EdgeInsets.only(right: 16.0),
                   child: Image.asset(
@@ -281,6 +288,7 @@ class CountryCodePickerState extends State<CountryCodePicker> {
               ? widget.showFlagDialog
               : widget.showFlag,
           flagWidth: widget.flagWidth,
+          flagDecoration: widget.flagDecoration,
           size: widget.dialogSize,
           backgroundColor: widget.dialogBackgroundColor,
           barrierColor: widget.barrierColor,
diff --git a/lib/selection_dialog.dart b/lib/selection_dialog.dart
index 1b7f8830..672135d2 100644
--- a/lib/selection_dialog.dart
+++ b/lib/selection_dialog.dart
@@ -12,6 +12,7 @@ class SelectionDialog extends StatefulWidget {
   final WidgetBuilder emptySearchBuilder;
   final bool showFlag;
   final double flagWidth;
+  final Decoration flagDecoration;
   final Size size;
   final bool hideSearch;
   final Icon closeIcon;
@@ -36,6 +37,7 @@ class SelectionDialog extends StatefulWidget {
     this.textStyle,
     this.boxDecoration,
     this.showFlag,
+    this.flagDecoration,
     this.flagWidth = 32,
     this.size,
     this.backgroundColor,
@@ -142,8 +144,11 @@ class _SelectionDialogState extends State<SelectionDialog> {
         children: <Widget>[
           if (widget.showFlag)
             Flexible(
-              child: Padding(
-                padding: const EdgeInsets.only(right: 16.0),
+              child: Container(
+                margin: const EdgeInsets.only(right: 16.0),
+                decoration: widget.flagDecoration,
+                clipBehavior:
+                    widget.flagDecoration == null ? Clip.none : Clip.hardEdge,
                 child: Image.asset(
                   e.flagUri,
                   package: 'country_code_picker',

From e5ea5ec92f7fdf23ab94bd66fddefd0390f39c5a Mon Sep 17 00:00:00 2001
From: lordvidex <lordvidex.prime@gmail.com>
Date: Sat, 23 Jan 2021 10:56:45 +0300
Subject: [PATCH 2/2] Updated documentation for new feature <flagDecoration>

---
 README.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/README.md b/README.md
index 95d1dadf..dc0fd575 100644
--- a/README.md
+++ b/README.md
@@ -92,6 +92,7 @@ Here is a list of properties available to customize your widget:
 |showFlagMain| bool | shows the flag only when closed |
 |showFlagDialog| bool | shows the flag only in dialog |
 |flagWidth| double | the width of the flags |
+|flagDecoration| Decoration | used for styling the flags |
 |comparator| Comparator<CountryCode> | use this to sort the countries in the selection dialog |
 |hideSearch| bool | if true the search feature will be disabled |