diff --git a/crates/bevy_feathers/src/controls/button.rs b/crates/bevy_feathers/src/controls/button.rs
index 1067792097d5c..38695f679f373 100644
--- a/crates/bevy_feathers/src/controls/button.rs
+++ b/crates/bevy_feathers/src/controls/button.rs
@@ -9,13 +9,13 @@ use bevy_ecs::{
     reflect::ReflectComponent,
     schedule::IntoScheduleConfigs,
     spawn::{SpawnRelated, SpawnableList},
-    system::{Commands, In, Query},
+    system::{Commands, Query},
 };
 use bevy_input_focus::tab_navigation::TabIndex;
 use bevy_picking::{hover::Hovered, PickingSystems};
 use bevy_reflect::{prelude::ReflectDefault, Reflect};
 use bevy_ui::{AlignItems, InteractionDisabled, JustifyContent, Node, Pressed, UiRect, Val};
-use bevy_ui_widgets::{Activate, Button, Callback};
+use bevy_ui_widgets::Button;
 
 use crate::{
     constants::{fonts, size},
@@ -47,8 +47,6 @@ pub struct ButtonProps {
     pub variant: ButtonVariant,
     /// Rounded corners options
     pub corners: RoundedCorners,
-    /// Click handler
-    pub on_click: Callback<In<Activate>>,
 }
 
 /// Template function to spawn a button.
@@ -71,9 +69,7 @@ pub fn button<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
             flex_grow: 1.0,
             ..Default::default()
         },
-        Button {
-            on_activate: props.on_click,
-        },
+        Button,
         props.variant,
         Hovered::default(),
         EntityCursor::System(bevy_window::SystemCursorIcon::Pointer),
diff --git a/crates/bevy_feathers/src/controls/checkbox.rs b/crates/bevy_feathers/src/controls/checkbox.rs
index ebeff7fe3b171..01dec1edd645e 100644
--- a/crates/bevy_feathers/src/controls/checkbox.rs
+++ b/crates/bevy_feathers/src/controls/checkbox.rs
@@ -11,7 +11,7 @@ use bevy_ecs::{
     reflect::ReflectComponent,
     schedule::IntoScheduleConfigs,
     spawn::{Spawn, SpawnRelated, SpawnableList},
-    system::{Commands, In, Query},
+    system::{Commands, Query},
 };
 use bevy_input_focus::tab_navigation::TabIndex;
 use bevy_math::Rot2;
@@ -21,7 +21,7 @@ use bevy_ui::{
     AlignItems, BorderRadius, Checked, Display, FlexDirection, InteractionDisabled, JustifyContent,
     Node, PositionType, UiRect, UiTransform, Val,
 };
-use bevy_ui_widgets::{Callback, Checkbox, ValueChange};
+use bevy_ui_widgets::Checkbox;
 
 use crate::{
     constants::{fonts, size},
@@ -32,13 +32,6 @@ use crate::{
     tokens,
 };
 
-/// Parameters for the checkbox template, passed to [`checkbox`] function.
-#[derive(Default)]
-pub struct CheckboxProps {
-    /// Change handler
-    pub on_change: Callback<In<ValueChange<bool>>>,
-}
-
 /// Marker for the checkbox frame (contains both checkbox and label)
 #[derive(Component, Default, Clone, Reflect)]
 #[reflect(Component, Clone, Default)]
@@ -61,7 +54,6 @@ struct CheckboxMark;
 /// * `overrides` - a bundle of components that are merged in with the normal checkbox components.
 /// * `label` - the label of the checkbox.
 pub fn checkbox<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
-    props: CheckboxProps,
     overrides: B,
     label: C,
 ) -> impl Bundle {
@@ -74,9 +66,7 @@ pub fn checkbox<C: SpawnableList<ChildOf> + Send + Sync + 'static, B: Bundle>(
             column_gap: Val::Px(4.0),
             ..Default::default()
         },
-        Checkbox {
-            on_change: props.on_change,
-        },
+        Checkbox,
         CheckboxFrame,
         Hovered::default(),
         EntityCursor::System(bevy_window::SystemCursorIcon::Pointer),
diff --git a/crates/bevy_feathers/src/controls/color_slider.rs b/crates/bevy_feathers/src/controls/color_slider.rs
index 0ef776e3b7808..b4dcdcbc7e02a 100644
--- a/crates/bevy_feathers/src/controls/color_slider.rs
+++ b/crates/bevy_feathers/src/controls/color_slider.rs
@@ -12,7 +12,7 @@ use bevy_ecs::{
     query::{Changed, Or, With},
     schedule::IntoScheduleConfigs,
     spawn::SpawnRelated,
-    system::{In, Query},
+    system::Query,
 };
 use bevy_input_focus::tab_navigation::TabIndex;
 use bevy_log::warn_once;
@@ -23,9 +23,7 @@ use bevy_ui::{
     UiRect, UiTransform, Val, Val2, ZIndex,
 };
 use bevy_ui_render::ui_material::MaterialNode;
