From 857c5ec86572d9188048f43eabb6a64fb0527023 Mon Sep 17 00:00:00 2001
From: Aleksander <aleksander@oo8.dev>
Date: Sun, 6 Jul 2025 20:53:40 +0200
Subject: [PATCH] listener handles, auto-clean destroyed listeners, minor
 refactor

---
 uidev/src/main.rs                             |  10 +-
 uidev/src/testbed/testbed_any.rs              |   9 +-
 uidev/src/testbed/testbed_generic.rs          |   9 +-
 wgui/src/components/button.rs                 |  77 ++++----
 wgui/src/components/slider.rs                 | 174 +++++++++++-------
 wgui/src/event.rs                             | 101 +++++++++-
 wgui/src/layout.rs                            |   7 +-
 wgui/src/parser/component_button.rs           |   4 +-
 wgui/src/parser/component_slider.rs           |   4 +-
 wgui/src/parser/mod.rs                        |  41 +++--
 wgui/src/widget/mod.rs                        |  13 +-
 wlx-overlay-s/src/gui/panel.rs                |  46 ++---
 wlx-overlay-s/src/overlays/anchor.rs          |   2 +-
 wlx-overlay-s/src/overlays/bar.rs             |   4 +-
 .../src/overlays/keyboard/builder.rs          |  16 +-
 wlx-overlay-s/src/overlays/watch.rs           |  13 +-
 16 files changed, 348 insertions(+), 182 deletions(-)

