feat(docs): Integrate kapaai (#2428)

* test(docs): test kapa.ai script

* feat(docs): add script-providers.tsx

* refactor(docs): update layout.tsx

* chore(docs): update script-providers.tsx

* refactor(docs): update layout.tsx

apps/docs/app/layout.tsx

@@ -1,9 +1,7 @@
 import "@/styles/globals.css";
 import "@/styles/sandpack.css";
 import {Metadata} from "next";
-import Script from "next/script";
 import {clsx} from "@nextui-org/shared-utils";
-import {Analytics} from "@vercel/analytics/react";
 
 import {Providers} from "./providers";
 
@@ -13,8 +11,8 @@ import {siteConfig} from "@/config/site";
 import {fontSans} from "@/config/fonts";
 import {Navbar} from "@/components/navbar";
 import {Footer} from "@/components/footer";
-import {__PROD__} from "@/utils";
 import {ProBanner} from "@/components/pro-banner";
+import {ScriptProviders} from "@/components/scripts/script-providers";
 
 export const metadata: Metadata = {
   title: {
@@ -79,8 +77,7 @@ export default function RootLayout({children}: {children: React.ReactNode}) {
           </div>
           <Cmdk />
         </Providers>
-        {__PROD__ && <Analytics />}
-        <Script id="featurebase-sdk" src="https://do.featurebase.app/js/sdk.js" />
+        <ScriptProviders />
       </body>
     </html>
   );

apps/docs/components/scripts/script-providers.tsx

@@ -0,0 +1,29 @@
+import * as React from "react";
+import {Analytics} from "@vercel/analytics/react";
+import Script from "next/script";
+
+import {__PROD__} from "@/utils";
+
+export function ScriptProviders() {
+  return (
+    <>
+      <Script
+        id="featurebase-sdk"
+        src="https://do.featurebase.app/js/sdk.js"
+        strategy={"beforeInteractive"}
+      />
+      <Script
+        defer
+        data-modal-disclaimer="This is a custom LLM for NextUI with access to all developer docs (nextui.org/docs) and GitHub Issues and PRs (github.com/nextui-org/nextui)."
+        data-modal-example-questions="How do I install for Next.js?,How do I customize primary color?"
+        data-project-color="#000000"
+        data-project-logo="https://avatars.githubusercontent.com/u/86160567?s=280&v=4"
+        data-project-name="NextUI"
+        data-website-id="e733a73f-980e-4f7d-9e8b-91867453f899"
+        src="https://widget.kapa.ai/kapa-widget.bundle.js"
+        strategy="afterInteractive"
+      />
+      {__PROD__ && <Analytics />}
+    </>
+  );
+}