-use bevy_ui_widgets::{
-    Callback, Slider, SliderRange, SliderThumb, SliderValue, TrackClick, ValueChange,
-};
+use bevy_ui_widgets::{Slider, SliderRange, SliderThumb, SliderValue, TrackClick};
 
 use crate::{
     alpha_pattern::{AlphaPattern, AlphaPatternMaterial},
@@ -146,8 +144,6 @@ pub struct SliderBaseColor(pub Color);
 pub struct ColorSliderProps {
     /// Slider current value
     pub value: f32,
-    /// On-change handler
-    pub on_change: Callback<In<ValueChange<f32>>>,
     /// Which color component we're editing
     pub channel: ColorChannel,
 }
@@ -156,7 +152,6 @@ impl Default for ColorSliderProps {
     fn default() -> Self {
         Self {
             value: 0.0,
-            on_change: Callback::Ignore,
             channel: ColorChannel::Alpha,
         }
     }
@@ -195,7 +190,6 @@ pub fn color_slider<B: Bundle>(props: ColorSliderProps, overrides: B) -> impl Bu
             ..Default::default()
         },
         Slider {
-            on_change: props.on_change,
             track_click: TrackClick::Snap,
         },
         ColorSlider {
diff --git a/crates/bevy_feathers/src/controls/mod.rs b/crates/bevy_feathers/src/controls/mod.rs
index f5b9ef4c43dd5..8adf2b5911659 100644
--- a/crates/bevy_feathers/src/controls/mod.rs
+++ b/crates/bevy_feathers/src/controls/mod.rs
@@ -11,15 +11,15 @@ mod toggle_switch;
 mod virtual_keyboard;
 
 pub use button::{button, ButtonPlugin, ButtonProps, ButtonVariant};
-pub use checkbox::{checkbox, CheckboxPlugin, CheckboxProps};
+pub use checkbox::{checkbox, CheckboxPlugin};
 pub use color_slider::{
     color_slider, ColorChannel, ColorSlider, ColorSliderPlugin, ColorSliderProps, SliderBaseColor,
 };
 pub use color_swatch::{color_swatch, ColorSwatch, ColorSwatchFg};
 pub use radio::{radio, RadioPlugin};
 pub use slider::{slider, SliderPlugin, SliderProps};
-pub use toggle_switch::{toggle_switch, ToggleSwitchPlugin, ToggleSwitchProps};
-pub use virtual_keyboard::virtual_keyboard;
+pub use toggle_switch::{toggle_switch, ToggleSwitchPlugin};
+pub use virtual_keyboard::{virtual_keyboard, VirtualKeyPressed};
 
 use crate::alpha_pattern::AlphaPatternPlugin;
 
diff --git a/crates/bevy_feathers/src/controls/slider.rs b/crates/bevy_feathers/src/controls/slider.rs
index fbad8c7a362b5..1bcb2449f9370 100644
--- a/crates/bevy_feathers/src/controls/slider.rs
+++ b/crates/bevy_feathers/src/controls/slider.rs
@@ -13,7 +13,7 @@ use bevy_ecs::{
     reflect::ReflectComponent,
     schedule::IntoScheduleConfigs,
     spawn::SpawnRelated,
-    system::{Commands, In, Query, Res},
+    system::{Commands, Query, Res},
 };
 use bevy_input_focus::tab_navigation::TabIndex;
 use bevy_picking::PickingSystems;
@@ -23,7 +23,7 @@ use bevy_ui::{
     InteractionDisabled, InterpolationColorSpace, JustifyContent, LinearGradient, Node,
     PositionType, UiRect, Val,
 };
-use bevy_ui_widgets::{Callback, Slider, SliderRange, SliderValue, TrackClick, ValueChange};
+use bevy_ui_widgets::{Slider, SliderRange, SliderValue, TrackClick};
 
 use crate::{
     constants::{fonts, size},
@@ -43,8 +43,6 @@ pub struct SliderProps {
     pub min: f32,
     /// Slider maximum value
     pub max: f32,
-    /// On-change handler
-    pub on_change: Callback<In<ValueChange<f32>>>,
 }
 
 impl Default for SliderProps {
@@ -53,7 +51,6 @@ impl Default for SliderProps {
             value: 0.0,
             min: 0.0,
             max: 1.0,
-            on_change: Callback::Ignore,
         }
     }
 }
@@ -86,7 +83,6 @@ pub fn slider<B: Bundle>(props: SliderProps, overrides: B) -> impl Bundle {
             ..Default::default()
         },
         Slider {
-            on_change: props.on_change,
             track_click: TrackClick::Drag,
         },
         SliderStyle,
diff --git a/crates/bevy_feathers/src/controls/toggle_switch.rs b/crates/bevy_feathers/src/controls/toggle_switch.rs
index 94a49ca1972b5..dea53f169f0f8 100644
--- a/crates/bevy_feathers/src/controls/toggle_switch.rs
+++ b/crates/bevy_feathers/src/controls/toggle_switch.rs
@@ -12,14 +12,14 @@ use bevy_ecs::{
     reflect::ReflectComponent,
     schedule::IntoScheduleConfigs,
     spawn::SpawnRelated,
-    system::{Commands, In, Query},
+    system::{Commands, Query},
     world::Mut,
 };
 use bevy_input_focus::tab_navigation::TabIndex;
 use bevy_picking::{hover::Hovered, PickingSystems};
 use bevy_reflect::{prelude::ReflectDefault, Reflect};
 use bevy_ui::{BorderRadius, Checked, InteractionDisabled, Node, PositionType, UiRect, Val};
-use bevy_ui_widgets::{Callback, Checkbox, ValueChange};
+use bevy_ui_widgets::Checkbox;
 
 use crate::{
     constants::size,
@@ -28,13 +28,6 @@ use crate::{
     tokens,
 };
 
-/// Parameters for the toggle switch template, passed to [`toggle_switch`] function.
-#[derive(Default)]
-pub struct ToggleSwitchProps {
-    /// Change handler
-    pub on_change: Callback<In<ValueChange<bool>>>,
-}
-
 /// Marker for the toggle switch outline
 #[derive(Component, Default, Clone, Reflect)]
 #[reflect(Component, Clone, Default)]
@@ -50,7 +43,7 @@ struct ToggleSwitchSlide;
 /// # Arguments
 /// * `props` - construction properties for the toggle switch.
 /// * `overrides` - a bundle of components that are merged in with the normal toggle switch components.
-pub fn toggle_switch<B: Bundle>(props: ToggleSwitchProps, overrides: B) -> impl Bundle {
+pub fn toggle_switch<B: Bundle>(overrides: B) -> impl Bundle {
     (
         Node {
             width: size::TOGGLE_WIDTH,
@@ -58,9 +51,7 @@ pub fn toggle_switch<B: Bundle>(props: ToggleSwitchProps, overrides: B) -> impl
             border: UiRect::all(Val::Px(2.0)),
             ..Default::default()
         },
-        Checkbox {
-            on_change: props.on_change,
-        },
+        Checkbox,
         ToggleSwitchOutline,
         BorderRadius::all(Val::Px(5.0)),
         ThemeBackgroundColor(tokens::SWITCH_BG),
diff --git a/crates/bevy_feathers/src/controls/virtual_keyboard.rs b/crates/bevy_feathers/src/controls/virtual_keyboard.rs
index acc62afc82478..0e95a41956137 100644
--- a/crates/bevy_feathers/src/controls/virtual_keyboard.rs
+++ b/crates/bevy_feathers/src/controls/virtual_keyboard.rs
@@ -1,26 +1,27 @@
-use bevy_ecs::{
-    bundle::Bundle,
-    component::Component,
-    hierarchy::{ChildOf, Children},
-    relationship::RelatedSpawner,
-    spawn::{Spawn, SpawnRelated, SpawnWith},
-    system::{In, SystemId},
-};
+use bevy_ecs::prelude::*;
 use bevy_input_focus::tab_navigation::TabGroup;
 use bevy_ui::Node;
 use bevy_ui::Val;
 use bevy_ui::{widget::Text, FlexDirection};
-use bevy_ui_widgets::{Activate, Callback};
+use bevy_ui_widgets::{observe, Activate};
 
 use crate::controls::{button, ButtonProps};
 
+/// Fired whenever a virtual key is pressed.
+#[derive(EntityEvent)]
+pub struct VirtualKeyPressed<T> {
+    /// The virtual keyboard entity
+    pub entity: Entity,
+    /// The pressed virtual key
+    pub key: T,
+}
+
 /// Function to spawn a virtual keyboard
 pub fn virtual_keyboard<T>(
-    keys: impl Iterator<Item = Vec<(String, T)>> + Send + Sync + 'static,
-    on_key_press: SystemId<In<Activate>>,
+    keys: impl Iterator<Item = Vec<T>> + Send + Sync + 'static,
 ) -> impl Bundle
 where
-    T: Component,
+    T: AsRef<str> + Clone + Send + Sync + 'static,
 {
     (
         Node {
@@ -29,28 +30,33 @@ where
             ..Default::default()
         },
         TabGroup::new(0),
-        Children::spawn((SpawnWith(move |parent: &mut RelatedSpawner<ChildOf>| {
-            for row in keys {
-                parent.spawn((
-                    Node {
-                        flex_direction: FlexDirection::Row,
-                        column_gap: Val::Px(4.),
-                        ..Default::default()
-                    },
-                    Children::spawn(SpawnWith(move |parent: &mut RelatedSpawner<ChildOf>| {
-                        for (label, key_id) in row.into_iter() {
-                            parent.spawn(button(
-                                ButtonProps {
-                                    on_click: Callback::System(on_key_press),
-                                    ..Default::default()
-                                },
-                                (key_id,),
-                                Spawn(Text::new(label)),
-                            ));
-                        }
-                    })),
-                ));
-            }
-        }),)),
+        Children::spawn(SpawnIter(keys.map(move |row| {
+            (
+                Node {
+                    flex_direction: FlexDirection::Row,
+                    column_gap: Val::Px(4.),
+                    ..Default::default()
+                },
+                Children::spawn(SpawnIter(row.into_iter().map(move |key| {
+                    (
+                        button(ButtonProps::default(), (), Spawn(Text::new(key.as_ref()))),
+                        observe(
+                            move |activate: On<Activate>,
+                                  mut commands: Commands,
+                                  query: Query<&ChildOf>|
+                                  -> Result {
+                                let virtual_keyboard =
+                                    query.get(query.get(activate.entity)?.parent())?.parent();
+                                commands.trigger(VirtualKeyPressed {
+                                    entity: virtual_keyboard,
+                                    key: key.clone(),
+                                });
+                                Ok(())
+                            },
+                        ),
+                    )
+                }))),
+            )
+        }))),
     )
 }
diff --git a/crates/bevy_ui_widgets/src/button.rs b/crates/bevy_ui_widgets/src/button.rs
index 46fea109ac62d..4c98f6063d8d6 100644
--- a/crates/bevy_ui_widgets/src/button.rs
+++ b/crates/bevy_ui_widgets/src/button.rs
@@ -2,7 +2,6 @@ use accesskit::Role;
 use bevy_a11y::AccessibilityNode;
 use bevy_app::{App, Plugin};
 use bevy_ecs::query::Has;
-use bevy_ecs::system::In;
 use bevy_ecs::{
     component::Component,
     entity::Entity,
@@ -16,25 +15,21 @@ use bevy_input_focus::FocusedInput;
 use bevy_picking::events::{Cancel, Click, DragEnd, Pointer, Press, Release};
 use bevy_ui::{InteractionDisabled, Pressed};
 
-use crate::{Activate, Callback, Notify};
+use crate::Activate;
 
 /// Headless button widget. This widget maintains a "pressed" state, which is used to
-/// indicate whether the button is currently being pressed by the user. It emits a `ButtonClicked`
+/// indicate whether the button is currently being pressed by the user. It emits an [`Activate`]
 /// event when the button is un-pressed.
 #[derive(Component, Default, Debug)]
 #[require(AccessibilityNode(accesskit::Node::new(Role::Button)))]
-pub struct Button {
-    /// Callback to invoke when the button is clicked, or when the `Enter` or `Space` key
-    /// is pressed while the button is focused.
-    pub on_activate: Callback<In<Activate>>,
-}
+pub struct Button;
 
 fn button_on_key_event(
     mut event: On<FocusedInput<KeyboardInput>>,
-    q_state: Query<(&Button, Has<InteractionDisabled>)>,
+    q_state: Query<Has<InteractionDisabled>, With<Button>>,
     mut commands: Commands,
 ) {
-    if let Ok((bstate, disabled)) = q_state.get(event.focused_entity)
+    if let Ok(disabled) = q_state.get(event.focused_entity)
         && !disabled
     {
         let input_event = &event.input;
@@ -43,20 +38,24 @@ fn button_on_key_event(
             && (input_event.key_code == KeyCode::Enter || input_event.key_code == KeyCode::Space)
         {
             event.propagate(false);
-            commands.notify_with(&bstate.on_activate, Activate(event.focused_entity));
+            commands.trigger(Activate {
+                entity: event.focused_entity,
+            });
         }
     }
 }
 
 fn button_on_pointer_click(
     mut click: On<Pointer<Click>>,
-    mut q_state: Query<(&Button, Has<Pressed>, Has<InteractionDisabled>)>,
+    mut q_state: Query<(Has<Pressed>, Has<InteractionDisabled>), With<Button>>,
     mut commands: Commands,
 ) {
-    if let Ok((bstate, pressed, disabled)) = q_state.get_mut(click.entity) {
+    if let Ok((pressed, disabled)) = q_state.get_mut(click.entity) {
         click.propagate(false);
         if pressed && !disabled {
-            commands.notify_with(&bstate.on_activate, Activate(click.entity));
+            commands.trigger(Activate {
+                entity: click.entity,
+            });
         }
     }
 }
diff --git a/crates/bevy_ui_widgets/src/callback.rs b/crates/bevy_ui_widgets/src/callback.rs
deleted file mode 100644
index 6dba1f9056b9e..0000000000000
--- a/crates/bevy_ui_widgets/src/callback.rs
+++ /dev/null
@@ -1,115 +0,0 @@
-use bevy_ecs::system::{Commands, SystemId, SystemInput};
-use bevy_ecs::world::{DeferredWorld, World};
-use bevy_reflect::{prelude::ReflectDefault, Reflect};
-
-/// A callback defines how we want to be notified when a widget changes state. Unlike an event
-/// or observer, callbacks are intended for "point-to-point" communication that cuts across the
-/// hierarchy of entities. Callbacks can be created in advance of the entity they are attached
-/// to, and can be passed around as parameters.
-///
-/// Example:
-/// ```
-/// use bevy_app::App;
-/// use bevy_ui_widgets::{Callback, Notify};
-/// use bevy_ecs::system::{Commands, IntoSystem};
-///
-/// let mut app = App::new();
-///
-/// // Register a one-shot system
-/// fn my_callback_system() {
-///     println!("Callback executed!");
-/// }
-///
-/// let system_id = app.world_mut().register_system(my_callback_system);
-///
-/// // Wrap system in a callback
-/// let callback = Callback::System(system_id);
-///
-/// // Later, when we want to execute the callback:
-/// app.world_mut().commands().notify(&callback);
-/// ```
-#[derive(Default, Debug, Reflect)]
-#[reflect(Default)]
-pub enum Callback<I: SystemInput = ()> {
-    /// Invoke a one-shot system
-    System(SystemId<I>),
-    /// Ignore this notification
-    #[default]
-    Ignore,
-}
-
-/// Trait used to invoke a [`Callback`], unifying the API across callers.
-pub trait Notify {
-    /// Invoke the callback with no arguments.
-    fn notify(&mut self, callback: &Callback<()>);
-
-    /// Invoke the callback with one argument.
-    fn notify_with<I>(&mut self, callback: &Callback<I>, input: I::Inner<'static>)
-    where
-        I: SystemInput<Inner<'static>: Send> + 'static;
-}
-
-impl<'w, 's> Notify for Commands<'w, 's> {
-    fn notify(&mut self, callback: &Callback<()>) {
-        match callback {
-            Callback::System(system_id) => self.run_system(*system_id),
-            Callback::Ignore => (),
-        }
-    }
-
-    fn notify_with<I>(&mut self, callback: &Callback<I>, input: I::Inner<'static>)
-    where
-        I: SystemInput<Inner<'static>: Send> + 'static,
-    {
-        match callback {
-            Callback::System(system_id) => self.run_system_with(*system_id, input),
-            Callback::Ignore => (),
-        }
-    }
-}
-
-impl Notify for World {
-    fn notify(&mut self, callback: &Callback<()>) {
-        match callback {
-            Callback::System(system_id) => {
-                let _ = self.run_system(*system_id);
-            }
-            Callback::Ignore => (),
-        }
-    }
-
-    fn notify_with<I>(&mut self, callback: &Callback<I>, input: I::Inner<'static>)
-    where
-        I: SystemInput<Inner<'static>: Send> + 'static,
-    {
-        match callback {
-            Callback::System(system_id) => {
-                let _ = self.run_system_with(*system_id, input);
-            }
-            Callback::Ignore => (),
-        }
-    }
-}
-
-impl Notify for DeferredWorld<'_> {
-    fn notify(&mut self, callback: &Callback<()>) {
-        match callback {
-            Callback::System(system_id) => {
-                self.commands().run_system(*system_id);
-            }
-            Callback::Ignore => (),
-        }
-    }
-
-    fn notify_with<I>(&mut self, callback: &Callback<I>, input: I::Inner<'static>)
-    where
-        I: SystemInput<Inner<'static>: Send> + 'static,
-    {
-        match callback {
-            Callback::System(system_id) => {
-                self.commands().run_system_with(*system_id, input);
-            }
-            Callback::Ignore => (),
-        }
-    }
-}
diff --git a/crates/bevy_ui_widgets/src/checkbox.rs b/crates/bevy_ui_widgets/src/checkbox.rs
index d50d464f5fb1d..f4620c15049b2 100644
--- a/crates/bevy_ui_widgets/src/checkbox.rs
+++ b/crates/bevy_ui_widgets/src/checkbox.rs
@@ -2,8 +2,8 @@ use accesskit::Role;
 use bevy_a11y::AccessibilityNode;
 use bevy_app::{App, Plugin};
 use bevy_ecs::event::EntityEvent;
-use bevy_ecs::query::{Has, Without};
-use bevy_ecs::system::{In, ResMut};
+use bevy_ecs::query::{Has, With, Without};
+use bevy_ecs::system::ResMut;
 use bevy_ecs::{
     component::Component,
     observer::On,
@@ -15,14 +15,14 @@ use bevy_input_focus::{FocusedInput, InputFocus, InputFocusVisible};
 use bevy_picking::events::{Click, Pointer};
 use bevy_ui::{Checkable, Checked, InteractionDisabled};
 
-use crate::{Callback, Notify as _, ValueChange};
+use crate::ValueChange;
 use bevy_ecs::entity::Entity;
 
 /// Headless widget implementation for checkboxes. The [`Checked`] component represents the current
-/// state of the checkbox. The `on_change` field is an optional system id that will be run when the
-/// checkbox is clicked, or when the `Enter` or `Space` key is pressed while the checkbox is
-/// focused. If the `on_change` field is `Callback::Ignore`, then instead of calling a callback, the
-/// checkbox will update its own [`Checked`] state directly.
+/// state of the checkbox. The widget will emit a [`ValueChange<bool>`] event when clicked, or when
+/// the `Enter` or `Space` key is pressed while the checkbox is focused.
+///
+/// Add the [`checkbox_self_update`] observer watching the entity with this component to automatically add and remove the [`Checked`] component.
 ///
 /// # Toggle switches
 ///
@@ -31,38 +31,36 @@ use bevy_ecs::entity::Entity;
 /// the `Switch` role instead of the `Checkbox` role.
 #[derive(Component, Debug, Default)]
 #[require(AccessibilityNode(accesskit::Node::new(Role::CheckBox)), Checkable)]
-pub struct Checkbox {
-    /// One-shot system that is run when the checkbox state needs to be changed. If this value is
-    /// `Callback::Ignore`, then the checkbox will update it's own internal [`Checked`] state
-    /// without notification.
-    pub on_change: Callback<In<ValueChange<bool>>>,
-}
+pub struct Checkbox;
 
 fn checkbox_on_key_input(
     mut ev: On<FocusedInput<KeyboardInput>>,
-    q_checkbox: Query<(&Checkbox, Has<Checked>), Without<InteractionDisabled>>,
+    q_checkbox: Query<Has<Checked>, (With<Checkbox>, Without<InteractionDisabled>)>,
     mut commands: Commands,
 ) {
-    if let Ok((checkbox, is_checked)) = q_checkbox.get(ev.focused_entity) {
+    if let Ok(is_checked) = q_checkbox.get(ev.focused_entity) {
         let event = &ev.event().input;
         if event.state == ButtonState::Pressed
             && !event.repeat
             && (event.key_code == KeyCode::Enter || event.key_code == KeyCode::Space)
         {
             ev.propagate(false);
-            set_checkbox_state(&mut commands, ev.focused_entity, checkbox, !is_checked);
+            commands.trigger(ValueChange {
+                source: ev.focused_entity,
+                value: !is_checked,
+            });
         }
     }
 }
 
 fn checkbox_on_pointer_click(
     mut click: On<Pointer<Click>>,
-    q_checkbox: Query<(&Checkbox, Has<Checked>, Has<InteractionDisabled>)>,
+    q_checkbox: Query<(Has<Checked>, Has<InteractionDisabled>), With<Checkbox>>,
     focus: Option<ResMut<InputFocus>>,
     focus_visible: Option<ResMut<InputFocusVisible>>,
     mut commands: Commands,
 ) {
-    if let Ok((checkbox, is_checked, disabled)) = q_checkbox.get(click.entity) {
+    if let Ok((is_checked, disabled)) = q_checkbox.get(click.entity) {
         // Clicking on a button makes it the focused input,
         // and hides the focus ring if it was visible.
         if let Some(mut focus) = focus {
@@ -74,7 +72,10 @@ fn checkbox_on_pointer_click(
 
         click.propagate(false);
         if !disabled {
-            set_checkbox_state(&mut commands, click.entity, checkbox, !is_checked);
+            commands.trigger(ValueChange {
+                source: click.entity,
+                value: !is_checked,
+            });
         }
     }
 }
@@ -133,53 +134,38 @@ pub struct ToggleChecked {
 
 fn checkbox_on_set_checked(
     set_checked: On<SetChecked>,
-    q_checkbox: Query<(&Checkbox, Has<Checked>, Has<InteractionDisabled>)>,
+    q_checkbox: Query<(Has<Checked>, Has<InteractionDisabled>), With<Checkbox>>,
     mut commands: Commands,
 ) {
-    if let Ok((checkbox, is_checked, disabled)) = q_checkbox.get(set_checked.entity) {
+    if let Ok((is_checked, disabled)) = q_checkbox.get(set_checked.entity) {
         if disabled {
             return;
         }
 
         let will_be_checked = set_checked.checked;
         if will_be_checked != is_checked {
-            set_checkbox_state(&mut commands, set_checked.entity, checkbox, will_be_checked);
+            commands.trigger(ValueChange {
+                source: set_checked.entity,
+                value: will_be_checked,
+            });
         }
     }
 }
 
 fn checkbox_on_toggle_checked(
     toggle_checked: On<ToggleChecked>,
-    q_checkbox: Query<(&Checkbox, Has<Checked>, Has<InteractionDisabled>)>,
+    q_checkbox: Query<(Has<Checked>, Has<InteractionDisabled>), With<Checkbox>>,
     mut commands: Commands,
 ) {
-    if let Ok((checkbox, is_checked, disabled)) = q_checkbox.get(toggle_checked.entity) {
+    if let Ok((is_checked, disabled)) = q_checkbox.get(toggle_checked.entity) {
         if disabled {
             return;
         }
 
-        set_checkbox_state(&mut commands, toggle_checked.entity, checkbox, !is_checked);
-    }
-}
-
-fn set_checkbox_state(
-    commands: &mut Commands,
-    entity: impl Into<Entity>,
-    checkbox: &Checkbox,
-    new_state: bool,
-) {
-    if !matches!(checkbox.on_change, Callback::Ignore) {
-        commands.notify_with(
-            &checkbox.on_change,
-            ValueChange {
-                source: entity.into(),
-                value: new_state,
-            },
-        );
-    } else if new_state {
-        commands.entity(entity.into()).insert(Checked);
-    } else {
-        commands.entity(entity.into()).remove::<Checked>();
+        commands.trigger(ValueChange {
+            source: toggle_checked.entity,
+            value: !is_checked,
+        });
     }
 }
 
@@ -194,3 +180,14 @@ impl Plugin for CheckboxPlugin {
             .add_observer(checkbox_on_toggle_checked);
     }
 }
+
+/// Observer function which updates the checkbox value in response to a [`ValueChange`] event.
+/// This can be used to make the checkbox automatically update its own state when clicked,
+/// as opposed to managing the checkbox state externally.
+pub fn checkbox_self_update(value_change: On<ValueChange<bool>>, mut commands: Commands) {
+    if value_change.value {
+        commands.entity(value_change.source).insert(Checked);
+    } else {
+        commands.entity(value_change.source).remove::<Checked>();
+    }
+}
diff --git a/crates/bevy_ui_widgets/src/lib.rs b/crates/bevy_ui_widgets/src/lib.rs
index d1bf311dc1ed1..3ab239412775e 100644
--- a/crates/bevy_ui_widgets/src/lib.rs
+++ b/crates/bevy_ui_widgets/src/lib.rs
@@ -19,21 +19,21 @@
 //! user interface is showing a live view of dynamic data coming from deeper within the game engine.
 
 mod button;
-mod callback;
 mod checkbox;
+mod observe;
 mod radio;
 mod scrollbar;
 mod slider;
 
 pub use button::*;
-pub use callback::*;
 pub use checkbox::*;
+pub use observe::*;
 pub use radio::*;
 pub use scrollbar::*;
 pub use slider::*;
 
 use bevy_app::{PluginGroup, PluginGroupBuilder};
-use bevy_ecs::entity::Entity;
+use bevy_ecs::{entity::Entity, event::EntityEvent};
 
 /// A plugin group that registers the observers for all of the widgets in this crate. If you don't want to
 /// use all of the widgets, you can import the individual widget plugins instead.
@@ -51,13 +51,17 @@ impl PluginGroup for UiWidgetsPlugins {
 }
 
 /// Notification sent by a button or menu item.
-#[derive(Copy, Clone, Debug, PartialEq)]
-pub struct Activate(pub Entity);
+#[derive(Copy, Clone, Debug, PartialEq, EntityEvent)]
+pub struct Activate {
+    /// The activated entity.
+    pub entity: Entity,
+}
 
 /// Notification sent by a widget that edits a scalar value.
-#[derive(Copy, Clone, Debug, PartialEq)]
+#[derive(Copy, Clone, Debug, PartialEq, EntityEvent)]
 pub struct ValueChange<T> {
     /// The id of the widget that produced this value.
+    #[event_target]
     pub source: Entity,
     /// The new value.
     pub value: T,
diff --git a/crates/bevy_ui_widgets/src/observe.rs b/crates/bevy_ui_widgets/src/observe.rs
new file mode 100644
index 0000000000000..6fb4d177a65ed
--- /dev/null
+++ b/crates/bevy_ui_widgets/src/observe.rs
@@ -0,0 +1,77 @@
+// TODO: This probably doesn't belong in bevy_ui_widgets, but I am not sure where it should go.
+// It is certainly a useful thing to have.
+#![expect(unsafe_code, reason = "Unsafe code is used to improve performance.")]
+
+use core::marker::PhantomData;
+
+use bevy_ecs::{
+    bundle::{Bundle, DynamicBundle},
+    event::EntityEvent,
+    system::IntoObserverSystem,
+};
+
+/// Helper struct that adds an observer when inserted as a [`Bundle`].
+pub struct AddObserver<E: EntityEvent, B: Bundle, M, I: IntoObserverSystem<E, B, M>> {
+    observer: I,
+    marker: PhantomData<(E, B, M)>,
+}
+
+// SAFETY: Empty method bodies.
+unsafe impl<
+        E: EntityEvent,
+        B: Bundle,
+        M: Send + Sync + 'static,
+        I: IntoObserverSystem<E, B, M> + Send + Sync,
+    > Bundle for AddObserver<E, B, M, I>
+{
+    #[inline]
+    fn component_ids(
+        _components: &mut bevy_ecs::component::ComponentsRegistrator,
+        _ids: &mut impl FnMut(bevy_ecs::component::ComponentId),
+    ) {
+        // SAFETY: Empty function body
+    }
+
+    #[inline]
+    fn get_component_ids(
+        _components: &bevy_ecs::component::Components,
+        _ids: &mut impl FnMut(Option<bevy_ecs::component::ComponentId>),
+    ) {
+        // SAFETY: Empty function body
+    }
+}
+
+impl<E: EntityEvent, B: Bundle, M, I: IntoObserverSystem<E, B, M>> DynamicBundle
+    for AddObserver<E, B, M, I>
+{
+    type Effect = Self;
+
+    #[inline]
+    unsafe fn get_components(
+        _ptr: bevy_ecs::ptr::MovingPtr<'_, Self>,
+        _func: &mut impl FnMut(bevy_ecs::component::StorageType, bevy_ecs::ptr::OwningPtr<'_>),
+    ) {
+        // SAFETY: Empty function body
+    }
+
+    #[inline]
+    unsafe fn apply_effect(
+        ptr: bevy_ecs::ptr::MovingPtr<'_, core::mem::MaybeUninit<Self>>,
+        entity: &mut bevy_ecs::world::EntityWorldMut,
+    ) {
+        // SAFETY: `get_components` does nothing, value was not moved.
+        let add_observer = unsafe { ptr.assume_init() };
+        let add_observer = add_observer.read();
+        entity.observe(add_observer.observer);
+    }
+}
+
+/// Adds an observer as a bundle effect.
+pub fn observe<E: EntityEvent, B: Bundle, M, I: IntoObserverSystem<E, B, M>>(
+    observer: I,
+) -> AddObserver<E, B, M, I> {
+    AddObserver {
+        observer,
+        marker: PhantomData,
+    }
+}
diff --git a/crates/bevy_ui_widgets/src/radio.rs b/crates/bevy_ui_widgets/src/radio.rs
index 0e5fde2aa53cb..1dac539782f54 100644
--- a/crates/bevy_ui_widgets/src/radio.rs
+++ b/crates/bevy_ui_widgets/src/radio.rs
@@ -3,11 +3,12 @@ use bevy_a11y::AccessibilityNode;
 use bevy_app::{App, Plugin};
 use bevy_ecs::{
     component::Component,
+    entity::Entity,
     hierarchy::{ChildOf, Children},
     observer::On,
     query::{Has, With},
     reflect::ReflectComponent,
-    system::{Commands, In, Query},
+    system::{Commands, Query},
 };
 use bevy_input::keyboard::{KeyCode, KeyboardInput};
 use bevy_input::ButtonState;
@@ -16,7 +17,7 @@ use bevy_picking::events::{Click, Pointer};
 use bevy_reflect::Reflect;
 use bevy_ui::{Checkable, Checked, InteractionDisabled};
 
-use crate::{Activate, Callback, Notify};
+use crate::ValueChange;
 
 /// Headless widget implementation for a "radio button group". This component is used to group
 /// multiple [`RadioButton`] components together, allowing them to behave as a single unit. It
@@ -24,9 +25,10 @@ use crate::{Activate, Callback, Notify};
 ///
 /// The [`RadioGroup`] component does not have any state itself, and makes no assumptions about
 /// what, if any, value is associated with each radio button, or what Rust type that value might be.
-/// Instead, the output of the group is the entity id of the selected button. The app can then
-/// derive the selected value from this using app-specific means, such as accessing a component on
-/// the individual buttons.
+/// Instead, the output of the group is a [`ValueChange`] event whose payload is the entity id of
+/// the selected button. This event is emitted whenever a radio button is clicked, or when using
+/// the arrow keys while the radio group is focused. The app can then derive the selected value from
+/// this using app-specific means, such as accessing a component on the individual buttons.
 ///
 /// The [`RadioGroup`] doesn't actually set the [`Checked`] states directly, that is presumed to
 /// happen by the app or via some external data-binding scheme. Typically, each button would be
@@ -35,10 +37,7 @@ use crate::{Activate, Callback, Notify};
 /// within the group, it should never be the case that more than one button is selected at a time.
 #[derive(Component, Debug)]
 #[require(AccessibilityNode(accesskit::Node::new(Role::RadioGroup)))]
-pub struct RadioGroup {
-    /// Callback which is called when the selected radio button changes.
-    pub on_change: Callback<In<Activate>>,
-}
+pub struct RadioGroup;
 
 /// Headless widget implementation for radio buttons. These should be enclosed within a
 /// [`RadioGroup`] widget, which is responsible for the mutual exclusion logic.
@@ -54,12 +53,12 @@ pub struct RadioButton;
 
 fn radio_group_on_key_input(
     mut ev: On<FocusedInput<KeyboardInput>>,
-    q_group: Query<&RadioGroup>,
+    q_group: Query<(), With<RadioGroup>>,
     q_radio: Query<(Has<Checked>, Has<InteractionDisabled>), With<RadioButton>>,
     q_children: Query<&Children>,
     mut commands: Commands,
 ) {
-    if let Ok(RadioGroup { on_change }) = q_group.get(ev.focused_entity) {
+    if q_group.contains(ev.focused_entity) {
         let event = &ev.event().input;
         if event.state == ButtonState::Pressed
             && !event.repeat
@@ -134,20 +133,23 @@ fn radio_group_on_key_input(
             let (next_id, _) = radio_buttons[next_index];
 
             // Trigger the on_change event for the newly checked radio button
-            commands.notify_with(on_change, Activate(next_id));
+            commands.trigger(ValueChange::<Entity> {
+                source: ev.focused_entity,
+                value: next_id,
+            });
         }
     }
 }
 
 fn radio_group_on_button_click(
     mut ev: On<Pointer<Click>>,
-    q_group: Query<&RadioGroup>,
+    q_group: Query<(), With<RadioGroup>>,
     q_radio: Query<(Has<Checked>, Has<InteractionDisabled>), With<RadioButton>>,
     q_parents: Query<&ChildOf>,
     q_children: Query<&Children>,
     mut commands: Commands,
 ) {
-    if let Ok(RadioGroup { on_change }) = q_group.get(ev.entity) {
+    if q_group.contains(ev.entity) {
         // Starting with the original target, search upward for a radio button.
         let radio_id = if q_radio.contains(ev.original_event_target()) {
             ev.original_event_target()
@@ -202,7 +204,10 @@ fn radio_group_on_button_click(
         }
 
         // Trigger the on_change event for the newly checked radio button
-        commands.notify_with(on_change, Activate(radio_id));
+        commands.trigger(ValueChange::<Entity> {
+            source: ev.entity,
+            value: radio_id,
+        });
     }
 }
 
diff --git a/crates/bevy_ui_widgets/src/slider.rs b/crates/bevy_ui_widgets/src/slider.rs
index a417ba2bb9786..59c3e580b19df 100644
--- a/crates/bevy_ui_widgets/src/slider.rs
+++ b/crates/bevy_ui_widgets/src/slider.rs
@@ -7,7 +7,7 @@ use bevy_ecs::event::EntityEvent;
 use bevy_ecs::hierarchy::Children;
 use bevy_ecs::lifecycle::Insert;
 use bevy_ecs::query::Has;
-use bevy_ecs::system::{In, Res};
+use bevy_ecs::system::Res;
 use bevy_ecs::world::DeferredWorld;
 use bevy_ecs::{
     component::Component,
@@ -27,7 +27,7 @@ use bevy_ui::{
     ComputedNode, ComputedUiRenderTargetInfo, InteractionDisabled, UiGlobalTransform, UiScale,
 };
 
-use crate::{Callback, Notify, ValueChange};
+use crate::ValueChange;
 use bevy_ecs::entity::Entity;
 
 /// Defines how the slider should behave when you click on the track (not the thumb).
@@ -81,10 +81,6 @@ pub enum TrackClick {
     SliderStep
 )]
 pub struct Slider {
-    /// Callback which is called when the slider is dragged or the value is changed via other user
-    /// interaction. If this value is `Callback::Ignore`, then the slider will update it's own
-    /// internal [`SliderValue`] state without notification.
-    pub on_change: Callback<In<ValueChange<f32>>>,
     /// Set the track-clicking behavior for this slider.
     pub track_click: TrackClick,
     // TODO: Think about whether we want a "vertical" option.
@@ -303,17 +299,10 @@ pub(crate) fn slider_on_pointer_down(
                 .unwrap_or(click_val),
         });
 
-        if matches!(slider.on_change, Callback::Ignore) {
-            commands.entity(press.entity).insert(SliderValue(new_value));
-        } else {
-            commands.notify_with(
-                &slider.on_change,
-                ValueChange {
-                    source: press.entity,
-                    value: new_value,
-                },
-            );
-        }
+        commands.trigger(ValueChange {
+            source: press.entity,
+            value: new_value,
+        });
     }
 }
 
@@ -339,22 +328,23 @@ pub(crate) fn slider_on_drag_start(
 
 pub(crate) fn slider_on_drag(
     mut event: On<Pointer<Drag>>,
-    mut q_slider: Query<(
-        &ComputedNode,
-        &Slider,
-        &SliderRange,
-        Option<&SliderPrecision>,
-        &UiGlobalTransform,
-        &mut CoreSliderDragState,
-        Has<InteractionDisabled>,
-    )>,
+    mut q_slider: Query<
+        (
+            &ComputedNode,
+            &SliderRange,
+            Option<&SliderPrecision>,
+            &UiGlobalTransform,
+            &mut CoreSliderDragState,
+            Has<InteractionDisabled>,
+        ),
+        With<Slider>,
+    >,
     q_thumb: Query<&ComputedNode, With<SliderThumb>>,
     q_children: Query<&Children>,
     mut commands: Commands,
     ui_scale: Res<UiScale>,
 ) {
-    if let Ok((node, slider, range, precision, transform, drag, disabled)) =
-        q_slider.get_mut(event.entity)
+    if let Ok((node, range, precision, transform, drag, disabled)) = q_slider.get_mut(event.entity)
     {
         event.propagate(false);
         if drag.dragging && !disabled {
@@ -379,19 +369,10 @@ pub(crate) fn slider_on_drag(
                     .unwrap_or(new_value),
             );
 
-            if matches!(slider.on_change, Callback::Ignore) {
-                commands
-                    .entity(event.entity)
-                    .insert(SliderValue(rounded_value));
-            } else {
-                commands.notify_with(
-                    &slider.on_change,
-                    ValueChange {
-                        source: event.entity,
-                        value: rounded_value,
-                    },
-                );
-            }
+            commands.trigger(ValueChange {
+                source: event.entity,
+                value: rounded_value,
+            });
         }
     }
 }
@@ -410,16 +391,18 @@ pub(crate) fn slider_on_drag_end(
 
 fn slider_on_key_input(
     mut focused_input: On<FocusedInput<KeyboardInput>>,
-    q_slider: Query<(
-        &Slider,
-        &SliderValue,
-        &SliderRange,
-        &SliderStep,
-        Has<InteractionDisabled>,
-    )>,
+    q_slider: Query<
+        (
+            &SliderValue,
+            &SliderRange,
+            &SliderStep,
+            Has<InteractionDisabled>,
+        ),
+        With<Slider>,
+    >,
     mut commands: Commands,
 ) {
-    if let Ok((slider, value, range, step, disabled)) = q_slider.get(focused_input.focused_entity) {
+    if let Ok((value, range, step, disabled)) = q_slider.get(focused_input.focused_entity) {
         let input_event = &focused_input.input;
         if !disabled && input_event.state == ButtonState::Pressed {
             let new_value = match input_event.key_code {
@@ -432,19 +415,10 @@ fn slider_on_key_input(
                 }
             };
             focused_input.propagate(false);
-            if matches!(slider.on_change, Callback::Ignore) {
-                commands
-                    .entity(focused_input.focused_entity)
-                    .insert(SliderValue(new_value));
-            } else {
-                commands.notify_with(
-                    &slider.on_change,
-                    ValueChange {
-                        source: focused_input.focused_entity,
-                        value: new_value,
-                    },
-                );
-            }
+            commands.trigger(ValueChange {
+                source: focused_input.focused_entity,
+                value: new_value,
+            });
         }
     }
 }
@@ -532,10 +506,10 @@ pub enum SliderValueChange {
 
 fn slider_on_set_value(
     set_slider_value: On<SetSliderValue>,
-    q_slider: Query<(&Slider, &SliderValue, &SliderRange, Option<&SliderStep>)>,
+    q_slider: Query<(&SliderValue, &SliderRange, Option<&SliderStep>), With<Slider>>,
     mut commands: Commands,
 ) {
-    if let Ok((slider, value, range, step)) = q_slider.get(set_slider_value.entity) {
+    if let Ok((value, range, step)) = q_slider.get(set_slider_value.entity) {
         let new_value = match set_slider_value.change {
             SliderValueChange::Absolute(new_value) => range.clamp(new_value),
             SliderValueChange::Relative(delta) => range.clamp(value.0 + delta),
@@ -543,22 +517,22 @@ fn slider_on_set_value(
                 range.clamp(value.0 + delta * step.map(|s| s.0).unwrap_or_default())
             }
         };
-        if matches!(slider.on_change, Callback::Ignore) {
-            commands
-                .entity(set_slider_value.entity)
-                .insert(SliderValue(new_value));
-        } else {
-            commands.notify_with(
-                &slider.on_change,
-                ValueChange {
-                    source: set_slider_value.entity,
-                    value: new_value,
-                },
-            );
-        }
+        commands.trigger(ValueChange {
+            source: set_slider_value.entity,
+            value: new_value,
+        });
     }
 }
 
+/// Observer function which updates the slider value in response to a [`ValueChange`] event.
+/// This can be used to make the slider automatically update its own state when dragged,
+/// as opposed to managing the slider state externally.
+pub fn slider_self_update(value_change: On<ValueChange<f32>>, mut commands: Commands) {
+    commands
+        .entity(value_change.source)
+        .insert(SliderValue(value_change.value));
+}
+
 /// Plugin that adds the observers for the [`Slider`] widget.
 pub struct SliderPlugin;
 
diff --git a/examples/ui/feathers.rs b/examples/ui/feathers.rs
index fd25979bd2704..13ea3c212d810 100644
--- a/examples/ui/feathers.rs
+++ b/examples/ui/feathers.rs
@@ -5,8 +5,8 @@ use bevy::{
     feathers::{
         controls::{
             button, checkbox, color_slider, color_swatch, radio, slider, toggle_switch,
-            ButtonProps, ButtonVariant, CheckboxProps, ColorChannel, ColorSlider, ColorSliderProps,
-            ColorSwatch, SliderBaseColor, SliderProps, ToggleSwitchProps,
+            ButtonProps, ButtonVariant, ColorChannel, ColorSlider, ColorSliderProps, ColorSwatch,
+            SliderBaseColor, SliderProps,
         },
         dark_theme::create_dark_theme,
         rounded_corners::RoundedCorners,
@@ -17,8 +17,8 @@ use bevy::{
     prelude::*,
     ui::{Checked, InteractionDisabled},
     ui_widgets::{
-        Activate, Callback, RadioButton, RadioGroup, SliderPrecision, SliderStep, SliderValue,
-        ValueChange,
+        checkbox_self_update, observe, slider_self_update, Activate, RadioButton, RadioGroup,
+        SliderPrecision, SliderStep, SliderValue, ValueChange,
     },
 };
 
@@ -54,66 +54,10 @@ fn main() {
 fn setup(mut commands: Commands) {
     // ui camera
     commands.spawn(Camera2d);
-    let root = demo_root(&mut commands);
-    commands.spawn(root);
+    commands.spawn(demo_root());
 }
 
-fn demo_root(commands: &mut Commands) -> impl Bundle {
-    // Update radio button states based on notification from radio group.
-    let radio_exclusion = commands.register_system(
-        |ent: In<Activate>, q_radio: Query<Entity, With<RadioButton>>, mut commands: Commands| {
-            for radio in q_radio.iter() {
-                if radio == ent.0 .0 {
-                    commands.entity(radio).insert(Checked);
-                } else {
-                    commands.entity(radio).remove::<Checked>();
-                }
-            }
-        },
-    );
-
-    let change_red = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.rgb_color.red = change.value;
-        },
-    );
-
-    let change_green = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.rgb_color.green = change.value;
-        },
-    );
-
-    let change_blue = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.rgb_color.blue = change.value;
-        },
-    );
-
-    let change_alpha = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.rgb_color.alpha = change.value;
-        },
-    );
-
-    let change_hue = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.hsl_color.hue = change.value;
-        },
-    );
-
-    let change_saturation = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.hsl_color.saturation = change.value;
-        },
-    );
-
-    let change_lightness = commands.register_system(
-        |change: In<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
-            color.hsl_color.lightness = change.value;
-        },
-    );
-
+fn demo_root() -> impl Bundle {
     (
         Node {
             width: percent(100),
@@ -150,42 +94,38 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                         ..default()
                     },
                     children![
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Normal button clicked!");
-                                    }
-                                )),
-                                ..default()
-                            },
-                            (),
-                            Spawn((Text::new("Normal"), ThemedText))
+                        (
+                            button(
+                                ButtonProps::default(),
+                                (),
+                                Spawn((Text::new("Normal"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Normal button clicked!");
+                            })
                         ),
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Disabled button clicked!");
-                                    }
-                                )),
-                                ..default()
-                            },
-                            (InteractionDisabled, DemoDisabledButton),
-                            Spawn((Text::new("Disabled"), ThemedText))
+                        (
+                            button(
+                                ButtonProps::default(),
+                                (InteractionDisabled, DemoDisabledButton),
+                                Spawn((Text::new("Disabled"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Disabled button clicked!");
+                            })
                         ),
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Primary button clicked!");
-                                    }
-                                )),
-                                variant: ButtonVariant::Primary,
-                                ..default()
-                            },
-                            (),
-                            Spawn((Text::new("Primary"), ThemedText))
+                        (
+                            button(
+                                ButtonProps {
+                                    variant: ButtonVariant::Primary,
+                                    ..default()
+                                },
+                                (),
+                                Spawn((Text::new("Primary"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Disabled button clicked!");
+                            })
                         ),
                     ]
                 ),
@@ -199,95 +139,96 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                         ..default()
                     },
                     children![
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Left button clicked!");
-                                    }
-                                )),
-                                corners: RoundedCorners::Left,
-                                ..default()
-                            },
-                            (),
-                            Spawn((Text::new("Left"), ThemedText))
+                        (
+                            button(
+                                ButtonProps {
+                                    corners: RoundedCorners::Left,
+                                    ..default()
+                                },
+                                (),
+                                Spawn((Text::new("Left"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Left button clicked!");
+                            })
                         ),
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Center button clicked!");
-                                    }
-                                )),
-                                corners: RoundedCorners::None,
-                                ..default()
-                            },
-                            (),
-                            Spawn((Text::new("Center"), ThemedText))
+                        (
+                            button(
+                                ButtonProps {
+                                    corners: RoundedCorners::None,
+                                    ..default()
+                                },
+                                (),
+                                Spawn((Text::new("Center"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Center button clicked!");
+                            })
                         ),
-                        button(
-                            ButtonProps {
-                                on_click: Callback::System(commands.register_system(
-                                    |_: In<Activate>| {
-                                        info!("Right button clicked!");
-                                    }
-                                )),
-                                variant: ButtonVariant::Primary,
-                                corners: RoundedCorners::Right,
-                            },
-                            (),
-                            Spawn((Text::new("Right"), ThemedText))
+                        (
+                            button(
+                                ButtonProps {
+                                    variant: ButtonVariant::Primary,
+                                    corners: RoundedCorners::Right,
+                                },
+                                (),
+                                Spawn((Text::new("Right"), ThemedText))
+                            ),
+                            observe(|_activate: On<Activate>| {
+                                info!("Right button clicked!");
+                            })
                         ),
                     ]
                 ),
-                button(
-                    ButtonProps {
-                        on_click: Callback::System(commands.register_system(|_: In<Activate>| {
-                            info!("Wide button clicked!");
-                        })),
-                        ..default()
-                    },
-                    (),
-                    Spawn((Text::new("Button"), ThemedText))
+                (
+                    button(
+                        ButtonProps::default(),
+                        (),
+                        Spawn((Text::new("Button"), ThemedText))
+                    ),
+                    observe(|_activate: On<Activate>| {
+                        info!("Wide button clicked!");
+                    })
                 ),
-                checkbox(
-                    CheckboxProps {
-                        on_change: Callback::System(commands.register_system(
-                            |change: In<ValueChange<bool>>,
-                             query: Query<Entity, With<DemoDisabledButton>>,
-                             mut commands: Commands| {
-                                info!("Checkbox clicked!");
-                                let mut button = commands.entity(query.single().unwrap());
-                                if change.value {
-                                    button.insert(InteractionDisabled);
-                                } else {
-                                    button.remove::<InteractionDisabled>();
-                                }
-                                let mut checkbox = commands.entity(change.source);
-                                if change.value {
-                                    checkbox.insert(Checked);
-                                } else {
-                                    checkbox.remove::<Checked>();
-                                }
+                (
+                    checkbox(Checked, Spawn((Text::new("Checkbox"), ThemedText))),
+                    observe(
+                        |change: On<ValueChange<bool>>,
+                         query: Query<Entity, With<DemoDisabledButton>>,
+                         mut commands: Commands| {
+                            info!("Checkbox clicked!");
+                            let mut button = commands.entity(query.single().unwrap());
+                            if change.value {
+                                button.insert(InteractionDisabled);
+                            } else {
+                                button.remove::<InteractionDisabled>();
                             }
-                        )),
-                    },
-                    Checked,
-                    Spawn((Text::new("Checkbox"), ThemedText))
+                            let mut checkbox = commands.entity(change.source);
+                            if change.value {
+                                checkbox.insert(Checked);
+                            } else {
+                                checkbox.remove::<Checked>();
+                            }
+                        }
+                    )
                 ),
-                checkbox(
-                    CheckboxProps {
-                        on_change: Callback::Ignore,
-                    },
-                    InteractionDisabled,
-                    Spawn((Text::new("Disabled"), ThemedText))
+                (
+                    checkbox(
+                        InteractionDisabled,
+                        Spawn((Text::new("Disabled"), ThemedText))
+                    ),
+                    observe(|_change: On<ValueChange<bool>>| {
+                        warn!("Disabled checkbox clicked!");
+                    })
                 ),
-                checkbox(
-                    CheckboxProps {
-                        on_change: Callback::Ignore,
-                    },
-                    (InteractionDisabled, Checked),
-                    Spawn((Text::new("Disabled+Checked"), ThemedText))
+                (
+                    checkbox(
+                        (InteractionDisabled, Checked),
+                        Spawn((Text::new("Disabled+Checked"), ThemedText))
+                    ),
+                    observe(|_change: On<ValueChange<bool>>| {
+                        warn!("Disabled checkbox clicked!");
+                    })
                 ),
                 (
                     Node {
@@ -296,9 +237,20 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                         row_gap: px(4),
                         ..default()
                     },
-                    RadioGroup {
-                        on_change: Callback::System(radio_exclusion),
-                    },
+                    RadioGroup,
+                    observe(
+                        |value_change: On<ValueChange<Entity>>,
+                         q_radio: Query<Entity, With<RadioButton>>,
+                         mut commands: Commands| {
+                            for radio in q_radio.iter() {
+                                if radio == value_change.value {
+                                    commands.entity(radio).insert(Checked);
+                                } else {
+                                    commands.entity(radio).remove::<Checked>();
+                                }
+                            }
+                        }
+                    ),
                     children![
                         radio(Checked, Spawn((Text::new("One"), ThemedText))),
                         radio((), Spawn((Text::new("Two"), ThemedText))),
@@ -319,33 +271,27 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                         ..default()
                     },
                     children![
-                        toggle_switch(
-                            ToggleSwitchProps {
-                                on_change: Callback::Ignore,
-                            },
-                            (),
-                        ),
-                        toggle_switch(
-                            ToggleSwitchProps {
-                                on_change: Callback::Ignore,
-                            },
-                            InteractionDisabled,
+                        (toggle_switch((),), observe(checkbox_self_update)),
+                        (
+                            toggle_switch(InteractionDisabled,),
+                            observe(checkbox_self_update)
                         ),
-                        toggle_switch(
-                            ToggleSwitchProps {
-                                on_change: Callback::Ignore,
-                            },
-                            (InteractionDisabled, Checked),
+                        (
+                            toggle_switch((InteractionDisabled, Checked),),
+                            observe(checkbox_self_update)
                         ),
                     ]
                 ),
-                slider(
-                    SliderProps {
-                        max: 100.0,
-                        value: 20.0,
-                        ..default()
-                    },
-                    (SliderStep(10.), SliderPrecision(2)),
+                (
+                    slider(
+                        SliderProps {
+                            max: 100.0,
+                            value: 20.0,
+                            ..default()
+                        },
+                        (SliderStep(10.), SliderPrecision(2)),
+                    ),
+                    observe(slider_self_update)
                 ),
                 (
                     Node {
@@ -356,37 +302,61 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                     },
                     children![Text("Srgba".to_owned()), color_swatch(SwatchType::Rgb),]
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_red),
-                        channel: ColorChannel::Red
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::Red
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.rgb_color.red = change.value;
+                        }
+                    )
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_green),
-                        channel: ColorChannel::Green
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::Green
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.rgb_color.green = change.value;
+                        },
+                    )
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_blue),
-                        channel: ColorChannel::Blue
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::Blue
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.rgb_color.blue = change.value;
+                        },
+                    )
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_alpha),
-                        channel: ColorChannel::Alpha
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::Alpha
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.rgb_color.alpha = change.value;
+                        },
+                    )
                 ),
                 (
                     Node {
@@ -397,29 +367,47 @@ fn demo_root(commands: &mut Commands) -> impl Bundle {
                     },
                     children![Text("Hsl".to_owned()), color_swatch(SwatchType::Hsl),]
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_hue),
-                        channel: ColorChannel::HslHue
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::HslHue
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.hsl_color.hue = change.value;
+                        },
+                    )
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_saturation),
-                        channel: ColorChannel::HslSaturation
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::HslSaturation
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.hsl_color.saturation = change.value;
+                        },
+                    )
                 ),
