feat(native-el-ui): convert all component files to el-html vessel API

Replaced raw HTML heredoc returns with native el_ function calls across all 21 component files. styles.el intentionally excluded.
2026-05-08 22:35:41 -05:00
parent f2ab12e65b
commit 2553a6b7ac
21 changed files with 2550 additions and 2105 deletions
@@ -1,34 +1,58 @@
 // components/footer.el - Site footer.

+extern fn el_footer(attrs: String, children: String) -> String
+extern fn el_div(attrs: String, children: String) -> String
+extern fn el_a(href: String, attrs: String, children: String) -> String
+extern fn el_p(attrs: String, children: String) -> String
+extern fn el_nav(attrs: String, children: String) -> String
+extern fn el_img(src: String, alt: String, attrs: String) -> String
+
 fn footer() -> String {
-    return <footer id="footer" aria-label="Footer">
-  <div class="container">
-    <div class="footer-inner">
+    let brand_img: String = el_img(
+        "/assets/brand/neuron-wordmark-on-light.png",
+        "Neuron",
+        "srcset=\"/assets/brand/neuron-wordmark-on-light@2x.png 2x\" height=\"24\" style=\"display:block;margin-bottom:0.35rem;\""
+    )
+    let brand_tagline: String = el_p("class=\"footer-brand-tagline\"", "Built Different.")
+    let brand_link: String = el_a(
+        "/",
+        "class=\"footer-brand\" aria-label=\"Neuron home\" style=\"display:flex;flex-direction:column;align-items:center;\"",
+        brand_img + brand_tagline
+    )

-      <a href="/" class="footer-brand" aria-label="Neuron home" style="display:flex;flex-direction:column;align-items:center;">
-        <img src="/assets/brand/neuron-wordmark-on-light.png" srcset="/assets/brand/neuron-wordmark-on-light@2x.png 2x" alt="Neuron" height="24" style="display:block;margin-bottom:0.35rem;">
-        <p class="footer-brand-tagline">Built Different.</p>
-      </a>
+    let footer_center: String = el_div(
+        "class=\"footer-center\"",
+        el_div("class=\"navy-line\"", "")
+    )

-      <div class="footer-center">
-        <div class="navy-line"></div>
-      </div>
+    let footer_nav_links: String =
+        el_a("/legal/terms", "", "Terms") +
+        el_a("/legal/enterprise-terms", "", "Enterprise Agreement") +
+        el_a("mailto:legal@neurontechnologies.ai", "", "Contact")
+    let footer_nav: String = el_nav(
+        "class=\"footer-nav\" aria-label=\"Footer navigation\"",
+        footer_nav_links
+    )
+    let footer_right: String = el_div(
+        "class=\"footer-right\"",
+        el_p("class=\"footer-domain\"", "neurontechnologies.ai") + footer_nav
+    )

-      <div class="footer-right">
-        <p class="footer-domain">neurontechnologies.ai</p>
-        <nav class="footer-nav" aria-label="Footer navigation">
-          <a href="/legal/terms">Terms</a>
-          <a href="/legal/enterprise-terms">Enterprise Agreement</a>
-          <a href="mailto:legal@neurontechnologies.ai">Contact</a>
-        </nav>
-      </div>
+    let footer_inner: String = el_div(
+        "class=\"footer-inner\"",
+        brand_link + footer_center + footer_right
+    )

-    </div>
+    let footer_bottom: String = el_div(
+        "class=\"footer-bottom\"",
+        el_p("class=\"footer-copy\"", "&copy; 2026 Neuron, LLC. All rights reserved.") +
+        el_p("class=\"footer-tagline-bottom\"", "Your memory. Your AI.")
+    )

-    <div class="footer-bottom">
-      <p class="footer-copy">&copy; 2026 Neuron, LLC. All rights reserved.</p>
-      <p class="footer-tagline-bottom">Your memory. Your AI.</p>
-    </div>
-  </div>
-</footer>
+    let container: String = el_div(
+        "class=\"container\"",
+        footer_inner + footer_bottom
+    )
+
+    el_footer("id=\"footer\" aria-label=\"Footer\"", container)
 }