diff --git a/samples/advanced-markers-collision/index.html b/samples/advanced-markers-collision/index.html
index b4725575..4dce2363 100644
--- a/samples/advanced-markers-collision/index.html
+++ b/samples/advanced-markers-collision/index.html
@@ -6,75 +6,73 @@
 -->
 <!-- [START maps_advanced_markers_collision] -->
 <html>
-  <head>
-    <title>Advanced Marker Collision Management</title>
+    <head>
+        <title>Advanced Marker Collision Management</title>
 
-    <link
-      href="https://unpkg.com/material-components-web@6.0.0/dist/material-components-web.css"
-      rel="stylesheet"
-    />
-    <script src="https://unpkg.com/material-components-web@6.0.0/dist/material-components-web.min.js"></script>
-    <link
-      rel="stylesheet"
-      href="https://fonts.googleapis.com/icon?family=Material+Icons"
-    />
+        <link
+            href="https://unpkg.com/material-components-web@6.0.0/dist/material-components-web.css"
+            rel="stylesheet" />
+        <script src="https://unpkg.com/material-components-web@6.0.0/dist/material-components-web.min.js"></script>
+        <link
+            rel="stylesheet"
+            href="https://fonts.googleapis.com/icon?family=Material+Icons" />
 
-    <link rel="stylesheet" type="text/css" href="./style.css" />
-    <script type="module" src="./index.js"></script>
-    <!-- prettier-ignore -->
-    <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))})
+        <link rel="stylesheet" type="text/css" href="./style.css" />
+        <script type="module" src="./index.js"></script>
+        <!-- prettier-ignore -->
+        <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: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
-  </head>
-  <body>
-    <div id="container">
-      <gmp-map center="47.609414458375674,-122.33897030353548" zoom="17" map-id="6ff586e93e18149f"></gmp-map>
-      <div id="sidebar">
-        <div class="mdc-select mdc-select--outlined">
-          <div
-            class="mdc-select__anchor"
-            aria-labelledby="outlined-select-label"
-          >
-            <input
-              type="text"
-              disabled
-              readonly
-              id="demo-selected-text"
-              class="mdc-select__selected-text"
-            />
-            <i class="mdc-select__dropdown-icon"></i>
-            <span class="mdc-notched-outline">
-              <span class="mdc-notched-outline__leading"></span>
-              <span class="mdc-notched-outline__notch">
-                <span
-                  id="outlined-select-label"
-                  class="mdc-floating-label mdc-theme--primary"
-                  >Pick a Collision Behavior</span
-                >
-              </span>
-              <span class="mdc-notched-outline__trailing"></span>
-            </span>
-          </div>
-          <div class="mdc-select__menu mdc-menu mdc-menu-surface">
-            <ul class="mdc-list">
-              <li class="mdc-list-item" data-value="REQUIRED">Required</li>
-              <li
-                class="mdc-list-item"
-                data-value="REQUIRED_AND_HIDES_OPTIONAL"
-              >
-                Required and hides optional
-              </li>
-              <li
-                class="mdc-list-item"
-                data-value="OPTIONAL_AND_HIDES_LOWER_PRIORITY"
-              >
-                Optional and hides lower priority
-              </li>
-            </ul>
-          </div>
+    </head>
+    <body>
+        <div id="container">
+            <gmp-map
+                center="47.609414458375674,-122.33897030353548"
+                zoom="17"
+                map-id="6ff586e93e18149f"></gmp-map>
+            <div id="sidebar">
+                <div class="mdc-select mdc-select--outlined">
+                    <div
+                        class="mdc-select__anchor"
+                        aria-labelledby="outlined-select-label">
+                        <input
+                            type="text"
+                            disabled
+                            readonly
+                            id="demo-selected-text"
+                            class="mdc-select__selected-text" />
+                        <i class="mdc-select__dropdown-icon"></i>
+                        <span class="mdc-notched-outline">
+                            <span class="mdc-notched-outline__leading"></span>
+                            <span class="mdc-notched-outline__notch">
+                                <span
+                                    id="outlined-select-label"
+                                    class="mdc-floating-label mdc-theme--primary"
+                                    >Pick a Collision Behavior</span
+                                >
+                            </span>
+                            <span class="mdc-notched-outline__trailing"></span>
+                        </span>
+                    </div>
+                    <div class="mdc-select__menu mdc-menu mdc-menu-surface">
+                        <ul class="mdc-list">
+                            <li class="mdc-list-item" data-value="REQUIRED">
+                                Required
+                            </li>
+                            <li
+                                class="mdc-list-item"
+                                data-value="REQUIRED_AND_HIDES_OPTIONAL">
+                                Required and hides optional
+                            </li>
+                            <li
+                                class="mdc-list-item"
+                                data-value="OPTIONAL_AND_HIDES_LOWER_PRIORITY">
+                                Optional and hides lower priority
+                            </li>
+                        </ul>
+                    </div>
+                </div>
+            </div>
         </div>
