@adukiorg/anza 0.2.0

package/src/core/router/sync/transport.js

@@ -0,0 +1,139 @@
+/**
+ * src/core/router/sync/transport.js
+ *
+ * Dynamic network connection pool coordinator matching active route paths.
+ * Automatically spawns or tears down WebSocket/WebTransport/SSE streams
+ * when pathname transitions match registered URLPatterns.
+ *
+ * Source: doc 09 — Routing §12, §15, plan.md §6
+ */
+
+import { guard } from '../../platform/index.js';
+
+const registry = new Map(); // patternStr -> { factoryFn, pattern }
+const activeConnections = new Map(); // patternStr -> connection instance
+let URLPatternClass = typeof URLPattern !== 'undefined' ? URLPattern : null;
+
+// Pre-resolve polyfill in background if not native (RT-03)
+if (!URLPatternClass) {
+  guard.urlPattern().then(cls => {
+    URLPatternClass = cls;
+  }).catch(() => {});
+}
+
+async function getURLPattern() {
+  if (!URLPatternClass) {
+    URLPatternClass = await guard.urlPattern();
+  }
+  return URLPatternClass;
+}
+
+/**
+ * Registers a dynamic background connection associated with a URLPattern path.
+ * Factory receives { url, params } for named param access.
+ * Returns a disposer that removes the connection factory and closes active connection.
+ */
+export function registerConnection(patternStr, factoryFn) {
+  registry.set(patternStr, { factoryFn, pattern: null });
+
+  return () => {
+    registry.delete(patternStr);
+    const conn = activeConnections.get(patternStr);
+    if (conn) {
+      try {
+        if (typeof conn.close === 'function') conn.close();
+        else if (typeof conn.disconnect === 'function') conn.disconnect();
+      } catch (_) {}
+      activeConnections.delete(patternStr);
+    }
+  };
+}
+
+/** Grouped links API. */
+export const links = {
+  add: registerConnection,
+  remove(patternStr) {
+    registry.delete(patternStr);
+    const conn = activeConnections.get(patternStr);
+    if (conn) {
+      try {
+        if (typeof conn.close === 'function') conn.close();
+        else if (typeof conn.disconnect === 'function') conn.disconnect();
+      } catch (_) {}
+      activeConnections.delete(patternStr);
+    }
+  },
+  clear: clearConnections
+};
+
+/**
+ * Automatically coordinates in-flight connections against the active URL.
+ */
+export async function coordinateConnections(url) {
+  const Pattern = URLPatternClass || (await getURLPattern());
+  const targetUrl = new URL(url, globalThis.location?.href || 'http://localhost');
+
+  const matchedPatterns = new Set();
+  for (const [patternStr, entry] of registry.entries()) {
+    if (!entry.pattern) {
+      entry.pattern = patternStr.startsWith('http://') || patternStr.startsWith('https://')
+        ? new Pattern(patternStr)
+        : new Pattern({ pathname: patternStr });
+    }
+    if (entry.pattern.test(targetUrl.href)) {
+      matchedPatterns.add(patternStr);
+    }
+  }
+
+  // Teardown stale active connections that do not match the new route
+  for (const [patternStr, conn] of activeConnections.entries()) {
+    if (!matchedPatterns.has(patternStr)) {
+      try {
+        if (typeof conn.close === 'function') conn.close();
+        else if (typeof conn.disconnect === 'function') conn.disconnect();
+      } catch (err) {
+        console.error(`Error closing background synchronized connection for ${patternStr}:`, err);
+      }
+      activeConnections.delete(patternStr);
+    }
+  }
+
+  // Boot up new connections matching the new active route
+  for (const patternStr of matchedPatterns) {
+    if (!activeConnections.has(patternStr)) {
+      const entry = registry.get(patternStr);
+      // Extract named params for the factory
+      const result = entry.pattern.exec(targetUrl.href);
+      const params = result?.pathname?.groups ?? {};
+      try {
+        const conn = await entry.factoryFn({ url: targetUrl, params });
+        if (conn) {
+          activeConnections.set(patternStr, conn);
+        }
+      } catch (err) {
+        console.error(`Failed to initialize background connection for ${patternStr}:`, err);
+      }
+    }
+  }
+}
+
+/**
+ * Returns all active coordinated connection instances.
+ */
+export function getActiveConnections() {
+  return activeConnections;
+}
+
+/**
+ * Clears and closes all active transport connections.
+ */
+export function clearConnections() {
+  for (const conn of activeConnections.values()) {
+    try {
+      if (typeof conn.close === 'function') conn.close();
+      else if (typeof conn.disconnect === 'function') conn.disconnect();
+    } catch (_) {}
+  }
+  activeConnections.clear();
+  registry.clear();
+}

package/src/core/router/transitions.js

@@ -0,0 +1,59 @@
+/**
+ * src/core/router/transitions.js
+ *
+ * Safe wrapper for the browser's CSS View Transitions API.
+ * Animates page updates off-thread via GPU screenshots when available,
+ * falling back instantly to standard synchronous rendering when unsupported
+ * or when the user prefers reduced motion.
+ *
+ * Source: doc 09 — Routing §8, plan.md §5
+ */
+
+export const transitions = {
+  /**
+   * Wraps a DOM modification callback in a view transition.
+   * Skips the transition when the user prefers reduced motion.
+   * Supports transient shared element morphing.
+   */
+  async run(updateDOM, options = {}) {
+    const { sourceElement, name = 'selected-item' } = options;
+
+    const reducedMotion =
+      typeof window !== 'undefined' &&
+      window.matchMedia?.('(prefers-reduced-motion: reduce)').matches;
+
+    if (
+      !reducedMotion &&
+      typeof document !== 'undefined' &&
+      typeof document.startViewTransition === 'function'
+    ) {
+      const hasSource = sourceElement && sourceElement instanceof HTMLElement;
+      if (hasSource) {
+        sourceElement.style.viewTransitionName = name;
+      }
+
+      const transition = document.startViewTransition(() => {
+        const res = updateDOM();
+        if (res instanceof Promise) return res;
+      });
+
+      if (hasSource) {
+        // Clean up the transient style as soon as transition completes or fails
+        transition.finished.finally(() => {
+          sourceElement.style.viewTransitionName = '';
+        });
+      }
+
+      try {
+        await transition.finished;
+      } catch (err) {
+        // Silence aborted/superseded view transition errors to preserve router stability
+        console.warn('View Transition was aborted or failed:', err);
+      }
+    } else {
+      // Graceful fallback for non-supporting browsers or reduced-motion preference
+      const res = updateDOM();
+      if (res instanceof Promise) await res;
+    }
+  }
+};