docs: DX and performance improvements in API reference (#9430)

- Improve scroll behavior between active sections
- Improve lag when clicking on a sidebar item
- Refactor internal working of the `SidebarProvider` to find active items faster.
- Use Next.js's `useRouter` hook for changing the hash (since they added the option to disable scroll)
- Change `isBrowser` from a hook to a provider since it's widely used across applications.
- Other general improvements and fixes.

Closes DOCS-952

www/packages/docs-ui/src/layouts/main-content.tsx

@@ -16,7 +16,7 @@ export const MainContentLayout = ({
   mainWrapperClasses,
   showBanner = true,
 }: MainContentLayoutProps) => {
-  const isBrowser = useIsBrowser()
+  const { isBrowser } = useIsBrowser()
   const { desktopSidebarOpen } = useSidebar()
 
   useEffect(() => {

www/packages/docs-ui/src/layouts/root.tsx

@@ -1,6 +1,6 @@
 import React from "react"
 import clsx from "clsx"
-import { Sidebar, SidebarProps } from "@/components"
+import { RootProviders, Sidebar, SidebarProps } from "@/components"
 import { MobileNavigation } from "../components/MobileNavigation"
 import { Toc } from "../components/Toc"
 import { MainContentLayout, MainContentLayoutProps } from "./main-content"
@@ -36,14 +36,16 @@ export const RootLayout = ({
           bodyClassName
         )}
       >
-        <ProvidersComponent>
-          <MobileNavigation />
-          <Sidebar {...sidebarProps} />
-          <div className={clsx("relative", "h-screen", "flex")}>
-            <MainContentLayout {...mainProps} />
-            {showToc && <Toc />}
-          </div>
-        </ProvidersComponent>
+        <RootProviders>
+          <ProvidersComponent>
+            <MobileNavigation />
+            <Sidebar {...sidebarProps} />
+            <div className={clsx("relative", "h-screen", "flex")}>
+              <MainContentLayout {...mainProps} />
+              {showToc && <Toc />}
+            </div>
+          </ProvidersComponent>
+        </RootProviders>
       </body>
     </html>
   )