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:
@@ -25,11 +25,21 @@ export default ({
|
||||
name={name}
|
||||
namespace={name}
|
||||
className={`${name} dropdown-menu`}
|
||||
onKeyPressEvent={(_, event) => {
|
||||
onKeyPressEvent={(self, event) => {
|
||||
const key = event.get_keyval()[1];
|
||||
|
||||
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}
|
||||
@@ -48,67 +58,53 @@ export default ({
|
||||
})}
|
||||
{...props}
|
||||
>
|
||||
<eventbox
|
||||
className="parent-event"
|
||||
onButtonPressEvent={(_, event) => {
|
||||
const buttonClicked = event.get_button()[1];
|
||||
|
||||
if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
|
||||
App.get_window(name)?.set_visible(false);
|
||||
<box vertical>
|
||||
{bind(location).as((lcn) => {
|
||||
if (locationMap[lcn] === Astal.WindowAnchor.TOP) {
|
||||
return <BarEventMargins windowName={name} />;
|
||||
}
|
||||
}}
|
||||
>
|
||||
<box className="top-eb" vertical>
|
||||
{bind(location).as((lcn) => {
|
||||
if (locationMap[lcn] === Astal.WindowAnchor.TOP) {
|
||||
return <BarEventMargins windowName={name} />;
|
||||
}
|
||||
return <box />;
|
||||
})}
|
||||
<eventbox
|
||||
className="in-eb menu-event-box"
|
||||
onButtonPressEvent={(_, event) => {
|
||||
const buttonClicked = event.get_button()[1];
|
||||
return <box />;
|
||||
})}
|
||||
<eventbox
|
||||
className="in-eb menu-event-box"
|
||||
onButtonPressEvent={(_, event) => {
|
||||
const buttonClicked = event.get_button()[1];
|
||||
|
||||
if (
|
||||
buttonClicked === Gdk.BUTTON_PRIMARY ||
|
||||
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} />;
|
||||
if (buttonClicked === Gdk.BUTTON_PRIMARY || buttonClicked === Gdk.BUTTON_SECONDARY) {
|
||||
return true;
|
||||
}
|
||||
return <box />;
|
||||
})}
|
||||
</box>
|
||||
</eventbox>
|
||||
}}
|
||||
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 />;
|
||||
})}
|
||||
</box>
|
||||
</window>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user