feat: 🎸 improve json-ml types

src/json-ml/toHtml.ts

@@ -12,6 +12,6 @@ export const toHtml = (node: JsonMlNode): string => {
   let childrenStr = '';
   for (let i = 0; i < childrenLength; i++) childrenStr += toHtml(children[i]);
   if (!tag) return childrenStr;
-  if (attrs) for (const key in attrs) attrStr += ' ' + key + '="' + escapeAttr(attrs[key]) + '"';
+  if (attrs) for (const key in attrs) attrStr += ' ' + key + '="' + escapeAttr(attrs[key] + '') + '"';
   return '<' + tag + attrStr + '>' + childrenStr + '</' + tag + '>';
 };

src/json-ml/types.ts

@@ -1,2 +1,30 @@
+/**
+ * Represents a node in the JsonML tree. Can be a string or an element.
+ */
 export type JsonMlNode = string | JsonMlElement;
-export type JsonMlElement = [tag: string | number, attrs: null | Record<string, unknown>, ...children: JsonMlNode[]];
+
+/**
+ * Represents an element in the JsonML tree. Lke an HTML element.
+ */
+export type JsonMlElement = [
+  /**
+   * Tag name of the element. An empty string `''` tag represents a *fragment* -
+   * a list of nodes. Similar to a `DocumentFragment` in the DOM, or
+   * `React.Fragment` `<>` in React.
+   * 
+   * When converting to HTML, an empty string tag is not rendered and numeric
+   * tags are converted to strings.
+   */
+  tag: '' | string | number,
+
+  /**
+   * Attributes of the element. `null` if there are no attributes. Attribute
+   * object values are converted to strings when formatting to HTML.
+   */
+  attrs: null | Record<string, unknown>,
+
+  /**
+   * Child nodes of the element. Can be a mix of strings and elements.
+   */
+  ...children: JsonMlNode[],
+];