Struct MutableVec 

pub struct MutableVec<T> { /* private fields */ }

Wrapper around a Vec that emits mutations as VecDiffs, enabling diff-less constant-time reactive updates for downstream SignalVecs.

Implementations

impl<T> MutableVec<T>

pub fn read<'s>( &self, mutable_vec_data_reader: impl ReadMutableVecData<'s, T>, ) -> MutableVecReadGuard<'s, T>

where T: SSs,

Provides read-only access to the underlying Vec via either a &World or a &Query<MutableVecData<T>>.

pub fn write<'w>( &self, mutable_vec_data_writer: impl WriteMutableVecData<'w, T>, ) -> MutableVecWriteGuard<'w, T>

where T: SSs,

Provides write access to the underlying Vec via either a &mut World or a &mut Query<&mut MutableVecData<T>>.

Examples found in repository

examples/test.rs (line 144)

fn hotkeys(
    keys: Res<ButtonInput<KeyCode>>,
    numbers: ResMut<Numbers>,
    mut mutable_vec_datas: Query<&mut MutableVecData<i32>>,
) {
    let mut guard = numbers.0.write(&mut mutable_vec_datas);
    if keys.just_pressed(KeyCode::Equal) {
        guard.push((guard.len() + 1) as i32);
    } else if keys.just_pressed(KeyCode::Minus) {
        guard.pop();
    }
}

examples/filters.rs (line 119)

fn ui(items: MutableVec<Data>, rows: MutableVec<()>) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        height: Val::Percent(100.),
        width: Val::Percent(100.),
        ..default()
    })
    .child(
        JonmoBuilder::from(Node {
            flex_direction: FlexDirection::Column,
            align_self: AlignSelf::Start,
            justify_self: JustifySelf::Start,
            row_gap: Val::Px(GAP * 2.),
            padding: UiRect::all(Val::Px(GAP * 4.)),
            ..default()
        })
        .child(
            JonmoBuilder::from((Node {
                flex_direction: FlexDirection::Row,
                align_items: AlignItems::Center,
                column_gap: Val::Px(GAP * 2.),
                ..default()
            },))
            .child(JonmoBuilder::from((
                Node::default(),
                Text::new("source"),
                TextColor(Color::WHITE),
                TextFont::from_font_size(30.),
                TextLayout::new_with_justify(JustifyText::Center),
            )))
            .child(button("+", -2.).apply(on_click(
                |_: Trigger<Pointer<Click>>,
                 datas: Res<Datas>,
                 mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    datas.0.write(&mut mutable_vec_datas).insert(0, random_data());
                },
            )))
            .child(
                JonmoBuilder::from(Node {
                    flex_direction: FlexDirection::Row,
                    align_items: AlignItems::Center,
                    column_gap: Val::Px(GAP),
                    ..default()
                })
                .children_signal_vec(
                    items
                        .signal_vec()
                        .enumerate()
                        .map_in(|(index, data)| item(index.dedupe(), data)),
                ),
            ),
        )
        .children_signal_vec(
            rows.signal_vec()
                .enumerate()
                .map_in(clone!((items) move |(index, _)| row(index.dedupe(), items.clone()))),
        )
        .child(
            JonmoBuilder::from((
                Node {
                    height: Val::Px(55.),
                    justify_content: JustifyContent::Center,
                    flex_direction: FlexDirection::Column,
                    ..default()
                },
                // BackgroundColor(Color::WHITE),
            ))
            .child(button("+", -2.).apply(on_click(
                |_: Trigger<Pointer<Click>>, rows: Res<Rows>, mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    rows.0.write(&mut mutable_vec_datas).push(());
                },
            ))),
        ),
    )
}

fn random_subset<T: Clone>(items: &[T]) -> Vec<T> {
    let mut rng = rand::rng();
    loop {
        let subset: Vec<T> = items
            .iter()
            .filter(|_| rng.random_bool(0.5)) // "Flip a coin" for each item
            .cloned() // Convert from `&&T` to `T`
            .collect();

        if !subset.is_empty() {
            // If we have at least one item, return the subset
            return subset;
        }
        // Otherwise, the loop continues and we try again
    }
}

fn random_number_filters() -> NumberFilters {
    NumberFilters(HashSet::from_iter(random_subset(&[Parity::Odd, Parity::Even])))
}

fn random_color_filters() -> ColorFilters {
    ColorFilters(HashSet::from_iter(random_subset(&[
        ColorEnum::Blue,
        ColorEnum::Pink,
        ColorEnum::White,
    ])))
}

fn random_shape_filters() -> ShapeFilters {
    ShapeFilters(HashSet::from_iter(random_subset(&[Shape::Square, Shape::Circle])))
}

fn maybe_insert_random_sorted(builder: JonmoBuilder) -> JonmoBuilder {
    let mut rng = rand::rng();
    if rng.random_bool(0.5) {
        builder.insert(Sorted)
    } else {
        builder
    }
}

