diff --git a/crates/zu-docs/src/views/inputs/button_page.rs b/crates/zu-docs/src/views/inputs/button_page.rs
index 0563c5843..e4114e92b 100644
--- a/crates/zu-docs/src/views/inputs/button_page.rs
+++ b/crates/zu-docs/src/views/inputs/button_page.rs
@@ -6,7 +6,7 @@ use stylist::Style;
use yew::{classes, function_component, html, Html, MouseEvent};
use zu::button::Button;
use zu::icon_button::IconButton;
-use zu::loading_button::LoadingButton;
+use zu::loading_button::{LoadingButton, Position};
use zu::r#box::Box;
use zu::styles::button_variant::ButtonVariant as Variant;
use zu::styles::color::Color;
@@ -154,26 +154,9 @@ fn create_icons_and_labels_view() -> Html {
}
}
-fn create_icon_button_view() -> Html {
+fn create_icon_button_sizes_view() -> Html {
html! {
<>
- {"Icon button"}
- {"Icon buttons are commonly found in app bars and toolbars."}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
{"Sizes"}
{"For larger or smaller icon buttons, use the size prop."}
@@ -190,7 +173,13 @@ fn create_icon_button_view() -> Html {
+
+ }
+}
+fn create_icon_button_colors_view() -> Html {
+ html! {
+ <>
{"Colors"}
{"Use color prop to apply theme color palette to component."}
@@ -217,6 +206,33 @@ fn create_icon_button_view() -> Html {
}
}
+fn create_icon_button_view() -> Html {
+ html! {
+ <>
+ {"Icon button"}
+ {"Icon buttons are commonly found in app bars and toolbars."}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {create_icon_button_sizes_view()}
+ {create_icon_button_colors_view()}
+
+
+ }
+}
+
fn create_loading_button_view() -> Html {
html! {
<>
@@ -229,7 +245,7 @@ fn create_loading_button_view() -> Html {
{"Fetch data"}
- }} variant={Variant::Outlined}>
{"Save"}
diff --git a/crates/zu/src/loading_button/mod.rs b/crates/zu/src/loading_button/mod.rs
index b01aea2d8..d6eef2d5f 100644
--- a/crates/zu/src/loading_button/mod.rs
+++ b/crates/zu/src/loading_button/mod.rs
@@ -24,11 +24,17 @@ pub struct Props {
pub loading: bool,
#[prop_or_default]
- pub loading_indicator: Option,
+ pub loading_indicator: AttrValue,
#[prop_or_default]
pub loading_position: Position,
+ #[prop_or_default]
+ pub start_icon: Option,
+
+ #[prop_or_default]
+ pub end_icon: Option,
+
#[prop_or_default]
pub style: AttrValue,