♻️ (pagetop): with_prop() acepta impl Into<PropsOp>

`FlexItem`, `Margin` y `Padding` se pasan directamente gracias a `From`
 hacia `PropsOp`, sin `PropsOp::flex_item()`/`margin()`/`padding()` ni
`.into()` explícito. Revisadas todas las llamadas en el código para
simplificarlas.

src/base/component/badge.rs

@@ -122,7 +122,7 @@ impl Badge {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/block.rs

@@ -61,7 +61,7 @@ impl Block {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/brand.rs

@@ -88,7 +88,7 @@ impl Brand {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/breadcrumb/component.rs

@@ -78,7 +78,7 @@ impl Breadcrumb {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/breadcrumb/crumb.rs

@@ -73,7 +73,7 @@ impl Crumb {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML del elemento.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/button/component.rs

@@ -193,7 +193,7 @@ impl Button {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/container.rs

@@ -133,7 +133,7 @@ impl Container {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/dialog.rs

@@ -114,7 +114,7 @@ impl Dialog {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/dropdown/component.rs

@@ -141,7 +141,7 @@ impl Dropdown {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/dropdown/item.rs

@@ -264,7 +264,7 @@ impl Item {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/check.rs

@@ -189,7 +189,7 @@ impl Field {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/checkbox.rs

@@ -159,7 +159,7 @@ impl Checkbox {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/component.rs

@@ -100,7 +100,7 @@ impl Form {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/fieldset.rs

@@ -78,7 +78,7 @@ impl Fieldset {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/input.rs

@@ -398,7 +398,7 @@ impl Field {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/number.rs

@@ -132,7 +132,7 @@ impl Number {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/radio.rs

@@ -206,7 +206,7 @@ impl Field {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/range.rs

@@ -117,7 +117,7 @@ impl Range {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/select.rs

@@ -316,7 +316,7 @@ impl Field {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/form/textarea.rs

@@ -146,7 +146,7 @@ impl Textarea {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/image/component.rs

@@ -110,7 +110,7 @@ impl Image {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/messages.rs

@@ -80,7 +80,7 @@ impl Messages {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/nav/component.rs

@@ -80,7 +80,7 @@ impl Nav {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/nav/item.rs

@@ -275,7 +275,7 @@ impl Item {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/navbar/component.rs

@@ -209,7 +209,7 @@ impl Navbar {
     }
 
     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/pager.rs

@@ -346,7 +346,7 @@ impl Pager {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML del componente.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/table/cell.rs

@@ -51,7 +51,7 @@ impl Cell {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML de la celda.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/table/column.rs

@@ -46,7 +46,7 @@ impl Column {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML de la columna.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/table/component.rs

@@ -129,7 +129,7 @@ impl Table {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML de la tabla.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/table/props.rs

@@ -66,7 +66,7 @@ impl SortLink {
 
     /// Modifica los atributos HTML del enlace. Es el punto de extensión para añadir atributos de
     /// interactividad sin que `Table` necesite conocerlos.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/base/component/table/row.rs

@@ -35,7 +35,7 @@ impl Row {
     }
 
     /// Modifica identificador, clases CSS o atributos HTML de la fila.
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
         self.props.alter_prop(op);
         self
     }

src/html/flex.rs

@@ -7,8 +7,8 @@
 //! [`FlexItem`] configura, en cambio, un único elemento en relación con el contenedor flex de su
 //! padre (crecimiento, reducción, alineación individual, orden, ancho y desplazamiento). No tiene
 //! un builder propio ya que puede acabar aplicándose sobre cualquier componente (no sólo los que
-//! ofrecen `with_flex()`). Por eso se aplica con [`PropsOp::flex_item()`] sobre el `with_prop()`
-//! que normalmente ya expone cualquier componente.
+//! ofrecen `with_flex()`). Por eso se aplica pasándolo directamente al `with_prop()` que
+//! normalmente ya expone cualquier componente, gracias a su `From` hacia [`PropsOp`].
 //!
 //! # Un entorno nativo autosuficiente
 //!
@@ -22,7 +22,7 @@
 //!
 //! [Flexbox]: https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Flexible_box_layout
 //! [`AssetsOp::add_responsive_style()`]: crate::core::component::AssetsOp::add_responsive_style
-//! [`PropsOp::flex_item()`]: crate::html::props::PropsOp::flex_item
+//! [`PropsOp`]: crate::html::props::PropsOp
 //! [`Container`]: crate::base::component::Container
 //! [`Navbar`]: crate::base::component::Navbar
 

src/html/flex/item.rs

@@ -14,8 +14,8 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 ///
 /// No tiene un builder dedicado en ningún componente. De hecho, no tendría sentido porque cualquier
 /// componente puede acabar siendo hijo de un contenedor flex, y ninguno debería necesitar un campo
-/// propio para esto. Se aplica con [`PropsOp::flex_item()`] sobre el `with_prop()` que suele
-/// exponer cualquier componente.
+/// propio para esto. Se aplica sobre el `with_prop()` que suele exponer cualquier componente, que
+/// acepta `FlexItem` directamente gracias a su `From` hacia [`PropsOp`].
 ///
 /// Con [`ItemSize`] y [`ItemOffset`] se pueden modelar rejillas de columnas fijas sobre Flexbox,
 /// combinando un tamaño en fracción del contenedor con un desplazamiento lateral cuando se
@@ -27,18 +27,18 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 /// use pagetop::prelude::*;
 ///
 /// // Crece para ocupar el espacio sobrante, partiendo de ancho cero.
-/// let panel = Button::plain(Lc::n("Panel")).with_prop(PropsOp::flex_item(
+/// let panel = Button::plain(Lc::n("Panel")).with_prop(
 ///     FlexItem::new()
 ///         .with_grow(flex::ItemGrow::Is1)
 ///         .with_size(flex::ItemSize::Custom(UnitValue::Zero)),
-/// ));
+/// );
 ///
 /// // Ocupa un tercio del ancho del contenedor, desplazado otro tercio desde el inicio.
-/// let column = Container::new().with_prop(PropsOp::flex_item(
+/// let column = Container::new().with_prop(
 ///     FlexItem::new()
 ///         .with_size(flex::ItemSize::Percent33)
 ///         .with_offset(flex::ItemOffset::Percent33),
-/// ));
+/// );
 /// ```
 #[derive(AutoDefault, Clone, Copy, Debug, PartialEq, Getters)]
 pub struct FlexItem {
@@ -89,7 +89,7 @@ impl FlexItem {
     /// use pagetop::prelude::*;
     ///
     /// let user_menu = Nav::new()
-    ///     .with_prop(FlexItem::push_end().into())
+    ///     .with_prop(FlexItem::push_end())
     ///     .with_item(nav::Item::link(Lc::n("Profile"), "/profile"))
     ///     .with_item(nav::Item::link(Lc::n("Sign out"), "/sign-out"));
     /// ```

src/html/props/definition.rs

@@ -177,7 +177,7 @@ use std::panic::Location;
 /// #[builder_impl]
 /// impl MyButton {
 ///     /// Modifica identificador, clases CSS, atributos HTML o valores extra del componente.
-///     pub fn with_prop(mut self, op: PropsOp) -> Self {
+///     pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
 ///         self.props.alter_prop(op);
 ///         self
 ///     }
@@ -218,9 +218,10 @@ impl Props {
     /// Modifica el identificador, las clases, los atributos o los valores extra según la operación
     /// indicada, incluido el posicionamiento Flexbox y el espaciado (`FlexItem`, `Margin`,
     /// `Padding`). El método recomendado para construir cada operación es usar los constructores de
-    /// [`PropsOp`].
-    pub fn with_prop(mut self, op: PropsOp) -> Self {
-        match op {
+    /// [`PropsOp`], aunque `FlexItem`, `Margin` y `Padding` pueden pasarse directamente gracias a
+    /// sus `From` hacia `PropsOp`.
+    pub fn with_prop(mut self, op: impl Into<PropsOp>) -> Self {
+        match op.into() {
             PropsOp::SetId(value) => {
                 self.apply_id(value.as_ref());
             }

src/html/spacing.rs

@@ -1,9 +1,9 @@
 //! Márgenes y relleno nativos aplicados a componentes.
 //!
 //! [`Margin`] y [`Padding`] configuran márgenes externos y relleno interno por lado lógico y punto
-//! de corte. Aplican sobre cualquier componente. Se usan igual que [`FlexItem`], con
-//! [`PropsOp::margin()`] y [`PropsOp::padding()`] sobre el `with_prop()` que normalmente ya expone
-//! cualquier componente.
+//! de corte. Aplican sobre cualquier componente. Se usan igual que [`FlexItem`]: pasándolos
+//! directamente al `with_prop()` que normalmente ya expone cualquier componente, gracias a su
+//! `From` hacia [`PropsOp`].
 //!
 //! # Ejemplo
 //!
@@ -11,17 +11,14 @@
 //! use pagetop::prelude::*;
 //!
 //! // Margen exterior arriba/abajo y relleno interno por los cuatro lados.
-//! // `Margin` y `Padding` implementan `From` para `PropsOp`, así que `with_prop()`
-//! // acepta `.into()` en vez de `PropsOp::margin()`/`PropsOp::padding()`.
 //! let card = Container::new()
-//!     .with_prop(Margin::new().with_y(UnitValue::RelRem(1.0)).into())
-//!     .with_prop(Padding::new().with_all(UnitValue::RelRem(1.5)).into())
+//!     .with_prop(Margin::new().with_y(UnitValue::RelRem(1.0)))
+//!     .with_prop(Padding::new().with_all(UnitValue::RelRem(1.5)))
 //!     .with_child(Button::plain(Lc::n("Aceptar")));
 //! ```
 //!
 //! [`FlexItem`]: crate::html::flex::FlexItem
-//! [`PropsOp::margin()`]: crate::html::props::PropsOp::margin
-//! [`PropsOp::padding()`]: crate::html::props::PropsOp::padding
+//! [`PropsOp`]: crate::html::props::PropsOp
 
 mod margin;
 pub use margin::Margin;

src/html/spacing/margin.rs

@@ -6,8 +6,8 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 
 /// Configuración de márgenes externos por lado lógico y punto de corte.
 ///
-/// No tiene relación con Flexbox. Se aplica sobre cualquier componente, con [`PropsOp::margin()`]
-/// desde el `with_prop()` que suele exponer cualquier componente.
+/// No tiene relación con Flexbox. Se aplica sobre cualquier componente, pasándolo directamente al
+/// `with_prop()` que suele exponer cualquier componente, gracias a su `From` hacia [`PropsOp`].
 ///
 /// Cada lado admite cualquier [`UnitValue`], incluido [`UnitValue::Auto`] (por ejemplo, para
 /// centrar un bloque con `margin-inline: auto`). Los lados lógicos `start`/`end` se traducen a
@@ -19,11 +19,11 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 /// use pagetop::prelude::*;
 ///
 /// // Centra el bloque horizontalmente y añade espacio inferior.
-/// let panel = Container::new().with_prop(PropsOp::margin(
+/// let panel = Container::new().with_prop(
 ///     Margin::new()
 ///         .with_x(UnitValue::Auto)
 ///         .with_bottom(UnitValue::RelRem(1.5)),
-/// ));
+/// );
 /// ```
 ///
 /// [`Flex`]: crate::html::flex::Flex

src/html/spacing/padding.rs

@@ -7,7 +7,8 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 /// Configuración de relleno interno por lado lógico y punto de corte.
 ///
 /// Mismo mecanismo y criterio de uso que [`Margin`](super::Margin): no tiene relación con Flexbox,
-/// y se aplica sobre cualquier componente vía [`PropsOp::padding()`] desde su `with_prop()`.
+/// y se aplica sobre cualquier componente pasándolo directamente a su `with_prop()`, gracias a su
+/// `From` hacia [`PropsOp`].
 ///
 /// A diferencia de `Margin`, [`UnitValue::Auto`] no tiene efecto en ningún lado ya que CSS no
 /// admite `padding: auto`, así que un lado establecido a `Auto` se ignora como si no se hubiera
@@ -18,11 +19,11 @@ use crate::{AutoDefault, Getters, builder_impl, util};
 /// ```rust,no_run
 /// use pagetop::prelude::*;
 ///
-/// let card = Container::new().with_prop(PropsOp::padding(
+/// let card = Container::new().with_prop(
 ///     Padding::new()
 ///         .with_all(UnitValue::RelRem(1.0))
 ///         .with_bottom_at(Breakpoint::Md, UnitValue::RelRem(2.0)),
-/// ));
+/// );
 /// ```
 #[derive(AutoDefault, Clone, Copy, Debug, PartialEq, Getters)]
 pub struct Padding {