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}
|
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>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
Reference in New Issue
Block a user