fix(ui): make catalog mega menus interactive

packages/ui/test/ui.test.ts

@@ -2948,6 +2948,30 @@ test("mega menu columns take roving focus and survive an empty column list", asy
   expect(dom.querySelector('[data-wrn-roving="both"]')).not.toBeNull();
 });
 
+test("catalog mega menu renders only the active rail category", async () => {
+  const source = readFileSync(uiComponentPath("MegaMenu"), "utf8");
+  const html = await renderComponent(source, {
+    label: "Products",
+    variant: "catalog",
+    activeCategory: "sales",
+    rail: [
+      { label: "Platform", value: "platform" },
+      { label: "Sales", value: "sales" },
+    ],
+    columns: [
+      { heading: "Platform", items: [{ label: "Home", href: "/home" }] },
+      { heading: "Sales", items: [{ label: "CRM", href: "/crm" }] },
+    ],
+  });
+  const dom = mountHtml(html);
+
+  expect(dom.querySelectorAll(".wrn-mega__rail-link")).toHaveLength(2);
+  expect(dom.querySelectorAll(".wrn-mega__column")).toHaveLength(1);
+  expect(dom.querySelector(".wrn-mega__heading")?.textContent).toContain("Sales");
+  expect(dom.querySelector('[aria-pressed="true"]')?.textContent).toContain("Sales");
+  expect(source).toContain("overflow-y: auto");
+});
+
 test("mega menu supports rails, icons, badges, media, featured content and footer actions", async () => {
   const source = readFileSync(uiComponentPath("MegaMenu"), "utf8");
   const html = await renderComponent(source, {
@@ -3128,7 +3152,8 @@ test("mega menu keeps hover activation and click activation from cancelling each
   const source = readFileSync(uiComponentPath("MegaMenu"), "utf8");
   expect(source).toContain("openOnHover: boolean = true");
   expect(source).toContain("@click='activatePanel(event)'");
-  expect(source).toContain("@mouseenter='hoverPanel(event)'");
+  expect(source).toContain("@mousemove='hoverPanel(event)'");
+  expect(source).toContain("}, 140)");
   expect(source).not.toContain("@focus='showPanel(event)'");
   expect(source).toContain("max-height: calc(100dvh - 5.5rem)");
 });