fn text_node(text: &'static str) -> JonmoBuilder {
    JonmoBuilder::from((
        Node::default(),
        Text::new(text),
        TextColor(Color::WHITE),
        TextLayout::new_with_justify(JustifyText::Center),
        BorderRadius::all(Val::Px(GAP)),
    ))
}

fn toggle<T: Eq + core::hash::Hash>(set: &mut HashSet<T>, value: T) {
    if !set.remove(&value) {
        set.insert(value);
    }
}

fn on_click<M>(
    on_click: impl IntoObserverSystem<Pointer<Click>, (), M> + SSs,
) -> impl FnOnce(JonmoBuilder) -> JonmoBuilder {
    move |builder: JonmoBuilder| {
        builder.on_spawn(move |world, entity| {
            world.entity_mut(entity).observe(on_click);
        })
    }
}

fn outline() -> Outline {
    Outline {
        width: Val::Px(1.),
        ..default()
    }
}

fn number_toggle(row_parent: LazyEntity, parity: Parity) -> impl Fn(JonmoBuilder) -> JonmoBuilder {
    move |builder| {
        builder
            .apply(on_click(
                clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut number_filters: Query<&mut NumberFilters>| {
                    toggle(&mut number_filters.get_mut(row_parent.get()).unwrap().0, parity);
                }),
            ))
            .component_signal(
                SignalBuilder::from_component_lazy(row_parent.clone())
                    .dedupe()
                    .map_in(move |NumberFilters(filters)| filters.contains(&parity))
                    .dedupe()
                    .map_true(|_: In<()>| outline()),
            )
    }
}

fn number_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        row_gap: Val::Px(2.),
        ..default()
    })
    .child(
        text_node("even")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(number_toggle(row_parent.clone(), Parity::Even)),
    )
    .child(
        text_node("odd")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(number_toggle(row_parent.clone(), Parity::Odd)),
    )
    .child(
        text_node("sort")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(on_click(
                clone!((row_parent) move |_: Trigger<Pointer<Click>>, world: &mut World| {
                    let mut entity = world.entity_mut(row_parent.get());
                    if entity.take::<Sorted>().is_none() { entity.insert(Sorted); }
                }),
            ))
            .component_signal(
                SignalBuilder::from_lazy_entity(row_parent.clone())
                    .has_component::<Sorted>()
                    .dedupe()
                    .map_true(|_: In<()>| outline()),
            ),
    )
}

fn shape_toggle(row_parent: LazyEntity, shape: Shape) -> JonmoBuilder {
    JonmoBuilder::from((
        Node {
            width: Val::Px(20.),
            height: Val::Px(20.),
            ..default()
        },
        BackgroundColor(bevy::color::palettes::basic::GRAY.into()),
    ))
    .apply(on_click(
        clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut shape_filters: Query<&mut ShapeFilters>| {
            toggle(&mut shape_filters.get_mut(row_parent.get()).unwrap().0, shape);
        }),
    ))
    .component_signal(
        SignalBuilder::from_component_lazy(row_parent.clone())
            .dedupe()
            .map_in(move |ShapeFilters(filters)| filters.contains(&shape))
            .dedupe()
            .map_true(|_: In<()>| outline()),
    )
}

fn shape_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(GAP),
        ..default()
    })
    .child(shape_toggle(row_parent.clone(), Shape::Square))
    .child(shape_toggle(row_parent.clone(), Shape::Circle).insert(BorderRadius::MAX))
}

fn color_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(GAP),
        ..default()
    })
    .children(
        [ColorEnum::Blue, ColorEnum::Pink, ColorEnum::White]
            .into_iter()
            .map(move |color| {
                JonmoBuilder::from((
                    Node {
                        width: Val::Px(15.),
                        height: Val::Px(15.),
                        border: UiRect::all(Val::Px(1.)),
                        ..default()
                    },
                    BorderRadius::all(Val::Px(GAP)),
                    BackgroundColor(color.into()),
                    BorderColor(Color::BLACK),
                ))
                .apply(on_click(
                    clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut color_filters: Query<&mut ColorFilters>| {
                        toggle(&mut color_filters.get_mut(row_parent.get()).unwrap().0, color);
                    }),
                ))
                .component_signal(
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |ColorFilters(filters)| filters.contains(&color))
                        .dedupe()
                        .map_true(|_: In<()>| outline()),
                )
            }),
    )
}

fn button(text: &'static str, offset: f32) -> JonmoBuilder {
    JonmoBuilder::from((
        Node {
            width: Val::Px((ITEM_SIZE / 2) as f32),
            height: Val::Px((ITEM_SIZE / 2) as f32),
            justify_content: JustifyContent::Center,
            border: UiRect::all(Val::Px(1.)),
            ..default()
        },
        BackgroundColor(bevy::color::palettes::basic::GRAY.into()),
        BorderColor(Color::WHITE),
        BorderRadius::all(Val::Px(GAP)),
    ))
    .child(
        text_node(text)
            .with_component::<Node>(move |mut node| node.top = Val::Px(offset))
            .insert(TextFont::from_font_size(24.)),
    )
}

#[derive(Component, Clone)]
struct Index(usize);

