[core] migrate to bevy-0.10.1

closes #54

Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "belly"
-version = "0.1.1"
+version = "0.2.0"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

assets/color-picker.ess

@@ -1,6 +1,9 @@
 body {
     justify-content: center;
     align-items: center;
+    align-content: center;
+    width: 100%;
+    height: 100%;
 }
 .controls {
     width: 200px;

assets/party-editor/styles.ess

@@ -5,28 +5,29 @@
 body {
     flex-wrap: no-wrap;
     flex-direction: row;
+    width: 100%;
+    height: 100%;
 }
 #animals {
-    flex-wrap: wrap;
+    width: 100%;
     height: 100%;
 }
 #popups {
     height: 100%;
-    padding-right: 5%;
     justify-content: center;
     align-items: center;
 }
 #editor {
-    height: 80%;
     width: 400px;
     background-color: gray;
     justify-content: center;
     align-content: center;
-    padding: 10px;
+    margin: 30px;
 }
 #editor .content {
     width: 100%;
     height: 100%;
+    padding: 10px;
     justify-content: flex-start;
 }
 #editor .avatar {
@@ -44,9 +45,9 @@ body {
     width: 100%;
 }
 #editor .popup-header {
-    margin: -10px -10px 10px -10px;
     padding-bottom: 3px;
     background-color: #2f2f2f;
+    width: 100%;
 }
 
 #editor .editor-buttons button {
@@ -68,12 +69,13 @@ body {
 
 #color-picker {
     justify-content: space-between;
-    align-content: space-between;
+    align-content: center;
+    align-items: center;
     flex-wrap: wrap;
-    /* width: 100%; */
+    width: 380px;
 }
 #color-picker button {
-    margin: 2px;
+    margin: 3px;
 }
 #color-picker button .button-foreground {
     padding: 0px;
