Add html::attr

CHANGELOG.md

@@ -20,10 +20,15 @@ A dependency update to an incompatible version is considered a breaking change.
 ### Added
 
 - `Attr::set`
+- `html::attr`
 
 ### Deprecated
 
 - `Attr::new` in favor of `Attr::set`
+- `Attr::id` in favor of `html::attr::id`
+- `Attr::class` in favor of `html::attr::class`
+- `Attr::style` in favor of `html::attr::style`
+- `Attr::data` in favor of `html::attr::data_x`
 
 ## v0.1.1 - 2024-12-08
 

README.md

@@ -13,15 +13,14 @@ use el::{Attr, Render, html::*};
 
 let page: String = html((
     head((
-        meta(Attr::new("charset", "utf-8")),
         meta((
-            Attr::new("name", "viewport"),
-            Attr::new("content", "width=device-width, initial-scale=1"),
+            attr::name("viewport"),
+            attr::content("width=device-width, initial-scale=1"),
         )),
         title("Example page"),
     )),
     body((
-        h1((Attr::id("heading"), "Example page")),
+        h1((attr::id("heading"), "Example page")),
         p(("This is an example for a ", em("simple"), " web page.")),
     )),
 ))
@@ -53,12 +52,11 @@ Use it like so:
 ```js
 const page = el("html", {},
   el("head", {},
-    el("meta", { charset: "utf-8" }),
     el("meta", {
-        name: "viewport",
-        content: "width=device-width, initial-scale=1",
+      name: "viewport",
+      content: "width=device-width, initial-scale=1",
     }),
-    el("title", {}, "Example page")
+    el("title", {}, "Example page"),
   ),
   el("body", {},
     el("h1", { id: "heading" }, "Example page"),

src/element.rs

@@ -346,6 +346,7 @@ impl Attr {
     /// Create (or replace) an `id` attribute.
     ///
     /// `Attr::id(id)` is equivalent to `Attr::new("id", id)`.
+    #[deprecated = "use `html::attr::id` instead"]
     pub fn id(id: impl ToString) -> Self {
         Self::set("id", id)
     }
@@ -354,6 +355,7 @@ impl Attr {
     ///
     /// `Attr::class(class)` is equivalent to
     /// `Attr::append("class", class, " ")`.
+    #[deprecated = "use `html::attr::class` instead"]
     pub fn class(class: impl ToString) -> Self {
         Self::append("class", class, " ")
     }
@@ -362,6 +364,7 @@ impl Attr {
     ///
     /// `Attr::style(style)` is equivalent to
     /// `Attr::append("style", style, ";")`.
+    #[deprecated = "use `html::attr::style` instead"]
     pub fn style(style: impl ToString) -> Self {
         Self::append("style", style, ";")
     }
@@ -372,6 +375,7 @@ impl Attr {
     /// `Attr::new(format!("data-{name}"), value)`.
     ///
     /// [mdn]: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*
+    #[deprecated = "use `html::attr::data_x` instead"]
     pub fn data(name: impl ToString, value: impl ToString) -> Self {
         Self::set(format!("data-{}", name.to_string()), value)
     }

src/html.rs

@@ -1,5 +1,9 @@
-//! Definitions for all non-deprecated HTML elements
+//! Definitions for HTML elements and attributes
 //! ([MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element)).
+//!
+//! Deprecated HTML elements are not included.
+
+pub mod attr;
 
 use crate::{Element, ElementComponent, ElementKind};
 

src/lib.rs

@@ -37,15 +37,14 @@
 //!
 //! let page: String = html((
 //!     head((
-//!         meta(Attr::new("charset", "utf-8")),
 //!         meta((
-//!             Attr::new("name", "viewport"),
-//!             Attr::new("content", "width=device-width, initial-scale=1"),
+//!             attr::name("viewport"),
+//!             attr::content("width=device-width, initial-scale=1"),
 //!         )),
 //!         title("Example page"),
 //!     )),
 //!     body((
-//!         h1((Attr::id("heading"), "Example page")),
+//!         h1((attr::id("heading"), "Example page")),
 //!         p(("This is an example for a ", em("simple"), " web page.")),
 //!     )),
 //! ))
@@ -151,9 +150,9 @@ mod tests {
         assert_eq!(
             input((
                 Attr::set("name", "tentacles"),
-                Attr::set("type", "number"),
-                Attr::set("min", 10),
-                Attr::set("max", 100),
+                attr::TypeInput::Number,
+                attr::min(10),
+                Attr::append("max", 100, "FOOBAA"),
             ))
             .render_to_string()
             .unwrap(),
@@ -166,6 +165,18 @@ mod tests {
                 .unwrap(),
             r#"<input checked name="horns">"#,
         );
+
+        assert_eq!(
+            p((
+                attr::id("foo"),
+                attr::id("bar"),
+                attr::class("foo"),
+                attr::class("bar"),
+            ))
+            .render_to_string()
+            .unwrap(),
+            r#"<p class="foo bar" id="bar"></p>"#,
+        )
     }
 
     #[test]