Trouble building a nav/sub-nav with ember-modal-dialog?

Any ember-modal-dialog experts out there? Trying to figure out how to make these nav/subnavs work together. Have used onMouseEnter={{action (mut showExample) "example"}} onMouseLeave={{action (mut showExample) ""}} to get the subnavs going… which is great until you leave. Replacing with "example" for both Enter/Leave solves going away problem, but then you’re left with a sub-nav that doesn’t go away if you onMouseLeave to the left. And if you invoke clickOutsideToClose=true you have to double-click to make the subnav go away. Another compounding problem is you can’t see any hover actions or use the subnavs until you click on the subnav itself. All of this is less than ideal for obvious reasons. Any help would be greatly appreciated!

p.s. Yes, I know how to do this with hover CSS… but I’m trying to learn Ember here, so of course I have to be difficult. :grin:

p.p.s. Spent a fair amount of last night trying to incorporate the jQuery here into a component.js file, but couldn’t nail-down the definitions to make it work. So, that’s one option… but I wouldn’t be surprised if there was a much easier way to do this – with ember-modal-dialog that’s not CSS.

Thanks y’all!