fn row(index: impl Signal<Item = Option<usize>>, items: MutableVec<Data>) -> JonmoBuilder {
    let row_parent = LazyEntity::new();
    JonmoBuilder::from((
        Node {
            flex_direction: FlexDirection::Row,
            align_items: AlignItems::Center,
            column_gap: Val::Px(GAP * 2.),
            ..default()
        },
        random_number_filters(),
        random_color_filters(),
        random_shape_filters(),
    ))
    .apply(maybe_insert_random_sorted)
    .entity_sync(row_parent.clone())
    .child(
        button("-", -3.)
            .component_signal(index.map_in(|index| index.map(Index)))
            .apply(on_click(
                |click: Trigger<Pointer<Click>>,
                 rows: Res<Rows>,
                 indices: Query<&Index>,
                 mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    if let Ok(&Index(index)) = indices.get(click.target()) {
                        rows.0.write(&mut mutable_vec_datas).remove(index);
                    }
                },
            )),
    )
    .child(
        JonmoBuilder::from((Node {
            flex_direction: FlexDirection::Row,
            width: Val::Px(108.),
            height: Val::Percent(100.),
            column_gap: Val::Px(GAP * 2.),
            justify_content: JustifyContent::Center,
            ..default()
        },))
        .child(number_toggles(row_parent.clone()))
        .child(shape_toggles(row_parent.clone()))
        .child(color_toggles(row_parent.clone())),
    )
    .child(
        JonmoBuilder::from((Node {
            flex_direction: FlexDirection::Row,
            align_items: AlignItems::Center,
            column_gap: Val::Px(GAP),
            ..default()
        },))
        .children_signal_vec(
            SignalBuilder::from_lazy_entity(row_parent.clone())
                .has_component::<Sorted>()
                .dedupe()
                .switch_signal_vec(move |In(sorted)| {
                    let base = items.signal_vec().enumerate();
                    if sorted {
                        base.sort_by_key(|In((_, Data { number, .. }))| number).left_either()
                    } else {
                        base.right_either()
                    }
                })
                .filter_signal(clone!((row_parent) move | In((_, Data { number, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |number_filters: NumberFilters| {
                            number_filters.0.contains(&if number.is_multiple_of(2) {
                                Parity::Even
                            } else {
                                Parity::Odd
                            })
                        })
                        .dedupe()
                }))
                .filter_signal(clone!((row_parent) move | In((_, Data { shape, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |shape_filters: ShapeFilters| shape_filters.0.contains(&shape))
                        .dedupe()
                }))
                .filter_signal(clone!((row_parent) move | In((_, Data { color, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |color_filters: ColorFilters| color_filters.0.contains(&color))
                        .dedupe()
                }))
                .map_in(|(index, data)| item(index.dedupe(), data)),
        ),
    )
}

const ITEM_SIZE: u32 = 50;

#[derive(Clone, Copy, PartialEq, Eq, Hash, Debug)]
enum Shape {
    Square,
    Circle,
}

#[derive(Clone, Copy, PartialEq, Hash, Eq, Debug)]
enum Parity {
    Even,
    Odd,
}

fn item(index: impl Signal<Item = Option<usize>>, Data { number, color, shape }: Data) -> JonmoBuilder {
    JonmoBuilder::from((
        Node {
            height: Val::Px(ITEM_SIZE as f32),
            width: Val::Px(ITEM_SIZE as f32),
            align_items: AlignItems::Center,
            justify_content: JustifyContent::Center,
            ..default()
        },
        BackgroundColor(color.into()),
        match shape {
            Shape::Square => BorderRadius::default(),
            Shape::Circle => BorderRadius::MAX,
        },
    ))
    .component_signal(index.map_in(|index| index.map(Index)))
    .apply(on_click(
        |click: Trigger<Pointer<Click>>,
         datas: Res<Datas>,
         indices: Query<&Index>,
         mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
            if let Ok(&Index(index)) = indices.get(click.target()) {
                datas.0.write(&mut mutable_vec_datas).remove(index);
            }
        },
    ))
    .child((
        Node::default(),
        Text::new(number.to_string()),
        TextColor(Color::BLACK),
        TextLayout::new_with_justify(JustifyText::Center),
    ))
}

examples/lifetimes.rs (line 130)

fn ui_root(colors: impl SignalVec<Item = Color>) -> JonmoBuilder {
    // A standard vertical flexbox to hold our list items.
    JonmoBuilder::from(Node {
        height: Val::Percent(100.0),
        width: Val::Percent(100.0),
        flex_direction: FlexDirection::Column,
        align_items: AlignItems::Center,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(10.0),
        ..default()
    })
    // This is the core of the dynamic list.
    // `children_signal_vec` subscribes to a `SignalVec`. For each item in the
    // vector, it spawns a child entity using the `JonmoBuilder` returned by the closure.
    // It handles all diffs automatically: `Push` creates a new child, `RemoveAt`
    // despawns one, `Move` reorders them, etc.
    .children_signal_vec(
        // `.enumerate()` is a powerful combinator that transforms a `SignalVec<T>`
        // into a `SignalVec<(Signal<Option<usize>>, T)>`.
        // The first element of the tuple is a *new signal* that will always contain
        // the current index of that specific item, or `None` if it has been removed.
        // This is crucial for displaying the index or for actions like removing a specific item.
        colors.enumerate().map_in(|(index, color)| item(index.dedupe(), color)),
    )
    .child(
        JonmoBuilder::from((
            Node {
                height: Val::Px(40.),
                width: Val::Px(100.),
                align_items: AlignItems::Center,
                justify_content: JustifyContent::Center,
                ..default()
            },
            BackgroundColor(bevy::color::palettes::basic::GREEN.into()),
        ))
        // `on_spawn` runs a closure with access to the `World` and the spawned `Entity`
        // just after the entity is created. This is a good place to set up observers or
        // other one-time logic.
        .on_spawn(|world, entity| {
            // `observe` is a Bevy event-handling pattern. Here, we're setting up this
            // button entity to listen for a `Click` event.
            world.entity_mut(entity).observe(
                // This closure is the event handler that runs when the button is clicked.
                move |_: Trigger<Pointer<Click>>,
                      colors: Res<Colors>,
                      mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    // Try to get the `Index` component from the clicked entity.
                    // We found the index! Now we can mutate the central data source.
                    // `colors.0.write()` gets a write lock on the `MutableVec`.
                    let mut guard = colors.0.write(&mut mutable_vec_datas);
                    guard.insert(guard.len(), random_color());
                },
            );
        })
        .child(JonmoBuilder::from((
            Node::default(),
            Text::new("+"),
            TextColor(Color::WHITE),
            TextLayout::new_with_justify(JustifyText::Center),
        ))),
    )
}

