1 files changed, 73 insertions, 17 deletions

diff --git a/native/src/element.rs b/native/src/element.rs
index 5c84a388..ee404a1c 100644
--- a/native/src/element.rs
+++ b/native/src/element.rs
@@ -1,6 +1,8 @@
 use crate::event::{self, Event};
 use crate::layout;
+use crate::mouse;
 use crate::overlay;
+use crate::renderer;
 use crate::{
     Clipboard, Color, Hasher, Layout, Length, Point, Rectangle, Widget,
 };
@@ -77,7 +79,7 @@ where
     ///
     /// ```
     /// # mod counter {
-    /// #     type Text = iced_native::Text<iced_native::renderer::Null>;
+    /// #     type Text = iced_native::widget::Text<iced_native::renderer::Null>;
     /// #
     /// #     #[derive(Debug, Clone, Copy)]
     /// #     pub enum Message {}
@@ -104,7 +106,8 @@ where
     /// # pub enum Message {
     /// #    Counter(usize, counter::Message)
     /// # }
-    /// use iced_native::{Element, Row};
+    /// use iced_native::Element;
+    /// use iced_native::widget::Row;
     /// use iced_wgpu::Renderer;
     ///
     /// impl ManyCounters {
@@ -189,7 +192,7 @@ where
     ) -> Element<'a, Message, Renderer>
     where
         Message: 'static,
-        Renderer: 'a + layout::Debugger,
+        Renderer: 'a,
     {
         Element {
             widget: Box::new(Explain::new(self, color.into())),
@@ -241,13 +244,24 @@ where
     pub fn draw(
         &self,
         renderer: &mut Renderer,
-        defaults: &Renderer::Defaults,
+        style: &renderer::Style,
+        layout: Layout<'_>,
+        cursor_position: Point,
+        viewport: &Rectangle,
+    ) {
+        self.widget
+            .draw(renderer, style, layout, cursor_position, viewport)
+    }
+
+    /// Returns the current [`mouse::Interaction`] of the [`Element`].
+    pub fn mouse_interaction(
+        &self,
         layout: Layout<'_>,
         cursor_position: Point,
         viewport: &Rectangle,
-    ) -> Renderer::Output {
+    ) -> mouse::Interaction {
         self.widget
-            .draw(renderer, defaults, layout, cursor_position, viewport)
+            .mouse_interaction(layout, cursor_position, viewport)
     }
 
     /// Computes the _layout_ hash of the [`Element`].
@@ -336,13 +350,23 @@ where
     fn draw(
         &self,
         renderer: &mut Renderer,
-        defaults: &Renderer::Defaults,
+        style: &renderer::Style,
+        layout: Layout<'_>,
+        cursor_position: Point,
+        viewport: &Rectangle,
+    ) {
+        self.widget
+            .draw(renderer, style, layout, cursor_position, viewport)
+    }
+
+    fn mouse_interaction(
+        &self,
         layout: Layout<'_>,
         cursor_position: Point,
         viewport: &Rectangle,
-    ) -> Renderer::Output {
+    ) -> mouse::Interaction {
         self.widget
-            .draw(renderer, defaults, layout, cursor_position, viewport)
+            .mouse_interaction(layout, cursor_position, viewport)
     }
 
     fn hash_layout(&self, state: &mut Hasher) {
@@ -378,7 +402,7 @@ where
 impl<'a, Message, Renderer> Widget<Message, Renderer>
     for Explain<'a, Message, Renderer>
 where
-    Renderer: crate::Renderer + layout::Debugger,
+    Renderer: crate::Renderer,
 {
     fn width(&self) -> Length {
         self.element.widget.width()
@@ -418,19 +442,51 @@ where
     fn draw(
         &self,
         renderer: &mut Renderer,
-        defaults: &Renderer::Defaults,
+        style: &renderer::Style,
         layout: Layout<'_>,
         cursor_position: Point,
         viewport: &Rectangle,
-    ) -> Renderer::Output {
-        renderer.explain(
-            defaults,
-            self.element.widget.as_ref(),
+    ) {
+        fn explain_layout<Renderer: crate::Renderer>(
+            renderer: &mut Renderer,
+            color: Color,
+            layout: Layout<'_>,
+        ) {
+            renderer.fill_quad(
+                renderer::Quad {
+                    bounds: layout.bounds(),
+                    border_color: color,
+                    border_width: 1.0,
+                    border_radius: 0.0,
+                },
+                Color::TRANSPARENT,
+            );
+
+            for child in layout.children() {
+                explain_layout(renderer, color, child);
+            }
+        }
+
+        self.element.widget.draw(
+            renderer,
+            style,
             layout,
             cursor_position,
             viewport,
-            self.color,
-        )
+        );
+
+        explain_layout(renderer, self.color, layout);
+    }
+
+    fn mouse_interaction(
+        &self,
+        layout: Layout<'_>,
+        cursor_position: Point,
+        viewport: &Rectangle,
+    ) -> mouse::Interaction {
+        self.element
+            .widget
+            .mouse_interaction(layout, cursor_position, viewport)
     }
 
     fn hash_layout(&self, state: &mut Hasher) {