From 75893fcf9ebe0b2f13288a07d4cfb9131615cfb3 Mon Sep 17 00:00:00 2001
From: Michiel Borkent <michielborkent@gmail.com>
Date: Fri, 24 May 2024 18:13:27 +0200
Subject: [PATCH] html attr improvements

---
 src/squint/compiler_common.cljc |  2 +-
 src/squint/html.js              | 46 ++++++++++++++++++++++++++-------
 2 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/src/squint/compiler_common.cljc b/src/squint/compiler_common.cljc
index 4f443dd3..af53604c 100644
--- a/src/squint/compiler_common.cljc
+++ b/src/squint/compiler_common.cljc
@@ -1060,7 +1060,7 @@ break;}" body)
                             (do
                               (when-let [dyn (:has-dynamic-expr env)]
                                 (reset! dyn true))
-                              (format "${%s}" (emit v (dissoc env :jsx))))
+                              (format "${squint_html.attrs(%s)}" (emit v (dissoc env :jsx))))
                             (str "{..." (emit v (dissoc env :jsx)) "}"))
                           (str (name k) "="
                                (let [env env]
diff --git a/src/squint/html.js b/src/squint/html.js
index b013b66d..3dedb37d 100644
--- a/src/squint/html.js
+++ b/src/squint/html.js
@@ -1,18 +1,46 @@
+function css(v) {
+  let ret = "";
+  if (v == null) return ret;
+  let first = true;
+  for (const kv of Object.entries(v)) {
+    if (!first) ret += ' ';
+    ret += kv[0];
+    ret += ":";
+    ret += kv[1];
+    ret += ';';
+    first = false;
+  }
+  return ret;
+}
+
+export function attrs(v) {
+  let ret = "";
+  if (v == null) return ret;
+  let first = true;
+  for (const kv of Object.entries(v)) {
+    if (!first) {
+      ret += ' ';
+    }
+    ret += kv[0];
+    ret += "=";
+    ret += '"';
+    const v1 = kv[1];
+    if (typeof(v1) === 'object') {
+      ret += css(v1);
+    } else
+      ret += v1;
+    ret += '"';
+    first = false;
+  }
+  return ret;
+}
+
 function toHTML(v) {
   if (v == null) return;
   if (typeof(v) === 'string') return v;
   if (v[Symbol.iterator]) {
     return [...v].join("");
   }
-  if (typeof v === 'object') {
-    let ret = "";
-    for (const kv of Object.entries(v)) {
-      ret += kv[0];
-      ret += "=";
-      ret += '"' + kv[1] + '"';
-      return ret;
-    }
-  }
   return v;
 }