/// A component to hold the index of a list item. This is inserted onto the
/// "remove" button so that when it's clicked, we know which item in the
/// `MutableVec` to remove.
#[derive(Component, Clone)]
struct Index(usize);

/// Constructs a `JonmoBuilder` for a single item in our list.
///
/// # Arguments
/// * `index` - A `Signal<Item = Option<usize>>` that provides the current index of this item. This
///   signal is provided by the `.enumerate()` call in `ui_root`.
/// * `color` - The `Color` for this specific item.
fn item(index: impl Signal<Item = Option<usize>> + Clone, color: Color) -> JonmoBuilder {
    // --- The LazyEntity Pattern ---
    // `LazyEntity` is a thread-safe, clone-able handle to an `Entity` that can be
    // created *before* the entity is spawned.
    // We need this because we want to create a signal for the text display that *reads*
    // the `Lifetime` component from its own parent entity. When we define the text signal,
    // the parent entity doesn't exist yet. `LazyEntity` acts as a promise that will be
    // fulfilled later.
    let lifetime_holder = LazyEntity::new();

    JonmoBuilder::from((
        Node {
            height: Val::Px(40.0),
            width: Val::Px(350.0),
            align_items: AlignItems::Center,
            flex_direction: FlexDirection::Row,
            column_gap: Val::Px(10.0),
            ..default()
        },
        // Each item gets its own `Lifetime` component, which will be updated by the `live` system.
        Lifetime::default(),
    ))
    // Here we fulfill the promise. `entity_sync` will set the `Entity` id into the
    // `lifetime_holder` once this `JonmoBuilder` is spawned into an actual entity.
    // Any signals that were created using `lifetime_holder` will now point to the correct entity.
    .entity_sync(lifetime_holder.clone())
    .child({
        // The main info panel for the item.
        JonmoBuilder::from((
            Node {
                height: Val::Percent(100.),
                width: Val::Percent(90.),
                align_items: AlignItems::Center,
                justify_content: JustifyContent::Center,
                ..default()
            },
            BackgroundColor(color),
        ))
        .child(
            // This `JonmoBuilder` will hold the text. Bevy UI text is composed of `TextSection`s,
            // which are children of a `Text` entity. We use `JonmoBuilder`'s child methods to
            // construct these sections reactively.
            JonmoBuilder::from((
                Node::default(),
                // Start with a `Text` component with no sections. We'll add them as children.
                Text::new(""),
                TextColor(Color::BLACK), // Default color, can be overridden by children.
                TextLayout::new_with_justify(JustifyText::Center),
            ))
            // Child 1: A static text span.
            .child((TextColor(Color::BLACK), TextSpan::new("item ")))
            // Child 2: A reactive text span for the index.
            .child(
                JonmoBuilder::from(TextColor(Color::BLACK)).component_signal(
                    // `component_signal` takes a signal and uses its output to insert/update a component.
                    index
                        .clone()
                        .map_in(|index| index.as_ref().map(ToString::to_string).map(TextSpan)),
                ),
            )
            // Child 3: Another static text span.
            .child((TextColor(Color::BLACK), TextSpan::new(" | lifetime: ")))
            // Child 4: A reactive text span for the lifetime.
            .child(
                JonmoBuilder::from(TextColor(Color::BLACK)).component_signal(
                    // This is where the `LazyEntity` becomes powerful.
                    // We create a signal that reads a component from the entity that `lifetime_holder` will eventually
                    // point to.
                    SignalBuilder::from_component_lazy(lifetime_holder)
                        // Map the `Lifetime` component to its inner `f32` value and round it.
                        .map_in(|Lifetime(lifetime)| lifetime.round())
                        // `dedupe` is a crucial optimization. It ensures the rest of the signal chain only runs
                        // when the rounded lifetime value actually changes (once per second in this case),
                        // not on every single frame.
                        .dedupe()
                        // Convert the rounded `f32` to a `String`.
                        .map_in_ref(ToString::to_string)
                        // Wrap it in a `TextSpan` component for display.
                        .map_in(TextSpan)
                        .map_in(Some),
                ),
            ),
        )
    })
    // Add the "remove" button as a child of the item row.
    .child(
        JonmoBuilder::from((
            Node {
                height: Val::Percent(100.),
                width: Val::Percent(10.),
                align_items: AlignItems::Center,
                justify_content: JustifyContent::Center,
                ..default()
            },
            // Using a color from Bevy's built-in palette for the button.
            BackgroundColor(bevy::color::palettes::basic::RED.into()),
        ))
        // `on_spawn` runs a closure with access to the `World` and the spawned `Entity`
        // just after the entity is created. This is a good place to set up observers or
        // other one-time logic.
        .on_spawn(|world, entity| {
            // `observe` is a Bevy event-handling pattern. Here, we're setting up this
            // button entity to listen for a `Click` event.
            world.entity_mut(entity).observe(
                // This closure is the event handler that runs when the button is clicked.
                move |_: Trigger<Pointer<Click>>,
                      indices: Query<&Index>,
                      colors: Res<Colors>,
                      mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    // Try to get the `Index` component from the clicked entity.
                    if let Ok(&Index(index)) = indices.get(entity) {
                        // We found the index! Now we can mutate the central data source.
                        // `colors.0.write()` gets a write lock on the `MutableVec`.
                        colors.0.write(&mut mutable_vec_datas).remove(index);
                    }
                },
            );
        })
        // To make the observer work, the button entity needs to *have* an `Index` component.
        // We use `component_signal` again to reactively insert the `Index` component,
        // driven by the same `index` signal we used for the display text.
        .component_signal(index.map_in(|index| index.map(Index)))
        .child(JonmoBuilder::from((
            Node::default(),
            Text::new("x"),
            TextColor(Color::WHITE),
            TextLayout::new_with_justify(JustifyText::Center),
        ))),
    )
}

