Support disabled attribute on checkboxes

DioxusLabs · Sep 7, 2024 · 00427a8 · 00427a8
1 parent bea7717
commit 00427a8
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 3 deletions.
diff --git a/packages/blitz/src/renderer/render.rs b/packages/blitz/src/renderer/render.rs
@@ -1214,15 +1214,27 @@ impl ElementCx<'_> {
             && matches!(self.element.attr(local_name!("type")), Some("checkbox"))
         {
             let checked = self.element.attr(local_name!("checked")).is_some();
+            let disabled = self.element.attr(local_name!("disabled")).is_some();
 
             // TODO this should be coming from css accent-color, but I couldn't find how to retrieve it
-            let accent_color = self.style.get_inherited_text().color.as_vello();
+            let accent_color = if disabled {
+                peniko::Color {
+                    r: 209,
+                    g: 209,
+                    b: 209,
+                    a: 255,
+                }
+            } else {
+                self.style.get_inherited_text().color.as_vello()
+            };
 
-            let scale = self
+            let scale = (self
                 .frame
                 .outer_rect
                 .width()
                 .min(self.frame.outer_rect.height())
+                - 4.0)
+                .max(0.0)
                 / 16.0;
 
             let frame = self.frame.outer_rect.to_rounded_rect(scale * 2.0);
@@ -1236,7 +1248,7 @@ impl ElementCx<'_> {
                 path.line_to((6.0, 13.0));
                 path.line_to((14.0, 2.0));
 
-                path.apply_affine(Affine::scale(scale));
+                path.apply_affine(Affine::translate(Vec2 { x: 2.0, y: 1.0 }).then_scale(scale));
 
                 let style = Stroke {
                     width: 2.0 * scale,

diff --git a/packages/dom/src/document.rs b/packages/dom/src/document.rs
@@ -129,6 +129,11 @@ impl DocumentLike for Document {
                         return true;
                     };
 
+                    let disabled = el.attr(local_name!("disabled")).is_some();
+                    if disabled {
+                        return true;
+                    }
+
                     if let NodeSpecificData::TextInput(ref mut text_input_data) =
                         el.node_specific_data
                     {