shadow-claw 1.40.0 → 1.41.0

package/src/components/shadow-claw/utils/navigateToRoute.test.ts

@@ -111,4 +111,25 @@ describe("navigateToRoute", () => {
       route,
     );
   });
+
+  it("should applyRoute directly without calling nav.navigate if already at finalPath", async () => {
+    mockSupportsNavigationApi.mockReturnValue(true);
+    const origPathname = window.location.pathname;
+    try {
+      window.history.replaceState({}, "", "/base/chat");
+      await navigateToRoute(shadowRoot, shadowClaw, db, fStore, oStore, route);
+
+      expect(mockNav.navigate).not.toHaveBeenCalled();
+      expect(mockApplyRoute).toHaveBeenCalledWith(
+        shadowRoot,
+        shadowClaw,
+        db,
+        fStore,
+        oStore,
+        route,
+      );
+    } finally {
+      window.history.replaceState({}, "", origPathname);
+    }
+  });
 });

package/src/components/shadow-claw/utils/navigateToRoute.ts

@@ -21,6 +21,16 @@ export async function navigateToRoute(
   const targetPath = buildRoutePath(route);
   const finalPath = applyBasePath(targetPath);
 
+  const currentPath =
+    typeof window !== "undefined" && window.location
+      ? `${window.location.pathname}${window.location.search}${window.location.hash}`
+      : "";
+
+  if (currentPath && finalPath === currentPath) {
+    await applyRoute(shadow, shadowClaw, db, fStore, oStore, route);
+    return;
+  }
+
   if (supportsNavigationApi()) {
     const nav = (window as any).navigation;
 

package/src/components/shadow-claw/utils/sidebarVisibility.ts

@@ -34,12 +34,20 @@ export function applySidebarNavVisibility(
     `.nav-item[data-page="${page}"]`,
   ) as HTMLElement | null;
 
-  if (!navItem) {
-    return;
+  if (navItem) {
+    navItem.hidden = hidden;
+    navItem.setAttribute("aria-hidden", String(hidden));
   }
 
-  navItem.hidden = hidden;
-  navItem.setAttribute("aria-hidden", String(hidden));
+  if (page === "chat") {
+    const convoEl = shadow.querySelector(
+      "shadow-claw-conversations",
+    ) as HTMLElement | null;
+    if (convoEl) {
+      convoEl.hidden = hidden;
+      convoEl.setAttribute("aria-hidden", String(hidden));
+    }
+  }
 }
 
 /**

package/src/components/shadow-claw/utils/syncSlottedSidebarActiveLinks.test.ts

@@ -0,0 +1,93 @@
+import { describe, it, expect, beforeEach } from "@jest/globals";
+import { syncSlottedSidebarActiveLinks } from "./syncSlottedSidebarActiveLinks.js";
+
+describe("syncSlottedSidebarActiveLinks", () => {
+  let host: HTMLElement;
+
+  beforeEach(() => {
+    host = document.createElement("div");
+    host.innerHTML = `
+      <div slot="sidebar" class="sidebar-custom-sections">
+        <a href="/" class="sidebar-link">Home</a>
+        <a href="/about" class="sidebar-link">About</a>
+        <a href="/portfolio" class="sidebar-link">Portfolio</a>
+        <a href="https://external.example.com" class="sidebar-link" target="_blank">External</a>
+      </div>
+    `;
+  });
+
+  it("marks matching internal link as active and sets aria-current='page'", () => {
+    const url = new URL("https://example.com/about");
+    syncSlottedSidebarActiveLinks(host, url);
+
+    const homeLink = host.querySelector('a[href="/"]');
+    const aboutLink = host.querySelector('a[href="/about"]');
+    const portfolioLink = host.querySelector('a[href="/portfolio"]');
+    const externalLink = host.querySelector(
+      'a[href="https://external.example.com"]',
+    );
+
+    expect(aboutLink?.classList.contains("active")).toBe(true);
+    expect(aboutLink?.getAttribute("aria-current")).toBe("page");
+
+    expect(homeLink?.classList.contains("active")).toBe(false);
+    expect(homeLink?.hasAttribute("aria-current")).toBe(false);
+
+    expect(portfolioLink?.classList.contains("active")).toBe(false);
+    expect(externalLink?.classList.contains("active")).toBe(false);
+  });
+
+  it("handles root path matching correctly with trailing slashes", () => {
+    const url = new URL("https://example.com/");
+    syncSlottedSidebarActiveLinks(host, url);
+
+    const homeLink = host.querySelector('a[href="/"]');
+    const aboutLink = host.querySelector('a[href="/about"]');
+
+    expect(homeLink?.classList.contains("active")).toBe(true);
+    expect(homeLink?.getAttribute("aria-current")).toBe("page");
+    expect(aboutLink?.classList.contains("active")).toBe(false);
+  });
+
+  it("never marks external links as active", () => {
+    const url = new URL("https://example.com/");
+    syncSlottedSidebarActiveLinks(host, url);
+
+    const externalLink = host.querySelector(
+      'a[href="https://external.example.com"]',
+    );
+    expect(externalLink?.classList.contains("active")).toBe(false);
+  });
+
+  it("handles hash links properly without activating sub-items on base route", () => {
+    host.innerHTML = `
+      <div slot="sidebar">
+        <a href="/portfolio" class="sidebar-link">Portfolio</a>
+        <a href="/portfolio#web-apps" class="sidebar-link">Web Apps</a>
+        <a href="/portfolio#corporate-sites" class="sidebar-link">Corporate Sites</a>
+      </div>
+    `;
+
+    // 1. Browsed to base /portfolio with no hash
+    const baseUrl = new URL("https://example.com/portfolio");
+    syncSlottedSidebarActiveLinks(host, baseUrl);
+
+    const portfolioLink = host.querySelector('a[href="/portfolio"]');
+    const webAppsLink = host.querySelector('a[href="/portfolio#web-apps"]');
+    const corporateLink = host.querySelector(
+      'a[href="/portfolio#corporate-sites"]',
+    );
+
+    expect(portfolioLink?.classList.contains("active")).toBe(true);
+    expect(webAppsLink?.classList.contains("active")).toBe(false);
+    expect(corporateLink?.classList.contains("active")).toBe(false);
+
+    // 2. Browsed to /portfolio#web-apps with hash
+    const hashUrl = new URL("https://example.com/portfolio#web-apps");
+    syncSlottedSidebarActiveLinks(host, hashUrl);
+
+    expect(portfolioLink?.classList.contains("active")).toBe(false);
+    expect(webAppsLink?.classList.contains("active")).toBe(true);
+    expect(corporateLink?.classList.contains("active")).toBe(false);
+  });
+});

package/src/components/shadow-claw/utils/syncSlottedSidebarActiveLinks.ts

@@ -0,0 +1,100 @@
+/**
+ * Sync active state on slotted sidebar navigation links.
+ */
+export function syncSlottedSidebarActiveLinks(
+  host: HTMLElement | null,
+  currentUrl?: URL,
+): void {
+  if (!host || typeof host.querySelectorAll !== "function") {
+    return;
+  }
+
+  const url =
+    currentUrl ||
+    (typeof window !== "undefined" && window.location?.href
+      ? new URL(window.location.href)
+      : null);
+  if (!url) {
+    return;
+  }
+
+  const currentPath = url.pathname.replace(/\/+$/, "") || "/";
+
+  // Select all links slotted into sidebar slots or in custom sections
+  const slottedLinks = host.querySelectorAll<HTMLAnchorElement>(
+    '[slot="sidebar"] a[href], [slot="sidebar-nav"] a[href], [slot="sidebar-content"] a[href], [slot="sidebar-footer"] a[href], .sidebar-custom-sections a[href]',
+  );
+
+  slottedLinks.forEach((link) => {
+    try {
+      const href = link.getAttribute("href") || "";
+      if (
+        !href ||
+        href.startsWith("#") ||
+        href.startsWith("javascript:") ||
+        href.startsWith("mailto:") ||
+        href.startsWith("tel:")
+      ) {
+        return;
+      }
+
+      const linkUrl = new URL(href, url.origin);
+      if (linkUrl.origin !== url.origin) {
+        link.classList.remove("active");
+        link.removeAttribute("aria-current");
+        return;
+      }
+
+      const linkPath = linkUrl.pathname.replace(/\/+$/, "") || "/";
+      const isPathMatch = linkPath === currentPath;
+      const isMatch =
+        isPathMatch && (linkUrl.hash ? linkUrl.hash === url.hash : !url.hash);
+
+      if (isMatch) {
+        link.classList.add("active");
+        link.setAttribute("aria-current", "page");
+      } else {
+        link.classList.remove("active");
+        link.removeAttribute("aria-current");
+      }
+    } catch {
+      // Ignore URL parsing errors
+    }
+  });
+}
+
+/**
+ * Sets up listeners so slotted sidebar active links stay in sync whenever
+ * the URL changes (popstate, Navigation API navigate, or iframe replaceState).
+ * Returns a cleanup function to remove the listeners.
+ */
+export function setupSlottedSidebarActiveLinks(
+  host: HTMLElement | null,
+): () => void {
+  if (!host || typeof window === "undefined") {
+    return () => {};
+  }
+
+  const sync = () => syncSlottedSidebarActiveLinks(host);
+
+  // Initial sync
+  sync();
+
+  // Re-sync on back/forward navigation and replaceState-driven URL changes
+  window.addEventListener("popstate", sync, { passive: true });
+
+  // Re-sync on Navigation API navigate (Chrome 102+) — covers pushState/replaceState too
+  const nav = (window as unknown as { navigation?: EventTarget }).navigation;
+  if (nav && typeof nav.addEventListener === "function") {
+    nav.addEventListener("navigate", sync, {
+      passive: true,
+    } as EventListenerOptions);
+  }
+
+  return () => {
+    window.removeEventListener("popstate", sync);
+    if (nav && typeof nav.removeEventListener === "function") {
+      nav.removeEventListener("navigate", sync);
+    }
+  };
+}

package/src/components/shadow-claw-file-viewer/shadow-claw-file-viewer.ts

@@ -1667,6 +1667,37 @@ export class ShadowClawFileViewer extends ShadowClawElement {
     }
   }
 
+  async handleSendFileToPeer() {
+    const file = fileViewerStore.file;
+    if (!file || !file.path) {
+      showError("No file is currently open.", 4500);
+
+      return;
+    }
+
+    const activeGroupId = file.groupId || orchestratorStore.activeGroupId || "";
+    const isPeer = activeGroupId.startsWith("peer:");
+    const isRoom = activeGroupId.startsWith("room:");
+
+    if (!isPeer && !isRoom) {
+      showError(
+        "Can only send files to peers in a peer or room conversation.",
+        4500,
+      );
+
+      return;
+    }
+
+    try {
+      await orchestratorStore.sendFileToPeer(file.path, activeGroupId, {
+        fileName: file.name,
+        mimeType: file.mimeType,
+      });
+    } catch {
+      // Toast error handled in sendFileToPeer
+    }
+  }
+
   async handleShareFile() {
     const file = fileViewerStore.file;
     if (!file || !this.canShareCurrentFile(file)) {
@@ -1706,37 +1737,6 @@ export class ShadowClawFileViewer extends ShadowClawElement {
     }
   }
 
-  async handleSendFileToPeer() {
-    const file = fileViewerStore.file;
-    if (!file || !file.path) {
-      showError("No file is currently open.", 4500);
-
-      return;
-    }
-
-    const activeGroupId = file.groupId || orchestratorStore.activeGroupId || "";
-    const isPeer = activeGroupId.startsWith("peer:");
-    const isRoom = activeGroupId.startsWith("room:");
-
-    if (!isPeer && !isRoom) {
-      showError(
-        "Can only send files to peers in a peer or room conversation.",
-        4500,
-      );
-
-      return;
-    }
-
-    try {
-      await orchestratorStore.sendFileToPeer(file.path, activeGroupId, {
-        fileName: file.name,
-        mimeType: file.mimeType,
-      });
-    } catch {
-      // Toast error handled in sendFileToPeer
-    }
-  }
-
   async openFolderInFilesView(path: string) {
     if (!this.db) {
       return;

package/src/components/shadow-claw-pages/shadow-claw-pages.css

@@ -186,6 +186,11 @@ article > h2,
 .pages__rendered > h1,
 .pages__rendered > h2 {
   margin-top: 0;
+  margin-bottom: var(--shadow-claw-article-header-margin-bottom, 1.5rem);
+}
+
+.pages__rendered :is(h1, h2, h3, h4) {
+  clear: both;
 }
 
 .pages__iframe {
@@ -219,7 +224,7 @@ article > h2,
 
 .pages__dropdown-container {
   align-items: center;
-  display: flex;
+  display: var(--shadow-claw-pages-dropdown-container-display, flex);
   gap: 0.5rem;
   margin-bottom: 1rem;
   position: relative;
@@ -487,6 +492,10 @@ article > h2,
   }
 }
 
+shadow-claw-page-header {
+  display: var(--shadow-claw-page-header-display, block);
+}
+
 ul {
   line-height: 1.5;
 }

package/src/components/shadow-claw-pages/utils/removePreviewIframe.ts

@@ -8,5 +8,8 @@ export function removePreviewIframe(root: ShadowRoot | HTMLElement): void {
   }
 
   iframe.removeAttribute("srcdoc");
+  try {
+    iframe.src = "about:blank";
+  } catch {}
   iframe.remove();
 }

package/src/core/effect.test.ts

@@ -80,6 +80,25 @@ describe("effect", () => {
     expect(cleanup).toHaveBeenCalledTimes(1);
   });
 
+  it("invokes cleanup before next execution when effect re-runs", () => {
+    const cleanup = jest.fn();
+    (globalThis as any).queueMicrotask = jest.fn((fn: any) => fn());
+
+    let runCount = 0;
+    effect(() => {
+      runCount++;
+      return cleanup as any;
+    });
+
+    // In effect, watcher.watch(computed) is called.
+    const lastWatched = watcherInstance.watch.mock.calls.slice(-1)[0][0];
+    watcherInstance.pending = [lastWatched];
+    watcherInstance.trigger();
+
+    expect(cleanup).toHaveBeenCalledTimes(1);
+    expect(runCount).toBe(2);
+  });
+
   it("processes pending signals and re-watches on watcher callback", () => {
     const pendingA: any = { get: jest.fn() };
     const pendingB: any = { get: jest.fn() };

package/src/core/orchestrator/orchestrator-state.ts

@@ -12,6 +12,7 @@ import type { TaskScheduler } from "../../subsystems/tools/task-scheduler.js";
 import type { Router } from "../router.js";
 import type { EventBus } from "./utils/EventBus.js";
 import type { DirectToolCommandPolicy } from "./utils/types.js";
+import type { InboundMessage } from "../../subsystems/channels/types.js";
 
 export interface OrchestratorState {
   // ── Core ──────────────────────────────────────────────────────────────────
@@ -77,7 +78,7 @@ export interface OrchestratorState {
   >;
   inFlightProviderRequestIds: Map<string, string>;
   inFlightTriggerByGroup: Map<string, string>;
-  messageQueue: any[];
+  messageQueue: InboundMessage[];
   processing: boolean;
   promptControllers: Map<string, AbortController>;