update

src/asset.rs

@@ -19,7 +19,7 @@ pub fn flowbite_css() -> DataResponse {
     )
 }
 
-#[get("/assets/flowbite.min.s")]
+#[get("/assets/flowbite.min.js")]
 pub fn flowbite_js() -> DataResponse {
     DataResponse::new(
         include_str!("flowbite.min.js").as_bytes().to_vec(),

src/ui/primitives/div.rs

@@ -136,8 +136,7 @@ impl UIWidget for DivWidget {
                 .join(" ");
 
             PreEscaped(format!(
-                "<div class='{} {class}' {attrs}> {} </div>",
+                "<div class='{class}' {attrs}> {} </div>",
-                self.extended_class_().join(" "),
                 inner.0
             ))
         }

src/ui/primitives/image.rs

@@ -7,12 +7,18 @@ pub fn Image(src: &str) -> ImageWidget {
     ImageWidget {
         src: src.to_owned(),
         alt: String::new(),
+        width: None,
+        height: None,
+        caption: None,
     }
 }
 
 pub struct ImageWidget {
     src: String,
     alt: String,
+    width: Option<u32>,
+    height: Option<u32>,
+    caption: Option<String>,
 }
 
 impl Render for ImageWidget {
@@ -27,6 +33,46 @@ impl ImageWidget {
         self.alt = alt.to_string();
         self
     }
+
+    #[must_use]
+    pub fn width(mut self, width: u32) -> Self {
+        self.width = Some(width);
+        self
+    }
+
+    #[must_use]
+    pub fn height(mut self, height: u32) -> Self {
+        self.height = Some(height);
+        self
+    }
+
+    #[must_use]
+    pub fn caption(mut self, caption: &str) -> Self {
+        self.caption = Some(caption.to_string());
+        self
+    }
+
+    pub fn build_img(&self, class: &str) -> PreEscaped<String> {
+        let mut str = "<img".to_string();
+
+        str.push_str(&format!(" src=\"{}\"", self.src));
+
+        if !self.alt.is_empty() {
+            str.push_str(&format!(" alt=\"{}\"", self.alt));
+        }
+
+        if let Some(width) = self.width {
+            str.push_str(&format!(" width=\"{width}\""));
+        }
+
+        if let Some(height) = self.height {
+            str.push_str(&format!(" height=\"{height}\""));
+        }
+
+        str.push_str(&format!(" class=\"{class}\">"));
+
+        PreEscaped(str)
+    }
 }
 
 impl UIWidget for ImageWidget {
@@ -43,9 +89,16 @@ impl UIWidget for ImageWidget {
     }
 
     fn render_with_class(&self, class: &str) -> Markup {
-        html! {
+        if let Some(caption) = &self.caption {
-            img src=(self.src) alt=(self.alt) class=(class) {};
+            return html! {
+                figure class="w-fit" {
+                    (self.build_img(class))
+                    figcaption class="mt-2 text-sm text-center text-gray-500 dark:text-gray-400" { (caption) };
+                }
+            };
         }
+
+        self.build_img(class)
     }
 }
 
@@ -218,7 +271,7 @@ impl UIWidget for SourceWidget {
         html! {
             @if let Some(mime) = &self.mime {
                 source src=(self.src) type=(mime);
-            } else {
+            } @else {
                 source src=(self.src);
             };
         }