pub fn signal_vec(&self) -> Source<T>

where T: Clone + SSs,

Returns a Source signal from this MutableVec.

Examples found in repository

examples/lifetimes.rs (line 48)

fn main() {
    let mut app = App::new();
    let world = app.world_mut();
    // 1. --- DATA SOURCE SETUP ---
    // `MutableVec` is the core reactive data source for lists in `jonmo`.
    // We initialize it with two random colors.
    // It's wrapped in an `Arc<RwLock<...>>` internally, so cloning it is cheap
    // and allows multiple systems to access and modify the same data.
    let colors = MutableVecBuilder::from([random_color(), random_color()]).spawn(world);

    app.add_plugins(examples_plugin)
        // 2. --- RESOURCE MANAGEMENT ---
        // We insert a clone of our `MutableVec` into a Bevy resource. This makes it
        // accessible to any system that needs to read or modify the list of colors,
        // such as our `hotkeys` system or the remove button's `observe` system.
        .insert_resource(Colors(colors.clone()))
        .add_systems(
            // We use `PostStartup` to ensure that Bevy's UI systems are initialized
            // before we try to spawn our UI.
            Startup,
            (
                // 3. --- UI SPAWNING ---
                // We move the `colors` `MutableVec` into a closure that will spawn the UI.
                // `colors.signal_vec()` creates a `SignalVec`, which is a stream of
                // changes (`VecDiff`s) that other parts of the UI can subscribe to.
                move |world: &mut World| {
                    ui_root(colors.signal_vec()).spawn(world);
                },
                camera,
            ),
        )
        // 4. --- UPDATE SYSTEMS ---
        // These systems run every frame.
        .add_systems(
            Update,
            (
                // The `live` system increments the lifetime of each list item.
                // It only runs if there is at least one entity with a `Lifetime` component.
                live.run_if(any_with_component::<Lifetime>),
            ),
        )
        .run();
}

examples/filters.rs (line 131)

