feat: allow custom attributes on leptos_meta components (#1874)

meta/src/link.rs

@@ -80,6 +80,9 @@ pub fn Link(
     /// The [`blocking`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/link#attr-blocking) attribute.
     #[prop(optional, into)]
     blocking: Option<Oco<'static, str>>,
+    /// Custom attributes.
+    #[prop(attrs, optional)]
+    attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     let meta = use_head();
     let next_id = meta.tags.get_next_id();
@@ -89,7 +92,11 @@ pub fn Link(
     let builder_el = leptos::leptos_dom::html::as_meta_tag({
         let id = id.clone_inplace();
         move || {
-            leptos::leptos_dom::html::link()
+            attrs
+                .into_iter()
+                .fold(leptos::leptos_dom::html::link(), |el, (name, value)| {
+                    el.attr(name, value)
+                })
                 .attr("id", id)
                 .attr("as", as_)
                 .attr("crossorigin", crossorigin)

meta/src/meta_tags.rs

@@ -1,5 +1,5 @@
 use crate::{use_head, TextProp};
-use leptos::{component, IntoView};
+use leptos::{component, Attribute, IntoView};
 
 /// Injects an [`HTMLMetaElement`](https://developer.mozilla.org/en-US/docs/Web/API/HTMLMetaElement) into the document
 /// head to set metadata
@@ -38,13 +38,20 @@ pub fn Meta(
     /// The [`content`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta#attr-content) attribute.
     #[prop(optional, into)]
     content: Option<TextProp>,
+    /// Custom attributes.
+    #[prop(attrs, optional)]
+    attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     let meta = use_head();
     let next_id = meta.tags.get_next_id();
     let id = format!("leptos-link-{}", next_id.0);
 
     let builder_el = leptos::leptos_dom::html::as_meta_tag(move || {
-        leptos::leptos_dom::html::meta()
+        attrs
+            .into_iter()
+            .fold(leptos::leptos_dom::html::meta(), |el, (name, value)| {
+                el.attr(name, value)
+            })
             .attr("charset", move || charset.as_ref().map(|v| v.get()))
             .attr("name", move || name.as_ref().map(|v| v.get()))
             .attr("property", move || property.as_ref().map(|v| v.get()))

meta/src/script.rs

@@ -62,6 +62,9 @@ pub fn Script(
     /// The content of the `<script>` tag.
     #[prop(optional)]
     children: Option<Box<dyn FnOnce() -> Fragment>>,
+    /// Custom attributes.
+    #[prop(attrs, optional)]
+    attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     let meta = use_head();
     let next_id = meta.tags.get_next_id();
@@ -71,7 +74,12 @@ pub fn Script(
     let builder_el = leptos::leptos_dom::html::as_meta_tag({
         let id = id.clone_inplace();
         move || {
-            leptos::leptos_dom::html::script()
+            attrs
+                .into_iter()
+                .fold(
+                    leptos::leptos_dom::html::script(),
+                    |el, (name, value)| el.attr(name, value),
+                )
                 .attr("id", id)
                 .attr("async", async_)
                 .attr("crossorigin", crossorigin)

meta/src/style.rs

@@ -41,6 +41,9 @@ pub fn Style(
     /// The content of the `<style>` tag.
     #[prop(optional)]
     children: Option<Box<dyn FnOnce() -> Fragment>>,
+    /// Custom attributes.
+    #[prop(attrs, optional)]
+    attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     let meta = use_head();
     let next_id = meta.tags.get_next_id();
@@ -50,7 +53,11 @@ pub fn Style(
     let builder_el = leptos::leptos_dom::html::as_meta_tag({
         let id = id.clone_inplace();
         move || {
-            leptos::leptos_dom::html::style()
+            attrs
+                .into_iter()
+                .fold(leptos::leptos_dom::html::style(), |el, (name, value)| {
+                    el.attr(name, value)
+                })
                 .attr("id", id)
                 .attr("media", media)
                 .attr("nonce", nonce)

meta/src/stylesheet.rs

@@ -27,14 +27,17 @@ pub fn Stylesheet(
     /// An ID for the stylesheet.
     #[prop(optional, into)]
     id: Option<String>,
+    /// Custom attributes.
+    #[prop(attrs, optional)]
+    attrs: Vec<(&'static str, Attribute)>,
 ) -> impl IntoView {
     if let Some(id) = id {
         view! {
-            <Link id rel="stylesheet" href/>
+            <Link id rel="stylesheet" href attrs/>
         }
     } else {
         view! {
-            <Link rel="stylesheet" href/>
+            <Link rel="stylesheet" href attrs/>
         }
     }
 }