[yew-devel] [PATCH yew-widget-toolkit v2 11/12] touch: fab menu: convert to widget macro

Dominik Csapak d.csapak at proxmox.com
Mon Jun 30 10:25:08 CEST 2025


This does many things we did here manually.

Signed-off-by: Dominik Csapak <d.csapak at proxmox.com>
---
 src/touch/fab_menu.rs | 57 ++++++-------------------------------------
 1 file changed, 8 insertions(+), 49 deletions(-)

diff --git a/src/touch/fab_menu.rs b/src/touch/fab_menu.rs
index 4ad1234..92f2331 100644
--- a/src/touch/fab_menu.rs
+++ b/src/touch/fab_menu.rs
@@ -1,12 +1,10 @@
-use std::rc::Rc;
-
-use yew::html::IntoPropValue;
 use yew::prelude::*;
-use yew::virtual_dom::{Key, VComp, VNode};
 
 use crate::props::{ContainerBuilder, EventSubscriber, WidgetBuilder};
 use crate::widget::Container;
 
+use pwt_macros::{builder, widget};
+
 use super::Fab;
 
 /// [FabMenu] direction.
@@ -27,12 +25,10 @@ pub enum FabMenuAlign {
 }
 
 /// Favorite actions button Menu.
+#[widget(pwt=crate, comp=PwtFabMenu, @element)]
 #[derive(Properties, Clone, PartialEq)]
+#[builder]
 pub struct FabMenu {
-    /// The yew component key.
-    #[prop_or_default]
-    pub key: Option<Key>,
-
     /// Main button Icon (CSS class).
     #[prop_or_default]
     pub main_icon_class: Option<Classes>,
@@ -43,11 +39,13 @@ pub struct FabMenu {
 
     /// Menu popup direction
     #[prop_or(FabMenuDirection::Up)]
+    #[builder]
     pub direction: FabMenuDirection,
 
     /// Menu alignment
     ///
     #[prop_or(FabMenuAlign::Center)]
+    #[builder]
     pub align: FabMenuAlign,
 
     /// Child buttons, which popup when main button is pressed.
@@ -69,17 +67,6 @@ impl FabMenu {
         yew::props!(Self {})
     }
 
-    /// Builder style method to set the yew `key` property
-    pub fn key(mut self, key: impl IntoPropValue<Option<Key>>) -> Self {
-        self.set_key(key);
-        self
-    }
-
-    /// Method to set the yew `key` property
-    pub fn set_key(&mut self, key: impl IntoPropValue<Option<Key>>) {
-        self.key = key.into_prop_value();
-    }
-
     /// Builder style method to set the icon class for the main button.
     pub fn main_icon_class(mut self, class: impl Into<Classes>) -> Self {
         self.set_main_icon_class(class);
@@ -106,28 +93,6 @@ impl FabMenu {
         }
     }
 
-    /// Builder style method to set the popup alignment
-    pub fn align(mut self, align: FabMenuAlign) -> Self {
-        self.set_align(align);
-        self
-    }
-
-    /// Method to set the popup alignment
-    pub fn set_align(&mut self, align: FabMenuAlign) {
-        self.align = align;
-    }
-
-    /// Builder style method to set the popup direction
-    pub fn direction(mut self, direction: FabMenuDirection) -> Self {
-        self.set_direction(direction);
-        self
-    }
-
-    /// Method to set the popup direction
-    pub fn set_direction(&mut self, direction: FabMenuDirection) {
-        self.direction = direction;
-    }
-
     /// Builder style method to add a child button
     pub fn with_child(mut self, child: impl Into<Fab>) -> Self {
         self.add_child(child);
@@ -180,6 +145,8 @@ impl Component for PwtFabMenu {
         };
 
         let mut container = Container::new()
+            .with_std_props(&props.std_props)
+            .listeners(&props.listeners)
             .class("pwt-fab-menu-container")
             .class(match props.align {
                 FabMenuAlign::Start => Some("pwt-fab-align-start"),
@@ -232,11 +199,3 @@ impl Component for PwtFabMenu {
         container.into()
     }
 }
-
-impl From<FabMenu> for VNode {
-    fn from(val: FabMenu) -> Self {
-        let key = val.key.clone();
-        let comp = VComp::new::<PwtFabMenu>(Rc::new(val), key);
-        VNode::from(comp)
-    }
-}
-- 
2.39.5





More information about the yew-devel mailing list