@supernal/interface-nextjs 1.0.24 → 1.0.25

package/dist/index.js

@@ -4144,8 +4144,15 @@ var import_browser6 = require("@supernal/interface/browser");
 
 // src/hooks/useLocationTracking.ts
 var import_react14 = require("react");
-var import_router = require("next/router");
 var import_browser4 = require("@supernal/interface/browser");
+var usePathname;
+var useSearchParams;
+try {
+  const navigation = require("next/navigation");
+  usePathname = navigation.usePathname;
+  useSearchParams = navigation.useSearchParams;
+} catch {
+}
 function getVisibleElements() {
   if (typeof document === "undefined") return [];
   const elements = document.querySelectorAll("[data-testid]");
@@ -4157,77 +4164,126 @@ function arraysEqual(a, b) {
   const sortedB = [...b].sort();
   return sortedA.every((val, idx) => val === sortedB[idx]);
 }
+function getCurrentLocation() {
+  if (typeof window === "undefined") {
+    return { pathname: "/", search: "", asPath: "/" };
+  }
+  return {
+    pathname: window.location.pathname,
+    search: window.location.search,
+    asPath: window.location.pathname + window.location.search
+  };
+}
 function useLocationTracking() {
-  const router = (0, import_router.useRouter)();
   const lastLocationRef = (0, import_react14.useRef)("");
   const lastElementsRef = (0, import_react14.useRef)([]);
+  let pathname = null;
+  let searchParams = null;
+  try {
+    if (usePathname) {
+      pathname = usePathname();
+    }
+    if (useSearchParams) {
+      searchParams = useSearchParams();
+    }
+  } catch {
+  }
   (0, import_react14.useEffect)(() => {
     const updateLocation = () => {
+      const location = pathname !== null ? { pathname, search: searchParams?.toString() || "", asPath: pathname + (searchParams?.toString() ? `?${searchParams.toString()}` : "") } : getCurrentLocation();
       const visibleElements = getVisibleElements();
-      const locationChanged = lastLocationRef.current !== router.pathname;
+      const locationChanged = lastLocationRef.current !== location.pathname;
       const elementsChanged = !arraysEqual(lastElementsRef.current, visibleElements);
       if (locationChanged || elementsChanged) {
         import_browser4.LocationContext.setCurrent({
-          page: router.pathname,
-          route: router.route,
+          page: location.pathname,
+          route: location.pathname,
           elements: visibleElements,
           metadata: {
-            query: router.query,
-            asPath: router.asPath
+            search: location.search,
+            asPath: location.asPath
           }
         });
         if (locationChanged) {
-          console.log(`[LocationTracking] Updated location: ${router.pathname}`);
+          console.log(`[LocationTracking] Updated location: ${location.pathname}`);
         }
         if (elementsChanged) {
           console.log(`[LocationTracking] Visible elements changed: ${visibleElements.length} elements`);
         }
-        lastLocationRef.current = router.pathname;
+        lastLocationRef.current = location.pathname;
         lastElementsRef.current = visibleElements;
       }
     };
     const initialTimer = setTimeout(updateLocation, 100);
     const intervalId = setInterval(updateLocation, 1e3);
-    const handleRouteChange = () => {
+    const handleNavigation = () => {
       setTimeout(updateLocation, 100);
     };
-    router.events.on("routeChangeComplete", handleRouteChange);
+    window.addEventListener("popstate", handleNavigation);
     return () => {
       clearTimeout(initialTimer);
       clearInterval(intervalId);
-      router.events.off("routeChangeComplete", handleRouteChange);
+      window.removeEventListener("popstate", handleNavigation);
     };
-  }, [router.pathname, router.route, router.asPath]);
+  }, [pathname, searchParams]);
 }
 
 // src/hooks/useNavigationGraphSetup.ts
 var import_react15 = require("react");