fn ui(items: MutableVec<Data>, rows: MutableVec<()>) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        height: Val::Percent(100.),
        width: Val::Percent(100.),
        ..default()
    })
    .child(
        JonmoBuilder::from(Node {
            flex_direction: FlexDirection::Column,
            align_self: AlignSelf::Start,
            justify_self: JustifySelf::Start,
            row_gap: Val::Px(GAP * 2.),
            padding: UiRect::all(Val::Px(GAP * 4.)),
            ..default()
        })
        .child(
            JonmoBuilder::from((Node {
                flex_direction: FlexDirection::Row,
                align_items: AlignItems::Center,
                column_gap: Val::Px(GAP * 2.),
                ..default()
            },))
            .child(JonmoBuilder::from((
                Node::default(),
                Text::new("source"),
                TextColor(Color::WHITE),
                TextFont::from_font_size(30.),
                TextLayout::new_with_justify(JustifyText::Center),
            )))
            .child(button("+", -2.).apply(on_click(
                |_: Trigger<Pointer<Click>>,
                 datas: Res<Datas>,
                 mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    datas.0.write(&mut mutable_vec_datas).insert(0, random_data());
                },
            )))
            .child(
                JonmoBuilder::from(Node {
                    flex_direction: FlexDirection::Row,
                    align_items: AlignItems::Center,
                    column_gap: Val::Px(GAP),
                    ..default()
                })
                .children_signal_vec(
                    items
                        .signal_vec()
                        .enumerate()
                        .map_in(|(index, data)| item(index.dedupe(), data)),
                ),
            ),
        )
        .children_signal_vec(
            rows.signal_vec()
                .enumerate()
                .map_in(clone!((items) move |(index, _)| row(index.dedupe(), items.clone()))),
        )
        .child(
            JonmoBuilder::from((
                Node {
                    height: Val::Px(55.),
                    justify_content: JustifyContent::Center,
                    flex_direction: FlexDirection::Column,
                    ..default()
                },
                // BackgroundColor(Color::WHITE),
            ))
            .child(button("+", -2.).apply(on_click(
                |_: Trigger<Pointer<Click>>, rows: Res<Rows>, mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    rows.0.write(&mut mutable_vec_datas).push(());
                },
            ))),
        ),
    )
}

fn random_subset<T: Clone>(items: &[T]) -> Vec<T> {
    let mut rng = rand::rng();
    loop {
        let subset: Vec<T> = items
            .iter()
            .filter(|_| rng.random_bool(0.5)) // "Flip a coin" for each item
            .cloned() // Convert from `&&T` to `T`
            .collect();

        if !subset.is_empty() {
            // If we have at least one item, return the subset
            return subset;
        }
        // Otherwise, the loop continues and we try again
    }
}

fn random_number_filters() -> NumberFilters {
    NumberFilters(HashSet::from_iter(random_subset(&[Parity::Odd, Parity::Even])))
}

fn random_color_filters() -> ColorFilters {
    ColorFilters(HashSet::from_iter(random_subset(&[
        ColorEnum::Blue,
        ColorEnum::Pink,
        ColorEnum::White,
    ])))
}

fn random_shape_filters() -> ShapeFilters {
    ShapeFilters(HashSet::from_iter(random_subset(&[Shape::Square, Shape::Circle])))
}

fn maybe_insert_random_sorted(builder: JonmoBuilder) -> JonmoBuilder {
    let mut rng = rand::rng();
    if rng.random_bool(0.5) {
        builder.insert(Sorted)
    } else {
        builder
    }
}

fn text_node(text: &'static str) -> JonmoBuilder {
    JonmoBuilder::from((
        Node::default(),
        Text::new(text),
        TextColor(Color::WHITE),
        TextLayout::new_with_justify(JustifyText::Center),
        BorderRadius::all(Val::Px(GAP)),
    ))
}

fn toggle<T: Eq + core::hash::Hash>(set: &mut HashSet<T>, value: T) {
    if !set.remove(&value) {
        set.insert(value);
    }
}

fn on_click<M>(
    on_click: impl IntoObserverSystem<Pointer<Click>, (), M> + SSs,
) -> impl FnOnce(JonmoBuilder) -> JonmoBuilder {
    move |builder: JonmoBuilder| {
        builder.on_spawn(move |world, entity| {
            world.entity_mut(entity).observe(on_click);
        })
    }
}

fn outline() -> Outline {
    Outline {
        width: Val::Px(1.),
        ..default()
    }
}

fn number_toggle(row_parent: LazyEntity, parity: Parity) -> impl Fn(JonmoBuilder) -> JonmoBuilder {
    move |builder| {
        builder
            .apply(on_click(
                clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut number_filters: Query<&mut NumberFilters>| {
                    toggle(&mut number_filters.get_mut(row_parent.get()).unwrap().0, parity);
                }),
            ))
            .component_signal(
                SignalBuilder::from_component_lazy(row_parent.clone())
                    .dedupe()
                    .map_in(move |NumberFilters(filters)| filters.contains(&parity))
                    .dedupe()
                    .map_true(|_: In<()>| outline()),
            )
    }
}

fn number_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        row_gap: Val::Px(2.),
        ..default()
    })
    .child(
        text_node("even")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(number_toggle(row_parent.clone(), Parity::Even)),
    )
    .child(
        text_node("odd")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(number_toggle(row_parent.clone(), Parity::Odd)),
    )
    .child(
        text_node("sort")
            .insert(TextFont::from_font_size(13.))
            .insert(BackgroundColor(bevy::color::palettes::basic::GRAY.into()))
            .apply(on_click(
                clone!((row_parent) move |_: Trigger<Pointer<Click>>, world: &mut World| {
                    let mut entity = world.entity_mut(row_parent.get());
                    if entity.take::<Sorted>().is_none() { entity.insert(Sorted); }
                }),
            ))
            .component_signal(
                SignalBuilder::from_lazy_entity(row_parent.clone())
                    .has_component::<Sorted>()
                    .dedupe()
                    .map_true(|_: In<()>| outline()),
            ),
    )
}

