fix: close dropdown menu when focus lost (#986)

* fix: close dropdown menu when focus lost

Signed-off-by: davfsa <davfsa@gmail.com>

* fix: shadow var name to avoid unused lint

Signed-off-by: davfsa <davfsa@gmail.com>

* fix: remove unused argument

Signed-off-by: davfsa <davfsa@gmail.com>

---------

Signed-off-by: davfsa <davfsa@gmail.com>
Co-authored-by: Jas Singh <jaskiratpal.singh@outlook.com>
This commit is contained in:
davfsa
2025-06-14 23:14:58 +02:00
committed by GitHub
parent bfd47dd853
commit 6870dc71cd

View File

@@ -25,11 +25,21 @@ export default ({
name={name} name={name}
namespace={name} namespace={name}
className={`${name} dropdown-menu`} className={`${name} dropdown-menu`}
onKeyPressEvent={(_, event) => { onKeyPressEvent={(self, event) => {
const key = event.get_keyval()[1]; const key = event.get_keyval()[1];
if (key === Gdk.KEY_Escape) { if (key === Gdk.KEY_Escape) {
App.get_window(name)?.set_visible(false); self.visible = false;
}
}}
onFocusOutEvent={(self) => {
self.visible = false;
}}
onButtonPressEvent={(self, event) => {
const buttonClicked = event.get_button()[1];
if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
self.visible = false;
} }
}} }}
visible={false} visible={false}
@@ -48,67 +58,53 @@ export default ({
})} })}
{...props} {...props}
> >
<eventbox <box vertical>
className="parent-event" {bind(location).as((lcn) => {
onButtonPressEvent={(_, event) => { if (locationMap[lcn] === Astal.WindowAnchor.TOP) {
const buttonClicked = event.get_button()[1]; return <BarEventMargins windowName={name} />;
if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
App.get_window(name)?.set_visible(false);
} }
}} return <box />;
> })}
<box className="top-eb" vertical> <eventbox
{bind(location).as((lcn) => { className="in-eb menu-event-box"
if (locationMap[lcn] === Astal.WindowAnchor.TOP) { onButtonPressEvent={(_, event) => {
return <BarEventMargins windowName={name} />; const buttonClicked = event.get_button()[1];
}
return <box />;
})}
<eventbox
className="in-eb menu-event-box"
onButtonPressEvent={(_, event) => {
const buttonClicked = event.get_button()[1];
if ( if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
buttonClicked === Gdk.BUTTON_PRIMARY || return true;
buttonClicked === Gdk.BUTTON_SECONDARY
) {
return true;
}
}}
setup={(self) => {
globalEventBoxes.set({
...globalEventBoxes.get(),
[name]: self,
});
}}
>
<box className="dropdown-menu-container" css="padding: 1px; margin: -1px;">
<revealer
revealChild={false}
setup={(self: Revealer) => {
App.connect('window-toggled', (_, window) => {
self.set_reveal_child(window.visible);
});
}}
transitionType={transition}
transitionDuration={bind(options.menus.transitionTime)}
>
<box className="dropdown-content" halign={Gtk.Align.CENTER} expand canFocus>
{child}
</box>
</revealer>
</box>
</eventbox>
{bind(location).as((lcn) => {
if (locationMap[lcn] === Astal.WindowAnchor.BOTTOM) {
return <BarEventMargins windowName={name} />;
} }
return <box />; }}
})} setup={(self) => {
</box> globalEventBoxes.set({
</eventbox> ...globalEventBoxes.get(),
[name]: self,
});
}}
>
<box className="dropdown-menu-container" css="padding: 1px; margin: -1px;">
<revealer
revealChild={false}
setup={(self: Revealer) => {
App.connect('window-toggled', (_, window) => {
self.set_reveal_child(window.visible);
});
}}
transitionType={transition}
transitionDuration={bind(options.menus.transitionTime)}
>
<box className="dropdown-content" halign={Gtk.Align.CENTER} expand canFocus>
{child}
</box>
</revealer>
</box>
</eventbox>
{bind(location).as((lcn) => {
if (locationMap[lcn] === Astal.WindowAnchor.BOTTOM) {
return <BarEventMargins windowName={name} />;
}
return <box />;
})}
</box>
</window> </window>
); );
}; };