diff --git a/uidev/src/main.rs b/uidev/src/main.rs
index c314c58..a325fe9 100644
--- a/uidev/src/main.rs
+++ b/uidev/src/main.rs
@@ -126,7 +126,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
                 MouseScrollDelta::LineDelta(x, y) => testbed
                     .layout()
                     .push_event(
-                        &listeners,
+                        &mut listeners,
                         &wgui::event::Event::MouseWheel(MouseWheelEvent {
                             shift: Vec2::new(x, y),
                             pos: mouse / scale,
@@ -138,7 +138,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
                 MouseScrollDelta::PixelDelta(pos) => testbed
                     .layout()
                     .push_event(
-                        &listeners,
+                        &mut listeners,
                         &wgui::event::Event::MouseWheel(MouseWheelEvent {
                             shift: Vec2::new(pos.x as f32 / 5.0, pos.y as f32 / 5.0),
                             pos: mouse / scale,
@@ -157,7 +157,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
                         testbed
                             .layout()
                             .push_event(
-                                &listeners,
+                                &mut listeners,
                                 &wgui::event::Event::MouseDown(MouseDownEvent {
                                     pos: mouse / scale,
                                     button: MouseButton::Left,
@@ -170,7 +170,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
                         testbed
                             .layout()
                             .push_event(
-                                &listeners,
+                                &mut listeners,
                                 &wgui::event::Event::MouseUp(MouseUpEvent {
                                     pos: mouse / scale,
                                     button: MouseButton::Left,
@@ -190,7 +190,7 @@ fn main() -> Result<(), Box<dyn std::error::Error>> {
                 testbed
                     .layout()
                     .push_event(
-                        &listeners,
+                        &mut listeners,
                         &wgui::event::Event::MouseMotion(MouseMotionEvent {
                             pos: mouse / scale,
                             device: 0,
diff --git a/uidev/src/testbed/testbed_any.rs b/uidev/src/testbed/testbed_any.rs
index 44b9b1b..a56bca5 100644
--- a/uidev/src/testbed/testbed_any.rs
+++ b/uidev/src/testbed/testbed_any.rs
@@ -1,9 +1,12 @@
 use crate::{assets, testbed::Testbed};
 use glam::Vec2;
-use wgui::{event::EventListenerCollection, layout::Layout};
+use wgui::{event::EventListenerCollection, layout::Layout, parser::ParserState};
 
 pub struct TestbedAny {
     pub layout: Layout,
+
+    #[allow(dead_code)]
+    state: ParserState,
 }
 
 impl TestbedAny {
@@ -12,9 +15,9 @@ impl TestbedAny {
         listeners: &mut EventListenerCollection<(), ()>,
     ) -> anyhow::Result<Self> {
         let path = format!("gui/{name}.xml");
-        let (layout, _state) =
+        let (layout, state) =
             wgui::parser::new_layout_from_assets(Box::new(assets::Asset {}), listeners, &path)?;
-        Ok(Self { layout })
+        Ok(Self { layout, state })
     }
 }
 
diff --git a/uidev/src/testbed/testbed_generic.rs b/uidev/src/testbed/testbed_generic.rs
index 24935f1..448b4fd 100644
--- a/uidev/src/testbed/testbed_generic.rs
+++ b/uidev/src/testbed/testbed_generic.rs
@@ -1,19 +1,22 @@
 use crate::{assets, testbed::Testbed};
 use glam::Vec2;
-use wgui::{event::EventListenerCollection, layout::Layout};
+use wgui::{event::EventListenerCollection, layout::Layout, parser::ParserState};
 
 pub struct TestbedGeneric {
     pub layout: Layout,
+
+    #[allow(dead_code)]
+    state: ParserState,
 }
 
 impl TestbedGeneric {
     pub fn new(listeners: &mut EventListenerCollection<(), ()>) -> anyhow::Result<Self> {
         const XML_PATH: &str = "gui/testbed.xml";
 
-        let (layout, _res) =
+        let (layout, state) =
             wgui::parser::new_layout_from_assets(Box::new(assets::Asset {}), listeners, XML_PATH)?;
 
-        Ok(Self { layout })
+        Ok(Self { layout, state })
     }
 }
 
diff --git a/wgui/src/components/button.rs b/wgui/src/components/button.rs
index 5a11df5..5b11463 100644
--- a/wgui/src/components/button.rs
+++ b/wgui/src/components/button.rs
@@ -5,7 +5,7 @@ use crate::{
 	animation::{Animation, AnimationEasing},
 	components::Component,
 	drawing::{self, Color},
-	event::{CallbackDataCommon, EventListenerCollection, EventListenerKind},
+	event::{CallbackDataCommon, EventListenerCollection, EventListenerKind, ListenerHandleVec},
 	layout::{Layout, WidgetID},
 	renderer_vk::text::{FontWeight, TextStyle},
 	widget::{
@@ -37,59 +37,64 @@ impl Default for Params<'_> {
 	}
 }
 
-pub struct Button {
+struct Data {
 	initial_color: drawing::Color,
 	initial_border_color: drawing::Color,
-	pub body: WidgetID,    // Rectangle
-	pub text_id: WidgetID, // Text
+	text_id: WidgetID, // Text
 	text_node: taffy::NodeId,
 }
 
+pub struct Button {
+	data: Rc<Data>,
+	#[allow(dead_code)]
+	listener_handles: ListenerHandleVec,
+}
+
 impl Component for Button {}
 
 impl Button {
-	pub fn set_text<'a, 'b, C>(&self, callback_data: &mut CallbackDataCommon, text: &str) {
-		callback_data.call_on_widget(self.text_id, |label: &mut TextLabel| {
+	pub fn set_text<C>(&self, callback_data: &mut CallbackDataCommon, text: &str) {
+		callback_data.call_on_widget(self.data.text_id, |label: &mut TextLabel| {
 			label.set_text(text);
 		});
 		callback_data.mark_redraw();
-		callback_data.mark_dirty(self.text_node);
+		callback_data.mark_dirty(self.data.text_node);
 	}
 }
 
-fn anim_hover(rect: &mut Rectangle, button: &Button, pos: f32) {
+fn anim_hover(rect: &mut Rectangle, data: &Data, pos: f32) {
 	let brightness = pos * 0.5;
 	let border_brightness = pos;
-	rect.params.color.r = button.initial_color.r + brightness;
-	rect.params.color.g = button.initial_color.g + brightness;
-	rect.params.color.b = button.initial_color.b + brightness;
-	rect.params.border_color.r = button.initial_border_color.r + border_brightness;
-	rect.params.border_color.g = button.initial_border_color.g + border_brightness;
-	rect.params.border_color.b = button.initial_border_color.b + border_brightness;
+	rect.params.color.r = data.initial_color.r + brightness;
+	rect.params.color.g = data.initial_color.g + brightness;
+	rect.params.color.b = data.initial_color.b + brightness;
+	rect.params.border_color.r = data.initial_border_color.r + border_brightness;
+	rect.params.border_color.g = data.initial_border_color.g + border_brightness;
+	rect.params.border_color.b = data.initial_border_color.b + border_brightness;
 	rect.params.border = 3.0;
 }
 
-fn anim_hover_in(button: Rc<Button>, widget_id: WidgetID) -> Animation {
+fn anim_hover_in(data: Rc<Data>, widget_id: WidgetID) -> Animation {
 	Animation::new(
 		widget_id,
 		10,
 		AnimationEasing::OutQuad,
-		Box::new(move |common, data| {
-			let rect = data.obj.get_as_mut::<Rectangle>();
-			anim_hover(rect, &button, data.pos);
+		Box::new(move |common, anim_data| {
+			let rect = anim_data.obj.get_as_mut::<Rectangle>();
+			anim_hover(rect, &data, anim_data.pos);
 			common.mark_redraw();
 		}),
 	)
 }
 
-fn anim_hover_out(button: Rc<Button>, widget_id: WidgetID) -> Animation {
+fn anim_hover_out(data: Rc<Data>, widget_id: WidgetID) -> Animation {
 	Animation::new(
 		widget_id,
 		15,
 		AnimationEasing::OutQuad,
-		Box::new(move |common, data| {
-			let rect = data.obj.get_as_mut::<Rectangle>();
-			anim_hover(rect, &button, 1.0 - data.pos);
+		Box::new(move |common, anim_data| {
+			let rect = anim_data.obj.get_as_mut::<Rectangle>();
+			anim_hover(rect, &data, 1.0 - anim_data.pos);
 			common.mark_redraw();
 		}),
 	)
@@ -144,33 +149,37 @@ pub fn construct<U1, U2>(
 		},
 	)?;
 
-	let _button = Rc::new(Button {
-		body: rect_id,
+	let _data = Rc::new(Data {
 		text_id,
 		text_node,
 		initial_color: params.color,
 		initial_border_color: params.border_color,
 	});
 
-	//let mut widget = layout.widget_map.get(rect_id).unwrap().lock().unwrap();
+	let mut listener_handles = ListenerHandleVec::default();
 
-	let button = _button.clone();
-	listeners.add(
+	let data = _data.clone();
+	listeners.register(
+		&mut listener_handles,
 		rect_id,
 		EventListenerKind::MouseEnter,
-		Box::new(move |common, data, _, _| {
-			common.animate(anim_hover_in(button.clone(), data.widget_id));
+		Box::new(move |common, event_data, _, _| {
+			common.animate(anim_hover_in(data.clone(), event_data.widget_id));
 		}),
 	);
 
-	let button = _button.clone();
-	listeners.add(
+	let data = _data.clone();
+	listeners.register(
+		&mut listener_handles,
 		rect_id,
 		EventListenerKind::MouseLeave,
-		Box::new(move |common, data, _, _| {
-			common.animate(anim_hover_out(button.clone(), data.widget_id));
+		Box::new(move |common, event_data, _, _| {
+			common.animate(anim_hover_out(data.clone(), event_data.widget_id));
 		}),
 	);
 
-	Ok(_button)
+	Ok(Rc::new(Button {
+		data: _data.clone(),
+		listener_handles,
+	}))
 }
diff --git a/wgui/src/components/slider.rs b/wgui/src/components/slider.rs
index 9744c93..c8b9e9d 100644
--- a/wgui/src/components/slider.rs
+++ b/wgui/src/components/slider.rs
@@ -10,7 +10,9 @@ use crate::{
 	animation::{Animation, AnimationEasing},
 	components::Component,
 	drawing::{self},
-	event::{self, CallbackDataCommon, EventListenerCollection, EventListenerKind},
+	event::{
+		self, CallbackDataCommon, EventListenerCollection, EventListenerKind, ListenerHandleVec,
+	},
 	layout::{Layout, WidgetID},
 	renderer_vk::util,
 	widget::{
@@ -46,29 +48,39 @@ pub struct SliderState {
 	max_value: f32,
 }
 
-pub struct Slider {
+struct Data {
 	body: WidgetID,                  // Div
 	slider_handle_id: WidgetID,      // Div
 	slider_handle_rect_id: WidgetID, // Rectangle
 	slider_handle_node: taffy::NodeId,
+}
+
+pub struct Slider {
+	data: Rc<Data>,
 	state: Rc<RefCell<SliderState>>,
+	listener_handles: ListenerHandleVec,
 }
 
 impl Component for Slider {}
 
-impl Slider {
-	fn get_state(&self) -> RefMut<'_, SliderState> {
-		self.state.borrow_mut()
-	}
-
-	pub fn set_value(&self, state: &mut SliderState, common: &mut CallbackDataCommon, value: f32) {
-		state.value = value;
-
-		common.mark_dirty(self.slider_handle_node);
-
-		common.call_on_widget(self.slider_handle_id, |div: &mut Div| {});
+impl SliderState {
+	fn set_value(&mut self, data: &Data, common: &mut CallbackDataCommon, value: f32) {
+		self.value = value;
+		common.mark_dirty(data.slider_handle_node);
+		common.call_on_widget(data.slider_handle_id, |div: &mut Div| {});
 		common.mark_redraw();
-		common.mark_dirty(self.slider_handle_node);
+
+		let mut style = common
+			.refs
+			.tree
+			.style(data.slider_handle_node)
+			.unwrap()
+			.clone();
+
+		// todo
+		style.margin.left = percent(1.0);
+
+		common.set_style(data.slider_handle_node, style);
 	}
 }
 
@@ -123,78 +135,97 @@ fn on_leave_anim(common: &mut event::CallbackDataCommon, handle_id: WidgetID) {
 
 const PAD_PERCENT: f32 = 0.75;
 
+const HANDLE_WIDTH: f32 = 32.0;
+const HANDLE_HEIGHT: f32 = 24.0;
+
 fn register_event_mouse_enter<U1, U2>(
-	slider: Rc<Slider>,
+	data: Rc<Data>,
+	state: Rc<RefCell<SliderState>>,
 	listeners: &mut EventListenerCollection<U1, U2>,
+	listener_handles: &mut ListenerHandleVec,
 ) {
-	listeners.add(
-		slider.body,
+	listeners.register(
+		listener_handles,
+		data.body,
 		EventListenerKind::MouseEnter,
 		Box::new(move |common, _data, _, _| {
 			common.trigger_haptics();
-			slider.get_state().hovered = true;
-			on_enter_anim(common, slider.slider_handle_rect_id);
+			state.borrow_mut().hovered = true;
+			on_enter_anim(common, data.slider_handle_rect_id);
 		}),
 	);
 }
 
 fn register_event_mouse_leave<U1, U2>(
-	slider: Rc<Slider>,
+	data: Rc<Data>,
+	state: Rc<RefCell<SliderState>>,
 	listeners: &mut EventListenerCollection<U1, U2>,
+	listener_handles: &mut ListenerHandleVec,
 ) {
-	listeners.add(
-		slider.body,
+	listeners.register(
+		listener_handles,
+		data.body,
 		EventListenerKind::MouseLeave,
 		Box::new(move |common, _data, _, _| {
 			common.trigger_haptics();
-			slider.get_state().hovered = false;
-			on_leave_anim(common, slider.slider_handle_rect_id);
+			state.borrow_mut().hovered = false;
+			on_leave_anim(common, data.slider_handle_rect_id);
 		}),
 	);
 }
 
 fn register_event_mouse_motion<U1, U2>(
-	slider: Rc<Slider>,
+	data: Rc<Data>,
+	_state: Rc<RefCell<SliderState>>,
 	listeners: &mut EventListenerCollection<U1, U2>,
+	listener_handles: &mut ListenerHandleVec,
 ) {
-	listeners.add(
-		slider.body,
+	listeners.register(
+		listener_handles,
+		data.body,
 		EventListenerKind::MouseMotion,
 		Box::new(move |_common, _data, _, _| {}),
 	);
 }
 
 fn register_event_mouse_press<U1, U2>(
-	slider: Rc<Slider>,
+	data: Rc<Data>,
+	state: Rc<RefCell<SliderState>>,
 	listeners: &mut EventListenerCollection<U1, U2>,
+	listener_handles: &mut ListenerHandleVec,
 ) {
-	listeners.add(
-		slider.body,
+	listeners.register(
+		listener_handles,
+		data.body,
 		EventListenerKind::MousePress,
 		Box::new(move |common, _data, _, _| {
 			common.trigger_haptics();
 
-			let mut state = slider.get_state();
+			let mut state = state.borrow_mut();
+
 			if state.hovered {
 				state.dragging = true;
-				let val = state.min_value;
-				slider.set_value(&mut state, common, val);
+				let val = 1.0;
+				state.set_value(&data, common, val);
 			}
 		}),
 	);
 }
 
 fn register_event_mouse_release<U1, U2>(
-	slider: Rc<Slider>,
+	data: Rc<Data>,
+	state: Rc<RefCell<SliderState>>,
 	listeners: &mut EventListenerCollection<U1, U2>,
+	listener_handles: &mut ListenerHandleVec,
 ) {
-	listeners.add(
-		slider.body,
+	listeners.register(
+		listener_handles,
+		data.body,
 		EventListenerKind::MouseRelease,
 		Box::new(move |common, _data, _, _| {
 			common.trigger_haptics();
 
-			let mut state = slider.get_state();
+			let mut state = state.borrow_mut();
 			if state.dragging {
 				state.dragging = false;
 			}
@@ -212,8 +243,6 @@ pub fn construct<U1, U2>(
 	style.position = taffy::Position::Relative;
 	style.min_size = style.size;
 	style.max_size = style.size;
-	style.align_items = Some(taffy::AlignItems::Center);
-	style.justify_content = Some(taffy::JustifyContent::Center);
 
 	let (body_id, _) = layout.add_child(parent, Div::create()?, style)?;
 
@@ -232,20 +261,27 @@ pub fn construct<U1, U2>(
 				height: percent(PAD_PERCENT),
 			},
 			position: taffy::Position::Absolute,
+			align_self: Some(taffy::AlignItems::Center),
+			justify_self: Some(taffy::JustifySelf::Center),
 			..Default::default()
 		},
 	)?;
 
-	let mut handle_style = taffy::Style::default();
-	handle_style.size.width = length(32.0);
-	handle_style.size.height = percent(1.0);
-	handle_style.position = taffy::Position::Absolute;
-	handle_style.align_items = Some(taffy::AlignItems::Center);
-	handle_style.justify_content = Some(taffy::JustifyContent::Center);
-
 	// invisible outer handle body
-	let (slider_handle_id, slider_handle_node) =
-		layout.add_child(body_id, Div::create()?, handle_style)?;
+	let (slider_handle_id, slider_handle_node) = layout.add_child(
+		body_id,
+		Div::create()?,
+		taffy::Style {
+			size: taffy::Size {
+				width: length(0.0),
+				height: percent(1.0),
+			},
+			position: taffy::Position::Absolute,
+			align_items: Some(taffy::AlignItems::Center),
+			justify_content: Some(taffy::JustifyContent::Center),
+			..Default::default()
+		},
+	)?;
 
 	let (slider_handle_rect_id, _) = layout.add_child(
 		slider_handle_id,
@@ -257,34 +293,44 @@ pub fn construct<U1, U2>(
 			..Default::default()
 		})?,
 		taffy::Style {
+			position: taffy::Position::Absolute,
 			size: taffy::Size {
-				width: percent(PAD_PERCENT),
-				height: percent(PAD_PERCENT),
+				width: length(HANDLE_WIDTH),
+				height: length(HANDLE_HEIGHT),
 			},
 			..Default::default()
 		},
 	)?;
 
-	let slider = Rc::new(Slider {
+	let data = Rc::new(Data {
 		body: body_id,
 		slider_handle_node,
 		slider_handle_rect_id,
 		slider_handle_id,
-		state: Rc::new(RefCell::new(SliderState {
-			dragging: false,
-			hovered: false,
-			max_value: params.max_value,
-			value: params.initial_value,
-			min_value: params.min_value,
-		})),
 	});
 
-	register_event_mouse_enter(slider.clone(), listeners);
-	register_event_mouse_leave(slider.clone(), listeners);
-	register_event_mouse_motion(slider.clone(), listeners);
-	register_event_mouse_press(slider.clone(), listeners);
-	register_event_mouse_leave(slider.clone(), listeners);
-	register_event_mouse_release(slider.clone(), listeners);
+	let state = Rc::new(RefCell::new(SliderState {
+		dragging: false,
+		hovered: false,
+		max_value: params.max_value,
+		value: params.initial_value,
+		min_value: params.min_value,
+	}));
+
+	let mut lhandles = ListenerHandleVec::default();
+
+	register_event_mouse_enter(data.clone(), state.clone(), listeners, &mut lhandles);
+	register_event_mouse_leave(data.clone(), state.clone(), listeners, &mut lhandles);
+	register_event_mouse_motion(data.clone(), state.clone(), listeners, &mut lhandles);
+	register_event_mouse_press(data.clone(), state.clone(), listeners, &mut lhandles);
+	register_event_mouse_leave(data.clone(), state.clone(), listeners, &mut lhandles);
+	register_event_mouse_release(data.clone(), state.clone(), listeners, &mut lhandles);
+
+	let slider = Rc::new(Slider {
+		data,
+		state,
+		listener_handles: lhandles,
+	});
 
 	Ok(slider)
 }
diff --git a/wgui/src/event.rs b/wgui/src/event.rs
index 89319bf..e82fb04 100644
--- a/wgui/src/event.rs
+++ b/wgui/src/event.rs
@@ -1,3 +1,5 @@
+use std::{cell::RefCell, rc::Rc};
+
 use glam::Vec2;
 use slotmap::SecondaryMap;
 
@@ -164,9 +166,30 @@ pub enum EventListenerKind {
 pub type EventCallback<U1, U2> =
 	Box<dyn Fn(&mut CallbackDataCommon, &mut CallbackData, &mut U1, &mut U2)>;
 
+//for ref-counting
+pub struct ListenerHandle {
+	needs_gc: Rc<RefCell<bool>>, // this will be set to true on destructor
+}
+
+#[derive(Default)]
+pub struct ListenerHandleVec(Vec<Rc<ListenerHandle>>);
+
+impl ListenerHandleVec {
+	pub fn push(&mut self, handle: Rc<ListenerHandle>) {
+		self.0.push(handle);
+	}
+}
+
+impl Drop for ListenerHandle {
+	fn drop(&mut self) {
+		*self.needs_gc.borrow_mut() = true;
+	}
+}
+
 pub struct EventListener<U1, U2> {
 	pub kind: EventListenerKind,
 	pub callback: EventCallback<U1, U2>,
+	pub handle: std::rc::Weak<ListenerHandle>,
 }
 
 impl<U1, U2> EventListener<U1, U2> {
@@ -182,8 +205,17 @@ impl<U1, U2> EventListener<U1, U2> {
 	}
 }
 
+pub struct EventListenerVec<U1, U2>(Vec<EventListener<U1, U2>>);
+
+impl<U1, U2> EventListenerVec<U1, U2> {
+	pub fn iter(&self) -> impl Iterator<Item = &EventListener<U1, U2>> {
+		self.0.iter().filter(|p| p.handle.strong_count() > 0)
+	}
+}
+
 pub struct EventListenerCollection<U1, U2> {
-	map: SecondaryMap<WidgetID, Vec<EventListener<U1, U2>>>,
+	map: SecondaryMap<WidgetID, EventListenerVec<U1, U2>>,
+	needs_gc: Rc<RefCell<bool>>,
 }
 
 // derive only works if generics also implement Default
@@ -191,26 +223,75 @@ impl<U1, U2> Default for EventListenerCollection<U1, U2> {
 	fn default() -> Self {
 		Self {
 			map: SecondaryMap::default(),
+			needs_gc: Rc::new(RefCell::new(false)),
 		}
 	}
 }
 
 impl<U1, U2> EventListenerCollection<U1, U2> {
-	pub fn add(
+	pub fn register(
 		&mut self,
+		listener_handles: &mut ListenerHandleVec,
 		widget_id: WidgetID,
 		kind: EventListenerKind,
 		callback: EventCallback<U1, U2>,
 	) {
-		let new_item = EventListener { kind, callback };
-		if let Some(vec) = self.map.get_mut(widget_id) {
-			vec.push(new_item);
-		} else {
-			self.map.insert(widget_id, vec![new_item]);
-		}
+		let res = self.add_single(widget_id, kind, callback);
+		listener_handles.push(res);
 	}
 
-	pub fn get(&self, widget_id: WidgetID) -> Option<&[EventListener<U1, U2>]> {
-		self.map.get(widget_id).map(|v| v.as_slice())
+	pub fn add_single(
+		&mut self,
+		widget_id: WidgetID,
+		kind: EventListenerKind,
+		callback: EventCallback<U1, U2>,
+	) -> Rc<ListenerHandle> {
+		let handle = Rc::new(ListenerHandle {
+			needs_gc: self.needs_gc.clone(),
+		});
+
+		let new_item = EventListener {
+			kind,
+			callback,
+			handle: Rc::downgrade(&handle),
+		};
+		if let Some(vec) = self.map.get_mut(widget_id) {
+			vec.0.push(new_item);
+		} else {
+			self.map.insert(widget_id, EventListenerVec(vec![new_item]));
+		}
+
+		handle
+	}
+
+	// clean-up expired events
+	pub fn gc(&mut self) {
+		let mut needs_gc = self.needs_gc.borrow_mut();
+		if !*needs_gc {
+			return;
+		}
+
+		*needs_gc = false;
+
+		let mut count = 0;
+
+		for (_id, vec) in self.map.iter_mut() {
+			vec.0.retain(|listener| {
+				if listener.handle.strong_count() != 0 {
+					true
+				} else {
+					count += 1;
+					false
+				}
+			});
+		}
+
+		self.map.retain(|_k, v| !v.0.is_empty());
+
+		log::debug!("EventListenerCollection: cleaned-up {count} expired events");
+	}
+
+	pub fn get(&self, widget_id: WidgetID) -> Option<&EventListenerVec<U1, U2>> {
+		self.map.get(widget_id)
 	}
 }
diff --git a/wgui/src/layout.rs b/wgui/src/layout.rs
index 8ce7aa2..f385ed9 100644
--- a/wgui/src/layout.rs
+++ b/wgui/src/layout.rs
@@ -152,6 +152,9 @@ impl Layout {
 				widget::EventResult::Outside => {
 					iter_children = false;
 				}
+				widget::EventResult::Unused => {
+					iter_children = false;
+				}
 			}
 		}
 
@@ -186,7 +189,7 @@ impl Layout {
 
 	pub fn push_event<U1, U2>(
 		&mut self,
-		listeners: &EventListenerCollection<U1, U2>,
+		listeners: &mut EventListenerCollection<U1, U2>,
 		event: &event::Event,
 		mut user_data: (&mut U1, &mut U2),
 	) -> anyhow::Result<()> {
@@ -202,6 +205,8 @@ impl Layout {
 
 		self.process_alterables(alterables)?;
 
+		listeners.gc();
+
 		Ok(())
 	}
 
diff --git a/wgui/src/parser/component_button.rs b/wgui/src/parser/component_button.rs
index 582f5ce..2e1e904 100644
--- a/wgui/src/parser/component_button.rs
+++ b/wgui/src/parser/component_button.rs
@@ -52,7 +52,7 @@ pub fn parse_component_button<'a, U1, U2>(
 		));
 	}
 
-	let _button = button::construct(
+	ctx.components.push(button::construct(
 		ctx.layout,
 		ctx.listeners,
 		parent_id,
@@ -64,7 +64,7 @@ pub fn parse_component_button<'a, U1, U2>(
 			text_style,
 			round,
 		},
-	)?;
+	)?);
 
 	Ok(())
 }
diff --git a/wgui/src/parser/component_slider.rs b/wgui/src/parser/component_slider.rs
index 2e85906..7f05131 100644
--- a/wgui/src/parser/component_slider.rs
+++ b/wgui/src/parser/component_slider.rs
@@ -32,7 +32,7 @@ pub fn parse_component_slider<'a, U1, U2>(
 		}
 	}
 
-	let slider = slider::construct(
+	ctx.components.push(slider::construct(
 		ctx.layout,
 		ctx.listeners,
 		parent_id,
@@ -42,7 +42,7 @@ pub fn parse_component_slider<'a, U1, U2>(
 			initial_value,
 			style,
 		},
-	)?;
+	)?);
 
 	Ok(())
 }
diff --git a/wgui/src/parser/mod.rs b/wgui/src/parser/mod.rs
index ce53e2c..01ae3b2 100644
--- a/wgui/src/parser/mod.rs
+++ b/wgui/src/parser/mod.rs
@@ -8,6 +8,7 @@ mod widget_sprite;
 
 use crate::{
 	assets::AssetProvider,
+	components::Component,
 	drawing::{self},
 	event::EventListenerCollection,
 	layout::{Layout, WidgetID},
@@ -44,15 +45,21 @@ struct ParserFile {
 	template_parameters: HashMap<Rc<str>, Rc<str>>,
 }
 
-pub struct ParserResult {
+/*
+	WARNING: this struct could contain valid components with already bound listener handles.
+	Make sure to store them somewhere in your code.
+*/
+#[derive(Default)]
+pub struct ParserState {
 	pub ids: HashMap<Rc<str>, WidgetID>,
 	macro_attribs: HashMap<Rc<str>, MacroAttribs>,
-	var_map: HashMap<Rc<str>, Rc<str>>,
+	pub var_map: HashMap<Rc<str>, Rc<str>>,
+	pub components: Vec<Rc<dyn Component>>,
 	pub templates: HashMap<Rc<str>, Rc<Template>>,
 	pub path: PathBuf,
 }
 
-impl ParserResult {
+impl ParserState {
 	pub fn require_by_id(&self, id: &str) -> anyhow::Result<WidgetID> {
 		match self.ids.get(id) {
 			Some(id) => Ok(*id),
@@ -78,6 +85,7 @@ impl ParserResult {
 			ids: Default::default(),
 			macro_attribs: self.macro_attribs.clone(), // FIXME: prevent copying
 			var_map: self.var_map.clone(),             // FIXME: prevent copying
+			components: self.components.clone(),       // FIXME: prevent copying
 			templates: Default::default(),
 		};
 
@@ -116,6 +124,7 @@ struct ParserContext<'a, U1, U2> {
 	macro_attribs: HashMap<Rc<str>, MacroAttribs>,
 	ids: HashMap<Rc<str>, WidgetID>,
 	templates: HashMap<Rc<str>, Rc<Template>>,
+	components: Vec<Rc<dyn Component>>,
 }
 
 // Parses a color from a HTML hex string
@@ -148,7 +157,7 @@ pub fn parse_color_hex(html_hex: &str) -> Option<drawing::Color> {
 			));
 		}
 	}
-	log::warn!("failed to parse color \"{}\"", html_hex);
+	log::warn!("failed to parse color \"{html_hex}\"");
 	None
 }
 
@@ -169,15 +178,15 @@ fn require_tag_by_name<'a>(
 }
 
 fn print_invalid_attrib(key: &str, value: &str) {
-	log::warn!("Invalid value \"{}\" in attribute \"{}\"", value, key);
+	log::warn!("Invalid value \"{value}\" in attribute \"{key}\"");
 }
 
 fn print_missing_attrib(tag_name: &str, attr: &str) {
-	log::warn!("Missing attribute {} in tag <{}>", attr, tag_name);
+	log::warn!("Missing attribute {attr} in tag <{tag_name}>");
 }
 
 fn print_invalid_value(value: &str) {
-	log::warn!("Invalid value \"{}\"", value);
+	log::warn!("Invalid value \"{value}\"");
 }
 
 fn parse_val(value: &Rc<str>) -> Option<f32> {
@@ -263,7 +272,7 @@ fn parse_widget_other<'a, U1, U2>(
 	parent_id: WidgetID,
 ) -> anyhow::Result<()> {
 	let Some(template) = ctx.templates.get(xml_tag_name) else {
-		log::error!("Undefined tag named \"{}\"", xml_tag_name);
+		log::error!("Undefined tag named \"{xml_tag_name}\"");
 		return Ok(()); // not critical
 	};
 
@@ -353,7 +362,7 @@ pub fn replace_vars(input: &str, vars: &HashMap<Rc<str>, Rc<str>>) -> Rc<str> {
 		match vars.get(input_var) {
 			Some(replacement) => replacement.clone(),
 			None => {
-				log::warn!("failed to replace var named \"{}\" (not found)", input_var);
+				log::warn!("failed to replace var named \"{input_var}\" (not found)");
 				Rc::from("")
 			}
 		}
@@ -413,7 +422,7 @@ fn iter_attribs<'a, U1, U2>(
 					res.push(process_attrib(file, ctx, macro_key, macro_value));
 				}
 			} else {
-				log::warn!("requested macro named \"{}\" not found!", value);
+				log::warn!("requested macro named \"{value}\" not found!");
 			}
 		} else {
 			res.push(process_attrib(file, ctx, key, value));
@@ -496,7 +505,7 @@ fn parse_tag_macro<U1, U2>(
 			}
 			_ => {
 				if macro_attribs.insert(key.clone(), value).is_some() {
-					log::warn!("macro attrib \"{}\" already defined!", key);
+					log::warn!("macro attrib \"{key}\" already defined!");
 				}
 			}
 		}
@@ -531,7 +540,7 @@ fn parse_universal<'a, U1, U2>(
 			"id" => {
 				// Attach a specific widget to name-ID map (just like getElementById)
 				if ctx.ids.insert(value.clone(), widget_id).is_some() {
-					log::warn!("duplicate ID \"{}\" in the same layout file!", value);
+					log::warn!("duplicate ID \"{value}\" in the same layout file!");
 				}
 			}
 			_ => {}
@@ -589,6 +598,7 @@ fn create_default_context<'a, U1, U2>(
 		var_map: Default::default(),
 		templates: Default::default(),
 		macro_attribs: Default::default(),
+		components: Default::default(),
 	}
 }
 
@@ -597,7 +607,7 @@ pub fn parse_from_assets<U1, U2>(
 	listeners: &mut EventListenerCollection<U1, U2>,
 	parent_id: WidgetID,
 	path: &str,
-) -> anyhow::Result<ParserResult> {
+) -> anyhow::Result<ParserState> {
 	let path = PathBuf::from(path);
 
 	let mut ctx = create_default_context(layout, listeners);
@@ -606,11 +616,12 @@ pub fn parse_from_assets<U1, U2>(
 	parse_document_root(file, &mut ctx, parent_id, node_layout)?;
 
 	// move everything essential to the result
-	let result = ParserResult {
+	let result = ParserState {
 		ids: std::mem::take(&mut ctx.ids),
 		templates: std::mem::take(&mut ctx.templates),
 		macro_attribs: std::mem::take(&mut ctx.macro_attribs),
 		var_map: std::mem::take(&mut ctx.var_map),
+		components: std::mem::take(&mut ctx.components),
 		path,
 	};
 
@@ -623,7 +634,7 @@ pub fn new_layout_from_assets<U1, U2>(
 	assets: Box<dyn AssetProvider>,
 	listeners: &mut EventListenerCollection<U1, U2>,
 	path: &str,
-) -> anyhow::Result<(Layout, ParserResult)> {
+) -> anyhow::Result<(Layout, ParserState)> {
 	let mut layout = Layout::new(assets)?;
 	let widget = layout.root_widget;
 	let state = parse_from_assets(&mut layout, listeners, widget, path)?;
diff --git a/wgui/src/widget/mod.rs b/wgui/src/widget/mod.rs
index 6f8f7f9..16a64fd 100644
--- a/wgui/src/widget/mod.rs
+++ b/wgui/src/widget/mod.rs
@@ -6,7 +6,7 @@ use crate::{
 	drawing,
 	event::{
 		CallbackData, CallbackDataCommon, CallbackMetadata, Event, EventAlterables, EventListener,
-		EventListenerKind, EventRefs, MouseWheelEvent,
+		EventListenerCollection, EventListenerKind, EventListenerVec, EventRefs, MouseWheelEvent,
 	},
 	layout::{Layout, WidgetID},
 	transform_stack::TransformStack,
@@ -135,9 +135,10 @@ impl EventParams<'_> {
 }
 
 pub enum EventResult {
-	Pass,
-	Consumed,
-	Outside,
+	Pass,     // widget acknowledged it and allows the event to pass to the children
+	Consumed, // widget triggered an action, do not pass to children
+	Outside, // widget acknowledged this event but ignores it due the fact the mouse is not hovered over it
+	Unused,  // widget doesn't have any events attached
 }
 
 fn get_scroll_enabled(style: &taffy::Style) -> (bool, bool) {
@@ -184,7 +185,7 @@ impl dyn WidgetObj {
 
 macro_rules! call_event {
 	($self:ident, $listeners:ident, $widget_id:ident, $node_id:ident, $params:ident, $kind:ident, $user_data:expr, $metadata:expr) => {
-		for listener in $listeners {
+		for listener in $listeners.iter() {
 			if let Some(callback) = listener.callback_for_kind(EventListenerKind::$kind) {
 				let mut data = CallbackData {
 					obj: $self.obj.as_mut(),
@@ -318,7 +319,7 @@ impl WidgetState {
 	pub fn process_event<'a, U1, U2>(
 		&mut self,
 		widget_id: WidgetID,
-		listeners: &[EventListener<U1, U2>],
+		listeners: &EventListenerVec<U1, U2>,
 		node_id: taffy::NodeId,
 		event: &Event,
 		user_data: &mut (&mut U1, &mut U2),
diff --git a/wlx-overlay-s/src/gui/panel.rs b/wlx-overlay-s/src/gui/panel.rs
index 98825a9..48ba7b2 100644
--- a/wlx-overlay-s/src/gui/panel.rs
+++ b/wlx-overlay-s/src/gui/panel.rs
@@ -4,11 +4,12 @@ use glam::{Affine2, Vec2, vec2};
 use vulkano::{command_buffer::CommandBufferUsage, image::view::ImageView};
 use wgui::{
     event::{
-        Event as WguiEvent, EventListenerCollection, InternalStateChangeEvent, MouseButton,
-        MouseDownEvent, MouseLeaveEvent, MouseMotionEvent, MouseUpEvent, MouseWheelEvent,
+        Event as WguiEvent, EventListenerCollection, InternalStateChangeEvent, ListenerHandleVec,
+        MouseButton, MouseDownEvent, MouseLeaveEvent, MouseMotionEvent, MouseUpEvent,
+        MouseWheelEvent,
     },
     layout::Layout,
-    parser::ParserResult,
+    parser::ParserState,
     renderer_vk::context::Context as WguiContext,
 };
 
@@ -32,20 +33,18 @@ pub struct GuiPanel<S> {
     pub state: S,
     pub timers: Vec<GuiTimer>,
     pub listeners: EventListenerCollection<AppState, S>,
+    pub listener_handles: ListenerHandleVec,
+    pub parser_state: ParserState,
     interaction_transform: Option<Affine2>,
     context: WguiContext,
     timestep: Timestep,
 }
 
 impl<S> GuiPanel<S> {
-    pub fn new_from_template(
-        app: &mut AppState,
-        path: &str,
-        state: S,
-    ) -> anyhow::Result<(Self, ParserResult)> {
+    pub fn new_from_template(app: &mut AppState, path: &str, state: S) -> anyhow::Result<Self> {
         let mut listeners = EventListenerCollection::<AppState, S>::default();
 
-        let (layout, parser_result) = wgui::parser::new_layout_from_assets(
+        let (layout, parser_state) = wgui::parser::new_layout_from_assets(
             Box::new(gui::asset::GuiAsset {}),
             &mut listeners,
             path,
@@ -55,18 +54,17 @@ impl<S> GuiPanel<S> {
         let mut timestep = Timestep::new();
         timestep.set_tps(60.0);
 
-        Ok((
-            Self {
-                layout,
-                context,
-                timestep,
-                state,
-                timers: vec![],
-                listeners,
-                interaction_transform: None,
-            },
-            parser_result,
-        ))
+        Ok(Self {
+            layout,
+            context,
+            timestep,
+            state,
+            listener_handles: ListenerHandleVec::default(),
+            parser_state,
+            timers: vec![],
+            listeners,
+            interaction_transform: None,
+        })
     }
 
     pub fn new_blank(app: &mut AppState, state: S) -> anyhow::Result<Self> {
@@ -80,6 +78,8 @@ impl<S> GuiPanel<S> {
             context,
             timestep,
             state,
+            parser_state: ParserState::default(),
+            listener_handles: ListenerHandleVec::default(),
             timers: vec![],
             listeners: EventListenerCollection::default(),
             interaction_transform: None,
@@ -93,7 +93,7 @@ impl<S> GuiPanel<S> {
     pub fn push_event(&mut self, app: &mut AppState, event: &WguiEvent) {
         if let Err(e) = self
             .layout
-            .push_event(&self.listeners, event, (app, &mut self.state))
+            .push_event(&mut self.listeners, event, (app, &mut self.state))
         {
             log::error!("Failed to push event: {e:?}");
         }
@@ -186,7 +186,7 @@ impl<S> OverlayBackend for GuiPanel<S> {
     fn on_scroll(&mut self, app: &mut AppState, hit: &PointerHit, delta_y: f32, delta_x: f32) {
         self.layout
             .push_event(
-                &self.listeners,
+                &mut self.listeners,
                 &WguiEvent::MouseWheel(MouseWheelEvent {
                     shift: vec2(delta_x, delta_y),
                     pos: hit.uv * self.layout.content_size,
diff --git a/wlx-overlay-s/src/overlays/anchor.rs b/wlx-overlay-s/src/overlays/anchor.rs
index 407ee38..e59fa87 100644
--- a/wlx-overlay-s/src/overlays/anchor.rs
+++ b/wlx-overlay-s/src/overlays/anchor.rs
@@ -11,7 +11,7 @@ pub fn create_anchor<O>(app: &mut AppState) -> anyhow::Result<OverlayData<O>>
 where
     O: Default,
 {
-    let (panel, _) = GuiPanel::new_from_template(app, "gui/anchor.xml", ())?;
+    let panel = GuiPanel::new_from_template(app, "gui/anchor.xml", ())?;
 
     Ok(OverlayData {
         state: OverlayState {
diff --git a/wlx-overlay-s/src/overlays/bar.rs b/wlx-overlay-s/src/overlays/bar.rs
index 9dcfca5..dc73e55 100644
--- a/wlx-overlay-s/src/overlays/bar.rs
+++ b/wlx-overlay-s/src/overlays/bar.rs
@@ -14,9 +14,9 @@ where
     O: Default,
 {
     let state = BarState {};
-    let (mut panel, parser) = GuiPanel::new_from_template(app, "gui/bar.xml", state)?;
+    let mut panel = GuiPanel::new_from_template(app, "gui/bar.xml", state)?;
 
-    for (id, widget_id) in parser.ids {
+    for (id, _widget_id) in &panel.parser_state.ids {
         match id.as_ref() {
             "lock" => {}
             "anchor" => {}
diff --git a/wlx-overlay-s/src/overlays/keyboard/builder.rs b/wlx-overlay-s/src/overlays/keyboard/builder.rs
index fc0938a..8510c60 100644
--- a/wlx-overlay-s/src/overlays/keyboard/builder.rs
+++ b/wlx-overlay-s/src/overlays/keyboard/builder.rs
@@ -186,7 +186,8 @@ where
                     })
                 };
 
-                panel.listeners.add(
+                panel.listeners.register(
+                    &mut panel.listener_handles,
                     *widget_id,
                     EventListenerKind::MouseEnter,
                     Box::new({
@@ -197,7 +198,8 @@ where
                         }
                     }),
                 );
-                panel.listeners.add(
+                panel.listeners.register(
+                    &mut panel.listener_handles,
                     *widget_id,
                     EventListenerKind::MouseLeave,
                     Box::new({
@@ -208,7 +210,8 @@ where
                         }
                     }),
                 );
-                panel.listeners.add(
+                panel.listeners.register(
+                    &mut panel.listener_handles,
                     *widget_id,
                     EventListenerKind::MousePress,
                     Box::new({
@@ -223,7 +226,8 @@ where
                         }
                     }),
                 );
-                panel.listeners.add(
+                panel.listeners.register(
+                    &mut panel.listener_handles,
                     *widget_id,
                     EventListenerKind::MouseRelease,
                     Box::new({
@@ -237,7 +241,8 @@ where
                 );
 
                 if let Some(modifier) = my_modifier {
-                    panel.listeners.add(
+                    panel.listeners.register(
+                        &mut panel.listener_handles,
                         *widget_id,
                         EventListenerKind::InternalStateChange,
                         Box::new({
@@ -259,6 +264,7 @@ where
     }
 
     panel.layout.update(vec2(2048., 2048.), 0.0)?;
+    panel.parser_state = gui_state_key;
 
     let width = layout.row_size * 0.05 * app.session.config.keyboard_scale;
 
diff --git a/wlx-overlay-s/src/overlays/watch.rs b/wlx-overlay-s/src/overlays/watch.rs
index d067051..93acef5 100644
--- a/wlx-overlay-s/src/overlays/watch.rs
+++ b/wlx-overlay-s/src/overlays/watch.rs
@@ -25,7 +25,7 @@ where
     O: Default,
 {
     let state = WatchState {};
-    let (mut panel, parser) = GuiPanel::new_from_template(app, "gui/watch.xml", state)?;
+    let mut panel = GuiPanel::new_from_template(app, "gui/watch.xml", state)?;
 
     panel
         .timers
@@ -33,8 +33,8 @@ where
 
     let clock_regex = Regex::new(r"^clock([0-9])_([a-z]+)$").unwrap();
 
-    for (id, widget_id) in parser.ids {
-        if let Some(cap) = clock_regex.captures(&id) {
+    for (id, widget_id) in &panel.parser_state.ids {
+        if let Some(cap) = clock_regex.captures(id) {
             let tz_idx: usize = cap.get(1).unwrap().as_str().parse().unwrap(); // safe due to regex
             let tz_str = (tz_idx > 0)
                 .then(|| app.session.config.timezones.get(tz_idx - 1))
@@ -44,7 +44,7 @@ where
             let mut widget = panel
                 .layout
                 .widget_map
-                .get_mut(widget_id)
+                .get_mut(*widget_id)
                 .unwrap() // want panic
                 .lock()
                 .unwrap(); // want panic
@@ -87,8 +87,9 @@ where
                 format: format.into(),
             };
 
-            panel.listeners.add(
-                widget_id,
+            panel.listeners.register(
+                &mut panel.listener_handles,
+                *widget_id,
                 EventListenerKind::InternalStateChange,
                 Box::new(move |_common, data, _, _| {
                     clock_on_tick(&clock, data);