Adding properties for customization

lib/country_code_picker.dart

@@ -24,6 +24,15 @@ class CountryCodePicker extends StatefulWidget {
   final bool enabled;
   final TextOverflow textOverflow;
 
+  /// Barrier color of ModalBottomSheet
+  final Color barrierColor;
+
+  /// Background color of ModalBottomSheet
+  final Color backgroundColor;
+
+  /// BoxDecoration for dialog
+  final BoxDecoration boxDecoration;
+
   /// the size of the selection dialog
   final Size dialogSize;
 
@@ -80,6 +89,9 @@ class CountryCodePicker extends StatefulWidget {
     this.flagWidth = 32.0,
     this.enabled = true,
     this.textOverflow = TextOverflow.ellipsis,
+    this.barrierColor,
+    this.backgroundColor,
+    this.boxDecoration,
     this.comparator,
     this.countryFilter,
     this.hideSearch = false,
@@ -228,8 +240,8 @@ class CountryCodePickerState extends State<CountryCodePicker> {
 
   void showCountryCodePickerDialog() {
     showMaterialModalBottomSheet(
-      barrierColor: Colors.grey.withOpacity(0.5),
-      backgroundColor: Colors.transparent,
+      barrierColor: widget.barrierColor ?? Colors.grey.withOpacity(0.5),
+      backgroundColor: widget.backgroundColor ?? Colors.transparent,
       context: context,
       builder: (context, scrollController) => SelectionDialog(
         elements,
@@ -239,6 +251,7 @@ class CountryCodePickerState extends State<CountryCodePicker> {
         searchDecoration: widget.searchDecoration,
         searchStyle: widget.searchStyle,
         textStyle: widget.dialogTextStyle,
+        boxDecoration: widget.boxDecoration,
         showFlag: widget.showFlagDialog != null
             ? widget.showFlagDialog
             : widget.showFlag,

lib/selection_dialog.dart

@@ -8,6 +8,7 @@ class SelectionDialog extends StatefulWidget {
   final InputDecoration searchDecoration;
   final TextStyle searchStyle;
   final TextStyle textStyle;
+  final BoxDecoration boxDecoration;
   final WidgetBuilder emptySearchBuilder;
   final bool showFlag;
   final double flagWidth;
@@ -26,6 +27,7 @@ class SelectionDialog extends StatefulWidget {
     InputDecoration searchDecoration = const InputDecoration(),
     this.searchStyle,
     this.textStyle,
+    this.boxDecoration,
     this.showFlag,
     this.flagWidth = 32,
     this.size,
@@ -50,18 +52,19 @@ class _SelectionDialogState extends State<SelectionDialog> {
           width: widget.size?.width ?? MediaQuery.of(context).size.width,
           height:
               widget.size?.height ?? MediaQuery.of(context).size.height * 0.85,
-          decoration: BoxDecoration(
-            color: Colors.white,
-            borderRadius: BorderRadius.all(Radius.circular(25.0)),
-            boxShadow: [
-              BoxShadow(
-                color: Colors.grey.withOpacity(1),
-                spreadRadius: 5,
-                blurRadius: 7,
-                offset: Offset(0, 3), // changes position of shadow
+          decoration: widget.boxDecoration ??
+              BoxDecoration(
+                color: Colors.white,
+                borderRadius: BorderRadius.all(Radius.circular(25.0)),
+                boxShadow: [
+                  BoxShadow(
+                    color: Colors.grey.withOpacity(1),
+                    spreadRadius: 5,
+                    blurRadius: 7,
+                    offset: Offset(0, 3), // changes position of shadow
+                  ),
+                ],
               ),
-            ],
-          ),
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.stretch,
             children: [
@@ -72,9 +75,7 @@ class _SelectionDialogState extends State<SelectionDialog> {
                   IconButton(
                     padding: const EdgeInsets.all(0),
                     iconSize: 20,
-                    icon: Icon(
-                      Icons.close,
-                    ),
+                    icon: const Icon(Icons.close),
                     onPressed: () => Navigator.pop(context),
                   ),
                   if (!widget.hideSearch)