-                color_slider(
-                    ColorSliderProps {
-                        value: 0.5,
-                        on_change: Callback::System(change_lightness),
-                        channel: ColorChannel::HslLightness
-                    },
-                    ()
+                (
+                    color_slider(
+                        ColorSliderProps {
+                            value: 0.5,
+                            channel: ColorChannel::HslLightness
+                        },
+                        ()
+                    ),
+                    observe(
+                        |change: On<ValueChange<f32>>, mut color: ResMut<DemoWidgetStates>| {
+                            color.hsl_color.lightness = change.value;
+                        },
+                    )
                 )
             ]
         ),],
diff --git a/examples/ui/standard_widgets.rs b/examples/ui/standard_widgets.rs
index 2de706979250d..a8a0db1d05db1 100644
--- a/examples/ui/standard_widgets.rs
+++ b/examples/ui/standard_widgets.rs
@@ -16,8 +16,9 @@ use bevy::{
     prelude::*,
     ui::{Checked, InteractionDisabled, Pressed},
     ui_widgets::{
-        Activate, Button, Callback, Checkbox, CoreSliderDragState, RadioButton, RadioGroup, Slider,
-        SliderRange, SliderThumb, SliderValue, TrackClick, UiWidgetsPlugins, ValueChange,
+        checkbox_self_update, observe, Activate, Button, Checkbox, CoreSliderDragState,
+        RadioButton, RadioGroup, Slider, SliderRange, SliderThumb, SliderValue, TrackClick,
+        UiWidgetsPlugins, ValueChange,
     },
 };
 
