✨ (bootsier): Añade más componentes y repasa código

- Se incorpora nuevo componente Dropdown.
- Se crea un componente Navbar con soporte para marca, elementos de
navegación.
- Se implementa el componente Offcanvas con opciones de posición,
visibilidad y fondo personalizables.
- Mejora el manejo de imágenes con un nuevo componente de Image.
- Se reorganizan los componentes del tema para una mejor estructura y
usabilidad.

extensions/pagetop-bootsier/src/theme/dropdown/component.rs

@@ -0,0 +1,99 @@
+use pagetop::prelude::*;
+
+use crate::prelude::*;
+
+#[rustfmt::skip]
+#[derive(AutoDefault)]
+pub struct Dropdown {
+    id     : AttrId,
+    classes: AttrClasses,
+    items  : Children,
+}
+
+impl Component for Dropdown {
+    fn new() -> Self {
+        Dropdown::default()
+    }
+
+    fn id(&self) -> Option<String> {
+        self.id.get()
+    }
+
+    fn setup_before_prepare(&mut self, _cx: &mut Context) {
+        self.alter_classes(ClassesOp::Prepend, "dropdown");
+    }
+
+    fn prepare_component(&self, cx: &mut Context) -> PrepareMarkup {
+        let items = self.items().render(cx);
+        if items.is_empty() {
+            return PrepareMarkup::None;
+        }
+
+        PrepareMarkup::With(html! {
+            div id=[self.id()] class=[self.classes().get()] {
+                button
+                    type="button"
+                    class="btn btn-secondary dropdown-toggle"
+                    data-bs-toggle="dropdown"
+                    aria-expanded="false"
+                {
+                    ("Dropdown button")
+                }
+                ul class="dropdown-menu" {
+                    li {
+                        a class="dropdown-item" href="#" {
+                            ("Action")
+                        }
+                    }
+                    li {
+                        a class="dropdown-item" href="#" {
+                            ("Another action")
+                        }
+                    }
+                    li {
+                        a class="dropdown-item" href="#" {
+                            ("Something else here")
+                        }
+                    }
+                }
+            }
+        })
+    }
+}
+
+impl Dropdown {
+    // **< Dropdown BUILDER >***********************************************************************
+
+    #[builder_fn]
+    pub fn with_id(mut self, id: impl AsRef<str>) -> Self {
+        self.id.alter_value(id);
+        self
+    }
+
+    #[builder_fn]
+    pub fn with_classes(mut self, op: ClassesOp, classes: impl AsRef<str>) -> Self {
+        self.classes.alter_value(op, classes);
+        self
+    }
+
+    pub fn add_item(mut self, item: dropdown::Item) -> Self {
+        self.items.add(Child::with(item));
+        self
+    }
+
+    #[builder_fn]
+    pub fn with_items(mut self, op: TypedOp<dropdown::Item>) -> Self {
+        self.items.alter_typed(op);
+        self
+    }
+
+    // **< Dropdown GETTERS >***********************************************************************
+
+    pub fn classes(&self) -> &AttrClasses {
+        &self.classes
+    }
+
+    pub fn items(&self) -> &Children {
+        &self.items
+    }
+}

extensions/pagetop-bootsier/src/theme/dropdown/item.rs

@@ -0,0 +1,109 @@
+use pagetop::prelude::*;
+
+// **< ItemType >***********************************************************************************
+
+#[derive(AutoDefault)]
+pub enum ItemType {
+    #[default]
+    Void,
+    Label(L10n),
+    Link(L10n, FnPathByContext),
+    LinkBlank(L10n, FnPathByContext),
+}
+
+// **< Item >***************************************************************************************
+
+#[rustfmt::skip]
+#[derive(AutoDefault)]
+pub struct Item {
+    item_type: ItemType,
+}
+
+impl Component for Item {
+    fn new() -> Self {
+        Item::default()
+    }
+
+    fn prepare_component(&self, cx: &mut Context) -> PrepareMarkup {
+        let description: Option<String> = None;
+
+        // Obtiene la URL actual desde `cx.request`.
+        let current_path = cx.request().map(|request| request.path());
+
+        match self.item_type() {
+            ItemType::Void => PrepareMarkup::None,
+            ItemType::Label(label) => PrepareMarkup::With(html! {
+                li class="dropdown-item" {
+                    span title=[description] {
+                        //(left_icon)
+                        (label.using(cx))
+                        //(right_icon)
+                    }
+                }
+            }),
+            ItemType::Link(label, path) => {
+                let item_path = path(cx);
+                let (class, aria) = if current_path == Some(item_path) {
+                    ("dropdown-item active", Some("page"))
+                } else {
+                    ("dropdown-item", None)
+                };
+                PrepareMarkup::With(html! {
+                    li class=(class) aria-current=[aria] {
+                        a class="nav-link" href=(item_path) title=[description] {
+                            //(left_icon)
+                            (label.using(cx))
+                            //(right_icon)
+                        }
+                    }
+                })
+            }
+            ItemType::LinkBlank(label, path) => {
+                let item_path = path(cx);
+                let (class, aria) = if current_path == Some(item_path) {
+                    ("dropdown-item active", Some("page"))
+                } else {
+                    ("dropdown-item", None)
+                };
+                PrepareMarkup::With(html! {
+                    li class=(class) aria-current=[aria] {
+                        a class="nav-link" href=(item_path) title=[description] target="_blank" {
+                            //(left_icon)
+                            (label.using(cx))
+                            //(right_icon)
+                        }
+                    }
+                })
+            }
+        }
+    }
+}
+
+impl Item {
+    pub fn label(label: L10n) -> Self {
+        Item {
+            item_type: ItemType::Label(label),
+            ..Default::default()
+        }
+    }
+
+    pub fn link(label: L10n, path: FnPathByContext) -> Self {
+        Item {
+            item_type: ItemType::Link(label, path),
+            ..Default::default()
+        }
+    }
+
+    pub fn link_blank(label: L10n, path: FnPathByContext) -> Self {
+        Item {
+            item_type: ItemType::LinkBlank(label, path),
+            ..Default::default()
+        }
+    }
+
+    // Item GETTERS.
+
+    pub fn item_type(&self) -> &ItemType {
+        &self.item_type
+    }
+}