From 2202a2350cc2a240422562e8bb37b75f6d864f1e Mon Sep 17 00:00:00 2001
From: Manuel Cillero <manuel@cillero.es>
Date: Sat, 20 Jun 2026 16:26:20 +0200
Subject: [PATCH] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20(bootsier):=20Usa=20nuevo?=
 =?UTF-8?q?=20Props=20en=20Navbar/Offcanvas?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/theme/navbar/component.rs             | 26 ++++++++++---------
 .../src/theme/offcanvas/component.rs          | 24 +++++++++--------
 2 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/extensions/pagetop-bootsier/src/theme/navbar/component.rs b/extensions/pagetop-bootsier/src/theme/navbar/component.rs
index 0438c981..8709a857 100644
--- a/extensions/pagetop-bootsier/src/theme/navbar/component.rs
+++ b/extensions/pagetop-bootsier/src/theme/navbar/component.rs
@@ -136,9 +136,7 @@ const TOGGLE_OFFCANVAS: &str = "offcanvas";
 /// ```
 #[derive(AutoDefault, Clone, Debug, Getters)]
 pub struct Navbar {
-    #[getters(skip)]
-    id: AttrId,
-    /// Devuelve los atributos HTML y clases CSS de la barra de navegación.
+    /// Devuelve identificador, clases CSS y atributos HTML del componente.
     props: Props,
     /// Devuelve el punto de ruptura configurado.
     expand: BreakPoint,
@@ -156,10 +154,14 @@ impl Component for Navbar {
     }
 
     fn id(&self) -> Option<String> {
-        self.id.get()
+        self.props.get_id()
     }
 
-    fn setup(&mut self, _cx: &Context) {
+    fn setup(&mut self, cx: &Context) {
+        // Asegura que la barra de navegación tiene un identificador único.
+        self.alter_prop(PropsOp::ensure_id(cx.build_id::<Self>(1)));
+
+        // Clases CSS por defecto para la barra de navegación.
         self.alter_prop(PropsOp::prepend_classes({
             let mut classes = "navbar".to_string();
             self.expand().push_class(&mut classes, "navbar-expand", "");
@@ -198,11 +200,11 @@ impl Component for Navbar {
             return Ok(html! {});
         }
 
-        // Asegura que la barra tiene un `id` para poder asociarlo al colapso/offcanvas.
-        let id = cx.required_id::<Self>(self.id(), 1);
+        // `setup()` garantiza que habrá un `id` antes de renderizar.
+        let id = self.id().unwrap();
 
         Ok(html! {
-            nav id=(&id) (self.props()) {
+            nav (self.props()) {
                 div class="container-fluid" {
                     @match self.layout() {
                         // Barra más sencilla: sólo contenido.
@@ -335,14 +337,14 @@ impl Navbar {
 
     // **< Navbar BUILDER >*************************************************************************
 
-    /// Establece el identificador único (`id`) de la barra de navegación.
+    /// Establece el identificador único del componente; igual a `with_prop(PropsOp::set_id(id))`.
     #[builder_fn]
-    pub fn with_id(mut self, id: impl AsRef<str>) -> Self {
-        self.id.alter_id(id);
+    pub fn with_id(mut self, id: impl Into<CowStr>) -> Self {
+        self.props.alter_id(id);
         self
     }
 
-    /// Modifica los atributos HTML o las clases CSS de la barra de navegación.
+    /// Modifica identificador, clases CSS o atributos HTML del componente.
     ///
     /// También acepta clases predefinidas para:
     ///
diff --git a/extensions/pagetop-bootsier/src/theme/offcanvas/component.rs b/extensions/pagetop-bootsier/src/theme/offcanvas/component.rs
index 481414fb..1d9f2c48 100644
--- a/extensions/pagetop-bootsier/src/theme/offcanvas/component.rs
+++ b/extensions/pagetop-bootsier/src/theme/offcanvas/component.rs
@@ -43,9 +43,7 @@ use crate::theme::*;
 /// ```
 #[derive(AutoDefault, Clone, Debug, Getters)]
 pub struct Offcanvas {
-    #[getters(skip)]
-    id: AttrId,
-    /// Devuelve los atributos HTML y clases CSS del panel.
+    /// Devuelve identificador, clases CSS y atributos HTML del componente.
     props: Props,
     /// Devuelve el título del panel.
     title: L10n,
@@ -69,10 +67,14 @@ impl Component for Offcanvas {
     }
 
     fn id(&self) -> Option<String> {
-        self.id.get()
+        self.props.get_id()
     }
 
-    fn setup(&mut self, _cx: &Context) {
+    fn setup(&mut self, cx: &Context) {
+        // Asegura que el panel tiene un identificador único.
+        self.alter_prop(PropsOp::ensure_id(cx.build_id::<Self>(1)));
+
+        // Clases CSS por defecto para el panel.
         self.alter_prop(PropsOp::prepend_classes({
             let mut classes = "offcanvas".to_string();
             self.breakpoint().push_class(&mut classes, "offcanvas", "");
@@ -90,14 +92,14 @@ impl Component for Offcanvas {
 impl Offcanvas {
     // **< Offcanvas BUILDER >**********************************************************************
 
-    /// Establece el identificador único (`id`) del panel.
+    /// Establece el identificador único del componente; igual a `with_prop(PropsOp::set_id(id))`.
     #[builder_fn]
-    pub fn with_id(mut self, id: impl AsRef<str>) -> Self {
-        self.id.alter_id(id);
+    pub fn with_id(mut self, id: impl Into<CowStr>) -> Self {
+        self.props.alter_id(id);
         self
     }
 
-    /// Modifica los atributos HTML o las clases CSS del panel.
+    /// Modifica identificador, clases CSS o atributos HTML del componente.
     #[builder_fn]
     pub fn with_prop(mut self, op: PropsOp) -> Self {
         self.props.alter_prop(op);
@@ -172,7 +174,8 @@ impl Offcanvas {
             return html! {};
         }
 
-        let id = cx.required_id::<Self>(self.id(), 1);
+        // `setup()` garantiza que habrá un `id` antes de renderizar.
+        let id = self.id().unwrap();
         let id_label = util::join!(id, "-label");
         let id_target = util::join!("#", id);
 
@@ -191,7 +194,6 @@ impl Offcanvas {
 
         html! {
             div
-                id=(&id)
                 (self.props())
                 tabindex="-1"
                 data-bs-scroll=[body_scroll]