6 ms·
Looks great! One suggestion would be adding a focus trap, such as when a Dialog opens. It's nice to use the tab key to move around the Dialog (inputs and butto
by gsanderson 1y ago
Looks great!
One suggestion would be adding a focus trap, such as when a Dialog opens. It's nice to use the tab key to move around the Dialog (inputs and buttons). Currently focus leaves to the page behind. It might be as simple as adding https://alpinejs.dev/plugins/focus#x-trap https://alpinejs.dev/plugins/focus#x-trap
- hunvreus 1y agoYeah, I looked into it but wanted to avoid adding plugins. I already do a bit of (simple) focusing here and there, so it shouldn't leave the focus on the background: https://github.com/hunvreus/basecoat/blob/main/src/js/dialog.js#L24-L25 https://github.com/hunvreus/basecoat/blob/main/src/js/dialog... But more complex scenario require you to be specific about the field you want to see focused. I was thinking about allowing you designate the field to focus on. What would you suggest?
- dbbk 1y agoWhy aren't you just using the built-in dialog element that already handles this?
- hunvreus 1y ago<dialog> is kind of a PITA to style (backdrop, transitions, etc), and doesn't really solve any of the tough problems with dialogs (e.g. locking scrolling). I tried really hard to use <dialog> and popover but didn't succeed. Maybe somebody more skilled can make it happen.