From bdb4fbefc956475fd7dce6a56ebc8914bafe5470 Mon Sep 17 00:00:00 2001
From: StarArawn <toasterthegamer@gmail.com>
Date: Tue, 14 Dec 2021 12:40:19 -0500
Subject: [PATCH] Added more clipping stuff.

---
 Cargo.lock                                    | 441 +++++++-----------
 Cargo.toml                                    |   2 +-
 bevy_kayak_ui/Cargo.toml                      |   4 +-
 bevy_kayak_ui/src/camera/camera.rs            |   2 +-
 bevy_kayak_ui/src/camera/mod.rs               |   4 +-
 bevy_kayak_ui/src/camera/ortho.rs             |   2 +-
 bevy_kayak_ui/src/lib.rs                      |   2 +-
 bevy_kayak_ui/src/render/mod.rs               |   8 +-
 bevy_kayak_ui/src/render/ui_pass.rs           |   6 +-
 bevy_kayak_ui/src/render/ui_pass_driver.rs    |   2 +-
 .../src/render/unified/font/extract.rs        |   8 +-
 bevy_kayak_ui/src/render/unified/font/mod.rs  |   2 +-
 .../src/render/unified/image/extract.rs       |   2 +-
 .../src/render/unified/image/image_manager.rs |   2 +-
 bevy_kayak_ui/src/render/unified/mod.rs       |  32 +-
 .../src/render/unified/nine_patch/extract.rs  |   4 +-
 bevy_kayak_ui/src/render/unified/pipeline.rs  |  24 +-
 .../src/render/unified/quad/extract.rs        |   2 +-
 examples/bevy.rs                              |   6 +-
 examples/clipping.rs                          | 110 +++++
 examples/counter.rs                           |  25 +-
 examples/full_ui.rs                           |  10 +-
 examples/global_counter.rs                    |   5 +-
 examples/image.rs                             |   7 +-
 examples/nine_patch.rs                        |   7 +-
 kayak_core/src/widget_manager.rs              |  21 +-
 kayak_render_macros/examples/main.rs          |   2 +
 kayak_render_macros/src/arc_function.rs       |   1 +
 kayak_render_macros/src/children.rs           |   2 +
 kayak_widgets/src/app.rs                      |   8 +-
 kayak_widgets/src/button.rs                   |   3 +
 kayak_widgets/src/clip.rs                     |  12 +-
 kayak_widgets/src/element.rs                  |  10 +
 kayak_widgets/src/lib.rs                      |   2 +
 kayak_widgets/src/window.rs                   |  36 +-
 35 files changed, 457 insertions(+), 359 deletions(-)
 create mode 100644 examples/clipping.rs
 create mode 100644 kayak_widgets/src/element.rs

diff --git a/Cargo.lock b/Cargo.lock
index dafabd1..6952b31 100644
--- a/Cargo.lock
+++ b/Cargo.lock
@@ -80,9 +80,9 @@ checksum = "85965b6739a430150bdd138e2374a98af0c3ee0d030b3bb7fc3bddff58d0102e"
 
 [[package]]
 name = "android_logger"
-version = "0.9.2"
+version = "0.10.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "2ec2333c185d826313162cee39d3fcc6a84ba08114a839bebf53b961e7e75773"
+checksum = "d9ed09b18365ed295d722d0b5ed59c01b79a826ff2d2a8f73d5ecca8e6fb2f66"
 dependencies = [
  "android_log-sys",
  "env_logger",
@@ -193,21 +193,15 @@ checksum = "904dfeac50f3cdaba28fc6f57fdcddb75f49ed61346676a78c4ffe55877802fd"
 [[package]]
 name = "bevy"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_internal",
 ]
 
-[[package]]
-name = "bevy-glsl-to-spirv"
-version = "0.2.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "0d5f2f58f0aec3c50a20799792c3705e80dd7df327e79791cacec197e84e5e61"
-
 [[package]]
 name = "bevy_app"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_derive",
  "bevy_ecs",