@@ -121,46 +122,12 @@ fn update_widget_values(
 }
 
 fn setup(mut commands: Commands, assets: Res<AssetServer>) {
-    // System to print a value when the button is clicked.
-    let on_click = commands.register_system(|_: In<Activate>| {
-        info!("Button clicked!");
-    });
-
-    // System to update a resource when the slider value changes. Note that we could have
-    // updated the slider value directly, but we want to demonstrate externalizing the state.
-    let on_change_value = commands.register_system(
-        |value: In<ValueChange<f32>>, mut widget_states: ResMut<DemoWidgetStates>| {
-            widget_states.slider_value = value.0.value;
-        },
-    );
-
-    // System to update a resource when the radio group changes.
-    let on_change_radio = commands.register_system(
-        |value: In<Activate>,
-         mut widget_states: ResMut<DemoWidgetStates>,
-         q_radios: Query<&DemoRadio>| {
-            if let Ok(radio) = q_radios.get(value.0 .0) {
-                widget_states.slider_click = radio.0;
-            }
-        },
-    );
-
     // ui camera
     commands.spawn(Camera2d);
-    commands.spawn(demo_root(
-        &assets,
-        Callback::System(on_click),
-        Callback::System(on_change_value),
-        Callback::System(on_change_radio),
-    ));
+    commands.spawn(demo_root(&assets));
 }
 
