fix nextjs linting hints and improve adapter to support config as function

examples/nextjs/src/components/Buttons.tsx

@@ -0,0 +1,29 @@
+import Image from "next/image";
+
+export const Buttons = () => (
+   <div className="flex gap-4 items-center flex-col sm:flex-row">
+      <a
+         className="rounded-full border border-solid border-transparent transition-colors flex items-center justify-center bg-foreground text-background gap-2 hover:bg-[#383838] dark:hover:bg-[#ccc] text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5"
+         href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
+         target="_blank"
+         rel="noopener noreferrer"
+      >
+         <Image
+            className="dark:invert"
+            src="/vercel.svg"
+            alt="Vercel logomark"
+            width={20}
+            height={20}
+         />
+         Deploy now
+      </a>
+      <a
+         className="rounded-full border border-solid border-black/[.08] dark:border-white/[.145] transition-colors flex items-center justify-center hover:bg-[#f2f2f2] dark:hover:bg-[#1a1a1a] hover:border-transparent text-sm sm:text-base h-10 sm:h-12 px-4 sm:px-5 sm:min-w-44"
+         href="https://docs.bknd.io/integration/nextjs"
+         target="_blank"
+         rel="noopener noreferrer"
+      >
+         Read our docs
+      </a>
+   </div>
+);