@@ -220,7 +214,7 @@ dependencies = [
 [[package]]
 name = "bevy_asset"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "anyhow",
  "bevy_app",
@@ -233,7 +227,7 @@ dependencies = [
  "crossbeam-channel",
  "downcast-rs",
  "js-sys",
- "ndk-glue 0.4.0",
+ "ndk-glue 0.5.0",
  "notify",
  "parking_lot",
  "rand",
@@ -247,7 +241,7 @@ dependencies = [
 [[package]]
 name = "bevy_audio"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "anyhow",
  "bevy_app",
@@ -262,7 +256,7 @@ dependencies = [
 [[package]]
 name = "bevy_core"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_derive",
@@ -277,19 +271,19 @@ dependencies = [
 [[package]]
 name = "bevy_core_pipeline"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_asset",
  "bevy_core",
  "bevy_ecs",
- "bevy_render2",
+ "bevy_render",
 ]
 
 [[package]]
 name = "bevy_derive"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "Inflector",
  "bevy_macro_utils",
@@ -300,7 +294,7 @@ dependencies = [
 [[package]]
 name = "bevy_diagnostic"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_core",
@@ -312,7 +306,7 @@ dependencies = [
 [[package]]
 name = "bevy_ecs"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "async-channel",
  "bevy_ecs_macros",
@@ -329,7 +323,7 @@ dependencies = [
 [[package]]
 name = "bevy_ecs_macros"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_macro_utils",
  "proc-macro2",
@@ -340,7 +334,7 @@ dependencies = [
 [[package]]
 name = "bevy_gilrs"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_ecs",
@@ -350,9 +344,9 @@ dependencies = [
 ]
 
 [[package]]
-name = "bevy_gltf2"
+name = "bevy_gltf"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "anyhow",
  "base64",
@@ -362,9 +356,9 @@ dependencies = [
  "bevy_ecs",
  "bevy_log",
  "bevy_math",
- "bevy_pbr2",
+ "bevy_pbr",
  "bevy_reflect",
- "bevy_render2",
+ "bevy_render",
  "bevy_scene",
  "bevy_transform",
  "bevy_utils",
@@ -377,7 +371,7 @@ dependencies = [
 [[package]]
 name = "bevy_input"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_ecs",
@@ -388,7 +382,7 @@ dependencies = [
 [[package]]
 name = "bevy_internal"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_asset",
@@ -399,27 +393,23 @@ dependencies = [
  "bevy_diagnostic",
  "bevy_ecs",
  "bevy_gilrs",
- "bevy_gltf2",
+ "bevy_gltf",
  "bevy_input",
  "bevy_log",
  "bevy_math",
  "bevy_pbr",
- "bevy_pbr2",
  "bevy_reflect",
  "bevy_render",
- "bevy_render2",
  "bevy_scene",
  "bevy_sprite",
- "bevy_sprite2",
  "bevy_tasks",
  "bevy_text",
  "bevy_transform",
  "bevy_ui",
  "bevy_utils",
- "bevy_wgpu",
  "bevy_window",
  "bevy_winit",
- "ndk-glue 0.4.0",
+ "ndk-glue 0.5.0",
 ]
 
 [[package]]
@@ -440,7 +430,7 @@ dependencies = [
 [[package]]
 name = "bevy_log"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "android_log-sys",
  "bevy_app",
@@ -454,7 +444,7 @@ dependencies = [
 [[package]]
 name = "bevy_macro_utils"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "cargo-manifest",
  "quote",
@@ -464,7 +454,7 @@ dependencies = [
 [[package]]
 name = "bevy_math"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_reflect",
  "glam",
@@ -473,23 +463,7 @@ dependencies = [
 [[package]]
 name = "bevy_pbr"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
-dependencies = [
- "bevy_app",
- "bevy_asset",
- "bevy_core",
- "bevy_ecs",
- "bevy_math",
- "bevy_reflect",
- "bevy_render",
- "bevy_transform",
- "bytemuck",
-]
-
-[[package]]
-name = "bevy_pbr2"
-version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_asset",
@@ -498,9 +472,10 @@ dependencies = [
  "bevy_ecs",
  "bevy_math",
  "bevy_reflect",
- "bevy_render2",
+ "bevy_render",
  "bevy_transform",
  "bevy_utils",
+ "bevy_window",
  "bitflags",
  "bytemuck",
  "crevice",
@@ -510,7 +485,7 @@ dependencies = [
 [[package]]
 name = "bevy_reflect"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_reflect_derive",
  "bevy_utils",
@@ -526,7 +501,7 @@ dependencies = [
 [[package]]
 name = "bevy_reflect_derive"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_macro_utils",
  "proc-macro2",
@@ -538,37 +513,7 @@ dependencies = [
 [[package]]
 name = "bevy_render"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
-dependencies = [
- "anyhow",
- "bevy-glsl-to-spirv",
- "bevy_app",
- "bevy_asset",
- "bevy_core",
- "bevy_derive",
- "bevy_ecs",
- "bevy_math",
- "bevy_reflect",
- "bevy_transform",
- "bevy_utils",
- "bevy_window",
- "bitflags",
- "downcast-rs",
- "hex",
- "hexasphere",
- "image",
- "once_cell",
- "parking_lot",
- "serde",
- "shaderc",
- "spirv-reflect",
- "thiserror",
-]
-
-[[package]]
-name = "bevy_render2"
-version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "anyhow",
  "bevy_app",
@@ -601,7 +546,7 @@ dependencies = [
 [[package]]
 name = "bevy_scene"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "anyhow",
  "bevy_app",
@@ -619,30 +564,7 @@ dependencies = [
 [[package]]
 name = "bevy_sprite"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
-dependencies = [
- "bevy_app",
- "bevy_asset",
- "bevy_core",
- "bevy_ecs",
- "bevy_log",
- "bevy_math",
- "bevy_reflect",
- "bevy_render",
- "bevy_transform",
- "bevy_utils",
- "bevy_window",
- "bytemuck",
- "guillotiere",
- "rectangle-pack",
- "serde",
- "thiserror",
-]
-
-[[package]]
-name = "bevy_sprite2"
-version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_asset",
@@ -652,7 +574,7 @@ dependencies = [
  "bevy_log",
  "bevy_math",
  "bevy_reflect",
- "bevy_render2",
+ "bevy_render",
  "bevy_transform",
  "bevy_utils",
  "bytemuck",
@@ -666,7 +588,7 @@ dependencies = [
 [[package]]
 name = "bevy_tasks"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "async-channel",
  "async-executor",
@@ -679,7 +601,7 @@ dependencies = [
 [[package]]
 name = "bevy_text"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "ab_glyph",
  "anyhow",
@@ -695,13 +617,14 @@ dependencies = [
  "bevy_utils",
  "bevy_window",
  "glyph_brush_layout",
+ "serde",
  "thiserror",
 ]
 
 [[package]]
 name = "bevy_transform"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_ecs",
@@ -714,11 +637,13 @@ dependencies = [
 [[package]]
 name = "bevy_ui"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_asset",
  "bevy_core",
+ "bevy_core_pipeline",
+ "bevy_derive",
  "bevy_ecs",
  "bevy_input",
  "bevy_log",
@@ -730,6 +655,8 @@ dependencies = [
  "bevy_transform",
  "bevy_utils",
  "bevy_window",
+ "bytemuck",
+ "crevice",
  "serde",
  "smallvec",
  "stretch",
@@ -738,7 +665,7 @@ dependencies = [
 [[package]]
 name = "bevy_utils"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "ahash",
  "bevy_derive",
@@ -748,43 +675,22 @@ dependencies = [
  "uuid",
 ]
 
-[[package]]
-name = "bevy_wgpu"
-version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
-dependencies = [
- "bevy_app",
- "bevy_asset",
- "bevy_core",
- "bevy_diagnostic",
- "bevy_ecs",
- "bevy_render",
- "bevy_utils",
- "bevy_window",
- "bevy_winit",
- "crossbeam-channel",
- "crossbeam-utils",
- "futures-lite",
- "parking_lot",
- "wgpu",
-]
-
 [[package]]
 name = "bevy_window"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bevy_app",
  "bevy_math",
  "bevy_utils",
- "raw-window-handle 0.3.4",
+ "raw-window-handle 0.4.2",
  "web-sys",
 ]
 
 [[package]]
 name = "bevy_winit"
 version = "0.5.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "approx",
  "bevy_app",
@@ -793,7 +699,7 @@ dependencies = [
  "bevy_math",
  "bevy_utils",
  "bevy_window",
- "raw-window-handle 0.3.4",
+ "raw-window-handle 0.4.2",
  "wasm-bindgen",
  "web-sys",
  "winit",
@@ -953,15 +859,6 @@ dependencies = [
  "libloading",
 ]
 
-[[package]]
-name = "cmake"
-version = "0.1.46"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b7b858541263efe664aead4a5209a4ae5c5d2811167d4ed4ee0944503f8d2089"
-dependencies = [
- "cc",
-]
-
 [[package]]
 name = "cocoa"
 version = "0.24.0"
@@ -1199,7 +1096,7 @@ dependencies = [
 [[package]]
 name = "crevice"
 version = "0.8.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "bytemuck",
  "crevice-derive",
@@ -1210,27 +1107,13 @@ dependencies = [
 [[package]]
 name = "crevice-derive"
 version = "0.8.0"
-source = "git+https://github.com/bevyengine/bevy?rev=38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c#38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c"
+source = "git+https://github.com/StarArawn/bevy?rev=bcca341d696c66d0173d8b0ac7a1b23b4b9e775c#bcca341d696c66d0173d8b0ac7a1b23b4b9e775c"
 dependencies = [
  "proc-macro2",
  "quote",
  "syn",
 ]
 
-[[package]]
-name = "crossbeam"
-version = "0.8.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4ae5588f6b3c3cb05239e90bd110f257254aecd01e4635400391aeae07497845"
-dependencies = [
- "cfg-if 1.0.0",
- "crossbeam-channel",
- "crossbeam-deque",
- "crossbeam-epoch",
- "crossbeam-queue",
- "crossbeam-utils",
-]
-
 [[package]]
 name = "crossbeam-channel"
 version = "0.5.1"
@@ -1241,40 +1124,6 @@ dependencies = [
  "crossbeam-utils",
 ]
 
-[[package]]
-name = "crossbeam-deque"
-version = "0.8.1"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "6455c0ca19f0d2fbf751b908d5c55c1f5cbc65e03c4225427254b46890bdde1e"
-dependencies = [
- "cfg-if 1.0.0",
- "crossbeam-epoch",
- "crossbeam-utils",
-]
-
-[[package]]
-name = "crossbeam-epoch"
-version = "0.9.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "4ec02e091aa634e2c3ada4a392989e7c3116673ef0ac5b72232439094d73b7fd"
-dependencies = [
- "cfg-if 1.0.0",
- "crossbeam-utils",
- "lazy_static",
- "memoffset",
- "scopeguard",
-]
-
-[[package]]
-name = "crossbeam-queue"
-version = "0.3.2"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "9b10ddc024425c88c2ad148c1b0fd53f4c6d38db9697c9f1588381212fa657c9"
-dependencies = [
- "cfg-if 1.0.0",
- "crossbeam-utils",
-]
-
 [[package]]
 name = "crossbeam-utils"
 version = "0.8.5"
@@ -1308,8 +1157,18 @@ version = "0.10.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "0d706e75d87e35569db781a9b5e2416cff1236a47ed380831f959382ccd5f858"
 dependencies = [
- "darling_core",
- "darling_macro",
+ "darling_core 0.10.2",
+ "darling_macro 0.10.2",
+]
+
+[[package]]
+name = "darling"
+version = "0.13.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "d0d720b8683f8dd83c65155f0530560cba68cd2bf395f6513a483caee57ff7f4"
+dependencies = [
+ "darling_core 0.13.1",
+ "darling_macro 0.13.1",
 ]
 
 [[package]]
@@ -1322,7 +1181,21 @@ dependencies = [
  "ident_case",
  "proc-macro2",
  "quote",
- "strsim",
+ "strsim 0.9.3",
+ "syn",
+]
+
+[[package]]
+name = "darling_core"
+version = "0.13.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "7a340f241d2ceed1deb47ae36c4144b2707ec7dd0b649f894cb39bb595986324"
+dependencies = [
+ "fnv",
+ "ident_case",
+ "proc-macro2",
+ "quote",
+ "strsim 0.10.0",
  "syn",
 ]
 
@@ -1332,7 +1205,18 @@ version = "0.10.2"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d9b5a2f4ac4969822c62224815d069952656cadc7084fdca9751e6d959189b72"
 dependencies = [
- "darling_core",
+ "darling_core 0.10.2",
+ "quote",
+ "syn",
+]
+
+[[package]]
+name = "darling_macro"
+version = "0.13.1"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "72c41b3b7352feb3211a0d743dc5700a4e3b60f51bd2b368892d1e0f9a95f44b"
+dependencies = [
+ "darling_core 0.13.1",
  "quote",
  "syn",
 ]
@@ -1416,9 +1300,9 @@ checksum = "9ea835d29036a4087793836fa931b08837ad5e957da9e23886b29586fb9b6650"
 
 [[package]]
 name = "env_logger"
-version = "0.7.1"
+version = "0.8.4"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "44533bbbb3bb3c1fa17d9f2e4e38bbbaf8396ba82193c4cb1b6445d711445d36"
+checksum = "a19187fea3ac7e84da7dacf48de0c45d63c6a76f9490dae389aead16c243fce3"
 dependencies = [
  "log",
  "regex",
@@ -2176,15 +2060,6 @@ version = "2.4.1"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "308cc39be01b73d0d18f82a0e7b2a3df85245f84af96fdddc5d202d27e47b86a"
 
-[[package]]
-name = "memoffset"
-version = "0.6.5"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "5aa361d4faea93603064a027415f07bd8e1d5c88c9fbf68bf56a285428fd79ce"
-dependencies = [
- "autocfg",
-]
-
 [[package]]
 name = "metal"
 version = "0.23.1"
@@ -2248,15 +2123,16 @@ dependencies = [
 ]
 
 [[package]]
-name = "mio-misc"
-version = "1.2.2"
+name = "mio"
+version = "0.8.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "b47412f3a52115b936ff2a229b803498c7b4d332adeb87c2f1498c9da54c398c"
+checksum = "ba272f85fa0b41fc91872be579b3bbe0f56b792aa361a380eb669469f68dafb2"
 dependencies = [
- "crossbeam",
- "crossbeam-queue",
+ "libc",
  "log",
- "mio",
+ "miow",
+ "ntapi",
+ "winapi",
 ]
 
 [[package]]
@@ -2322,6 +2198,19 @@ dependencies = [
  "thiserror",
 ]
 
+[[package]]
+name = "ndk"
+version = "0.5.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "96d868f654c72e75f8687572699cdabe755f03effbb62542768e995d5b8d699d"
+dependencies = [
+ "bitflags",
+ "jni-sys",
+ "ndk-sys",
+ "num_enum",
+ "thiserror",
+]
+
 [[package]]
 name = "ndk-glue"
 version = "0.3.0"
@@ -2332,7 +2221,7 @@ dependencies = [
  "libc",
  "log",
  "ndk 0.3.0",
- "ndk-macro",
+ "ndk-macro 0.2.0",
  "ndk-sys",
 ]
 
@@ -2342,12 +2231,26 @@ version = "0.4.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "d3e9e94628f24e7a3cb5b96a2dc5683acd9230bf11991c2a1677b87695138420"
 dependencies = [
- "android_logger",
  "lazy_static",
  "libc",
  "log",
  "ndk 0.4.0",
- "ndk-macro",
+ "ndk-macro 0.2.0",
+ "ndk-sys",
+]
+
+[[package]]
+name = "ndk-glue"
+version = "0.5.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "fc291b8de2095cba8dab7cf381bf582ff4c17a09acf854c32e46545b08085d28"
+dependencies = [
+ "android_logger",
+ "lazy_static",
+ "libc",
+ "log",
+ "ndk 0.5.0",
+ "ndk-macro 0.3.0",
  "ndk-sys",
 ]
 
@@ -2357,13 +2260,26 @@ version = "0.2.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "05d1c6307dc424d0f65b9b06e94f88248e6305726b14729fd67a5e47b2dc481d"
 dependencies = [
- "darling",
+ "darling 0.10.2",
  "proc-macro-crate 0.1.5",
  "proc-macro2",
  "quote",
  "syn",
 ]
 
+[[package]]
+name = "ndk-macro"
+version = "0.3.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "0df7ac00c4672f9d5aece54ee3347520b7e20f158656c7db2e6de01902eb7a6c"
+dependencies = [
+ "darling 0.13.1",
+ "proc-macro-crate 1.1.0",
+ "proc-macro2",
+ "quote",
+ "syn",
+]
+
 [[package]]
 name = "ndk-sys"
 version = "0.2.2"
@@ -2405,7 +2321,7 @@ dependencies = [
  "inotify",
  "kqueue",
  "libc",
- "mio",
+ "mio 0.7.14",
  "walkdir",
  "winapi",
 ]
@@ -2870,9 +2786,9 @@ dependencies = [
 
 [[package]]
 name = "ron"
-version = "0.6.6"
+version = "0.7.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "86018df177b1beef6c7c8ef949969c4f7cb9a9344181b92486b23c79995bdaa4"
+checksum = "1b861ecaade43ac97886a512b360d01d66be9f41f3c61088b42cedf92e03d678"
 dependencies = [
  "base64",
  "bitflags",
@@ -2993,26 +2909,6 @@ version = "0.6.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "2579985fda508104f7587689507983eadd6a6e84dd35d6d115361f530916fa0d"
 
-[[package]]
-name = "shaderc"
-version = "0.7.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "58da8aaf4ad3508598cdf098567114c98d5f455de7d69b1213232ac557bc67ea"
-dependencies = [
- "libc",
- "shaderc-sys",
-]
-
-[[package]]
-name = "shaderc-sys"
-version = "0.7.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "8bd76ec0bd25f2017a65250373485e43cdc81b5cb8fd83c6115375c8d018cdf9"
-dependencies = [
- "cmake",
- "libc",
-]
-
 [[package]]
 name = "sharded-slab"
 version = "0.1.4"
@@ -3073,30 +2969,6 @@ dependencies = [
  "num-traits",
 ]
 
-[[package]]
-name = "spirv-reflect"
-version = "0.2.3"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "cecc7af6a7d3ca6d15f4d6b5077df89c77ad1f4b314d0cabee221656d041dad7"
-dependencies = [
- "bitflags",
- "cc",
- "num-traits",
- "serde",
- "serde_derive",
- "spirv_headers",
-]
-
-[[package]]
-name = "spirv_headers"
-version = "1.5.0"
-source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "1f5b132530b1ac069df335577e3581765995cba5a13995cdbbdbc8fb057c532c"
-dependencies = [
- "bitflags",
- "num-traits",
-]
-
 [[package]]
 name = "stdweb"
 version = "0.1.3"
@@ -3170,6 +3042,12 @@ version = "0.9.3"
 source = "registry+https://github.com/rust-lang/crates.io-index"
 checksum = "6446ced80d6c486436db5c078dde11a9f73d42b57fb273121e160b84f63d894c"
 
+[[package]]
+name = "strsim"
+version = "0.10.0"
+source = "registry+https://github.com/rust-lang/crates.io-index"
+checksum = "73473c0e59e6d5812c5dfe2a064a6444949f089e20eec9a2e5506596494e4623"
+
 [[package]]
 name = "svg_fmt"
 version = "0.4.1"
@@ -3575,11 +3453,12 @@ checksum = "712e227841d057c1ee1cd2fb22fa7e5a5461ae8e48fa2ca79ec42cfc1931183f"
 
 [[package]]
 name = "winit"
-version = "0.25.0"
+version = "0.26.0"
 source = "registry+https://github.com/rust-lang/crates.io-index"
-checksum = "79610794594d5e86be473ef7763f604f2159cbac8c94debd00df8fb41e86c2f8"
+checksum = "70466a5f4825cc88c92963591b06dbc255420bffe19d847bfcda475e82d079c0"
 dependencies = [
  "bitflags",
+ "block",
  "cocoa",
  "core-foundation 0.9.2",
  "core-graphics 0.22.3",
@@ -3589,16 +3468,14 @@ dependencies = [
  "lazy_static",
  "libc",
  "log",
- "mio",
- "mio-misc",
- "ndk 0.3.0",
- "ndk-glue 0.3.0",
+ "mio 0.8.0",
+ "ndk 0.5.0",
+ "ndk-glue 0.5.0",
  "ndk-sys",
  "objc",
  "parking_lot",
  "percent-encoding",
- "raw-window-handle 0.3.4",
- "scopeguard",
+ "raw-window-handle 0.4.2",
  "wasm-bindgen",
  "web-sys",
  "winapi",
diff --git a/Cargo.toml b/Cargo.toml
index 5b0957a..06240ea 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -25,5 +25,5 @@ kayak_font = { path = "kayak_font", optional = true }
 kayak_render_macros = { path = "kayak_render_macros" }
 
 [dev-dependencies]
-bevy = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+bevy = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 kayak_widgets = { path = "kayak_widgets" }
diff --git a/bevy_kayak_ui/Cargo.toml b/bevy_kayak_ui/Cargo.toml
index 113f74e..1b1d89f 100644
--- a/bevy_kayak_ui/Cargo.toml
+++ b/bevy_kayak_ui/Cargo.toml
@@ -5,12 +5,12 @@ edition = "2021"
 
 [dependencies]
 bytemuck = "1.7.2"
-bevy = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+bevy = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 kayak_core = { path = "../kayak_core" }
 kayak_render_macros = { path = "../kayak_render_macros" }
 kayak_font = { path = "../kayak_font" }
 #kayak_font = { path = "../kayak_font" }
-crevice = { git = "https://github.com/bevyengine/bevy", rev = "38c7d5eb9e81ab8e1aec03673599b25a9aa0c69c" }
+crevice = { git = "https://github.com/StarArawn/bevy", rev = "bcca341d696c66d0173d8b0ac7a1b23b4b9e775c" }
 serde = "1.0"
 serde_json = "1.0"
 serde_path_to_error = "0.1"
diff --git a/bevy_kayak_ui/src/camera/camera.rs b/bevy_kayak_ui/src/camera/camera.rs
index be8d0b4..8f02ca9 100644
--- a/bevy_kayak_ui/src/camera/camera.rs
+++ b/bevy_kayak_ui/src/camera/camera.rs
@@ -1,6 +1,6 @@
 use bevy::{
     prelude::{Bundle, GlobalTransform, Transform},
-    render2::{
+    render::{
         camera::{Camera, CameraProjection, DepthCalculation, WindowOrigin},
         primitives::Frustum,
         view::VisibleEntities,
diff --git a/bevy_kayak_ui/src/camera/mod.rs b/bevy_kayak_ui/src/camera/mod.rs
index 2d0c1db..1d0d65e 100644
--- a/bevy_kayak_ui/src/camera/mod.rs
+++ b/bevy_kayak_ui/src/camera/mod.rs
@@ -1,6 +1,6 @@
 use bevy::{
     prelude::{CoreStage, Plugin},
-    render2::camera::ActiveCameras,
+    render::camera::ActiveCameras,
 };
 
 mod camera;
@@ -17,7 +17,7 @@ impl Plugin for KayakUICameraPlugin {
         active_cameras.add(UICameraBundle::UI_CAMERA);
         app.add_system_to_stage(
             CoreStage::PostUpdate,
-            bevy::render2::camera::camera_system::<UIOrthographicProjection>,
+            bevy::render::camera::camera_system::<UIOrthographicProjection>,
         );
     }
 }
diff --git a/bevy_kayak_ui/src/camera/ortho.rs b/bevy_kayak_ui/src/camera/ortho.rs
index ceacb30..d4d07f5 100644
--- a/bevy_kayak_ui/src/camera/ortho.rs
+++ b/bevy_kayak_ui/src/camera/ortho.rs
@@ -3,7 +3,7 @@ use bevy::prelude::Component;
 use bevy::{
     math::Mat4,
     reflect::Reflect,
-    render2::camera::{CameraProjection, DepthCalculation, ScalingMode, WindowOrigin},
+    render::camera::{CameraProjection, DepthCalculation, ScalingMode, WindowOrigin},
 };
 
 #[derive(Debug, Clone, Component, Reflect)]
diff --git a/bevy_kayak_ui/src/lib.rs b/bevy_kayak_ui/src/lib.rs
index ddc7232..9fe1162 100644
--- a/bevy_kayak_ui/src/lib.rs
+++ b/bevy_kayak_ui/src/lib.rs
@@ -2,7 +2,7 @@ use bevy::{
     input::{mouse::MouseButtonInput, ElementState},
     math::Vec2,
     prelude::{EventReader, IntoExclusiveSystem, MouseButton, Plugin, Res, World},
-    render2::color::Color,
+    render::color::Color,
     window::{CursorMoved, Windows},
 };
 
diff --git a/bevy_kayak_ui/src/render/mod.rs b/bevy_kayak_ui/src/render/mod.rs
index 4e38626..c70b7f9 100644
--- a/bevy_kayak_ui/src/render/mod.rs
+++ b/bevy_kayak_ui/src/render/mod.rs
@@ -1,10 +1,10 @@
 use bevy::{
     core_pipeline::node::MAIN_PASS_DRIVER,
     prelude::{Commands, Plugin, Res},
-    render2::{
+    render::{
         camera::ActiveCameras,
         render_graph::{EmptyNode, RenderGraph, SlotInfo, SlotType},
-        render_phase::{sort_phase_system, DrawFunctions, RenderPhase},
+        render_phase::{DrawFunctions, RenderPhase},
         RenderApp, RenderStage,
     },
 };
@@ -44,8 +44,8 @@ impl Plugin for BevyKayakUIRenderPlugin {
         let render_app = app.sub_app(RenderApp);
         render_app
             .init_resource::<DrawFunctions<TransparentUI>>()
-            .add_system_to_stage(RenderStage::Extract, extract_core_pipeline_camera_phases)
-            .add_system_to_stage(RenderStage::PhaseSort, sort_phase_system::<TransparentUI>);
+            .add_system_to_stage(RenderStage::Extract, extract_core_pipeline_camera_phases);
+        // .add_system_to_stage(RenderStage::PhaseSort, sort_phase_system::<TransparentUI>);
 
         let pass_node_ui = MainPassUINode::new(&mut render_app.world);
         let mut graph = render_app.world.get_resource_mut::<RenderGraph>().unwrap();
diff --git a/bevy_kayak_ui/src/render/ui_pass.rs b/bevy_kayak_ui/src/render/ui_pass.rs
index 0d37c93..061e314 100644
--- a/bevy_kayak_ui/src/render/ui_pass.rs
+++ b/bevy_kayak_ui/src/render/ui_pass.rs
@@ -1,8 +1,8 @@
 use bevy::core::FloatOrd;
 use bevy::ecs::prelude::*;
-use bevy::render2::render_phase::{DrawFunctionId, PhaseItem};
-use bevy::render2::render_resource::{CachedPipelineId, RenderPassColorAttachment};
-use bevy::render2::{
+use bevy::render::render_phase::{DrawFunctionId, PhaseItem};
+use bevy::render::render_resource::{CachedPipelineId, RenderPassColorAttachment};
+use bevy::render::{
     render_graph::{Node, NodeRunError, RenderGraphContext, SlotInfo, SlotType},
     render_phase::{DrawFunctions, RenderPhase, TrackedRenderPass},
     render_resource::{LoadOp, Operations, RenderPassDescriptor},
diff --git a/bevy_kayak_ui/src/render/ui_pass_driver.rs b/bevy_kayak_ui/src/render/ui_pass_driver.rs
index afefcf6..edd2908 100644
--- a/bevy_kayak_ui/src/render/ui_pass_driver.rs
+++ b/bevy_kayak_ui/src/render/ui_pass_driver.rs
@@ -1,5 +1,5 @@
 use bevy::ecs::world::World;
-use bevy::render2::{
+use bevy::render::{
     camera::ExtractedCameraNames,
     render_graph::{Node, NodeRunError, RenderGraphContext, SlotValue},
     renderer::RenderContext,
diff --git a/bevy_kayak_ui/src/render/unified/font/extract.rs b/bevy_kayak_ui/src/render/unified/font/extract.rs
index b436514..c134581 100644
--- a/bevy_kayak_ui/src/render/unified/font/extract.rs
+++ b/bevy_kayak_ui/src/render/unified/font/extract.rs
@@ -1,7 +1,7 @@
 use bevy::{
     math::Vec2,
     prelude::{Assets, Res},
-    sprite2::Rect,
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 use kayak_font::{Alignment, CoordinateSystem, KayakFont};
@@ -39,13 +39,15 @@ pub fn extract_texts(
 
     let font = font.unwrap();
 
+    let line_height = font_size * 1.2;
+
     let chars_layouts = font.get_layout(
         CoordinateSystem::PositiveYDown,
         Alignment::Start,
-        Vec2::new(layout.posx, layout.posy + font_size),
+        Vec2::new(layout.posx, layout.posy + line_height),
         Vec2::new(layout.width, layout.height),
         content,
-        font_size * 1.2,
+        line_height,
         font_size,
     );
 
diff --git a/bevy_kayak_ui/src/render/unified/font/mod.rs b/bevy_kayak_ui/src/render/unified/font/mod.rs
index ca51f64..4fdf406 100644
--- a/bevy_kayak_ui/src/render/unified/font/mod.rs
+++ b/bevy_kayak_ui/src/render/unified/font/mod.rs
@@ -1,6 +1,6 @@
 use bevy::{
     prelude::{Plugin, Res, ResMut},
-    render2::{
+    render::{
         render_asset::RenderAssets,
         renderer::{RenderDevice, RenderQueue},
         texture::Image,
diff --git a/bevy_kayak_ui/src/render/unified/image/extract.rs b/bevy_kayak_ui/src/render/unified/image/extract.rs
index 4dc1a7e..44feb6c 100644
--- a/bevy_kayak_ui/src/render/unified/image/extract.rs
+++ b/bevy_kayak_ui/src/render/unified/image/extract.rs
@@ -1,4 +1,4 @@
-use bevy::{math::Vec2, prelude::Res, render2::color::Color, sprite2::Rect};
+use bevy::{math::Vec2, prelude::Res, render::color::Color, sprite::Rect};
 use kayak_core::render_primitive::RenderPrimitive;
 
 use crate::{
diff --git a/bevy_kayak_ui/src/render/unified/image/image_manager.rs b/bevy_kayak_ui/src/render/unified/image/image_manager.rs
index 0493f8d..a260976 100644
--- a/bevy_kayak_ui/src/render/unified/image/image_manager.rs
+++ b/bevy_kayak_ui/src/render/unified/image/image_manager.rs
@@ -1,4 +1,4 @@
-use bevy::{prelude::Handle, render2::texture::Image, utils::HashMap};
+use bevy::{prelude::Handle, render::texture::Image, utils::HashMap};
 
 #[derive(Debug, Clone)]
 pub struct ImageManager {
diff --git a/bevy_kayak_ui/src/render/unified/mod.rs b/bevy_kayak_ui/src/render/unified/mod.rs
index 9c225c4..fadefd8 100644
--- a/bevy_kayak_ui/src/render/unified/mod.rs
+++ b/bevy_kayak_ui/src/render/unified/mod.rs
@@ -1,10 +1,12 @@
 use bevy::{
+    math::Vec2,
     prelude::{Assets, Commands, HandleUntyped, Plugin, Res},
     reflect::TypeUuid,
-    render2::{
-        render_phase::DrawFunctions, render_resource::Shader, texture::Image, RenderApp,
-        RenderStage,
+    render::{
+        color::Color, render_phase::DrawFunctions, render_resource::Shader, texture::Image,
+        RenderApp, RenderStage,
     },
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 use kayak_font::KayakFont;
@@ -17,7 +19,7 @@ use crate::{
     BevyContext, FontMapping, ImageManager,
 };
 
-use self::pipeline::ImageBindGroups;
+use self::pipeline::{ExtractQuadBundle, ExtractedQuad, ImageBindGroups, UIQuadType};
 
 pub mod font;
 pub mod image;
@@ -93,6 +95,28 @@ pub fn extract(
                     nine_patch::extract_nine_patch(&render_primitive, &image_manager, &images);
                 extracted_quads.extend(nine_patch_quads);
             }
+            RenderPrimitive::Clip { layout } => {
+                // dbg!(&layout);
+                extracted_quads.push(ExtractQuadBundle {
+                    extracted_quad: ExtractedQuad {
+                        rect: Rect {
+                            min: Vec2::new(layout.posx, layout.posy),
+                            max: Vec2::new(layout.posx + layout.width, layout.posy + layout.height),
+                        },
+                        color: Color::default(),
+                        vertex_index: 0,
+                        char_id: 0,
+                        z_index: layout.z_index,
+                        font_handle: None,
+                        quad_type: UIQuadType::Clip,
+                        type_index: 0,
+                        border_radius: (0.0, 0.0, 0.0, 0.0),
+                        image: None,
+                        uv_min: None,
+                        uv_max: None,
+                    },
+                });
+            }
             _ => {}
         }
     }
diff --git a/bevy_kayak_ui/src/render/unified/nine_patch/extract.rs b/bevy_kayak_ui/src/render/unified/nine_patch/extract.rs
index fc35595..7d55910 100644
--- a/bevy_kayak_ui/src/render/unified/nine_patch/extract.rs
+++ b/bevy_kayak_ui/src/render/unified/nine_patch/extract.rs
@@ -1,8 +1,8 @@
 use bevy::{
     math::Vec2,
     prelude::{Assets, Res},
-    render2::{color::Color, texture::Image},
-    sprite2::Rect,
+    render::{color::Color, texture::Image},
+    sprite::Rect,
 };
 use kayak_core::render_primitive::RenderPrimitive;
 
diff --git a/bevy_kayak_ui/src/render/unified/pipeline.rs b/bevy_kayak_ui/src/render/unified/pipeline.rs
index f3fe1ed..cbc8651 100644
--- a/bevy_kayak_ui/src/render/unified/pipeline.rs
+++ b/bevy_kayak_ui/src/render/unified/pipeline.rs
@@ -6,7 +6,7 @@ use bevy::{
     },
     math::{const_vec3, Mat4, Quat, Vec2, Vec3, Vec4},
     prelude::{Bundle, Component, Entity, FromWorld, Handle, Query, Res, ResMut, World},
-    render2::{
+    render::{
         color::Color,
         render_asset::RenderAssets,
         render_phase::{Draw, DrawFunctions, RenderPhase, TrackedRenderPass},
@@ -26,7 +26,7 @@ use bevy::{
         texture::{BevyDefault, GpuImage, Image},
         view::{ViewUniformOffset, ViewUniforms},
     },
-    sprite2::Rect,
+    sprite::Rect,
     utils::HashMap,
 };
 use bytemuck::{Pod, Zeroable};
@@ -255,7 +255,7 @@ impl FromWorld for UnifiedPipeline {
             label: Some("font_texture_array_view"),
             format: Some(TextureFormat::Rgba8UnormSrgb),
             dimension: Some(TextureViewDimension::D2),
-            aspect: bevy::render2::render_resource::TextureAspect::All,
+            aspect: bevy::render::render_resource::TextureAspect::All,
             base_mip_level: 0,
             base_array_layer: 0,
             mip_level_count: None,
@@ -305,6 +305,7 @@ pub enum UIQuadType {
     Quad,
     Text,
     Image,
+    Clip,
 }
 
 #[derive(Debug, Component, Clone)]
@@ -388,7 +389,11 @@ pub fn prepare_quads(
         &render_device,
     );
 
-    for (i, mut extracted_sprite) in extracted_quads.iter_mut().enumerate() {
+    for (i, mut extracted_sprite) in extracted_quads
+        .iter_mut()
+        .filter(|es| es.quad_type != UIQuadType::Clip)
+        .enumerate()
+    {
         let sprite_rect = extracted_sprite.rect;
         let color = extracted_sprite.color.as_linear_rgba_f32();
 
@@ -396,6 +401,7 @@ pub fn prepare_quads(
             UIQuadType::Quad => extracted_sprite.type_index = quad_type_offset,
             UIQuadType::Text => extracted_sprite.type_index = text_type_offset,
             UIQuadType::Image => extracted_sprite.type_index = image_type_offset,
+            UIQuadType::Clip => {}
         };
 
         let uv_min = extracted_sprite.uv_min.unwrap_or(Vec2::ZERO);
@@ -575,6 +581,16 @@ impl Draw<TransparentUI> for DrawUI {
         let view_uniform = views.get(view).unwrap();
         let quad_meta = quad_meta.into_inner();
         let extracted_quad = quads.get(item.entity).unwrap();
+
+        if extracted_quad.quad_type == UIQuadType::Clip {
+            let x = extracted_quad.rect.min.x as u32;
+            let y = extracted_quad.rect.min.y as u32;
+            let width = extracted_quad.rect.width() as u32;
+            let height = extracted_quad.rect.height() as u32;
+            pass.set_scissor_rect(x, y, width, height);
+            return;
+        }
+
         if let Some(pipeline) = pipelines.into_inner().get(item.pipeline) {
             pass.set_render_pipeline(pipeline);
             pass.set_vertex_buffer(0, quad_meta.vertices.buffer().unwrap().slice(..));
diff --git a/bevy_kayak_ui/src/render/unified/quad/extract.rs b/bevy_kayak_ui/src/render/unified/quad/extract.rs
index 97e3bbb..d919d85 100644
--- a/bevy_kayak_ui/src/render/unified/quad/extract.rs
+++ b/bevy_kayak_ui/src/render/unified/quad/extract.rs
@@ -1,4 +1,4 @@
-use bevy::{math::Vec2, sprite2::Rect};
+use bevy::{math::Vec2, sprite::Rect};
 use kayak_core::render_primitive::RenderPrimitive;
 
 use crate::{
diff --git a/examples/bevy.rs b/examples/bevy.rs
index 10aee13..de2fa16 100644
--- a/examples/bevy.rs
+++ b/examples/bevy.rs
@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Res, ResMut},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, UICameraBundle};
 use kayak_ui::core::Index;
@@ -42,6 +42,8 @@ fn startup(
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
+
         rsx! {
             <App styles={Some(styles.clone())}>
                 <Window position={(50.0, 50.0)} size={(300.0, 300.0)} title={"Window 1".to_string()}>
@@ -65,7 +67,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();
diff --git a/examples/clipping.rs b/examples/clipping.rs
new file mode 100644
index 0000000..f3fb5da
--- /dev/null
+++ b/examples/clipping.rs
@@ -0,0 +1,110 @@
+use bevy::{
+    math::Vec2,
+    prelude::{App as BevyApp, AssetServer, Commands, Handle, Res, ResMut},
+    window::{WindowDescriptor, Windows},
+    DefaultPlugins,
+};
+use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, ImageManager, UICameraBundle};
+use kayak_ui::core::{
+    layout_cache::Space,
+    rsx,
+    styles::{Style, StyleProp, Units},
+    Index,
+};
+use kayak_widgets::{App, Clip, NinePatch, Text};
+
+fn startup(
+    mut commands: Commands,
+    windows: Res<Windows>,
+    asset_server: Res<AssetServer>,
+    mut image_manager: ResMut<ImageManager>,
+    mut font_mapping: ResMut<FontMapping>,
+) {
+    commands.spawn_bundle(UICameraBundle::new());
+
+    let window_size = if let Some(window) = windows.get_primary() {
+        Vec2::new(window.width(), window.height())
+    } else {
+        panic!("Couldn't find primary window!");
+    };
+
+    font_mapping.add(asset_server.load("roboto.kayak_font"));
+
+    let handle: Handle<bevy::render::texture::Image> = asset_server.load("kenny/panel_brown.png");
+    let panel_brown_handle = image_manager.get(&handle);
+
+    let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
+        // Hack to trick the proc macro for right now..
+        let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
+
+        let nine_patch_styles = Style {
+            width: StyleProp::Value(Units::Pixels(512.0)),
+            height: StyleProp::Value(Units::Pixels(512.0)),
+            left: StyleProp::Value(Units::Stretch(1.0)),
+            right: StyleProp::Value(Units::Stretch(1.0)),
+            top: StyleProp::Value(Units::Stretch(1.0)),
+            bottom: StyleProp::Value(Units::Stretch(1.0)),
+            padding_left: StyleProp::Value(Units::Pixels(25.0)),
+            padding_right: StyleProp::Value(Units::Pixels(25.0)),
+            padding_top: StyleProp::Value(Units::Pixels(25.0)),
+            padding_bottom: StyleProp::Value(Units::Pixels(25.0)),
+            ..Style::default()
+        };
+
+        let clip_styles = Style {
+            // padding_left: StyleProp::Value(Units::Pixels(25.0)),
+            // padding_right: StyleProp::Value(Units::Pixels(25.0)),
+            // padding_top: StyleProp::Value(Units::Pixels(15.0)),
+            // padding_bottom: StyleProp::Value(Units::Pixels(125.0)),
+            ..Style::default()
+        };
+
+        let lorem_ipsum = r#"
+Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sed tellus neque. Proin tempus ligula a mi molestie aliquam. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam venenatis consequat ultricies. Sed ac orci purus. Nullam velit nisl, dapibus vel mauris id, dignissim elementum sapien. Vestibulum faucibus sapien ut erat bibendum, id lobortis nisi luctus. Mauris feugiat at lectus at pretium. Pellentesque vitae finibus ante. Nulla non ex neque. Cras varius, lorem facilisis consequat blandit, lorem mauris mollis massa, eget consectetur magna sem vel enim. Nam aliquam risus pulvinar, volutpat leo eget, eleifend urna. Suspendisse in magna sed ligula vehicula volutpat non vitae augue. Phasellus aliquam viverra consequat. Nam rhoncus molestie purus, sed laoreet neque imperdiet eget. Sed egestas metus eget sodales congue.
+
+Sed vel ante placerat, posuere lacus sit amet, tempus enim. Cras ullamcorper ex vitae metus consequat, a blandit leo semper. Nunc lacinia porta massa, a tempus leo laoreet nec. Sed vel metus tincidunt, scelerisque ex sit amet, lacinia dui. In sollicitudin pulvinar odio vitae hendrerit. Maecenas mollis tempor egestas. Nulla facilisi. Praesent nisi turpis, accumsan eu lobortis vestibulum, ultrices id nibh. Suspendisse sed dui porta, mollis elit sed, ornare sem. Cras molestie est libero, quis faucibus leo semper at.
+ 
+Nulla vel nisl rutrum, fringilla elit non, mollis odio. Donec convallis arcu neque, eget venenatis sem mattis nec. Nulla facilisi. Phasellus risus elit, vehicula sit amet risus et, sodales ultrices est. Quisque vulputate felis orci, non tristique leo faucibus in. Duis quis velit urna. Sed rhoncus dolor vel commodo aliquet. In sed tempor quam. Nunc non tempus ipsum. Praesent mi lacus, vehicula eu dolor eu, condimentum venenatis diam. In tristique ligula a ligula dictum, eu dictum lacus consectetur. Proin elementum egestas pharetra. Nunc suscipit dui ac nisl maximus, id congue velit volutpat. Etiam condimentum, mauris ac sodales tristique, est augue accumsan elit, ut luctus est mi ut urna. Mauris commodo, tortor eget gravida lacinia, leo est imperdiet arcu, a ullamcorper dui sapien eget erat.
+
+Vivamus pulvinar dui et elit volutpat hendrerit. Praesent luctus dolor ut rutrum finibus. Fusce ut odio ultrices, laoreet est at, condimentum turpis. Morbi at ultricies nibh. Mauris tempus imperdiet porta. Proin sit amet tincidunt eros. Quisque rutrum lacus ac est vehicula dictum. Pellentesque nec augue mi.
+
+Vestibulum rutrum imperdiet nisl, et consequat massa porttitor vel. Ut velit justo, vehicula a nulla eu, auctor eleifend metus. Ut egestas malesuada metus, sit amet pretium nunc commodo ac. Pellentesque gravida, nisl in faucibus volutpat, libero turpis mattis orci, vitae tincidunt ligula ligula ut tortor. Maecenas vehicula lobortis odio in molestie. Curabitur dictum elit sed arcu dictum, ut semper nunc cursus. Donec semper felis non nisl tincidunt elementum.
+        "#.to_string();
+
+        rsx! {
+            <App styles={Some(styles.clone())}>
+                <NinePatch
+                    styles={Some(nine_patch_styles)}
+                    border={Space {
+                        left: 30.0,
+                        right: 30.0,
+                        top: 30.0,
+                        bottom: 30.0,
+                    }}
+                    handle={panel_brown_handle}
+                >
+                    <Clip styles={Some(clip_styles)}>
+                        <Text content={lorem_ipsum} size={14.0} />
+                    </Clip>
+                </NinePatch>
+            </App>
+        }
+    });
+
+    commands.insert_resource(context);
+}
+
+fn main() {
+    BevyApp::new()
+        .insert_resource(WindowDescriptor {
+            width: 1270.0,
+            height: 720.0,
+            title: String::from("UI Example"),
+            ..Default::default()
+        })
+        .add_plugins(DefaultPlugins)
+        .add_plugin(BevyKayakUIPlugin)
+        .add_startup_system(startup)
+        .run();
+}
diff --git a/examples/counter.rs b/examples/counter.rs
index d8017eb..fd925c6 100644
--- a/examples/counter.rs
+++ b/examples/counter.rs
@@ -2,9 +2,9 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Res, ResMut},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
-use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, ImageManager, UICameraBundle};
+use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, UICameraBundle};
 use kayak_ui::core::{
     rsx,
     styles::{Style, StyleProp, Units},
@@ -15,11 +15,22 @@ use kayak_widgets::{App, Button, Text, Window};
 #[widget]
 fn Counter(context: &mut KayakContext) {
     let text_styles = Style {
+        bottom: StyleProp::Value(Units::Stretch(1.0)),
+        left: StyleProp::Value(Units::Stretch(0.1)),
+        right: StyleProp::Value(Units::Stretch(0.1)),
+        top: StyleProp::Value(Units::Stretch(1.0)),
+        width: StyleProp::Value(Units::Stretch(1.0)),
+        height: StyleProp::Value(Units::Pixels(28.0)),
+        ..Default::default()
+    };
+
+    let button_text_styles = Style {
         bottom: StyleProp::Value(Units::Stretch(1.0)),
         left: StyleProp::Value(Units::Stretch(1.0)),
         right: StyleProp::Value(Units::Stretch(1.0)),
         top: StyleProp::Value(Units::Stretch(1.0)),
-        height: StyleProp::Value(Units::Pixels(26.0)),
+        width: StyleProp::Value(Units::Pixels(67.0)),
+        height: StyleProp::Value(Units::Pixels(39.0)),
         ..Default::default()
     };
 
@@ -36,9 +47,9 @@ fn Counter(context: &mut KayakContext) {
     rsx! {
         <>
             <Window position={(50.0, 50.0)} size={(300.0, 300.0)} title={"Counter Example".to_string()}>
-                <Text size={32.0} content={format!("Current Count: {}", count_value).to_string()}>{}</Text>
+                <Text styles={Some(text_styles)} size={32.0} content={format!("Current Count: {}", count_value).to_string()}>{}</Text>
                 <Button on_event={Some(on_event)}>
-                    <Text styles={Some(text_styles)} size={24.0} content={"Count!".to_string()}>{}</Text>
+                    <Text styles={Some(button_text_styles)} size={24.0} content={"Count!".to_string()}>{}</Text>
                 </Button>
             </Window>
         </>
@@ -64,6 +75,8 @@ fn startup(
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
+
         rsx! {
             <App styles={Some(styles.clone())}>
                 <Counter />
@@ -82,7 +95,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();
diff --git a/examples/full_ui.rs b/examples/full_ui.rs
index b2e804f..efa0aca 100644
--- a/examples/full_ui.rs
+++ b/examples/full_ui.rs
@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Handle, Res, ResMut, World},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, ImageManager, UICameraBundle};
 use kayak_ui::core::{
@@ -25,9 +25,9 @@ fn BlueButton(context: KayakContext, children: Children, styles: Option<Style>)
 
         let (handle1, handle2) = {
             let asset_server = world.get_resource::<AssetServer>().unwrap();
-            let handle1: Handle<bevy::render2::texture::Image> =
+            let handle1: Handle<bevy::render::texture::Image> =
                 asset_server.load("../assets/kenny/buttonSquare_blue.png");
-            let handle2: Handle<bevy::render2::texture::Image> =
+            let handle2: Handle<bevy::render::texture::Image> =
                 asset_server.load("../assets/kenny/buttonSquare_blue_pressed.png");
 
             (handle1, handle2)
@@ -97,7 +97,7 @@ fn startup(
 
     font_mapping.add(asset_server.load("roboto.kayak_font"));
 
-    let handle: Handle<bevy::render2::texture::Image> = asset_server.load("kenny/panel_brown.png");
+    let handle: Handle<bevy::render::texture::Image> = asset_server.load("kenny/panel_brown.png");
     let panel_brown_handle = image_manager.get(&handle);
 
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
@@ -189,7 +189,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();
diff --git a/examples/global_counter.rs b/examples/global_counter.rs
index 17b1ac8..cbf2d0d 100644
--- a/examples/global_counter.rs
+++ b/examples/global_counter.rs
@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Res, ResMut, World},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, FontMapping, UICameraBundle};
 use kayak_ui::core::{bind, rsx, widget, Binding, Bound, Index, MutableBound};
@@ -59,6 +59,7 @@ fn startup(
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
         rsx! {
             <App styles={Some(styles.clone())}>
                 <Counter />
@@ -80,7 +81,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .add_system(count_up)
diff --git a/examples/image.rs b/examples/image.rs
index e2e95ef..178d9e6 100644
--- a/examples/image.rs
+++ b/examples/image.rs
@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Handle, Res, ResMut},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, ImageManager, UICameraBundle};
 use kayak_ui::core::{rsx, Index};
@@ -22,12 +22,13 @@ fn startup(
         panic!("Couldn't find primary window!");
     };
 
-    let handle: Handle<bevy::render2::texture::Image> = asset_server.load("panel.png");
+    let handle: Handle<bevy::render::texture::Image> = asset_server.load("panel.png");
     let ui_image_handle = image_manager.get(&handle);
 
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
         rsx! {
             <App styles={Some(styles.clone())}>
                 <Image handle={ui_image_handle} />
@@ -46,7 +47,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();
diff --git a/examples/nine_patch.rs b/examples/nine_patch.rs
index 016c438..238cf55 100644
--- a/examples/nine_patch.rs
+++ b/examples/nine_patch.rs
@@ -2,7 +2,7 @@ use bevy::{
     math::Vec2,
     prelude::{App as BevyApp, AssetServer, Commands, Handle, Res, ResMut},
     window::{WindowDescriptor, Windows},
-    PipelinedDefaultPlugins,
+    DefaultPlugins,
 };
 use kayak_ui::bevy::{BevyContext, BevyKayakUIPlugin, ImageManager, UICameraBundle};
 use kayak_ui::core::{
@@ -27,12 +27,13 @@ fn startup(
         panic!("Couldn't find primary window!");
     };
 
-    let handle: Handle<bevy::render2::texture::Image> = asset_server.load("panel.png");
+    let handle: Handle<bevy::render::texture::Image> = asset_server.load("panel.png");
     let ui_image_handle = image_manager.get(&handle);
 
     let context = BevyContext::new(window_size.x, window_size.y, |styles, context| {
         // Hack to trick the proc macro for right now..
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_ui::core::Children> = None;
 
         // The border prop splits up the image into 9 quadrants like so:
         // 1----2----3
@@ -90,7 +91,7 @@ fn main() {
             title: String::from("UI Example"),
             ..Default::default()
         })
-        .add_plugins(PipelinedDefaultPlugins)
+        .add_plugins(DefaultPlugins)
         .add_plugin(BevyKayakUIPlugin)
         .add_startup_system(startup)
         .run();
diff --git a/kayak_core/src/widget_manager.rs b/kayak_core/src/widget_manager.rs
index 0a39d64..799a041 100644
--- a/kayak_core/src/widget_manager.rs
+++ b/kayak_core/src/widget_manager.rs
@@ -3,8 +3,6 @@ use std::{
     sync::{Arc, Mutex},
 };
 
-use morphorm::Hierarchy;
-
 use crate::{
     layout_cache::LayoutCache,
     node::{Node, NodeBuilder, NodeIndex},
@@ -259,6 +257,7 @@ impl WidgetManager {
         layout_cache: &LayoutCache,
         nodes: &Arena<Option<Node>>,
         current_node: Index,
+        mut main_z_index: f32,
     ) -> Vec<RenderPrimitive> {
         let mut render_primitives = Vec::new();
 
@@ -266,21 +265,36 @@ impl WidgetManager {
             if let Some(layout) = layout_cache.rect.get(&NodeIndex(current_node)) {
                 let mut render_primitive: RenderPrimitive = (&node.styles).into();
                 let mut layout = *layout;
-                layout.z_index = node.z;
+                let new_z_index = if matches!(render_primitive, RenderPrimitive::Clip { .. }) {
+                    main_z_index - 0.1
+                } else {
+                    main_z_index
+                };
+                layout.z_index = new_z_index;
                 render_primitive.set_layout(layout);
                 render_primitives.push(render_primitive.clone());
 
                 if node_tree.children.contains_key(&current_node) {
                     for child in node_tree.children.get(&current_node).unwrap() {
+                        main_z_index += 1.0;
                         render_primitives.extend(Self::recurse_node_tree_to_build_primitives(
                             node_tree,
                             layout_cache,
                             nodes,
                             *child,
+                            main_z_index,
                         ));
 
+                        main_z_index = layout.z_index;
                         // Between each child node we need to reset the clip.
                         if matches!(render_primitive, RenderPrimitive::Clip { .. }) {
+                            main_z_index = new_z_index;
+                            match &mut render_primitive {
+                                RenderPrimitive::Clip { layout } => {
+                                    layout.z_index = main_z_index + 0.1;
+                                }
+                                _ => {}
+                            };
                             render_primitives.push(render_primitive.clone());
                         }
                     }
@@ -297,6 +311,7 @@ impl WidgetManager {
             &self.layout_cache,
             &self.nodes,
             self.node_tree.root_node,
+            0.0,
         )
     }
 
diff --git a/kayak_render_macros/examples/main.rs b/kayak_render_macros/examples/main.rs
index 5fcb608..83d2864 100644
--- a/kayak_render_macros/examples/main.rs
+++ b/kayak_render_macros/examples/main.rs
@@ -48,6 +48,7 @@ fn main() {
         let foo = 10;
         let test_styles = Style::default();
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_core::Children> = None;
         rsx! {
             <Fragment>
                 <Test foo={10}>
@@ -66,6 +67,7 @@ fn main() {
         let test_styles = Style::default();
 
         let parent_id: Option<Index> = None;
+        let children: Option<kayak_core::Children> = None;
         rsx! {
             <Fragment>
                 <Test foo={foo} styles={Some(test_styles)}>
diff --git a/kayak_render_macros/src/arc_function.rs b/kayak_render_macros/src/arc_function.rs
index bc5c1ad..0e280e9 100644
--- a/kayak_render_macros/src/arc_function.rs
+++ b/kayak_render_macros/src/arc_function.rs
@@ -14,6 +14,7 @@ pub fn build_arc_function(
     };
 
     quote! {
+        let children = children.clone();
         let #widget_name = #children_quotes;
         let (should_rerender, child_id) =
             context
diff --git a/kayak_render_macros/src/children.rs b/kayak_render_macros/src/children.rs
index 2935b19..87bcb27 100644
--- a/kayak_render_macros/src/children.rs
+++ b/kayak_render_macros/src/children.rs
@@ -114,6 +114,8 @@ impl Children {
                     }
                 }
 
+                all_attributes.insert("children".to_string());
+
                 let base_matching: Vec<proc_macro2::TokenStream> = all_attributes
                     .iter()
                     .map(|a| format!("base_{}", a).to_string().parse().unwrap())
diff --git a/kayak_widgets/src/app.rs b/kayak_widgets/src/app.rs
index 5cba4c6..0ff42b4 100644
--- a/kayak_widgets/src/app.rs
+++ b/kayak_widgets/src/app.rs
@@ -1,11 +1,13 @@
-use kayak_ui::core::{rsx, widget, Children};
 use kayak_ui::core::derivative::*;
+use kayak_ui::core::{rsx, widget, Children};
+
+use crate::Clip;
 
 #[widget]
 pub fn App(children: Children) {
     rsx! {
-        <>
+        <Clip>
             {children}
-        </>
+        </Clip>
     }
 }
diff --git a/kayak_widgets/src/button.rs b/kayak_widgets/src/button.rs
index efd31db..31a3648 100644
--- a/kayak_widgets/src/button.rs
+++ b/kayak_widgets/src/button.rs
@@ -11,6 +11,7 @@ pub fn Button(children: Children, styles: Option<Style>) {
     let base_styles = styles.clone().unwrap_or_default();
     *styles = Some(Style {
         render_command: StyleProp::Value(RenderCommand::Quad),
+        border_radius: StyleProp::Value((5.0, 5.0, 5.0, 5.0)),
         height: if base_styles.height == StyleProp::Default {
             StyleProp::Value(Units::Pixels(45.0))
         } else {
@@ -21,6 +22,8 @@ pub fn Button(children: Children, styles: Option<Style>) {
         } else {
             base_styles.background_color
         },
+        padding_left: StyleProp::Value(Units::Stretch(1.0)),
+        padding_right: StyleProp::Value(Units::Stretch(1.0)),
         ..base_styles
     });
     rsx! {
diff --git a/kayak_widgets/src/clip.rs b/kayak_widgets/src/clip.rs
index 86cbb64..db5787e 100644
--- a/kayak_widgets/src/clip.rs
+++ b/kayak_widgets/src/clip.rs
@@ -1,16 +1,18 @@
 use kayak_ui::core::{
     render_command::RenderCommand,
     rsx,
-    styles::{Style, StyleProp},
+    styles::{Style, StyleProp, Units},
     widget, Children,
 };
 
 #[widget]
 pub fn Clip(children: Children, styles: Option<Style>) {
-    if styles.is_none() {
-        *styles = Some(Style::default())
-    }
-    styles.as_mut().unwrap().render_command = StyleProp::Value(RenderCommand::Clip);
+    *styles = Some(Style {
+        render_command: StyleProp::Value(RenderCommand::Clip),
+        width: StyleProp::Value(Units::Stretch(1.0)),
+        height: StyleProp::Value(Units::Stretch(1.0)),
+        ..styles.clone().unwrap_or_default()
+    });
     rsx! {
         <>
             {children}
diff --git a/kayak_widgets/src/element.rs b/kayak_widgets/src/element.rs
new file mode 100644
index 0000000..be6c883
--- /dev/null
+++ b/kayak_widgets/src/element.rs
@@ -0,0 +1,10 @@
+use kayak_ui::core::{rsx, widget, Children};
+
+#[widget]
+pub fn Element(children: Children) {
+    rsx! {
+        <>
+            {children}
+        </>
+    }
+}
diff --git a/kayak_widgets/src/lib.rs b/kayak_widgets/src/lib.rs
index d59d930..24834a9 100644
--- a/kayak_widgets/src/lib.rs
+++ b/kayak_widgets/src/lib.rs
@@ -2,6 +2,7 @@ mod app;
 mod background;
 mod button;
 mod clip;
+mod element;
 mod image;
 mod nine_patch;
 mod text;
@@ -11,6 +12,7 @@ pub use app::*;
 pub use background::*;
 pub use button::*;
 pub use clip::*;
+pub use element::*;
 pub use image::*;
 pub use nine_patch::*;
 pub use text::*;
diff --git a/kayak_widgets/src/window.rs b/kayak_widgets/src/window.rs
index e403916..33fdd4d 100644
--- a/kayak_widgets/src/window.rs
+++ b/kayak_widgets/src/window.rs
@@ -6,7 +6,7 @@ use kayak_ui::core::{
     widget, Children, Fragment,
 };
 
-use crate::{Background, Clip, Text};
+use crate::{Background, Clip, Element, Text};
 
 #[widget]
 pub fn Window(
@@ -25,21 +25,25 @@ pub fn Window(
         top: StyleProp::Value(Units::Pixels(position.1)),
         width: StyleProp::Value(Units::Pixels(size.0)),
         height: StyleProp::Value(Units::Pixels(size.1)),
+        ..styles.clone().unwrap_or_default()
+    });
+
+    let clip_styles = Style {
         padding_left: StyleProp::Value(Units::Pixels(5.0)),
         padding_right: StyleProp::Value(Units::Pixels(5.0)),
         padding_top: StyleProp::Value(Units::Pixels(5.0)),
         padding_bottom: StyleProp::Value(Units::Pixels(5.0)),
-        ..styles.clone().unwrap_or_default()
-    });
+        ..Style::default()
+    };
 
     let title_background_styles = Style {
         background_color: StyleProp::Value(Color::new(0.0781, 0.0898, 0.101, 1.0)),
         border_radius: StyleProp::Value((5.0, 0.0, 0.0, 5.0)),
         height: StyleProp::Value(Units::Pixels(24.0)),
-        left: StyleProp::Value(Units::Pixels(-5.0)),
-        right: StyleProp::Value(Units::Pixels(-5.0)),
-        top: StyleProp::Value(Units::Pixels(-5.0)),
-        bottom: StyleProp::Value(Units::Pixels(-5.0)),
+        left: StyleProp::Value(Units::Pixels(0.0)),
+        right: StyleProp::Value(Units::Pixels(0.0)),
+        top: StyleProp::Value(Units::Pixels(0.0)),
+        bottom: StyleProp::Value(Units::Pixels(0.0)),
         padding_left: StyleProp::Value(Units::Pixels(5.0)),
         padding_top: StyleProp::Value(Units::Stretch(1.0)),
         padding_bottom: StyleProp::Value(Units::Stretch(1.0)),
@@ -47,20 +51,28 @@ pub fn Window(
     };
 
     let title_text_styles = Style {
-        height: StyleProp::Value(Units::Pixels(22.0)),
+        height: StyleProp::Value(Units::Pixels(25.0)),
+        ..Style::default()
+    };
+
+    let content_styles = Style {
+        padding_left: StyleProp::Value(Units::Stretch(1.0)),
+        padding_right: StyleProp::Value(Units::Stretch(1.0)),
+        padding_top: StyleProp::Value(Units::Stretch(1.0)),
+        padding_bottom: StyleProp::Value(Units::Stretch(1.0)),
         ..Style::default()
     };
 
     let title = title.clone();
     rsx! {
         <Fragment>
-            <Clip>
+            <Clip styles={Some(clip_styles)}>
                 <Background styles={Some(title_background_styles)}>
                     <Text styles={Some(title_text_styles)} size={16.0} content={title}>{}</Text>
                 </Background>
-            </Clip>
-            <Clip>
-                {children}
+                <Element styles={Some(content_styles)}>
+                    {children}
+                </Element>
             </Clip>
         </Fragment>
     }
-- 
GitLab