✨ (pagetop): Añade PageTopSvg::Tile y ajusta Image

This commit is contained in:
Manuel Cillero 2026-09-21 13:51:18 +02:00
parent 16eec316c4
commit f8f023b513
5 changed files with 263 additions and 18 deletions

View file

@ -44,18 +44,11 @@ impl Component for Image {
fn setup(&mut self, _cx: &mut Context) {
self.alter_prop(PropsOp::prepend_classes(match self.source() {
image::Source::Logo(_) => "image image-fluid",
image::Source::Responsive(_) => "image image-fluid",
image::Source::Logo(_) | image::Source::Responsive(_) => "image image-fluid",
image::Source::Thumbnail(_) => "image image-thumbnail",
image::Source::Plain(_) => "image",
}));
// Se asigna un tamaño predefinido para el logotipo que `with_size()` puede sobrescribir.
if matches!(self.source(), image::Source::Logo(_)) {
self.alter_prop(PropsOp::add_style("width", "1.25em"));
self.alter_prop(PropsOp::add_style("height", "1.25em"));
}
// El tamaño se aplica como declaraciones `style` individuales sobre `Props`.
match *self.size() {
image::Size::Auto => {}
@ -74,6 +67,15 @@ impl Component for Image {
self.alter_prop(PropsOp::add_style("height", v.to_string()));
}
}
// El logotipo es cuadrado. Sin `width`/`height` toma un tamaño predefinido.
if matches!(self.source(), image::Source::Logo(_))
&& self.props().get_style("width").is_none()
&& self.props().get_style("height").is_none()
{
self.alter_prop(PropsOp::add_style("width", "1.25rem"));
self.alter_prop(PropsOp::add_style("height", "1.25rem"));
}
}
async fn prepare(&self, cx: &mut Context) -> Result<Markup, ComponentError> {
@ -81,9 +83,9 @@ impl Component for Image {
image::Source::Logo(svg) => {
return Ok(svg.markup_with(cx, self.props(), self.alternative().clone()));
}
image::Source::Responsive(source) => Some(source),
image::Source::Thumbnail(source) => Some(source),
image::Source::Plain(source) => Some(source),
image::Source::Responsive(source)
| image::Source::Thumbnail(source)
| image::Source::Plain(source) => Some(source),
};
Ok(html! {
img
@ -121,7 +123,7 @@ impl Image {
self
}
/// Establece el origen de la imagen, influyendo en su disposición en el contenido.
/// Establece el origen de la imagen.
pub fn with_source(mut self, source: image::Source) -> Self {
self.source = source;
self
@ -146,8 +148,8 @@ impl From<image::Source> for Image {
impl From<image::Source> for Option<Image> {
/// Permite pasar un [`image::Source`] directamente donde se espera `impl Into<Option<Image>>`
/// (p. ej. [`Brand::with_image()`](super::super::Brand::with_image)), sin construir la
/// [`Image`] a mano.
/// (p. ej. [`Brand::with_image()`](crate::base::component::Brand::with_image)), sin construir
/// la [`Image`] a mano.
fn from(source: image::Source) -> Self {
Some(Image::with(source))
}

View file

@ -7,7 +7,9 @@ use crate::prelude::*;
pub enum Size {
/// Ajuste automático por defecto.
///
/// La imagen usa su tamaño natural o se ajusta al contenedor donde se publica.
/// La imagen usa su tamaño natural o se ajusta al contenedor donde se publica. El logotipo
/// ([`Source::Logo`]) toma un tamaño predefinido de `1.25rem` de ancho y alto, salvo que se
/// haya fijado alguna de sus dimensiones.
#[default]
Auto,
/// Establece explícitamente el **ancho y alto** de la imagen.
@ -40,6 +42,10 @@ pub enum Size {
#[derive(AutoDefault, Clone, Debug, PartialEq)]
pub enum Source {
/// Imagen con el logotipo de PageTop.
///
/// Se renderiza como un `<svg>` en línea, siempre cuadrado. Sin dimensiones explícitas
/// ([`Size::Auto`]) mide `1.25rem` de ancho y alto; si se fija sólo una, la otra se ajusta
/// proporcionalmente.
#[default]
Logo(PageTopSvg),
/// Imagen que se adapta automáticamente a su contenedor.