✨ (bootsier): Añade componente Nav

- Adapta `Dropdown` para poder integrarlo en los menús `Nav`.
- Actualiza `Children` para soportar operaciones múltiples.

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

@@ -0,0 +1,168 @@
+use pagetop::prelude::*;
+
+use crate::prelude::*;
+
+/// Componente para crear un **menú** o alguna de sus variantes ([`nav::Kind`]).
+///
+/// Presenta un menú con una lista de elementos usando una vista básica, o alguna de sus variantes
+/// como *pestañas* (`Tabs`), *botones* (`Pills`) o *subrayado* (`Underline`). También permite
+/// controlar su distribución y orientación ([`nav::Layout`](crate::theme::nav::Layout)).
+///
+/// # Ejemplo
+///
+/// ```rust
+/// # use pagetop::prelude::*;
+/// # use pagetop_bootsier::prelude::*;
+/// let nav = Nav::tabs()
+///     .with_layout(nav::Layout::End)
+///     .add_item(nav::Item::link(L10n::n("Home"), |_| "/"))
+///     .add_item(nav::Item::link_blank(L10n::n("External"), |_| "https://www.google.es"))
+///     .add_item(nav::Item::dropdown(
+///         Dropdown::new()
+///             .with_title(L10n::n("Options"))
+///             .with_items(TypedOp::AddMany(vec![
+///                 Typed::with(dropdown::Item::link(L10n::n("Action"), |_| "/action")),
+///                 Typed::with(dropdown::Item::link(L10n::n("Another action"), |_| "/another")),
+///             ])),
+///     ))
+///     .add_item(nav::Item::link_disabled(L10n::n("Disabled"), |_| "#"));
+/// ```
+#[rustfmt::skip]
+#[derive(AutoDefault)]
+pub struct Nav {
+    id        : AttrId,
+    classes   : AttrClasses,
+    items     : Children,
+    nav_kind  : nav::Kind,
+    nav_layout: nav::Layout,
+}
+
+impl Component for Nav {
+    fn new() -> Self {
+        Nav::default()
+    }
+
+    fn id(&self) -> Option<String> {
+        self.id.get()
+    }
+
+    fn setup_before_prepare(&mut self, _cx: &mut Context) {
+        self.alter_classes(
+            ClassesOp::Prepend,
+            [
+                "nav",
+                match self.nav_kind() {
+                    nav::Kind::Default => "",
+                    nav::Kind::Tabs => "nav-tabs",
+                    nav::Kind::Pills => "nav-pills",
+                    nav::Kind::Underline => "nav-underline",
+                },
+                match self.nav_layout() {
+                    nav::Layout::Default => "",
+                    nav::Layout::Start => "justify-content-start",
+                    nav::Layout::Center => "justify-content-center",
+                    nav::Layout::End => "justify-content-end",
+                    nav::Layout::Vertical => "flex-column",
+                    nav::Layout::Fill => "nav-fill",
+                    nav::Layout::Justified => "nav-justified",
+                },
+            ]
+            .join(" "),
+        );
+    }
+
+    fn prepare_component(&self, cx: &mut Context) -> PrepareMarkup {
+        let items = self.items().render(cx);
+        if items.is_empty() {
+            return PrepareMarkup::None;
+        }
+
+        PrepareMarkup::With(html! {
+            ul id=[self.id()] class=[self.classes().get()] {
+                (items)
+            }
+        })
+    }
+}
+
+impl Nav {
+    /// Crea un `Nav` usando pestañas para los elementos (*Tabs*).
+    pub fn tabs() -> Self {
+        Nav::default().with_kind(nav::Kind::Tabs)
+    }
+
+    /// Crea un `Nav` usando botones para los elementos (*Pills*).
+    pub fn pills() -> Self {
+        Nav::default().with_kind(nav::Kind::Pills)
+    }
+
+    /// Crea un `Nav` usando elementos subrayados (*Underline*).
+    pub fn underline() -> Self {
+        Nav::default().with_kind(nav::Kind::Underline)
+    }
+
+    // **< Nav BUILDER >****************************************************************************
+
+    /// Establece el identificador único (`id`) del menú.
+    #[builder_fn]
+    pub fn with_id(mut self, id: impl AsRef<str>) -> Self {
+        self.id.alter_value(id);
+        self
+    }
+
+    /// Modifica la lista de clases CSS aplicadas al menú.
+    #[builder_fn]
+    pub fn with_classes(mut self, op: ClassesOp, classes: impl AsRef<str>) -> Self {
+        self.classes.alter_value(op, classes);
+        self
+    }
+
+    /// Cambia el estilo del menú (*Tabs*, *Pills*, *Underline* o *Default*).
+    #[builder_fn]
+    pub fn with_kind(mut self, kind: nav::Kind) -> Self {
+        self.nav_kind = kind;
+        self
+    }
+
+    /// Selecciona la distribución y orientación del menú.
+    #[builder_fn]
+    pub fn with_layout(mut self, layout: nav::Layout) -> Self {
+        self.nav_layout = layout;
+        self
+    }
+
+    /// Añade un nuevo elemento hijo al menú.
+    pub fn add_item(mut self, item: nav::Item) -> Self {
+        self.items.add(Child::with(item));
+        self
+    }
+
+    /// Modifica la lista de elementos (`children`) aplicando una operación [`TypedOp`].
+    #[builder_fn]
+    pub fn with_items(mut self, op: TypedOp<nav::Item>) -> Self {
+        self.items.alter_typed(op);
+        self
+    }
+
+    // **< Nav GETTERS >****************************************************************************
+
+    /// Devuelve las clases CSS asociadas al menú.
+    pub fn classes(&self) -> &AttrClasses {
+        &self.classes
+    }
+
+    /// Devuelve el estilo visual seleccionado.
+    pub fn nav_kind(&self) -> &nav::Kind {
+        &self.nav_kind
+    }
+
+    /// Devuelve la distribución y orientación seleccionada.
+    pub fn nav_layout(&self) -> &nav::Layout {
+        &self.nav_layout
+    }
+
+    /// Devuelve la lista de elementos (`children`) del menú.
+    pub fn items(&self) -> &Children {
+        &self.items
+    }
+}