refactor(navigation-menu): rewrite machine logic (#2678)

* chore: wip rewrite

* fix: viewport variant

* chore: add keyframes

* fix: nested navigation menu

* fix: ts error

* chore: add presence component everywhere

* fix: stop propagation

* refactor: navigate

* fix: vue ignore

* chore: update links

* fix: improve keyboard navigation

* chore: expose more api

* chore: tweak animation

* chore: add solid example

* chore: update

* chore: add svelte example

* chore: update

* chore: update vue example

* chore: update

* chore: update

* chore: add navigation-menu pages for svelte example

* fix: export missing types

* fix(presence): fix a bug where elements get stuck in unmountSuspended state during rapid hovering

* refactor: instant response time when moving between trigger

* refactor: remove nested navigation menu

* refactor: remove unnecessary escapeCloseValue

* fix: keyboard navigation is not working as expected

* fix: use CLOSE event

* test: correct test flow

* refactor: improve timeoutId handling

* test: add more tests

* fix: handle arrow key navigation between triggers

* test: add more tests

* fix: differentiate between content links and top-level elements in arrow key navigation

* test: add tests for Home, End keys

* refactor: remove clickCloseValue

* refactor: clean up

* refactor: clean up

* refactor: clean up

---------

Co-authored-by: Nelson Lai <[email protected]>

Author: segunadebayo

.changeset/dirty-turtles-attack.md

@@ -0,0 +1,5 @@
+---
+"@zag-js/presence": patch
+---
+
+Fix a bug where elements get stuck in unmountSuspended state during rapid hovering

e2e/models/navigation-menu.model.ts

@@ -7,7 +7,7 @@ export class NavigationMenuModel extends Model {
     super(page)
   }
 
-  goto(id?: "viewport" | "nested") {
+  goto(id?: "viewport") {
     return this.page.goto(`/navigation-menu${id ? `-${id}` : ""}`)
   }
 
@@ -66,4 +66,8 @@ export class NavigationMenuModel extends Model {
   async seeLinkIsFocused(value: string) {
     await expect(this.getLink(value)).toBeFocused()
   }
+
+  async wait(ms: number) {
+    await this.page.waitForTimeout(ms)
+  }
 }