-var import_router2 = require("next/router");
+var useAppRouter;
+var usePathname2;
+try {
+  const navigation = require("next/navigation");
+  useAppRouter = navigation.useRouter;
+  usePathname2 = navigation.usePathname;
+} catch {
+}
 function useNavigationGraphSetup() {
-  const router = (0, import_router2.useRouter)();
   const [isInitialized, setIsInitialized] = (0, import_react15.useState)(false);
+  let router = null;
+  let pathname = null;
+  try {
+    if (useAppRouter) {
+      router = useAppRouter();
+    }
+    if (usePathname2) {
+      pathname = usePathname2();
+    }
+  } catch {
+  }
+  const navigate = (0, import_react15.useCallback)((path) => {
+    const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+    if (router?.push) {
+      router.push(normalizedPath);
+    } else if (typeof window !== "undefined") {
+      window.location.href = normalizedPath;
+    }
+  }, [router]);
+  const currentPath = pathname ?? (typeof window !== "undefined" ? window.location.pathname + window.location.search : "/");
   (0, import_react15.useEffect)(() => {
     import("@supernal/interface/browser").then(({ NavigationGraph: NavigationGraph2 }) => {
       const graph = NavigationGraph2.getInstance();
-      const handler = (path) => {
-        const normalizedPath = path.startsWith("/") ? path : `/${path}`;
-        router.push(normalizedPath);
+      graph.setNavigationHandler(navigate);
+      const browserRouter = {
+        push: navigate,
+        back: () => router?.back?.() ?? window.history.back(),
+        forward: () => router?.forward?.() ?? window.history.forward(),
+        refresh: () => router?.refresh?.() ?? window.location.reload()
       };
-      graph.setNavigationHandler(handler);
-      graph.setRouter(router);
-      graph.setCurrentContext(router.asPath);
+      graph.setRouter(browserRouter);
+      graph.setCurrentContext(currentPath);
       setIsInitialized(true);
       console.log("[NavigationGraphSetup] Auto-configured with Next.js router");
     });
-  }, [router]);
+  }, [navigate, currentPath]);
   (0, import_react15.useEffect)(() => {
     if (!isInitialized) return;
     import("@supernal/interface/browser").then(({ NavigationGraph: NavigationGraph2 }) => {
       const graph = NavigationGraph2.getInstance();
-      graph.setCurrentContext(router.asPath);
-      console.log(`[NavigationGraphSetup] Context updated: ${router.asPath}`);
+      graph.setCurrentContext(currentPath);
+      console.log(`[NavigationGraphSetup] Context updated: ${currentPath}`);
     });
-  }, [router.asPath, isInitialized]);
+  }, [currentPath, isInitialized]);
 }
 
 // src/components/ToolMenuPopup/ToolMenuPopup.tsx

package/dist/index.mjs

@@ -4090,8 +4090,15 @@ import { ExposureCollector, ToolRegistry as ToolRegistry3 } from "@supernal/inte
 
 // src/hooks/useLocationTracking.ts
 import { useEffect as useEffect10, useRef as useRef9 } from "react";
-import { useRouter } from "next/router";
 import { LocationContext } from "@supernal/interface/browser";
+var usePathname;
+var useSearchParams;
+try {
+  const navigation = __require("next/navigation");
+  usePathname = navigation.usePathname;
+  useSearchParams = navigation.useSearchParams;
+} catch {
+}
 function getVisibleElements() {
   if (typeof document === "undefined") return [];
   const elements = document.querySelectorAll("[data-testid]");
@@ -4103,77 +4110,126 @@ function arraysEqual(a, b) {
   const sortedB = [...b].sort();
   return sortedA.every((val, idx) => val === sortedB[idx]);
 }
+function getCurrentLocation() {
+  if (typeof window === "undefined") {
+    return { pathname: "/", search: "", asPath: "/" };
+  }
+  return {
+    pathname: window.location.pathname,
+    search: window.location.search,
+    asPath: window.location.pathname + window.location.search
+  };
+}
 function useLocationTracking() {
-  const router = useRouter();
   const lastLocationRef = useRef9("");
   const lastElementsRef = useRef9([]);
+  let pathname = null;
+  let searchParams = null;
+  try {
+    if (usePathname) {
+      pathname = usePathname();
+    }
+    if (useSearchParams) {
+      searchParams = useSearchParams();
+    }
+  } catch {
+  }
   useEffect10(() => {
     const updateLocation = () => {
+      const location = pathname !== null ? { pathname, search: searchParams?.toString() || "", asPath: pathname + (searchParams?.toString() ? `?${searchParams.toString()}` : "") } : getCurrentLocation();
       const visibleElements = getVisibleElements();
-      const locationChanged = lastLocationRef.current !== router.pathname;
+      const locationChanged = lastLocationRef.current !== location.pathname;
       const elementsChanged = !arraysEqual(lastElementsRef.current, visibleElements);
       if (locationChanged || elementsChanged) {
         LocationContext.setCurrent({
-          page: router.pathname,
-          route: router.route,
+          page: location.pathname,
+          route: location.pathname,
           elements: visibleElements,
           metadata: {
-            query: router.query,
-            asPath: router.asPath
+            search: location.search,
+            asPath: location.asPath
           }
         });
         if (locationChanged) {
-          console.log(`[LocationTracking] Updated location: ${router.pathname}`);
+          console.log(`[LocationTracking] Updated location: ${location.pathname}`);
         }
         if (elementsChanged) {
           console.log(`[LocationTracking] Visible elements changed: ${visibleElements.length} elements`);
         }
-        lastLocationRef.current = router.pathname;
+        lastLocationRef.current = location.pathname;
         lastElementsRef.current = visibleElements;
       }
     };
     const initialTimer = setTimeout(updateLocation, 100);
     const intervalId = setInterval(updateLocation, 1e3);
-    const handleRouteChange = () => {
+    const handleNavigation = () => {
       setTimeout(updateLocation, 100);
     };
-    router.events.on("routeChangeComplete", handleRouteChange);
+    window.addEventListener("popstate", handleNavigation);
     return () => {
       clearTimeout(initialTimer);
       clearInterval(intervalId);
-      router.events.off("routeChangeComplete", handleRouteChange);
+      window.removeEventListener("popstate", handleNavigation);
     };
-  }, [router.pathname, router.route, router.asPath]);
+  }, [pathname, searchParams]);
 }
 
 // src/hooks/useNavigationGraphSetup.ts
