fix(ui): refine responsive catalog navigation

2026-08-25 13:46:19 +05:30
parent 9f6552ea62
commit 64db7da08d
6 changed files with 104 additions and 29 deletions
@@ -126,6 +126,42 @@ describe("@wrnexus/ui redesign component pack", () => {
    expect(source).not.toContain(".wrn-navbar__topbar:not(:empty)");
  });

+  test("Navbar exposes a brand slot while retaining the brand prop fallback", async () => {
+    const source = await readFile(join(componentsDir, "Navbar.wrn"), "utf8");
+
+    expect(source).toContain('<slot name="brand">');
+    expect(source).toContain("brand.logo || brand.icon || brand.label || brand.description");
+  });
+
+  test("Navbar renders slotted utilities before its built-in actions", async () => {
+    const source = await readFile(join(componentsDir, "Navbar.wrn"), "utf8");
+    const actionsStart = source.indexOf('<div class="wrn-navbar__actions">');
+    const slotIndex = source.indexOf('<slot name="actions" />', actionsStart);
+    const actionsLoop = source.indexOf("{#each actions as item}", actionsStart);
+
+    expect(slotIndex).toBeGreaterThan(actionsStart);
+    expect(slotIndex).toBeLessThan(actionsLoop);
+  });
+
+  test("Navbar passes structured MegaMenu props as expressions", async () => {
+    const source = await readFile(join(componentsDir, "Navbar.wrn"), "utf8");
+
+    expect(source).toContain("columns={megaColumns(item)}");
+    expect(source).toContain("rail={megaData(item).rail || []}");
+    expect(source).toContain("featured={megaData(item).featured || {}}");
+    expect(source).toContain("fullWidth={megaData(item).fullWidth || false}");
+    expect(source).not.toContain('columns="{megaColumns(item)}"');
+  });
+
+  test("Navbar replaces mega panels with direct links in collapsed navigation", async () => {
+    const source = await readFile(join(componentsDir, "Navbar.wrn"), "utf8");
+
+    expect(source).toContain("wrn-navbar__mobile-mega-link");
+    expect(source).toContain("item.href || megaData(item).actionHref");
+    expect(source).toContain('.wrn-navbar__mega { display: none; }');
+    expect(source).toContain('.wrn-navbar__mobile-mega-link { display: flex; }');
+  });
+
  test("Navbar supports in-flow floating and elevated menu panels", async () => {
    const source = await readFile(join(componentsDir, "Navbar.wrn"), "utf8");
    const ast = parse(source);