-        </div>
-      </div>
-    </div>
-  </body>
+    </body>
 </html>
 <!-- [END maps_advanced_markers_collision] -->
diff --git a/samples/boundaries-choropleth/index.html b/samples/boundaries-choropleth/index.html
index 80ea24c5..f5d8afc0 100644
--- a/samples/boundaries-choropleth/index.html
+++ b/samples/boundaries-choropleth/index.html
@@ -6,17 +6,20 @@
 -->
 <!-- [START maps_boundaries_choropleth] -->
 <html>
-  <head>
-    <title>Choropleth Map</title>
+    <head>
+        <title>Choropleth Map</title>
 
-    <link rel="stylesheet" type="text/css" href="./style.css" />
-    <script type="module" src="./index.js"></script>
-    <!-- prettier-ignore -->
-    <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))})
+        <link rel="stylesheet" type="text/css" href="./style.css" />
+        <script type="module" src="./index.js"></script>
+        <!-- prettier-ignore -->
+        <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: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
-  </head>
-  <body>
-    <gmp-map center="40.76,-101.64" zoom="5" map-id="8b37d7206ccf01219cd548d3">
-  </body>
+    </head>
+    <body>
+        <gmp-map
+            center="40.76,-101.64"
+            zoom="5"
+            map-id="8b37d7206ccf01219cd548d3"></gmp-map>
+    </body>
 </html>
 <!-- [END maps_boundaries_choropleth] -->
diff --git a/samples/boundaries-click/index.html b/samples/boundaries-click/index.html
index 2da437a2..5f69d7ac 100644
--- a/samples/boundaries-click/index.html
+++ b/samples/boundaries-click/index.html
@@ -6,17 +6,20 @@
 -->
 <!-- [START maps_boundaries_click_event] -->
 <html>
-  <head>
-    <title>Handle Region Boundary Click Event</title>
+    <head>
+        <title>Handle Region Boundary Click Event</title>
 
-    <link rel="stylesheet" type="text/css" href="./style.css" />
-    <script type="module" src="./index.js"></script>
-    <!-- prettier-ignore -->
-    <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))})
+        <link rel="stylesheet" type="text/css" href="./style.css" />
+        <script type="module" src="./index.js"></script>
+        <!-- prettier-ignore -->
+        <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: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
-  </head>
-  <body>
-    <gmp-map center="39.23,-105.73" zoom="8" map-id="8b37d7206ccf0121a2634fd5">
-  </body>
+    </head>
+    <body>
+        <gmp-map
+            center="39.23,-105.73"
+            zoom="8"
+            map-id="8b37d7206ccf0121a2634fd5"></gmp-map>
+    </body>
 </html>
 <!-- [END maps_boundaries_click_event] -->
diff --git a/samples/boundaries-simple/index.html b/samples/boundaries-simple/index.html
index ca3f5cbc..3967b957 100644
--- a/samples/boundaries-simple/index.html
+++ b/samples/boundaries-simple/index.html
@@ -6,17 +6,20 @@
 -->
 <!-- [START maps_boundaries_simple] -->
 <html>
-  <head>
-    <title>Boundaries Simple</title>
+    <head>
+        <title>Boundaries Simple</title>
 
-    <link rel="stylesheet" type="text/css" href="./style.css" />
-    <script type="module" src="./index.js"></script>
-    <!-- prettier-ignore -->
-    <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))})
+        <link rel="stylesheet" type="text/css" href="./style.css" />
+        <script type="module" src="./index.js"></script>
+        <!-- prettier-ignore -->
+        <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: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
-  </head>
-  <body>
-    <gmp-map center="20.773,-156.01" zoom="12" map-id="8b37d7206ccf0121d4414bb0">
-  </body>
+    </head>
+    <body>
+        <gmp-map
+            center="20.773,-156.01"
+            zoom="12"
+            map-id="8b37d7206ccf0121d4414bb0"></gmp-map>
+    </body>
 </html>
 <!-- [END maps_boundaries_simple] -->
diff --git a/samples/create-fiddle.html b/samples/create-fiddle.html
index a85cd73b..87ea715d 100644
--- a/samples/create-fiddle.html
+++ b/samples/create-fiddle.html
@@ -1,89 +1,128 @@
-<!DOCTYPE html>
+<!doctype html>
 <html>
