add JS binding for MapStyler

Author: navaronbracke

packages/google_maps_flutter/google_maps_flutter_web/lib/google_maps_flutter_web.dart

@@ -23,6 +23,7 @@ import 'package:web/web.dart';
 
 import 'src/dom_window_extension.dart';
 import 'src/google_maps_inspector_web.dart';
+import 'src/map_styler.dart';
 import 'src/third_party/to_screen_location/to_screen_location.dart';
 import 'src/types.dart';
 import 'src/utils.dart';

packages/google_maps_flutter/google_maps_flutter_web/lib/src/convert.dart

@@ -139,10 +139,11 @@ List<gmaps.MapTypeStyle> _mapStyles(String? mapStyleJson) {
       styles =
           (json.decode(mapStyleJson, reviver: (Object? key, Object? value) {
         if (value is Map && _isJsonMapStyle(value as Map<String, Object?>)) {
-          List<Object?> stylers = <Object?>[];
+          List<MapStyler> stylers = <MapStyler>[];
           if (value['stylers'] != null) {
             stylers = (value['stylers']! as List<Object?>)
-                .map<Object?>((Object? e) => e != null ? jsify(e) : null)
+                .whereType<Map<String, Object?>>()
+                .map(MapStyler.fromJson)
                 .toList();
           }
           return gmaps.MapTypeStyle()
@@ -277,6 +278,8 @@ gmaps.Icon? _gmIconFromBitmapDescriptor(BitmapDescriptor bitmapDescriptor) {
       'The bytes for a BitmapDescriptor icon must be a Uint8List',
     );
 
+    // TODO(ditman): Improve this conversion
+    // See https://github.com/dart-lang/web/issues/180
     blob = Blob(<JSUint8Array>[(bytes as Uint8List).toJS].toJS);
 
     icon = gmaps.Icon()..url = URL.createObjectURL(blob as JSObject);

packages/google_maps_flutter/google_maps_flutter_web/lib/src/map_styler.dart

@@ -0,0 +1,40 @@
+// Copyright 2013 The Flutter Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import 'dart:js_interop';
+
+/// The interop type for a Google Maps Map Styler.
+///
+/// See: https://developers.google.com/maps/documentation/javascript/style-reference#stylers
+@JS()
+@staticInterop
+@anonymous
+extension type MapStyler._(JSObject _) implements JSObject {
+  /// Create a new [MapStyler] instance.
+  external factory MapStyler({
+    String? hue,
+    num? lightness,
+    num? saturation,
+    num? gamma,
+    // ignore: non_constant_identifier_names
+    bool? invert_lightness,
+    String? visibility,
+    String? color,
+    int? weight,
+  });
+
+  /// Create a new [MapStyler] instance from the given [json].
+  factory MapStyler.fromJson(Map<String, Object?> json) {
+    return MapStyler(
+      hue: json['hue'] as String?,
+      lightness: json['lightness'] as num?,
+      saturation: json['saturation'] as num?,
+      gamma: json['gamma'] as num?,
+      invert_lightness: json['invert_lightness'] as bool?,
+      visibility: json['visibility'] as String?,
+      color: json['color'] as String?,
+      weight: json['weight'] as int?,
+    );
+  }
+}