ssleptsov / ninja-keys

Keyboard shortcuts interface for your website. Working with static HTML, Vanilla JS, Vue, React, Svelte.
https://ninja-keys-demo.vercel.app/
MIT License
1.65k stars 60 forks source link

Is there any way to listen modal open or close? #50

Open cotton123236 opened 1 year ago

cotton123236 commented 1 year ago

Great library! It makes building cmd tools super easy! I recently got a situation when I use ninja-keys to work with my react project. I use global storage to store the state of ninja-keys, but I don't know when should I set the state to false and I couldn't find any eventListener to check modal is open ore close. If there is any way to listen modal state will be great!

tiagorangel1 commented 1 year ago

You can create a interval of, like 5 milliseconds and check for the ninja.__visible variable

tzmartin commented 7 months ago

In case someone needs a way to detect a ninja visible modal:

ninjaModal = document.querySelector('ninja-keys')
if (ninjaModal) {
    const el = ninjaModal.shadowRoot.querySelector('div')
    if (el && el.classList.contains('visible')) {
      return
    }
}