-<head>
-    <title>Create JSFiddle</title>
-    <style>
-        body { font-family: sans-serif; display: grid; place-content: center; text-align: left; height: 100vh; margin: 0; }
-        button { font-size: 1.5em; padding: 0.5em 1em; cursor: pointer; }
-        #error { color: red; font-weight: bold; font-size: smaller; margin-top: 5px; }
-        #sample-name-input { font-size: 1.5em; padding: 0.5em 1em; margin-bottom: 5px;}
-    </style>
-</head>
-<body>
-
-    <h1 id="title">Create a JSFiddle!!!</h1>
-    <p>Create a JSFiddle from any sample in a local branch of js-api-samples.</p>
-    <ol>
-        <li>Run <code>npm run build --workspace=sample-name</code> to build the needed sample.</li>
-        <li>Enter the sample name and click <b>Create Fiddle!</b></li>
-        <li>A fiddle will open in a new browser tab.</li>
-        <li>Update the default name and save the fiddle.</li>
-        <li>Copy the URL to send to collaborators!</li>
-    </ol>
-    
-    <input id="sample-name-input" placeholder="Enter a sample name..." autocomplete="off"></input>
-    <button id="create-fiddle-btn">Create Fiddle!</button>
-    <div id="error"></div>
+    <head>
+        <title>Create JSFiddle</title>
+        <style>
+            body {
+                font-family: sans-serif;
+                display: grid;
+                place-content: center;
+                text-align: left;
+                height: 100vh;
+                margin: 0;
+            }
+            button {
+                font-size: 1.5em;
+                padding: 0.5em 1em;
+                cursor: pointer;
+            }
+            #error {
+                color: red;
+                font-weight: bold;
+                font-size: smaller;
+                margin-top: 5px;
+            }
+            #sample-name-input {
+                font-size: 1.5em;
+                padding: 0.5em 1em;
+                margin-bottom: 5px;
+            }
+        </style>
+    </head>
+    <body>
+        <h1 id="title">Create a JSFiddle!!!</h1>
+        <p>
+            Create a JSFiddle from any sample in a local branch of
+            js-api-samples.
+        </p>
+        <ol>
+            <li>
+                Run <code>npm run build --workspace=sample-name</code> to build
+                the needed sample.
+            </li>
+            <li>Enter the sample name and click <b>Create Fiddle!</b></li>
+            <li>A fiddle will open in a new browser tab.</li>
+            <li>Update the default name and save the fiddle.</li>
+            <li>Copy the URL to send to collaborators!</li>
+        </ol>
 
-    <!-- This form will be populated and submitted by the script -->
-    <form id="fiddle-form" action="https://jsfiddle.net/api/post/library/pure/" method="post" target="_blank" style="display: none;">
-        <textarea name="html"></textarea>
-        <textarea name="css"></textarea>
-        <textarea name="js"></textarea>
-        <input type="text" name="resources" />
-        <input type="text" name="title" />
-    </form>
+        <input
+            id="sample-name-input"
+            placeholder="Enter a sample name..."
+            autocomplete="off" />
+        <button id="create-fiddle-btn">Create Fiddle!</button>
+        <div id="error"></div>
 
-    <script>
-        const sampleInput = document.querySelector('#sample-name-input');
-        const button = document.getElementById('create-fiddle-btn');
-        const titleEl = document.getElementById('title');
-        const errorEl = document.getElementById('error');
+        <!-- This form will be populated and submitted by the script -->
+        <form
+            id="fiddle-form"
+            action="https://jsfiddle.net/api/post/library/pure/"
+            method="post"
+            target="_blank"
+            style="display: none">
+            <textarea name="html"></textarea>
+            <textarea name="css"></textarea>
+            <textarea name="js"></textarea>
+            <input type="text" name="resources" />
+            <input type="text" name="title" />
+        </form>
 
+        <script>
+            const sampleInput = document.querySelector('#sample-name-input');
+            const button = document.getElementById('create-fiddle-btn');
+            const titleEl = document.getElementById('title');
+            const errorEl = document.getElementById('error');
 
-        button.addEventListener('click', createFiddle);
+            button.addEventListener('click', createFiddle);
 
