@sondor-technology/sondor-components 1.0.4 → 1.0.6

package/src/components/router/router.ts

@@ -1,6 +1,6 @@
 export interface RouteDefinition {
   component: string;
-  [key: string]: unknown; // Allows consuming apps to attach custom metadata (e.g., titles, auth roles)
+  [key: string]: unknown;
 }
 
 export type RouteConfig = Record<string, RouteDefinition>;
@@ -13,85 +13,105 @@ export interface RouteMatch {
 }
 
 function getRouteWeight(pattern: string): number {
-  const segments = pattern.split('/').filter(Boolean);
+  const segments = pattern.split("/").filter(Boolean);
   return segments.reduce((weight, seg) => {
-    return weight + (seg.startsWith(':') ? 1 : 10);
+    return weight + (seg.startsWith(":") ? 1 : 10);
   }, 0);
 }
 
 export class AppRouter {
   private _routes: RouteConfig = {};
   private _initialized = false;
+  private _boundNotify: () => void;
+  private _boundClick: (e: MouseEvent) => void;
 
   constructor(routes?: RouteConfig) {
+    this._boundNotify = () => this._notify();
+    this._boundClick = (e: MouseEvent) => this._handleClick(e);
+
     if (routes) {
       this.setRoutes(routes);
     }
 
-    window.addEventListener('popstate', () => this._notify());
-    
-    document.addEventListener('click', (e) => {
-      if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) {
-        return;
-      }
-
-      const path = e.composedPath();
-      const link = path.find((el: any) => 
-        el && typeof el.hasAttribute === 'function' && el.hasAttribute('href')
-      ) as HTMLElement | undefined;
+    // 🚀 FIX: SSR Safety check. Prevents crashes during Node.js CI test imports.
+    if (typeof window !== "undefined") {
+      window.addEventListener("popstate", this._boundNotify);
+      document.addEventListener("click", this._boundClick as EventListener);
+    }
+  }
 
-      if (!link) return;
+  /**
+   * 🚀 FIX: Removes global listeners to prevent memory leaks during testing/teardown.
+   */
+  public destroy() {
+    if (typeof window !== "undefined") {
+      window.removeEventListener("popstate", this._boundNotify);
+      document.removeEventListener("click", this._boundClick as EventListener);
+    }
+  }
 
-      const href = link.getAttribute('href');
-      const target = link.getAttribute('target');
+  private _handleClick(e: MouseEvent) {
+    if (e.defaultPrevented || e.button !== 0 || e.metaKey || e.ctrlKey || e.shiftKey || e.altKey) {
+      return;
+    }
 
-      if (!href || href.startsWith('http') || href.startsWith('mailto:') || target === '_blank') {
-        return;
-      }
+    const path = e.composedPath();
+    const link = path.find(
+      (el: any) => el && typeof el.hasAttribute === "function" && el.hasAttribute("href"),
+    ) as HTMLElement | undefined;
+
+    if (!link) return;
+
+    const href = link.getAttribute("href");
+    const target = link.getAttribute("target");
+
+    // 🚀 FIX: Ignore links with the 'download' attribute so file downloads aren't hijacked
+    if (
+      !href ||
+      href.startsWith("http") ||
+      href.startsWith("mailto:") ||
+      target === "_blank" ||
+      link.hasAttribute("download")
+    ) {
+      return;
+    }
 
-      if (href.startsWith('/')) {
-        e.preventDefault(); 
-        this.navigate(href);
-      }
-    });
+    if (href.startsWith("/")) {
+      e.preventDefault();
+      this.navigate(href);
+    }
   }
 
-  /**
-   * Register or update the route configuration for this application.
-   */
   public setRoutes(routes: RouteConfig) {
     this._routes = routes;
 
-    // Trigger initial route resolution once routes are registered
     if (!this._initialized) {
       this._initialized = true;
-      setTimeout(() => this._notify(), 0);
+      if (typeof window !== "undefined") {
+        setTimeout(() => this._notify(), 0);
+      }
     } else {
       this._notify();
     }
   }
 
-  /**
-   * Programmatically navigate to an internal path.
-   */
   public navigate(path: string) {
-    window.history.pushState(null, '', path);
+    if (typeof window !== "undefined") {
+      window.history.pushState(null, "", path);
+    }
     this._notify();
   }
 
-  /**
-   * Matches a URL path against the registered routes.
-   */
   public matchRoute(currentPath: string): RouteMatch | null {
     const sortedRoutes = Object.entries(this._routes).sort(
-      ([patternA], [patternB]) => getRouteWeight(patternB) - getRouteWeight(patternA)
+      ([patternA], [patternB]) => getRouteWeight(patternB) - getRouteWeight(patternA),
     );
 
     for (const [pattern, routeDef] of sortedRoutes) {
       const paramNames: string[] = [];
       const regexPath = pattern.replace(/:([a-zA-Z0-9_]+)/g, (_, paramName) => {
         paramNames.push(paramName);
-        return '([^/]+)';
+        return "([^/]+)";
       });
 
       const regex = new RegExp(`^${regexPath}$`);
@@ -107,7 +127,7 @@ export class AppRouter {
           path: currentPath,
           component: routeDef.component,
           params,
-          definition: routeDef
+          definition: routeDef,
         };
       }
     }
@@ -116,19 +136,22 @@ export class AppRouter {
   }
 
   private _notify() {
+    if (typeof window === "undefined") return;
+
     const currentPath = window.location.pathname;
     const match = this.matchRoute(currentPath);
 
-    window.dispatchEvent(new CustomEvent('route-changed', { 
-      detail: {
-        path: currentPath,
-        component: match ? match.component : 'not-found-page',
-        params: match ? match.params : {},
-        definition: match ? match.definition : null
-      }
-    }));
+    window.dispatchEvent(
+      new CustomEvent("route-changed", {
+        detail: {
+          path: currentPath,
+          component: match ? match.component : "not-found-page",
+          params: match ? match.params : {},
+          definition: match ? match.definition : null,
+        },
+      }),
+    );
   }
 }
 
-// Export a singleton instance for standard app-wide use
-export const router = new AppRouter();
+export const router = new AppRouter();