Google Map - typo fixed in demos/dpcs. (#853)

BlazorBootstrap.Demo.RCL/Components/Layout/MainLayout.razor.cs

@@ -38,7 +38,7 @@ internal override IEnumerable<NavItem> GetNavItems()
             new (){ Id = "509", Text = "Collapse", Href = "/collapse", IconName = IconName.ArrowsCollapse, ParentId = "5" },
             new (){ Id = "510", Text = "Confirm Dialog", Href = "/confirm-dialog", IconName = IconName.QuestionDiamondFill, ParentId = "5" },
             new (){ Id = "511", Text = "Dropdown", Href = "/dropdown", IconName = IconName.MenuButtonWideFill, ParentId = "5" },
-            new (){ Id = "512", Text = "Google Maps", Href = "/google-map", IconName = IconName.Map, ParentId = "5" },
+            new (){ Id = "512", Text = "Google Map", Href = "/google-map", IconName = IconName.Map, ParentId = "5" },
 
             #region Grid
 

BlazorBootstrap.Demo.RCL/Components/Pages/Index.razor

@@ -111,8 +111,8 @@
             </a>
         </div>
         <div class="col-sm-4 mb-2">
-            <a class="d-block pe-lg-4 text-decoration-none lh-sm" href="/google-maps">
-                <h4 class="mb-0 fs-5 fw-semibold"><Icon Name="IconName.Map" class="me-2" /> Google Maps <Badge Color="BadgeColor.Danger">New</Badge></h4>
+            <a class="d-block pe-lg-4 text-decoration-none lh-sm" href="/google-map">
+                <h4 class="mb-0 fs-5 fw-semibold"><Icon Name="IconName.Map" class="me-2" /> Google Map <Badge Color="BadgeColor.Danger">New</Badge></h4>
             </a>
         </div>
         <div class="col-sm-4 mb-2">

BlazorBootstrap.Demo.RCL/Components/Pages/Maps/GoogleMapDocumentation.razor

@@ -19,11 +19,11 @@
 </div>
 
 <SectionHeading Size="HeadingSize.H2" Text="Examples" PageUrl="@pageUrl" HashTagName="examples" />
-<div class="mb-3">This example demonstrates how to use a simple Google Maps component.</div>
+<div class="mb-3">This example demonstrates how to use a simple Google Map component.</div>
 <Demo Type="typeof(GoogleMap_Demo_01_Examples)" Tabs="true" />
 
 <SectionHeading Size="HeadingSize.H2" Text="Add a marker to a map" PageUrl="@pageUrl" HashTagName="add-a-marker-to-a-map" />
-<div class="mb-3">This example demonstrates how to use a simple Google Maps component with marker.</div>
+<div class="mb-3">This example demonstrates how to use a simple Google Map component with marker.</div>
 <Demo Type="typeof(GoogleMap_Demo_02_Marker)" Tabs="true" />
 
 <SectionHeading Size="HeadingSize.H2" Text="Marker customization" PageUrl="@pageUrl" HashTagName="marker-customization" />

BlazorBootstrap.Demo.Server/Components/App.razor

@@ -37,16 +37,6 @@
         })(window, document, "clarity", "script", "eyusedpimp");
     </script>
 
-    <!-- Google maps -->
-    @* <script>
-        (g => { var h, a, k, p = "The Google Maps JavaScript API", c = "google", l = "importLibrary", q = "__ib__", m = document, b = window; b = b[c] || (b[c] = {}); var d = b.maps || (b.maps = {}), r = new Set, e = new URLSearchParams, u = () => h || (h = new Promise(async (f, n) => { await (a = m.createElement("script")); e.set("libraries", [...r] + ""); for (k in g) e.set(k.replace(/[A-Z]/g, t => "_" + t[0].toLowerCase()), g[k]); e.set("callback", c + ".maps." + q); a.src = `https://maps.${c}apis.com/maps/api/js?` + e; d[q] = f; a.onerror = () => h = n(Error(p + " could not load.")); a.nonce = m.querySelector("script[nonce]")?.nonce || ""; m.head.append(a) })); d[l] ? console.warn(p + " only loads once. Ignoring:", g) : d[l] = (f, ...n) => r.add(f) && u().then(() => d[l](f, ...n)) })({
-            key: "AIzaSyA-k5n6Q7VzGE-XEDbWFQI4IcgzRrafdy0",
-            v: "weekly",
-            // Use the 'v' parameter to indicate the version to use (weekly, beta, alpha, etc.).
-            // Add other bootstrap parameters as needed, using camel case.
-        });
-    </script> *@
-
     <HeadOutlet @rendermode="InteractiveServer" />
 </head>
 

README.md