-        async function createFiddle() {
-            errorEl.textContent = '';
-            titleEl.textContent = 'Creating Fiddle...';
+            async function createFiddle() {
+                errorEl.textContent = '';
+                titleEl.textContent = 'Creating Fiddle...';
 
-            const sampleName = sampleInput.value;
+                const sampleName = sampleInput.value;
 
-            const form = document.getElementById('fiddle-form');
-            const basePath = `../dist/samples/${sampleName}/jsfiddle`;
+                const form = document.getElementById('fiddle-form');
+                const basePath = `../dist/samples/${sampleName}/jsfiddle`;
 
-            try {
-                // 1. Fetch the file contents from the dist directory
-                const [htmlResponse, cssResponse, jsResponse] = await Promise.all([
-                    fetch(`${basePath}/demo.html`),
-                    fetch(`${basePath}/demo.css`),
-                    fetch(`${basePath}/demo.js`)
-                ]);
+                try {
+                    // 1. Fetch the file contents from the dist directory
+                    const [htmlResponse, cssResponse, jsResponse] =
+                        await Promise.all([
+                            fetch(`${basePath}/demo.html`),
+                            fetch(`${basePath}/demo.css`),
+                            fetch(`${basePath}/demo.js`),
+                        ]);
 
-                if (!htmlResponse.ok || !cssResponse.ok || !jsResponse.ok) {
-                    throw new Error(`Could not find files in ${basePath}. Double-check the sample name.`);
-                }
+                    if (!htmlResponse.ok || !cssResponse.ok || !jsResponse.ok) {
+                        throw new Error(
+                            `Could not find files in ${basePath}. Double-check the sample name.`
+                        );
+                    }
 
-                const htmlContent = await htmlResponse.text();
-                const cssContent = await cssResponse.text();
-                const jsContent = await jsResponse.text();
+                    const htmlContent = await htmlResponse.text();
+                    const cssContent = await cssResponse.text();
+                    const jsContent = await jsResponse.text();
 
-                // 2. Prepare the code for JSFiddle.
-                const bodyContent = htmlContent.match(/<html>([\s\S]*)<\/html>/i)[1] || '';
+                    // 2. Prepare the code for JSFiddle.
+                    const bodyContent =
+                        htmlContent.match(/<html>([\s\S]*)<\/html>/i)[1] || '';
 
-                // 3. Populate the form fields
-                form.querySelector('textarea[name="html"]').value = bodyContent.trim();
-                form.querySelector('textarea[name="css"]').value = cssContent;
-                form.querySelector('textarea[name="js"]').value = jsContent.trim();
-                form.querySelector('input[name="title"]').value = `Maps JS API Sample: ${sampleName}`;
+                    // 3. Populate the form fields
+                    form.querySelector('textarea[name="html"]').value =
+                        bodyContent.trim();
+                    form.querySelector('textarea[name="css"]').value =
+                        cssContent;
+                    form.querySelector('textarea[name="js"]').value =
+                        jsContent.trim();
+                    form.querySelector('input[name="title"]').value =
+                        `Maps JS API Sample: ${sampleName}`;
 
-                // 4. Submit the form to create the fiddle
-                form.submit();
-            } catch (e) {
-                errorEl.textContent = e.message;
+                    // 4. Submit the form to create the fiddle
+                    form.submit();
+                } catch (e) {
+                    errorEl.textContent = e.message;
+                }
             }
-        }
-    </script>
-
-</body>
+        </script>
+    </body>
 </html>
diff --git a/samples/place-text-search/index.html b/samples/place-text-search/index.html
index b641c55d..0f12265e 100644
--- a/samples/place-text-search/index.html
+++ b/samples/place-text-search/index.html
@@ -6,22 +6,25 @@
 -->
 <!-- [START maps_place_text_search] -->
 <html>
-  <head>
-    <title>Text Search</title>
+    <head>
+        <title>Text Search</title>
 
-    <link rel="stylesheet" type="text/css" href="./style.css" />
-    <script type="module" src="./index.js"></script>
-  </head>
-  <body>
-    <div id="text-input-card">
-      <input type="text" id="text-input" placeholder="Search for a place"></input>
-      <input type="button" id="text-input-button" value="Search"></input>
-    </div>
-    <div id="map"></div>
+        <link rel="stylesheet" type="text/css" href="./style.css" />
+        <script type="module" src="./index.js"></script>
+    </head>
+    <body>
+        <div id="text-input-card">
+            <input
+                type="text"
+                id="text-input"
+                placeholder="Search for a place" />
+            <input type="button" id="text-input-button" value="Search" />
+        </div>
+        <div id="map"></div>
 
-    <!-- prettier-ignore -->
-    <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))})
+        <!-- prettier-ignore -->
+        <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: "AIzaSyA6myHzS10YXdcazAFalmXvDkrYCp5cLc8", v: "weekly"});</script>
-  </body>
+    </body>
 </html>
 <!-- [END maps_place_text_search] -->