-fn demo_root(
-    asset_server: &AssetServer,
-    on_click: Callback<In<Activate>>,
-    on_change_value: Callback<In<ValueChange<f32>>>,
-    on_change_radio: Callback<In<Activate>>,
-) -> impl Bundle {
+fn demo_root(asset_server: &AssetServer) -> impl Bundle {
     (
         Node {
             width: percent(100),
@@ -174,16 +141,43 @@ fn demo_root(
         },
         TabGroup::default(),
         children![
-            button(asset_server, on_click),
-            slider(0.0, 100.0, 50.0, on_change_value),
-            checkbox(asset_server, "Checkbox", Callback::Ignore),
-            radio_group(asset_server, on_change_radio),
+            (
+                button(asset_server),
+                observe(|_activate: On<Activate>| {
+                    info!("Button clicked!");
+                }),
+            ),
+            (
+                slider(0.0, 100.0, 50.0),
+                observe(
+                    |value_change: On<ValueChange<f32>>,
+                     mut widget_states: ResMut<DemoWidgetStates>| {
+                        widget_states.slider_value = value_change.value;
+                    },
+                )
+            ),
+            (
+                checkbox(asset_server, "Checkbox"),
+                observe(checkbox_self_update)
+            ),
+            (
+                radio_group(asset_server),
+                observe(
+                    |value_change: On<ValueChange<Entity>>,
+                     mut widget_states: ResMut<DemoWidgetStates>,
+                     q_radios: Query<&DemoRadio>| {
+                        if let Ok(radio) = q_radios.get(value_change.value) {
+                            widget_states.slider_click = radio.0;
+                        }
+                    },
+                )
+            ),
             Text::new("Press 'D' to toggle widget disabled states"),
         ],
     )
 }
 
-fn button(asset_server: &AssetServer, on_click: Callback<In<Activate>>) -> impl Bundle {
+fn button(asset_server: &AssetServer) -> impl Bundle {
     (
         Node {
             width: px(150),
@@ -194,9 +188,7 @@ fn button(asset_server: &AssetServer, on_click: Callback<In<Activate>>) -> impl
             ..default()
         },
         DemoButton,
-        Button {
-            on_activate: on_click,
-        },
+        Button,
         Hovered::default(),
         TabIndex(0),
         BorderColor::all(Color::BLACK),
@@ -326,12 +318,7 @@ fn set_button_style(
 }
 
 /// Create a demo slider
-fn slider(
-    min: f32,
-    max: f32,
-    value: f32,
-    on_change: Callback<In<ValueChange<f32>>>,
-) -> impl Bundle {
+fn slider(min: f32, max: f32, value: f32) -> impl Bundle {
     (
         Node {
             display: Display::Flex,
@@ -348,7 +335,6 @@ fn slider(
         Hovered::default(),
         DemoSlider,
         Slider {
-            on_change,
             track_click: TrackClick::Snap,
         },
         SliderValue(value),
@@ -473,11 +459,7 @@ fn thumb_color(disabled: bool, hovered: bool) -> Color {
 }
 
 /// Create a demo checkbox
-fn checkbox(
-    asset_server: &AssetServer,
-    caption: &str,
-    on_change: Callback<In<ValueChange<bool>>>,
-) -> impl Bundle {
+fn checkbox(asset_server: &AssetServer, caption: &str) -> impl Bundle {
     (
         Node {
             display: Display::Flex,
@@ -491,7 +473,7 @@ fn checkbox(
         Name::new("Checkbox"),
         Hovered::default(),
         DemoCheckbox,
-        Checkbox { on_change },
+        Checkbox,
         TabIndex(0),
         Children::spawn((
             Spawn((
@@ -669,7 +651,7 @@ fn set_checkbox_or_radio_style(
 }
 
 /// Create a demo radio group
-fn radio_group(asset_server: &AssetServer, on_change: Callback<In<Activate>>) -> impl Bundle {
+fn radio_group(asset_server: &AssetServer) -> impl Bundle {
     (
         Node {
             display: Display::Flex,
@@ -679,7 +661,7 @@ fn radio_group(asset_server: &AssetServer, on_change: Callback<In<Activate>>) ->
             ..default()
         },
         Name::new("RadioGroup"),
-        RadioGroup { on_change },
+        RadioGroup,
         TabIndex::default(),
         children![
             (radio(asset_server, TrackClick::Drag, "Slider Drag"),),
diff --git a/examples/ui/standard_widgets_observers.rs b/examples/ui/standard_widgets_observers.rs
index 71001317812e9..07a3bbda1fc0e 100644
--- a/examples/ui/standard_widgets_observers.rs
+++ b/examples/ui/standard_widgets_observers.rs
@@ -6,7 +6,6 @@
 
 use bevy::{
     color::palettes::basic::*,
-    ecs::system::SystemId,
     input_focus::{
         tab_navigation::{TabGroup, TabIndex, TabNavigationPlugin},
         InputDispatchPlugin,
@@ -16,8 +15,8 @@ use bevy::{
     reflect::Is,
     ui::{Checked, InteractionDisabled, Pressed},
     ui_widgets::{
-        Activate, Button, Callback, Checkbox, Slider, SliderRange, SliderThumb, SliderValue,
-        UiWidgetsPlugins, ValueChange,
+        checkbox_self_update, observe, Activate, Button, Checkbox, Slider, SliderRange,
+        SliderThumb, SliderValue, UiWidgetsPlugins, ValueChange,
     },
 };
 
@@ -86,29 +85,12 @@ struct DemoWidgetStates {
 }
 
 fn setup(mut commands: Commands, assets: Res<AssetServer>) {
-    // System to print a value when the button is clicked.
-    let on_click = commands.register_system(|_: In<Activate>| {
-        info!("Button clicked!");
-    });
-
-    // System to update a resource when the slider value changes. Note that we could have
-    // updated the slider value directly, but we want to demonstrate externalizing the state.
-    let on_change_value = commands.register_system(
-        |value: In<ValueChange<f32>>, mut widget_states: ResMut<DemoWidgetStates>| {
-            widget_states.slider_value = value.0.value;
-        },
-    );
-
     // ui camera
     commands.spawn(Camera2d);
-    commands.spawn(demo_root(&assets, on_click, on_change_value));
+    commands.spawn(demo_root(&assets));
 }
 
-fn demo_root(
-    asset_server: &AssetServer,
-    on_click: SystemId<In<Activate>>,
-    on_change_value: SystemId<In<ValueChange<f32>>>,
-) -> impl Bundle {
+fn demo_root(asset_server: &AssetServer) -> impl Bundle {
     (
         Node {
             width: percent(100),
@@ -122,15 +104,31 @@ fn demo_root(
         },
         TabGroup::default(),
         children![
-            button(asset_server, Callback::System(on_click)),
-            slider(0.0, 100.0, 50.0, Callback::System(on_change_value)),
-            checkbox(asset_server, "Checkbox", Callback::Ignore),
+            (
+                button(asset_server),
+                observe(|_activate: On<Activate>| {
+                    info!("Button clicked!");
+                }),
+            ),
+            (
+                slider(0.0, 100.0, 50.0),
+                observe(
+                    |value_change: On<ValueChange<f32>>,
+                     mut widget_states: ResMut<DemoWidgetStates>| {
+                        widget_states.slider_value = value_change.value;
+                    },
+                )
+            ),
+            (
+                checkbox(asset_server, "Checkbox"),
+                observe(checkbox_self_update),
+            ),
             Text::new("Press 'D' to toggle widget disabled states"),
         ],
     )
 }
 
-fn button(asset_server: &AssetServer, on_click: Callback<In<Activate>>) -> impl Bundle {
+fn button(asset_server: &AssetServer) -> impl Bundle {
     (
         Node {
             width: px(150),
@@ -141,9 +139,7 @@ fn button(asset_server: &AssetServer, on_click: Callback<In<Activate>>) -> impl
             ..default()
         },
         DemoButton,
-        Button {
-            on_activate: on_click,
-        },
+        Button,
         Hovered::default(),
         TabIndex(0),
         BorderColor::all(Color::BLACK),
@@ -224,12 +220,7 @@ fn button_on_interaction<E: EntityEvent, C: Component>(
 }
 
 /// Create a demo slider
-fn slider(
-    min: f32,
-    max: f32,
-    value: f32,
-    on_change: Callback<In<ValueChange<f32>>>,
-) -> impl Bundle {
+fn slider(min: f32, max: f32, value: f32) -> impl Bundle {
     (
         Node {
             display: Display::Flex,
@@ -245,10 +236,7 @@ fn slider(
         Name::new("Slider"),
         Hovered::default(),
         DemoSlider,
-        Slider {
-            on_change,
-            ..default()
-        },
+        Slider::default(),
         SliderValue(value),
         SliderRange::new(min, max),
         TabIndex(0),
@@ -344,11 +332,7 @@ fn thumb_color(disabled: bool, hovered: bool) -> Color {
 }
 
 /// Create a demo checkbox
-fn checkbox(
-    asset_server: &AssetServer,
-    caption: &str,
-    on_change: Callback<In<ValueChange<bool>>>,
-) -> impl Bundle {
+fn checkbox(asset_server: &AssetServer, caption: &str) -> impl Bundle {
     (
         Node {
             display: Display::Flex,
@@ -362,7 +346,7 @@ fn checkbox(
         Name::new("Checkbox"),
         Hovered::default(),
         DemoCheckbox,
-        Checkbox { on_change },
+        Checkbox,
         TabIndex(0),
         Children::spawn((
             Spawn((
diff --git a/examples/ui/virtual_keyboard.rs b/examples/ui/virtual_keyboard.rs
index fe241ec5b916b..e423adc1737bc 100644
--- a/examples/ui/virtual_keyboard.rs
+++ b/examples/ui/virtual_keyboard.rs
@@ -2,12 +2,14 @@
 
 use bevy::{
     color::palettes::css::NAVY,
-    ecs::relationship::RelatedSpawnerCommands,
     feathers::{
-        controls::virtual_keyboard, dark_theme::create_dark_theme, theme::UiTheme, FeathersPlugins,
+        controls::{virtual_keyboard, VirtualKeyPressed},
+        dark_theme::create_dark_theme,
+        theme::UiTheme,
+        FeathersPlugins,
     },
     prelude::*,
-    ui_widgets::Activate,
+    ui_widgets::observe,
 };
 
 fn main() {
@@ -18,22 +20,13 @@ fn main() {
         .run();
 }
 
-#[derive(Component)]
-struct VirtualKey(String);
-
-fn on_virtual_key_pressed(
-    In(Activate(virtual_key_entity)): In<Activate>,
-    virtual_key_query: Query<&VirtualKey>,
-) {
-    if let Ok(VirtualKey(label)) = virtual_key_query.get(virtual_key_entity) {
-        println!("key pressed: {label}");
-    }
+fn on_virtual_key_pressed(virtual_key_pressed: On<VirtualKeyPressed<&'static str>>) {
+    println!("key pressed: {}", virtual_key_pressed.key);
 }
 
 fn setup(mut commands: Commands) {
     // ui camera
     commands.spawn(Camera2d);
-    let callback = commands.register_system(on_virtual_key_pressed);
 
     let layout = [
         vec!["1", "2", "3", "4", "5", "6", "7", "8", "9", "0", ".", ","],
@@ -44,42 +37,34 @@ fn setup(mut commands: Commands) {
         vec!["left", "right", "up", "down", "home", "end"],
     ];
 
-    let keys_iter = layout.into_iter().map(|row| {
-        row.into_iter()
-            .map(|label| {
-                let label_string = label.to_string();
-                (label_string.clone(), VirtualKey(label_string))
-            })
-            .collect()
-    });
-
-    commands
-        .spawn(Node {
+    commands.spawn((
+        Node {
             width: percent(100),
             height: percent(100),
             align_items: AlignItems::End,
             justify_content: JustifyContent::Center,
             ..default()
-        })
-        .with_children(|parent: &mut RelatedSpawnerCommands<ChildOf>| {
-            parent
-                .spawn((
-                    Node {
-                        flex_direction: FlexDirection::Column,
-                        border: px(5).into(),
-                        row_gap: px(5),
-                        padding: px(5).into(),
-                        align_items: AlignItems::Center,
-                        margin: px(25).into(),
-                        ..Default::default()
-                    },
-                    BackgroundColor(NAVY.into()),
-                    BorderColor::all(Color::WHITE),
-                    BorderRadius::all(px(10)),
-                ))
-                .with_children(|parent: &mut RelatedSpawnerCommands<ChildOf>| {
-                    parent.spawn(Text::new("virtual keyboard"));
-                    parent.spawn(virtual_keyboard(keys_iter, callback));
-                });
-        });
+        },
+        children![(
+            Node {
+                flex_direction: FlexDirection::Column,
+                border: px(5).into(),
+                row_gap: px(5),
+                padding: px(5).into(),
+                align_items: AlignItems::Center,
+                margin: px(25).into(),
+                ..Default::default()
+            },
+            BackgroundColor(NAVY.into()),
+            BorderColor::all(Color::WHITE),
+            BorderRadius::all(px(10)),
+            children![
+                Text::new("virtual keyboard"),
+                (
+                    virtual_keyboard(layout.into_iter()),
+                    observe(on_virtual_key_pressed)
+                )
+            ]
+        )],
+    ));
 }