@jsenv/navi 0.16.0 → 0.16.2

package/dist/jsenv_navi.js

@@ -7522,21 +7522,31 @@ setBaseUrl(
 // Pattern registry for building relationships before routes are created
 const patternRegistry = new Map(); // pattern -> patternData
 const patternRelationships = new Map(); // pattern -> relationships
+let patternsRegistered = false;
 
 // Function to detect signals in route patterns and connect them
 const detectSignals = (routePattern) => {
   const signalConnections = [];
   let updatedPattern = routePattern;
 
-  // Look for signals in the new syntax: :paramName={navi_state_signal:id} or ?paramName={navi_state_signal:id} or &paramName={navi_state_signal:id}
-  // Using curly braces to avoid conflicts with underscores in signal IDs
-  const signalParamRegex = /([?:&])(\w+)=(\{navi_state_signal:[^}]+\})/g;
+  // Look for signals in two formats:
+  // 1. Expected format: :paramName={navi_state_signal:id} or ?paramName={navi_state_signal:id} or &paramName={navi_state_signal:id}
+  // 2. Typoe format (missing = sign): &paramName{navi_state_signal:id}
+  const signalParamRegex = /([?:&])(\w+)(=)?(\{navi_state_signal:[^}]+\})/g;
   let match;
 
   while ((match = signalParamRegex.exec(routePattern)) !== null) {
-    const [fullMatch, prefix, paramName, signalString] = match;
+    const [fullMatch, prefix, paramName, equalSign, signalString] = match;
 
-    // Extract the signal ID from the new format: {navi_state_signal:id}
+    // Emit warning if equal sign is missing
+    if (!equalSign) {
+      console.warn(
+        `[detectSignals] Missing '=' sign in route pattern: "${prefix}${paramName}${signalString}". ` +
+          `Consider using "${prefix}${paramName}=${signalString}" for better clarity.`,
+      );
+    }
+
+    // Extract the signal ID from the format: {navi_state_signal:id}
     const signalIdMatch = signalString.match(/\{navi_state_signal:([^}]+)\}/);
     if (!signalIdMatch) {
       console.warn(
@@ -7553,13 +7563,10 @@ const detectSignals = (routePattern) => {
 
       let replacement;
       if (prefix === ":") {
-        // Path parameter: :section=__jsenv_signal_1__ becomes :section
-        replacement = `${prefix}${paramName}`;
-      } else if (prefix === "?") {
-        // First search parameter: ?city=__jsenv_signal_1__ becomes ?city
+        // Path parameter: :section={navi_state_signal:...} becomes :section
         replacement = `${prefix}${paramName}`;
-      } else if (prefix === "&") {
-        // Additional search parameter: &lon=__jsenv_signal_1__ becomes &lon
+      } else if (prefix === "?" || prefix === "&") {
+        // Query parameter: ?city={navi_state_signal:...} or &lon{navi_state_signal:...} becomes ?city or &lon
         replacement = `${prefix}${paramName}`;
       }
       updatedPattern = updatedPattern.replace(fullMatch, replacement);
@@ -7606,6 +7613,7 @@ const createRoutePattern = (pattern) => {
     const result = matchUrl(parsedPattern, url, {
       parameterDefaults,
       baseUrl,
+      connections,
     });
 
     return result;
@@ -7793,6 +7801,41 @@ const createRoutePattern = (pattern) => {
       }
     }
 
+    // PARENT PARAMETER INHERITANCE: Inherit query parameters from parent patterns
+    // This allows child routes like "/map/isochrone" to inherit "zoom=15" from parent "/map/?zoom=..."
+    const parentPatterns = relationships?.parentPatterns || [];
+    for (const parentPattern of parentPatterns) {
+      const parentPatternData = getPatternData(parentPattern);
+      if (!parentPatternData) continue;
+
+      // Check parent's signal connections for non-default values to inherit
+      for (const parentConnection of parentPatternData.connections) {
+        const { paramName, signal, options } = parentConnection;
+        const defaultValue = options.defaultValue;
+
+        // If we don't already have this parameter and parent signal has non-default value
+        if (
+          !(paramName in finalParams) &&
+          signal?.value !== undefined &&
+          signal.value !== defaultValue
+        ) {
+          // Check if this parameter corresponds to a literal segment in our path
+          // E.g., don't inherit "section=analytics" if our path is "/admin/analytics"
+          const shouldInherit = !isParameterRedundantWithLiteralSegments(
+            parsedPattern,
+            parentPatternData.parsedPattern,
+            paramName,
+            signal.value,
+          );
+
+          if (shouldInherit) {
+            // Inherit the parent's signal value
+            finalParams[paramName] = signal.value;
+          }
+        }
+      }
+    }
+
     if (!parsedPattern.segments) {
       return "/";
     }
@@ -7950,7 +7993,11 @@ const checkIfLiteralCanBeOptional = (literalValue, patternRegistry) => {
 /**
  * Match a URL against a parsed pattern
  */
-const matchUrl = (parsedPattern, url, { parameterDefaults, baseUrl }) => {
+const matchUrl = (
+  parsedPattern,
+  url,
+  { parameterDefaults, baseUrl, connections = [] },
+) => {
   // Parse the URL
   const urlObj = new URL(url, baseUrl);
   let pathname = urlObj.pathname;
@@ -7972,14 +8019,14 @@ const matchUrl = (parsedPattern, url, { parameterDefaults, baseUrl }) => {
   // OR when URL exactly matches baseUrl (treating baseUrl as root)
   if (parsedPattern.segments.length === 0) {
     if (pathname === "/" || pathname === "") {
-      return extractSearchParams(urlObj);
+      return extractSearchParams(urlObj, connections);
     }
 
     // Special case: if URL exactly matches baseUrl, treat as root route
     if (baseUrl) {
       const baseUrlObj = new URL(baseUrl);
       if (originalPathname === baseUrlObj.pathname) {
-        return extractSearchParams(urlObj);
+        return extractSearchParams(urlObj, connections);
       }
     }
 
@@ -8074,7 +8121,7 @@ const matchUrl = (parsedPattern, url, { parameterDefaults, baseUrl }) => {
   // If pattern has trailing slash or wildcard, allow extra segments (no additional check needed)
 
   // Add search parameters
-  const searchParams = extractSearchParams(urlObj);
+  const searchParams = extractSearchParams(urlObj, connections);
   Object.assign(params, searchParams);
 
   // Apply remaining parameter defaults for unmatched parameters
@@ -8090,10 +8137,29 @@ const matchUrl = (parsedPattern, url, { parameterDefaults, baseUrl }) => {
 /**
  * Extract search parameters from URL
  */
-const extractSearchParams = (urlObj) => {
+const extractSearchParams = (urlObj, connections = []) => {
   const params = {};
+
+  // Create a map for quick signal type lookup
+  const signalTypes = new Map();
+  for (const connection of connections) {
+    if (connection.options.type) {
+      signalTypes.set(connection.paramName, connection.options.type);
+    }
+  }
+
   for (const [key, value] of urlObj.searchParams) {
-    params[key] = value;
+    const signalType = signalTypes.get(key);
+
+    // Cast value based on signal type
+    if (signalType === "number" || signalType === "float") {
+      const numberValue = Number(value);
+      params[key] = isNaN(numberValue) ? value : numberValue;
+    } else if (signalType === "boolean") {
+      params[key] = value === "true" || value === "1";
+    } else {
+      params[key] = value;
+    }
   }
   return params;
 };
@@ -8157,6 +8223,27 @@ const buildUrlFromPattern = (parsedPattern, params = {}) => {
     path = path.slice(0, -1);
   }
 
+  // Check if we'll have query parameters to decide on trailing slash removal
+  const willHaveQueryParams =
+    parsedPattern.queryParams?.some((qp) => {
+      const value = params[qp.name];
+      return value !== undefined;
+    }) ||
+    Object.entries(params).some(([key, value]) => {
+      const isPathParam = parsedPattern.segments.some(
+        (s) => s.type === "param" && s.name === key,
+      );
+      const isQueryParam = parsedPattern.queryParams?.some(
+        (qp) => qp.name === key,
+      );
+      return value !== undefined && !isPathParam && !isQueryParam;
+    });
+
+  // Remove trailing slash when we have query params for prettier URLs
+  if (willHaveQueryParams && path.endsWith("/") && path !== "/") {
+    path = path.slice(0, -1);
+  }
+
   // Add search parameters
   const pathParamNames = new Set(
     parsedPattern.segments.filter((s) => s.type === "param").map((s) => s.name),
@@ -8255,6 +8342,43 @@ const isChildPattern = (childPattern, parentPattern) => {
   return childSegments.length > parentSegments.length || hasMoreSpecificSegment;
 };
 
+/**
+ * Check if a parameter is redundant because the child pattern already has it as a literal segment
+ * E.g., parameter "section" is redundant for pattern "/admin/settings/:tab" because "settings" is literal
+ */
+const isParameterRedundantWithLiteralSegments = (
+  childPattern,
+  parentPattern,
+  paramName,
+) => {
+  // Find which segment position corresponds to this parameter in the parent
+  let paramSegmentIndex = -1;
+  for (let i = 0; i < parentPattern.segments.length; i++) {
+    const segment = parentPattern.segments[i];
+    if (segment.type === "param" && segment.name === paramName) {
+      paramSegmentIndex = i;
+      break;
+    }
+  }
+
+  // If parameter not found in parent segments, it's not redundant with path
+  if (paramSegmentIndex === -1) {
+    return false;
+  }
+
+  // Check if child has a literal segment at the same position
+  if (childPattern.segments.length > paramSegmentIndex) {
+    const childSegment = childPattern.segments[paramSegmentIndex];
+    if (childSegment.type === "literal") {
+      // Child has a literal segment where parent has parameter
+      // This means the child is more specific and shouldn't inherit this parameter
+      return true; // Redundant - child already specifies this position with a literal
+    }
+  }
+
+  return false;
+};
+
 /**
  * Register all patterns at once and build their relationships
  */
@@ -8309,6 +8433,8 @@ const setupPatterns = (patternDefinitions) => {
       originalPattern: currentPattern,
     });
   }
+
+  patternsRegistered = true;
 };
 
 /**
@@ -8318,12 +8444,25 @@ const getPatternData = (urlPatternRaw) => {
   return patternRegistry.get(urlPatternRaw);
 };
 
+/**
+ * Get pattern relationships for route creation
+ */
+const getPatternRelationships = () => {
+  if (!patternsRegistered) {
+    throw new Error(
+      "Patterns must be registered before accessing relationships",
+    );
+  }
+  return patternRelationships;
+};
+
 /**
  * Clear all registered patterns
  */
 const clearPatterns = () => {
   patternRegistry.clear();
   patternRelationships.clear();
+  patternsRegistered = false;
 };
 
 const resolveRouteUrl = (relativeUrl) => {
@@ -8540,6 +8679,41 @@ const getRoutePrivateProperties = (route) => {
   return routePrivatePropertiesMap.get(route);
 };
 
+/**
+ * Get child routes of a given route
+ */
+const getRouteChildren = (route) => {
+  const children = [];
+  const routePrivateProperties = getRoutePrivateProperties(route);
+  if (!routePrivateProperties) {
+    return children;
+  }
+
+  const { originalPattern } = routePrivateProperties;
+  const relationships = getPatternRelationships();
+  const relationshipData = relationships.get(originalPattern);
+
+  if (!relationshipData || !relationshipData.children) {
+    return children;
+  }
+
+  // Find child routes
+  for (const childPattern of relationshipData.children) {
+    for (const otherRoute of routeSet) {
+      const otherRoutePrivateProperties = getRoutePrivateProperties(otherRoute);
+      if (
+        otherRoutePrivateProperties &&
+        otherRoutePrivateProperties.originalPattern === childPattern
+      ) {
+        children.push(otherRoute);
+        break;
+      }
+    }
+  }
+
+  return children;
+};
+
 const registerRoute = (routePattern) => {
   const urlPatternRaw = routePattern.originalPattern;
   const patternData = getPatternData(urlPatternRaw);
@@ -8626,6 +8800,13 @@ const registerRoute = (routePattern) => {
   for (const { signal: stateSignal, paramName, options = {} } of connections) {
     const { debug } = options;
 
+    if (debug) {
+      console.debug(
+        `[route] connecting param "${paramName}" to signal`,
+        stateSignal,
+      );
+    }
+
     // URL -> Signal synchronization
     effect(() => {
       const matching = matchingSignal.value;
@@ -8684,13 +8865,39 @@ const registerRoute = (routePattern) => {
       );
       return null;
     }
-    if (route.action) {
-      // For action: merge with resolved params (includes defaults) so action gets complete params
-      const currentResolvedParams = routePattern.resolveParams();
-      const updatedActionParams = { ...currentResolvedParams, ...newParams };
-      route.action.replaceParams(updatedActionParams);
+
+    // Walk down the hierarchy updating action params and tracking most specific route
+    let currentRoute = route;
+    let mostSpecificRoute;
+
+    while (currentRoute) {
+      if (!currentRoute.matching) {
+        break;
+      }
+
+      // Update the most specific route as we go
+      mostSpecificRoute = currentRoute;
+      // Update action params
+      if (currentRoute.action) {
+        const currentRoutePrivateProperties =
+          getRoutePrivateProperties(currentRoute);
+        if (currentRoutePrivateProperties) {
+          const { routePattern: currentRoutePattern } =
+            currentRoutePrivateProperties;
+          const currentResolvedParams = currentRoutePattern.resolveParams();
+          const updatedActionParams = {
+            ...currentResolvedParams,
+            ...newParams,
+          };
+          currentRoute.action.replaceParams(updatedActionParams);
+        }
+      }
+
+      // Find the first matching child to continue down the hierarchy
+      const children = getRouteChildren(currentRoute);
+      currentRoute = children.find((child) => child.matching) || null;
     }
-    return route.redirectTo(newParams);
+    return mostSpecificRoute.redirectTo(newParams);
   };
   route.buildRelativeUrl = (params) => {
     // buildMostPreciseUrl now handles parameter resolution internally