feat(docs): added tanstack router to the routing section in the docum…

…entation (#3271)

* feat(docs): added tanstack router to the routing section in the documentation

* fix: updated the TanStack Router example by following RA example

* fix: updated the documentation wordings

* chore(docs): update highlighted row numbers

---------

Co-authored-by: HaRuki Kuriwada <[email protected]>
Co-authored-by: WK Wong <[email protected]>

apps/docs/content/docs/guide/routing.mdx

@@ -197,6 +197,29 @@ export default function App() {
 ```
 
 
+### TanStack
+
+To use [TanStack Router](https://tanstack.com/router/latest) with NextUI, render NextUI's RouterProvider inside your root route. Use `router.navigate` in the `navigate` prop, and `router.buildLocation` in the `useHref` prop. 
+
+```tsx {9,10}
+// app/root.tsx
+import {NextUIProvider} from '@nextui-org/react';
+
+function RootRoute() {
+  let router = useRouter();
+
+  return (
+    <NextUIProvider 
+      navigate={(to, options) => router.navigate({ to, ...options })}
+      useHref={(to) => router.buildLocation(to).href}
+    >
+      {/* You app here... */}
+    </NextUIProvider>
+  );
+}
+```
+
+
 ### Usage examples
 
 Now that you have set up the `NextUIProvider` in your app, you can use the `href` prop in the `Tabs`, 
@@ -245,4 +268,4 @@ function App() {
     </>
   );
 }
-```
+```