@emeryld/rrroutes-contract 2.2.3 → 2.2.5

package/dist/index.mjs

@@ -516,6 +516,21 @@ body {
   box-shadow: 0 10px 30px -10px rgba(0,0,0,0.5);
 }
 
+.schema-indent {
+  display: inline-block;
+}
+
+.schema-branch {
+  opacity: 0.6;
+  font-family: var(--font-mono);
+  margin-right: 2px;
+}
+
+.schema-meta code {
+  font-family: var(--font-mono);
+  font-size: 11px;
+}
+
 /* Top Row: Filters */
 .filters-row {
   display: flex;
@@ -607,6 +622,15 @@ body {
   font-weight: 700;
   margin-right: 4px;
 }
+.schema-indent {
+  display: inline-block;
+}
+
+.schema-branch {
+  opacity: 0.6;
+  font-family: var(--font-mono);
+  margin-right: 2px;
+}
 
 /* Chips/Pills */
 .pill-checkbox { cursor: pointer; user-select: none; }
@@ -1141,30 +1165,209 @@ var DOCS_JS = `
     );
   }
 
-  function renderSchemaTable(node, title) {
-    let rows = '';
-    if (node.kind === 'object' && node.properties) {
-      Object.keys(node.properties).forEach(function(key) {
-        const prop = node.properties[key];
-        const reqClass = prop.optional ? 'req-false' : 'req-true';
-        const reqText = prop.optional ? 'OPT' : 'REQ';
-        rows +=
-          '<tr>' +
-            '<td class="col-name">' + escapeHtml(key) + '</td>' +
-            '<td class="col-type">' + escapeHtml(getTypeLabel(prop)) + '</td>' +
-            '<td><span class="req-badge ' + reqClass + '">' + reqText + '</span></td>' +
-            '<td>' + escapeHtml(prop.description || '') + '</td>' +
-          '</tr>';
-      });
-    } else {
-      rows = '<tr><td colspan="4">Type: ' + escapeHtml(getTypeLabel(node)) + '</td></tr>';
+// Recursive schema renderer with proper depth-based indentation.
+
+function renderSchemaTable(node, title) {
+  let rows = '';
+
+  if (node.kind === 'object' && node.properties) {
+    // Start at depth -1 so first level of properties shows at depth 0
+    rows = renderObjectChildren(node, -1);
+  } else {
+    rows = renderNodeRow('(root)', node, 0);
+  }
+
+  return (
+    (title
+      ? '<div class="schema-subtitle">' + escapeHtml(title) + '</div>'
+      : '') +
+    '<table class="schema-table">' +
+      rows +
+    '</table>'
+  );
+}
+
+function renderObjectChildren(node, depth) {
+  if (!node.properties) return '';
+
+  let rows = '';
+  Object.keys(node.properties).forEach(function (key) {
+    rows += renderNodeRow(key, node.properties[key], depth + 1);
+  });
+  return rows;
+}
+
+function renderNodeRow(name, node, depth) {
+  const reqClass = node.optional ? 'req-false' : 'req-true';
+  const reqText = node.optional ? 'OPT' : 'REQ';
+
+  const indentPx = depth * 16; // increase this if you want more spacing per level
+  const nameCell =
+    '<span class="schema-indent" style="padding-left:' +
+    indentPx +
+    'px;"></span>' +
+    (depth > 0 ? '<span class="schema-branch">\u2514\u2500 </span>' : '') +
+    escapeHtml(name);
+
+  const typeLabel = getTypeLabel(node);
+  const descriptionHtml = renderNodeDescription(node);
+
+  let rows =
+    '<tr>' +
+      '<td class="col-name">' + nameCell + '</td>' +
+      '<td class="col-type">' + escapeHtml(typeLabel) + '</td>' +
+      '<td><span class="req-badge ' + reqClass + '">' + reqText + '</span></td>' +
+      '<td>' + descriptionHtml + '</td>' +
+    '</tr>';
+
+  // 1) Object properties
+  if (node.kind === 'object' && node.properties) {
+    rows += renderObjectChildren(node, depth);
+  }
+
+  // 2) Array element type
+  if (node.kind === 'array' && node.element) {
+    const element = node.element;
+    if (isComplexNode(element)) {
+      // element rendered one level deeper than the array itself
+      rows += renderNodeRow('[items]', element, depth + 1);
     }
-    return (
-      (title ? '<div class="schema-subtitle">' + escapeHtml(title) + '</div>' : '') +
-      '<table class="schema-table">' + rows + '</table>'
+  }
+
+  // 3) Union variants
+  if (node.kind === 'union' && Array.isArray(node.union)) {
+    node.union.forEach(function (variant, index) {
+      rows += renderNodeRow('option ' + (index + 1), variant, depth + 1);
+    });
+  }
+
+  return rows;
+}
+
+/**
+ * Decide if a node is \u201Ccomplex\u201D enough to warrant a nested expansion row.
+ */
+function isComplexNode(node) {
+  return (
+    node.kind === 'object' ||
+    node.kind === 'array' ||
+    node.kind === 'union' ||
+    node.kind === 'record' ||
+    node.kind === 'tuple'
+  );
+}
+
+/**
+ * Helper: simple vs complex node, for compact type labels.
+ */
+function isSimpleNode(node) {
+  return !isComplexNode(node);
+}
+
+/**
+ * Type label shown in the "Type" column.
+ */
+function getTypeLabel(node) {
+  let base;
+
+  switch (node.kind) {
+    case 'object':
+      base = 'object';
+      break;
+
+    case 'array':
+      if (!node.element) {
+        base = 'array';
+      } else if (isSimpleNode(node.element)) {
+        base = 'array<' + getTypeLabel(node.element) + '>';
+      } else {
+        base = 'array<object>';
+      }
+      break;
+
+    case 'union':
+      if (node.union && node.union.length) {
+        const parts = node.union.map(function (u) {
+          return isSimpleNode(u) ? getTypeLabel(u) : 'object';
+        });
+        base = parts.join(' | ');
+      } else {
+        base = 'union';
+      }
+      break;
+
+    case 'literal':
+      base = 'literal';
+      break;
+
+    case 'enum':
+      base = 'enum';
+      break;
+
+    case 'record':
+      base = 'record';
+      break;
+
+    case 'tuple':
+      base = 'tuple';
+      break;
+
+    default:
+      base = node.kind || 'unknown';
+      break;
+  }
+
+  if (node.nullable) {
+    base = base + ' | null';
+  }
+  return base;
+}
+
+/**
+ * Description cell content:
+ * - main description text
+ * - for enum: allowed values
+ * - for literal: literal value
+ */
+function renderNodeDescription(node) {
+  const parts = [];
+
+  if (node.description) {
+    parts.push(escapeHtml(node.description));
+  }
+
+  if (node.kind === 'enum' && node.enumValues && node.enumValues.length) {
+    const values = node.enumValues
+      .map(function (v) {
+        return '<code>' + escapeHtml(String(v)) + '</code>';
+      })
+      .join(' | ');
+    parts.push('<div class="schema-meta">Allowed: ' + values + '</div>');
+  }
+
+  if (node.kind === 'literal' && typeof node.literal !== 'undefined') {
+    const valueStr = escapeHtml(JSON.stringify(node.literal));
+    parts.push(
+      '<div class="schema-meta">Literal: <code>' + valueStr + '</code></div>'
     );
   }
 
+  return parts.join('<br>');
+}
+
+/**
+ * Escape HTML helper.
+ */
+function escapeHtml(str) {
+  return String(str)
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+}
+
+
   function getTypeLabel(node) {
     if (!node) return 'any';
     if (node.kind === 'array') return getTypeLabel(node.element) + '[]';