-import { useEffect as useEffect11, useState as useState11 } from "react";
-import { useRouter as useRouter2 } from "next/router";
+import { useEffect as useEffect11, useState as useState11, useCallback as useCallback7 } from "react";
+var useAppRouter;
+var usePathname2;
+try {
+  const navigation = __require("next/navigation");
+  useAppRouter = navigation.useRouter;
+  usePathname2 = navigation.usePathname;
+} catch {
+}
 function useNavigationGraphSetup() {
-  const router = useRouter2();
   const [isInitialized, setIsInitialized] = useState11(false);
+  let router = null;
+  let pathname = null;
+  try {
+    if (useAppRouter) {
+      router = useAppRouter();
+    }
+    if (usePathname2) {
+      pathname = usePathname2();
+    }
+  } catch {
+  }
+  const navigate = useCallback7((path) => {
+    const normalizedPath = path.startsWith("/") ? path : `/${path}`;
+    if (router?.push) {
+      router.push(normalizedPath);
+    } else if (typeof window !== "undefined") {
+      window.location.href = normalizedPath;
+    }
+  }, [router]);
+  const currentPath = pathname ?? (typeof window !== "undefined" ? window.location.pathname + window.location.search : "/");
   useEffect11(() => {
     import("@supernal/interface/browser").then(({ NavigationGraph: NavigationGraph2 }) => {
       const graph = NavigationGraph2.getInstance();
-      const handler = (path) => {
-        const normalizedPath = path.startsWith("/") ? path : `/${path}`;
-        router.push(normalizedPath);
+      graph.setNavigationHandler(navigate);
+      const browserRouter = {
+        push: navigate,
+        back: () => router?.back?.() ?? window.history.back(),
+        forward: () => router?.forward?.() ?? window.history.forward(),
+        refresh: () => router?.refresh?.() ?? window.location.reload()
       };
-      graph.setNavigationHandler(handler);
-      graph.setRouter(router);
-      graph.setCurrentContext(router.asPath);
+      graph.setRouter(browserRouter);
+      graph.setCurrentContext(currentPath);
       setIsInitialized(true);
       console.log("[NavigationGraphSetup] Auto-configured with Next.js router");
     });
-  }, [router]);
+  }, [navigate, currentPath]);
   useEffect11(() => {
     if (!isInitialized) return;
     import("@supernal/interface/browser").then(({ NavigationGraph: NavigationGraph2 }) => {
       const graph = NavigationGraph2.getInstance();
-      graph.setCurrentContext(router.asPath);
-      console.log(`[NavigationGraphSetup] Context updated: ${router.asPath}`);
+      graph.setCurrentContext(currentPath);
+      console.log(`[NavigationGraphSetup] Context updated: ${currentPath}`);
     });
-  }, [router.asPath, isInitialized]);
+  }, [currentPath, isInitialized]);
 }
 
 // src/components/ToolMenuPopup/ToolMenuPopup.tsx
@@ -4405,7 +4461,7 @@ var ToolMenuPopup = ({
 import { useEffect as useEffect13 } from "react";
 
 // src/components/ToolMenuPopup/useToolMenu.ts
-import { useState as useState13, useMemo as useMemo4, useCallback as useCallback7 } from "react";
+import { useState as useState13, useMemo as useMemo4, useCallback as useCallback8 } from "react";
 import { ToolRegistry as ToolRegistry2 } from "@supernal/interface/browser";
 var CATEGORY_DISPLAY = {
   navigation: "Navigation",
@@ -4427,9 +4483,9 @@ var CATEGORY_DISPLAY = {
 };
 function useToolMenu() {
   const [isOpen, setIsOpen] = useState13(false);
-  const open = useCallback7(() => setIsOpen(true), []);
-  const close = useCallback7(() => setIsOpen(false), []);
-  const toggle = useCallback7(() => setIsOpen((prev) => !prev), []);
+  const open = useCallback8(() => setIsOpen(true), []);
+  const close = useCallback8(() => setIsOpen(false), []);
+  const toggle = useCallback8(() => setIsOpen((prev) => !prev), []);
   const { categories, totalTools, contextLabel } = useMemo4(() => {
     if (!isOpen) {
       return { categories: [], totalTools: 0, contextLabel: "" };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supernal/interface-nextjs",
-  "version": "1.0.24",
+  "version": "1.0.25",
   "description": "Next.js integration for Supernal Intelligence Interface - enables agentic UX with one line of code",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",