@@ -76,7 +76,7 @@ Install [Blazor Bootstrap templates](https://github.com/vikramlearning/blazorboo
 | Currency Input | [Docs](https://docs.blazorbootstrap.com/forms/currency-input) | [Demos](https://demos.blazorbootstrap.com/form/currency-input) |
 | Date Input | [Docs](https://docs.blazorbootstrap.com/forms/date-input) | [Demos](https://demos.blazorbootstrap.com/form/date-input) |
 | Dropdown | [Docs](https://docs.blazorbootstrap.com/components/dropdown) | [Demos](https://demos.blazorbootstrap.com/dropdown) |
-| Google Maps | [Docs](https://docs.blazorbootstrap.com/components/google-map) | [Demos](https://demos.blazorbootstrap.com/google-map) |
+| Google Map | [Docs](https://docs.blazorbootstrap.com/components/google-map) | [Demos](https://demos.blazorbootstrap.com/google-map) |
 | Grid | [Docs](https://docs.blazorbootstrap.com/components/grid) | [Demos](https://demos.blazorbootstrap.com/grid) |
 | Icons | [Docs](https://docs.blazorbootstrap.com/content/icons) | [Demos](https://demos.blazorbootstrap.com/icons) |
 | Images | [Docs](https://docs.blazorbootstrap.com/content/images) | [Demos](https://demos.blazorbootstrap.com/images) |

blazorbootstrap/Components/Maps/GoogleMap.razor.cs

@@ -37,7 +37,7 @@ public async Task OnMarkerClickJS(GoogleMapMarker marker)
     }
 
     /// <summary>
-    /// Refreshes the Google Maps component.
+    /// Refreshes the Google Map component.
     /// </summary>
     /// <returns>A completed task.</returns>
     public ValueTask RefreshAsync()
@@ -75,7 +75,7 @@ private void OnScriptLoad()
         );
 
     /// <summary>
-    /// Gets or sets the Google Maps API key.
+    /// Gets or sets the Google Map API key.
     /// </summary>
     [Parameter]
     public string? ApiKey { get; set; }

docs/docs/05-components/google-map.mdx

@@ -3,7 +3,7 @@ title: Blazor Google Map Component
 description: Blazor Bootstrap Google Map component will create maps to show locations anywhere in the world using the Google JavaScript API.
 image: https://i.imgur.com/beAr31J.png
 
-sidebar_label: Google Maps
+sidebar_label: Google Map
 sidebar_position: 12
 ---
 
@@ -27,7 +27,7 @@ Please follow the link below for detailed steps. <br />
 
 | Name | Type | Default | Required | Description | Added Version |
 |:--|:--|:--|:--|:--|:--|
-| ApiKey | `string?` | null | ✔️ | Gets or sets the Google Maps API key. | 3.0.0 |
+| ApiKey | `string?` | null | ✔️ | Gets or sets the Google Map API key. | 3.0.0 |
 | Center | `GoogleMapCenter` | null | | Gets or sets the center parameter. | 3.0.0 |
 | Clickable | bool | false | | Makes the marker clickable if set to `true`. | 3.0.0 |
 | Height | `double?` | null | | Gets or sets the height of the `GoogleMap`. | 3.0.0 |
@@ -42,7 +42,7 @@ Please follow the link below for detailed steps. <br />
 | Name | Description | Added Version |
 |:--|:--|:--|
 | AddMarkerAsync(GoogleMapMarker marker) | Adds a marker to the GoogleMap. | 3.0.0 |
-| RefreshAsync() | Refreshes the Google Maps component. | 3.0.0 |
+| RefreshAsync() | Refreshes the Google Map component. | 3.0.0 |
 | UpdateMarkersAsync(`IEnumerable<GoogleMapMarker>` markers) | Updates the markers on the Google Map. | 3.0.0 |
 
 ## Callback Events
@@ -53,7 +53,7 @@ Please follow the link below for detailed steps. <br />
 
 ## Examples
 
-This example demonstrates how to use a simple Google Maps component.
+This example demonstrates how to use a simple Google Map component.
 
 <img src="https://i.imgur.com/cKVhchz.png" alt="Blazor Bootstrap: Google Map Component - Examples" />
 
@@ -71,7 +71,7 @@ This example demonstrates how to use a simple Google Maps component.
 
 ### Add a marker to a map
 
-This example demonstrates how to use a simple Google Maps component with marker.
+This example demonstrates how to use a simple Google Map component with marker.
 
 <img src="https://i.imgur.com/5FaorJo.png" alt="Blazor Bootstrap: Google Map Component - Add a marker to a map" />
 

nuget/README.md

@@ -55,7 +55,7 @@ Get started any way you want
 | Currency Input | [Docs](https://docs.blazorbootstrap.com/forms/currency-input) | [Demos](https://demos.blazorbootstrap.com/form/currency-input) |
 | Date Input | [Docs](https://docs.blazorbootstrap.com/forms/date-input) | [Demos](https://demos.blazorbootstrap.com/form/date-input) |
 | Dropdown | [Docs](https://docs.blazorbootstrap.com/components/dropdown) | [Demos](https://demos.blazorbootstrap.com/dropdown) |
-| Google Maps | [Docs](https://docs.blazorbootstrap.com/components/google-map) | [Demos](https://demos.blazorbootstrap.com/google-map) |
+| Google Map | [Docs](https://docs.blazorbootstrap.com/components/google-map) | [Demos](https://demos.blazorbootstrap.com/google-map) |
 | Grid | [Docs](https://docs.blazorbootstrap.com/components/grid) | [Demos](https://demos.blazorbootstrap.com/grid) |
 | Icons | [Docs](https://docs.blazorbootstrap.com/content/icons) | [Demos](https://demos.blazorbootstrap.com/icons) |
 | Images | [Docs](https://docs.blazorbootstrap.com/content/images) | [Demos](https://demos.blazorbootstrap.com/images) |