✨ (base): Añade with_menu_end() para menú al final

This commit is contained in:
Manuel Cillero 2026-09-26 14:21:39 +02:00
parent f265f217bd
commit 165cb49880
7 changed files with 152 additions and 5 deletions

View file

@ -56,6 +56,11 @@ pub trait DropdownBootsier {
fn with_direction(self, direction: Direction) -> Self;
/// Configura la alineación horizontal (con posible comportamiento *responsive* adicional).
///
/// Si se deja en [`MenuAlign::Start`] (por defecto), se respeta [`with_menu_end()`]; cualquier
/// otra alineación prevalece sobre él.
///
/// [`with_menu_end()`]: pagetop::base::component::Dropdown::with_menu_end
fn with_menu_align(self, align: MenuAlign) -> Self;
/// Configura la posición del menú.
@ -135,9 +140,15 @@ pub(crate) async fn render(
let direction = dropdown
.props()
.extra_or(EXTRA_DIRECTION, Direction::default());
let menu_align = dropdown
let menu_align = match dropdown
.props()
.extra_or(EXTRA_MENU_ALIGN, MenuAlign::default());
.extra_or(EXTRA_MENU_ALIGN, MenuAlign::default())
{
// `with_menu_end()` del núcleo se traduce a `MenuAlign::End`, pero sólo si no hay una
// alineación propia diferente a la predeterminada (`Start`), que prevalece.
MenuAlign::Start if *dropdown.menu_end() => MenuAlign::End,
align => align,
};
let menu_position = dropdown
.props()
.extra_or(EXTRA_MENU_POSITION, MenuPosition::default());

View file

@ -169,6 +169,11 @@ pub(crate) async fn item_render(item: &Item, cx: &mut Context) -> Result<Markup,
.lookup(cx)
.unwrap_or_else(|| "Dropdown".to_string())
});
let menu_classes = if *dd.menu_end() {
"dropdown-menu dropdown-menu-end"
} else {
"dropdown-menu"
};
html! {
li (item.props().unpack(cx)) {
a
@ -181,7 +186,7 @@ pub(crate) async fn item_render(item: &Item, cx: &mut Context) -> Result<Markup,
{
(title)
}
ul class="dropdown-menu" {
ul class=(menu_classes) {
(items)
}
}

View file

@ -63,6 +63,59 @@ async fn dropdown_menu_align_combines_breakpoint_classes() {
);
}
async fn dropdown_menu_html(dropdown: bs::Dropdown) -> String {
let mut dropdown = dropdown
.with_title(Lc::n("Menu"))
.with_item(bs::dropdown::Item::link(Lc::n("Home"), "/"));
dropdown.render(&mut cx()).await.into_string()
}
#[pagetop::test]
async fn dropdown_menu_end_maps_to_the_end_alignment() {
let html = dropdown_menu_html(bs::Dropdown::new().with_menu_end(true)).await;
assert!(html.contains(r#"<ul class="dropdown-menu dropdown-menu-end">"#));
// Without `with_menu_end()` the menu keeps the default (start) alignment.
let html = dropdown_menu_html(bs::Dropdown::new()).await;
assert!(html.contains(r#"<ul class="dropdown-menu">"#));
assert!(!html.contains("dropdown-menu-end"));
}
#[pagetop::test]
async fn dropdown_menu_end_is_ignored_without_title() {
// A titleless menu is static (no button to align to), so it never gets the end alignment.
let mut dropdown = bs::Dropdown::new()
.with_menu_end(true)
.with_item(bs::dropdown::Item::link(Lc::n("Home"), "/"));
let html = dropdown.render(&mut cx()).await.into_string();
assert!(html.contains(r#"<ul class="dropdown-menu">"#));
assert!(!html.contains("dropdown-menu-end"));
}
#[pagetop::test]
async fn dropdown_own_menu_align_wins_over_menu_end() {
let html = dropdown_menu_html(
bs::Dropdown::new()
.with_menu_end(true)
.with_menu_align(bs::dropdown::MenuAlign::StartAt(Breakpoint::Md)),
)
.await;
assert!(html.contains("dropdown-menu-md-start"));
assert!(!html.contains("dropdown-menu-end"));
}
#[pagetop::test]
async fn nav_dropdown_menu_end_adds_the_end_class() {
let mut nav = bs::Nav::new().with_item(bs::nav::Item::dropdown(
bs::Dropdown::new()
.with_title(Lc::n("Menu"))
.with_menu_end(true)
.with_item(bs::dropdown::Item::link(Lc::n("Home"), "/")),
));
let html = nav.render(&mut cx()).await.into_string();
assert!(html.contains(r#"<ul class="dropdown-menu dropdown-menu-end">"#));
}
#[pagetop::test]
async fn navbar_expands_at_md_by_default_and_at_the_chosen_breakpoint() {
let item =