diff --git a/examples/catalog/__tests__/components/search/__snapshots__/Form.test.tsx.snap b/examples/catalog/__tests__/components/search/__snapshots__/Form.test.tsx.snap
index 53e378dd..d8dfe846 100644
--- a/examples/catalog/__tests__/components/search/__snapshots__/Form.test.tsx.snap
+++ b/examples/catalog/__tests__/components/search/__snapshots__/Form.test.tsx.snap
@@ -5,24 +5,20 @@ exports[`📸 of Form component with empty 1`] = `
   <form
     class="items-center"
   >
-    <div
-      class="flex"
+    <input
+      aria-label="Search"
+      class="inline-block w-1/2 pr-3 py-2 border border-gray-300 rounded-md leading-5 bg-white placeholder-gray-500 focus:outline-none focus:placeholder-gray-400 focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
+      id="search2"
+      name="search"
+      placeholder="GDP data..."
+      type="search"
+    />
+    <button
+      class="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
+      type="button"
     >
-      <input
-        aria-label="Search"
-        class="bg-white focus:outline-none focus:shadow-outline border border-gray-300 w-1/2 rounded-lg py-2 px-4 block appearance-none leading-normal"
-        name="search#q"
-        placeholder="Search"
-        type="text"
-        value=""
-      />
-      <button
-        class="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
-        type="button"
-      >
-        Search
-      </button>
-    </div>
+      Search
+    </button>
   </form>
 </div>
 `;
@@ -32,24 +28,20 @@ exports[`📸 of Form component with query 1`] = `
   <form
     class="items-center"
   >
-    <div
-      class="flex"
+    <input
+      aria-label="Search"
+      class="inline-block w-1/2 pr-3 py-2 border border-gray-300 rounded-md leading-5 bg-white placeholder-gray-500 focus:outline-none focus:placeholder-gray-400 focus:ring-1 focus:ring-indigo-500 focus:border-indigo-500 sm:text-sm"
+      id="search2"
+      name="search"
+      placeholder="GDP data..."
+      type="search"
+    />
+    <button
+      class="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
+      type="button"
     >
-      <input
-        aria-label="Search"
-        class="bg-white focus:outline-none focus:shadow-outline border border-gray-300 w-1/2 rounded-lg py-2 px-4 block appearance-none leading-normal"
-        name="search#q"
-        placeholder="Search"
-        type="text"
-        value=""
-      />
-      <button
-        class="inline-block text-sm px-4 py-3 mx-3 leading-none border rounded text-white bg-black border-black lg:mt-0"
-        type="button"
-      >
-        Search
-      </button>
-    </div>
+      Search
+    </button>
   </form>
 </div>
 `;