[PATCH yew-widget-toolkit/yew-widget-toolkit-assets 0/3] fix some field issues

[PATCH yew-widget-toolkit/yew-widget-toolkit-assets 0/3] fix some field issues

[Dominik Csapak]

Fixes two issues with fields/input panel:
* give the box label of checkboxes the correct opacity
* fix input panels with multiple custom children

note that the first pwt patch needs the correct assets since it adds
new css classes


proxmox-yew-widget-toolkit-assets:

Dominik Csapak (1):
  utilities: generate a class for each element state opacity

 scss/_utilities.scss | 7 +++++++
 1 file changed, 7 insertions(+)


proxmox-yew-widget-toolkit:

Dominik Csapak (2):
  widget: checkbox: make box-label adhere to disabled state
  widget: input panel: correctly generate keys for custom children

 src/widget/form/checkbox.rs |  6 ++++-
 src/widget/input_panel.rs   | 49 +++++++++++++++++++------------------
 2 files changed, 30 insertions(+), 25 deletions(-)


Summary over all repositories:
  3 files changed, 37 insertions(+), 25 deletions(-)

-- 
Generated by murpp 0.11.0

[PATCH yew-widget-toolkit-assets 1/3] utilities: generate a class for each element state opacity

[Dominik Csapak]

currently only 'disabled' exists there, but having this is useful as a
generic class to set the opacity according to state.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 scss/_utilities.scss | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 58bc8e6..62178b8 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -471,6 +471,13 @@ $position-values: absolute fixed relative sticky static;
     }
 }
 
+@each $state, $value in $element-state-opacity {
+    .pwt-opacity-#{$state} {
+        $var: "var(--pwt-" + $state + "-opacity)";
+        opacity: #{$var};
+    }
+}
+
 @keyframes delay-visibility {
     from {
         opacity: 0
-- 
2.47.3

[PATCH yew-widget-toolkit 2/3] widget: checkbox: make box-label adhere to disabled state

[Dominik Csapak]

when using the box-label instead of a normal label, the box-label was
not using the correct opacity. Use the new `pwt-opacity-disabled` class
to fix it.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 src/widget/form/checkbox.rs | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/widget/form/checkbox.rs b/src/widget/form/checkbox.rs
index 435ec26..b656bae 100644
--- a/src/widget/form/checkbox.rs
+++ b/src/widget/form/checkbox.rs
@@ -316,7 +316,11 @@ impl ManagedField for CheckboxField {
                     .into_html_with_ref(self.node_ref.clone()),
             );
 
-        let box_label = props.box_label.clone().map(|label| label.padding_start(2));
+        let box_label = props.box_label.clone().map(|label| {
+            label
+                .padding_start(2)
+                .class(disabled.then_some("pwt-opacity-disabled"))
+        });
 
         let checkbox = Row::new()
             .class(AlignItems::Center)
-- 
2.47.3

[PATCH yew-widget-toolkit 3/3] widget: input panel: correctly generate keys for custom children

[Dominik Csapak]

The input panel tries to extract a key from a custom child, but
generates one if it can't. This generated key accidentally only included
the `left_count` for its ID so two custom child (one on the left and one
on the right in the same row) would get the same key, which leads to
buggy and glitchy behavior (yews dom handling does not expect duplicate
keys).

Fix this by generating truly unique keys by including the row and column
position, as well as the advanced state, like we do for normal fields.

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
---
 src/widget/input_panel.rs | 49 ++++++++++++++++++++-------------------
 1 file changed, 25 insertions(+), 24 deletions(-)

diff --git a/src/widget/input_panel.rs b/src/widget/input_panel.rs
index 4c86bc4..d22049e 100644
--- a/src/widget/input_panel.rs
+++ b/src/widget/input_panel.rs
@@ -215,32 +215,33 @@ impl InputPanel {
             visible = false;
         }
 
-        let style = if visible {
-            let (row, start, span) = if self.mobile {
-                self.left_count += 1; // ignore position
-                (self.left_count, 1, -1)
-            } else {
-                match column {
-                    FieldPosition::Left => {
-                        self.left_count += 1;
-                        (self.left_count, 1, 3)
-                    }
-                    FieldPosition::Right => {
-                        self.two_column = true;
-                        self.right_count += 1;
-                        (self.right_count, 4, -1)
-                    }
-                    FieldPosition::Large => {
-                        self.two_column = true;
+        let (row, start, span) = if self.mobile {
+            self.left_count += 1; // ignore position
+            (self.left_count, 1, -1)
+        } else {
+            match column {
+                FieldPosition::Left => {
+                    self.left_count += 1;
+                    (self.left_count, 1, 3)
+                }
+                FieldPosition::Right => {
+                    self.two_column = true;
+                    self.right_count += 1;
+                    (self.right_count, 4, -1)
+                }
+                FieldPosition::Large => {
+                    self.two_column = true;
 
-                        let max = self.left_count.max(self.right_count);
-                        self.left_count = max + 1;
-                        self.right_count = max + 1;
+                    let max = self.left_count.max(self.right_count);
+                    self.left_count = max + 1;
+                    self.right_count = max + 1;
 
-                        (self.left_count, 1, -1)
-                    }
+                    (self.left_count, 1, -1)
                 }
-            };
+            }
+        };
+
+        let style = if visible {
             format!("grid-row: {}; grid-column: {}/{};", row, start, span)
         } else {
             "display: none;".to_string()
@@ -251,7 +252,7 @@ impl InputPanel {
             None => {
                 #[cfg(debug_assertions)]
                 log::warn!("could not extract key from custom child, generating one");
-                yew::virtual_dom::Key::from(format!("cl_{}", self.left_count))
+                Key::from(format!("c_{}_{}_{}", start, row, advanced))
             }
         };
 
-- 
2.47.3

applied: [PATCH yew-widget-toolkit-assets 1/3] utilities: generate a class for each element state opacity

[Dietmar Maurer]

applied

applied: [PATCH yew-widget-toolkit/yew-widget-toolkit-assets 0/3] fix some field issues

[Dietmar Maurer]

applied all patches