fn shape_toggle(row_parent: LazyEntity, shape: Shape) -> JonmoBuilder {
    JonmoBuilder::from((
        Node {
            width: Val::Px(20.),
            height: Val::Px(20.),
            ..default()
        },
        BackgroundColor(bevy::color::palettes::basic::GRAY.into()),
    ))
    .apply(on_click(
        clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut shape_filters: Query<&mut ShapeFilters>| {
            toggle(&mut shape_filters.get_mut(row_parent.get()).unwrap().0, shape);
        }),
    ))
    .component_signal(
        SignalBuilder::from_component_lazy(row_parent.clone())
            .dedupe()
            .map_in(move |ShapeFilters(filters)| filters.contains(&shape))
            .dedupe()
            .map_true(|_: In<()>| outline()),
    )
}

fn shape_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(GAP),
        ..default()
    })
    .child(shape_toggle(row_parent.clone(), Shape::Square))
    .child(shape_toggle(row_parent.clone(), Shape::Circle).insert(BorderRadius::MAX))
}

fn color_toggles(row_parent: LazyEntity) -> JonmoBuilder {
    JonmoBuilder::from(Node {
        flex_direction: FlexDirection::Column,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(GAP),
        ..default()
    })
    .children(
        [ColorEnum::Blue, ColorEnum::Pink, ColorEnum::White]
            .into_iter()
            .map(move |color| {
                JonmoBuilder::from((
                    Node {
                        width: Val::Px(15.),
                        height: Val::Px(15.),
                        border: UiRect::all(Val::Px(1.)),
                        ..default()
                    },
                    BorderRadius::all(Val::Px(GAP)),
                    BackgroundColor(color.into()),
                    BorderColor(Color::BLACK),
                ))
                .apply(on_click(
                    clone!((row_parent) move |_: Trigger<Pointer<Click>>, mut color_filters: Query<&mut ColorFilters>| {
                        toggle(&mut color_filters.get_mut(row_parent.get()).unwrap().0, color);
                    }),
                ))
                .component_signal(
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |ColorFilters(filters)| filters.contains(&color))
                        .dedupe()
                        .map_true(|_: In<()>| outline()),
                )
            }),
    )
}

fn button(text: &'static str, offset: f32) -> JonmoBuilder {
    JonmoBuilder::from((
        Node {
            width: Val::Px((ITEM_SIZE / 2) as f32),
            height: Val::Px((ITEM_SIZE / 2) as f32),
            justify_content: JustifyContent::Center,
            border: UiRect::all(Val::Px(1.)),
            ..default()
        },
        BackgroundColor(bevy::color::palettes::basic::GRAY.into()),
        BorderColor(Color::WHITE),
        BorderRadius::all(Val::Px(GAP)),
    ))
    .child(
        text_node(text)
            .with_component::<Node>(move |mut node| node.top = Val::Px(offset))
            .insert(TextFont::from_font_size(24.)),
    )
}

#[derive(Component, Clone)]
struct Index(usize);

