Merge branch 'master' into feature/shrink-by-default

web/src/style.rs

@@ -139,7 +139,7 @@ pub fn length(length: Length) -> String {
     match length {
         Length::Shrink => String::from("auto"),
         Length::Units(px) => format!("{}px", px),
-        Length::Fill => String::from("100%"),
+        Length::Fill | Length::FillPortion(_) => String::from("100%"),
     }
 }
 

web/src/widget.rs

@@ -28,6 +28,7 @@ mod container;
 mod image;
 mod radio;
 mod row;
+mod space;
 mod text;
 
 #[doc(no_inline)]
@@ -47,6 +48,7 @@ pub use container::Container;
 pub use image::Image;
 pub use radio::Radio;
 pub use row::Row;
+pub use space::Space;
 
 /// A component that displays information and allows interaction.
 ///

web/src/widget/image.rs

@@ -67,7 +67,7 @@ impl<Message> Widget<Message> for Image {
 
         match self.width {
             Length::Shrink => {}
-            Length::Fill => {
+            Length::Fill | Length::FillPortion(_) => {
                 image = image.attr("width", "100%");
             }
             Length::Units(px) => {

web/src/widget/space.rs

@@ -0,0 +1,69 @@
+use crate::{style, Bus, Element, Length, Widget};
+use dodrio::bumpalo;
+
+/// An amount of empty space.
+///
+/// It can be useful if you want to fill some space with nothing.
+#[derive(Debug)]
+pub struct Space {
+    width: Length,
+    height: Length,
+}
+
+impl Space {
+    /// Creates an amount of empty [`Space`] with the given width and height.
+    ///
+    /// [`Space`]: struct.Space.html
+    pub fn new(width: Length, height: Length) -> Self {
+        Space { width, height }
+    }
+
+    /// Creates an amount of horizontal [`Space`].
+    ///
+    /// [`Space`]: struct.Space.html
+    pub fn with_width(width: Length) -> Self {
+        Space {
+            width,
+            height: Length::Shrink,
+        }
+    }
+
+    /// Creates an amount of vertical [`Space`].
+    ///
+    /// [`Space`]: struct.Space.html
+    pub fn with_height(height: Length) -> Self {
+        Space {
+            width: Length::Shrink,
+            height,
+        }
+    }
+}
+
+impl<'a, Message> Widget<Message> for Space {
+    fn node<'b>(
+        &self,
+        bump: &'b bumpalo::Bump,
+        _publish: &Bus<Message>,
+        _style_sheet: &mut style::Sheet<'b>,
+    ) -> dodrio::Node<'b> {
+        use dodrio::builder::*;
+
+        let width = style::length(self.width);
+        let height = style::length(self.height);
+
+        let style = bumpalo::format!(
+            in bump,
+            "width: {}; height: {};",
+            width,
+            height
+        );
+
+        div(bump).attr("style", style.into_bump_str()).finish()
+    }
+}
+
+impl<'a, Message> From<Space> for Element<'a, Message> {
+    fn from(space: Space) -> Element<'a, Message> {
+        Element::new(space)
+    }
+}

web/src/widget/text_input.rs

@@ -32,6 +32,7 @@ pub struct TextInput<'a, Message> {
     _state: &'a mut State,
     placeholder: String,
     value: String,
+    is_secure: bool,
     width: Length,
     max_width: Length,
     padding: u16,
@@ -64,6 +65,7 @@ impl<'a, Message> TextInput<'a, Message> {
             _state: state,
             placeholder: String::from(placeholder),
             value: String::from(value),
+            is_secure: false,
             width: Length::Fill,
             max_width: Length::Shrink,
             padding: 0,
@@ -73,6 +75,14 @@ impl<'a, Message> TextInput<'a, Message> {
         }
     }
 
+    /// Converts the [`TextInput`] into a secure password input.
+    ///
+    /// [`TextInput`]: struct.TextInput.html
+    pub fn password(mut self) -> Self {
+        self.is_secure = true;
+        self
+    }
+    
     /// Sets the width of the [`TextInput`].
     ///
     /// [`TextInput`]: struct.TextInput.html
@@ -161,6 +171,10 @@ where
                 "value",
                 bumpalo::format!(in bump, "{}", self.value).into_bump_str(),
             )
+            .attr(
+                "type",
+                bumpalo::format!(in bump, "{}", if self.is_secure { "password" } else { "text" }).into_bump_str(),
+            )
             .on("input", move |root, vdom, event| {
                 let text_input = match event.target().and_then(|t| {
                     t.dyn_into::<web_sys::HtmlInputElement>().ok()