@@ -109,23 +111,24 @@ body {
 } 
 
 .row {
-    width: 100%;
+
     flex-direction: row;
     justify-content: center;
     align-content: center;
     align-items: center;
 }
 
 .column {
-    height: 100%;
+
     flex-direction: column;
     justify-content: center;
     align-content: center;
+    align-items: stretch;
 }
 
 .grow {
-    flex-basis: 100%;
     justify-content: center;
+    flex-basis: 100%;
 }
 .separator {
     min-width: 5px;

crates/belly_core/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "belly_core"
-version = "0.1.1"
+version = "0.2.0"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

crates/belly_core/src/element.rs

@@ -50,7 +50,6 @@ impl Default for ElementBundle {
 #[derive(Bundle)]
 pub struct TextElementBundle {
     pub element: Element,
-    pub background_color: BackgroundColor,
     #[bundle]
     pub text: TextBundle,
 }
@@ -59,9 +58,9 @@ impl Default for TextElementBundle {
     fn default() -> Self {
         TextElementBundle {
             element: Element::inline(),
-            background_color: BackgroundColor(Color::NONE),
             text: TextBundle {
                 text: Text::from_section("", Default::default()),
+                background_color: BackgroundColor(Color::NONE),
                 ..default()
             },
         }

crates/belly_core/src/ess/property/impls/layout_control.rs

@@ -168,6 +168,7 @@ style_property! {
         Parser = parse::IdentifierParser<Display>;
         Apply = |value, style, _assets, _commands, _entity| {
             if &style.display != value {
+                info!("set display = {value:?}");
                 style.display = *value;
             }
         };

crates/belly_core/src/relations/mod.rs

@@ -38,7 +38,11 @@ impl Plugin for RelationsPlugin {
         app.configure_set(RelationsSet::PostUpdate.after(CoreSet::PostUpdate));
 
         app.add_system(process_relations_system.in_set(RelationsSet::PreUpdate));
-        app.add_system(process_relations_system.in_set(RelationsSet::PostUpdate));
+        // For some reason with bevy 0.10 I can't process this system multiple times,
+        // App panics with:
+        // '`"Update"` and `"PostUpdate"` have a `before`-`after` relationship (which
+        // may be transitive) but share systems.
+        // app.add_system(process_relations_system.in_set(RelationsSet::PostUpdate));
     }
 }
 
@@ -59,6 +63,10 @@ pub fn process_relations_system(world: &mut World) {
     let relations = world.resource::<RelationsSystems>().clone();
     relations.run(world);
 }
+pub fn process_relations_system_b(world: &mut World) {
+    let relations = world.resource::<RelationsSystems>().clone();
+    relations.run(world);
+}
 
 pub fn process_signals_system<P: 'static + WorldQuery, E: Event>(
     asset_server: Res<AssetServer>,

crates/belly_macro/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "belly_macro"
-version = "0.1.1"
+version = "0.2.0"
 edition = "2021"
 
 [lib]

crates/belly_widgets/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "belly_widgets"
-version = "0.1.1"
+version = "0.2.0"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

crates/belly_widgets/src/common.rs

@@ -36,7 +36,6 @@ impl Plugin for CommonsPlugin {
 #[widget]
 #[styles(
     body {
-        width: 100%;
         width: 100%;
         height: 100%;
         align-content: flex-start;
@@ -78,12 +77,6 @@ fn brl(ctx: &mut WidgetContext) {
 }
 
 #[widget]
-#[styles(
-    div {
-        flex-wrap: wrap;
-        flex-basis: 100%;
-    }
-)]
 /// The `<div>` tag is an empty container that is used to define
 /// a division or a section. It does not affect the content or layout
 /// and is used to group `eml` elements to be styled with `ess`.

crates/belly_widgets/src/input/button.rs

@@ -144,6 +144,7 @@ ess_define! {
     }
     .button-background {
         width: 100%;
+        height: 100%;
         margin: -1px 1px 1px -1px;
         padding: 1px;
         background-color: #2f2f2f;

crates/belly_widgets/src/input/text.rs

@@ -4,6 +4,8 @@ use belly_core::build::*;
 use belly_macro::*;
 use bevy::{input::keyboard::KeyboardInput, prelude::*};
 
+use crate::common::Label;
+
 pub mod prelude {
     pub use super::TextInput;
     pub use super::TextinputWidgetExtension;
@@ -46,6 +48,12 @@ fn textinput(ctx: &mut WidgetContext, ti: &mut TextInput) {
     let text = ti.text;
     let container = ti.container;
     let selection = ti.selection;
+    // let a = belly_core::relations::bind::ToComponentWithoutTransformer {
+    //     id: belly_core::relations::bind::bind_id::<Label>("value"),
+    //     target: text,
+    //     reader: |c: &::bevy::prelude::Mut<Label>| &c.value,
+    //     writer: |c: &mut ::bevy::prelude::Mut<Label>| &mut c.value,
+    // };
     ctx.add(from!(this, TextInput: value) >> to!(text, Label: value));
     ctx.render(eml! {
         <span interactable="block" c:text-input c:text-input-border>

crates/bevy_stylebox/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "bevy_stylebox"
-version = "0.1.0"
+version = "0.2.0"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html

crates/bevy_stylebox/examples/flat_ui.rs

@@ -128,7 +128,10 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
 
                             parent
                                 .spawn(ImageBundle {
-                                    image: UiImage(circle.clone()),
+                                    image: UiImage {
+                                        texture: circle.clone(),
+                                        ..default()
+                                    },
                                     style: Style {
                                         padding: UiRect::all(Val::Px(2.)),
                                         size: Size::new(Val::Px(20.), Val::Px(20.)),
@@ -139,7 +142,10 @@ fn setup(mut commands: Commands, asset_server: Res<AssetServer>) {
                                 .with_children(|parent| {
                                     parent.spawn(ImageBundle {
                                         background_color: Color::DARK_GRAY.into(),
-                                        image: UiImage(asset_server.load("cross.png")),
+                                        image: UiImage {
+                                            texture: asset_server.load("cross.png"),
+                                            ..default()
+                                        },
                                         style: Style {
                                             size: Size::new(Val::Px(16.), Val::Px(16.)),
                                             ..default()

examples/counter-signals.rs

@@ -3,6 +3,8 @@
 use belly::prelude::*;
 use bevy::prelude::*;
 
+use belly::widgets::common::Label;
+
 fn main() {
     App::new()
         .add_plugins(DefaultPlugins)

examples/image-render-to-texture.rs

@@ -18,23 +18,12 @@ use bevy::{
     },
 };
 
-//we must run "setup_viewport" befor "setup_ui"  so we create to startup stages for our app
-// Bevy event could be used in stead of stages
-#[derive(StageLabel)]
-enum AppSetup {
-    Viewport,
-    Ui,
-}
-
 fn main() {
     App::new()
         .init_resource::<Viewport>()
         .add_plugins(DefaultPlugins)
         .add_plugin(BellyPlugin)
-        .add_startup_stage(AppSetup::Viewport, SystemStage::parallel())
-        .add_startup_stage_after(AppSetup::Viewport, AppSetup::Ui, SystemStage::parallel())
-        .add_startup_system_to_stage(AppSetup::Viewport, setup_viewport)
-        .add_startup_system_to_stage(AppSetup::Ui, setup_ui)
+        .add_startup_systems((setup_viewport, setup_ui))
         .add_system(rotator_system)
         .run();
 }
@@ -81,6 +70,7 @@ fn setup_viewport(
             format: TextureFormat::Bgra8UnormSrgb,
             mip_level_count: 1,
             sample_count: 1,
+            view_formats: &[],
             usage: TextureUsages::TEXTURE_BINDING
                 | TextureUsages::COPY_DST
                 | TextureUsages::RENDER_ATTACHMENT,
@@ -132,7 +122,7 @@ fn setup_viewport(
             },
             camera: Camera {
                 // render before the "main pass" camera
-                priority: -1,
+                order: -1,
                 target: RenderTarget::Image(image_handle.clone()),
                 ..default()
             },

examples/party-editor.rs

@@ -28,10 +28,14 @@ use belly::build::*;
 use belly::widgets::input::button::ButtonWidget;
 use bevy::prelude::*;
 
+use bevy::diagnostic::{FrameTimeDiagnosticsPlugin, LogDiagnosticsPlugin};
+
 fn main() {
     App::new()
         .add_plugins(DefaultPlugins)
         .add_plugin(BellyPlugin)
+        .add_plugin(LogDiagnosticsPlugin::default())
+        .add_plugin(FrameTimeDiagnosticsPlugin::default())
         .add_startup_system(setup)
         .run();
 }
@@ -90,7 +94,7 @@ fn setup(mut commands: Commands) {
     commands.add(StyleSheet::load("party-editor/styles.ess"));
     commands.add(eml! {
         <body>
-            <span id="animals" c:column c:grow>
+            <span id="animals" c:column>
                 <span c:row>"Choose & Edit your fighters!"</span>
                 <for row in=0..4>
                 <span c:row>
@@ -194,7 +198,7 @@ fn AnimalEditor(ctx: &mut WidgetContext) {
                     <button on:press=run!(for animal |data: &mut AnimalState| {
                         data.avatar.prev_animal();
                     })>"Prev"</button>
-                    <span c:grow>"AnimalState"</span>
+                    <span c:grow>"Avatar"</span>
                     <button on:press=run!(for animal |data: &mut AnimalState| {
                         data.avatar.next_animal();
                     })>"Next"</button>

examples/slider.rs

@@ -1,6 +1,8 @@
 use belly::prelude::*;
 use bevy::prelude::*;
 
+use belly::widgets::common::Label;
+
 fn main() {
     App::new()
         .add_plugins(DefaultPlugins)

examples/text-input.rs

@@ -1,6 +1,8 @@
 use belly::prelude::*;
 use bevy::prelude::*;
 
+use belly::widgets::common::Label;
+
 fn main() {
     App::new()
         .add_plugins(DefaultPlugins)