fn row(index: impl Signal<Item = Option<usize>>, items: MutableVec<Data>) -> JonmoBuilder {
    let row_parent = LazyEntity::new();
    JonmoBuilder::from((
        Node {
            flex_direction: FlexDirection::Row,
            align_items: AlignItems::Center,
            column_gap: Val::Px(GAP * 2.),
            ..default()
        },
        random_number_filters(),
        random_color_filters(),
        random_shape_filters(),
    ))
    .apply(maybe_insert_random_sorted)
    .entity_sync(row_parent.clone())
    .child(
        button("-", -3.)
            .component_signal(index.map_in(|index| index.map(Index)))
            .apply(on_click(
                |click: Trigger<Pointer<Click>>,
                 rows: Res<Rows>,
                 indices: Query<&Index>,
                 mut mutable_vec_datas: Query<&mut MutableVecData<_>>| {
                    if let Ok(&Index(index)) = indices.get(click.target()) {
                        rows.0.write(&mut mutable_vec_datas).remove(index);
                    }
                },
            )),
    )
    .child(
        JonmoBuilder::from((Node {
            flex_direction: FlexDirection::Row,
            width: Val::Px(108.),
            height: Val::Percent(100.),
            column_gap: Val::Px(GAP * 2.),
            justify_content: JustifyContent::Center,
            ..default()
        },))
        .child(number_toggles(row_parent.clone()))
        .child(shape_toggles(row_parent.clone()))
        .child(color_toggles(row_parent.clone())),
    )
    .child(
        JonmoBuilder::from((Node {
            flex_direction: FlexDirection::Row,
            align_items: AlignItems::Center,
            column_gap: Val::Px(GAP),
            ..default()
        },))
        .children_signal_vec(
            SignalBuilder::from_lazy_entity(row_parent.clone())
                .has_component::<Sorted>()
                .dedupe()
                .switch_signal_vec(move |In(sorted)| {
                    let base = items.signal_vec().enumerate();
                    if sorted {
                        base.sort_by_key(|In((_, Data { number, .. }))| number).left_either()
                    } else {
                        base.right_either()
                    }
                })
                .filter_signal(clone!((row_parent) move | In((_, Data { number, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |number_filters: NumberFilters| {
                            number_filters.0.contains(&if number.is_multiple_of(2) {
                                Parity::Even
                            } else {
                                Parity::Odd
                            })
                        })
                        .dedupe()
                }))
                .filter_signal(clone!((row_parent) move | In((_, Data { shape, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |shape_filters: ShapeFilters| shape_filters.0.contains(&shape))
                        .dedupe()
                }))
                .filter_signal(clone!((row_parent) move | In((_, Data { color, .. })) | {
                    SignalBuilder::from_component_lazy(row_parent.clone())
                        .dedupe()
                        .map_in(move |color_filters: ColorFilters| color_filters.0.contains(&color))
                        .dedupe()
                }))
                .map_in(|(index, data)| item(index.dedupe(), data)),
        ),
    )
}

examples/test.rs (line 36)

fn ui_root(numbers: MutableVec<i32>, world: &mut World) -> JonmoBuilder {
    let list_a = MutableVecBuilder::from([1, 2, 3, 4, 5]).spawn(world).signal_vec();
    let list_b = MutableVecBuilder::from([3, 4, 5]).spawn(world).signal_vec();
    let map = MutableBTreeMapBuilder::from([(1, 2), (2, 3)]).spawn(world);
    // map.signal_map().
    JonmoBuilder::from(Node {
        height: Val::Percent(100.0),
        width: Val::Percent(100.0),
        flex_direction: FlexDirection::Column,
        align_items: AlignItems::Center,
        justify_content: JustifyContent::Center,
        row_gap: Val::Px(10.0),
        ..default()
    })
    // .child_signal(numbers.clone().is_empty().map(|In(len)| item(len as u32)))
    .children_signal_vec(
        // MutableVec::from([numbers.signal_vec(), numbers.signal_vec()]).signal_vec()
        numbers
            .signal_vec()
            // SignalBuilder::from_system(|_: In<()>| 1)
            // SignalBuilder::from_system(|_: In<()>, toggle: Res<ToggleFilter>| toggle.0)
            // .dedupe()
            // .switch_signal_vec(move |In(toggle)| {
            //     if toggle {
            //         // println!("toggled to A");
            //         list_a.clone()
            //     } else {
            //         // println!("toggled to B");
            //         list_b.clone()
            //     }
            // })
            // .dedupe()
            // .to_signal_vec()
            .filter_signal(|In(n)| {
                SignalBuilder::from_system(move |_: In<()>, toggle: Res<ToggleFilter>| {
                    n % 2 == if toggle.0 { 0 } else { 1 }
                })
            })
            // .map_signal(|In(n): In<i32>| {
            //     SignalBuilder::from_system(move |_: In<()>| n + 1).dedupe()
            // })
            // .debug()
            // .map_in(|n: i32| -n)
            // .sort_by_cmp()
            // .flatten()
            // .chain(numbers)
            // .intersperse(0)
            // .sort_by(|In((left, right)): In<(i32, i32)>| left.cmp(&right).reverse())
            // .sort_by_key(|In(n): In<i32>| -n)
            // .intersperse_with(|In(index_signal): In<jonmo::signal::Dedupe<jonmo::signal::Source<Option<usize>>>>, world: &mut World| {
            //     let signal = index_signal.debug().register(world);
            //     poll_signal(world, *signal)
            //         .and_then(downcast_any_clone::<Option<usize>>).flatten().unwrap_or_default() as i32
            // })
            .map(|In(n)| item(n))
            // .intersperse_with(
            //     |index_signal: In<jonmo::signal::Dedupe<jonmo::signal::Source<Option<usize>>>>| {
            //         JonmoBuilder::from(Node::default()).component_signal(
            //             index_signal
            //                 .debug()
            //                 .map_in(|idx_opt| Text::new(format!("{}", idx_opt.unwrap_or(0)))),
            //         )
            //     },
            // ),
    )
}

Trait Implementations

impl<T> Clone for MutableVec<T>

fn clone(&self) -> Self

Returns a duplicate of the value.

fn clone_from(&mut self, source: &Self)

Performs copy-assignment from source.

impl<T> Drop for MutableVec<T>

fn drop(&mut self)

Executes the destructor for this type.

impl<T> From<&mut Commands<'_, '_>> for MutableVec<T>

where T: Clone + SSs,

fn from(commands: &mut Commands<'_, '_>) -> Self

Converts to this type from the input type.

impl<T> From<&mut World> for MutableVec<T>

where T: Clone + SSs,

fn from(world: &mut World) -> Self

Converts to this type from the input type.

impl<T> FromWorld for MutableVec<T>

where T: Clone + SSs,

fn from_world(world: &mut World) -> Self

Creates Self using data from the given World.