feat: minimize panel on inactive

[antfu]

I found that, sometimes, the floating panel took a bit too much space from the app. So I am thinking of having a way to minimize it when not in use for a while.

The effect looks like this (shorten the timeout to 2s for demo):

Screen.Recording.2023-08-03.at.15.01.53.mov

I'd like to hear your opinion on this, and if we should make it configurable?

[webfansplz]

I thought about it, too. My idea is that we can output a open DevTools tip in the project's terminal, and when the user clicks on it, we can trigger the DevTools to open in the page. We need a configuration to allow users to toggle between these two options.

[webfansplz]

I thought about it, too. My idea is that we can output a open DevTools tip in the project's terminal, and when the user clicks on it, we can trigger the DevTools to open in the page. We need a configuration to allow users to toggle between these two options.

Additionally, regarding the minimize option, I think it makes sense. Completely hiding it might be necessary for some users.

[antfu]

@webfansplz I was thinking about doing it shortcut-only as well. It might be an option, but in that case, we also need to find a way to trigger it on touch devices.

[webfansplz]

Awesome work 🤩. I’ll port it to the Vue DevTools🤓