@emeryld/rrroutes-export 1.0.19 → 1.0.20

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@emeryld/rrroutes-export",
   "description": "Finalized leaves export helpers and CLI for RRRoutes",
-  "version": "1.0.19",
+  "version": "1.0.20",
   "private": false,
   "type": "module",
   "main": "dist/index.cjs",

package/tools/finalized-leaves-viewer.html

@@ -403,6 +403,45 @@
         color: var(--schema-accent);
       }
 
+      .event-title-row {
+        display: inline-flex;
+        flex-wrap: wrap;
+        gap: 8px;
+        align-items: center;
+      }
+
+      .event-action-added {
+        color: var(--ok);
+        font-weight: 700;
+      }
+
+      .event-action-removed {
+        color: var(--danger);
+      }
+
+      .event-action-modified {
+        color: var(--accent);
+        font-weight: 700;
+      }
+
+      .event-icon {
+        display: inline-flex;
+        width: 14px;
+        height: 14px;
+        color: var(--muted);
+      }
+
+      .event-icon svg {
+        width: 14px;
+        height: 14px;
+        display: block;
+      }
+
+      .event-name {
+        font-weight: 700;
+        color: var(--text);
+      }
+
       .schema-block {
         border-top: 1px solid var(--border);
         padding: 8px 0 2px;
@@ -1652,7 +1691,12 @@
 
           const routeChangelogBody = el('div', 'leaf-content')
           routeHistoryNewestFirst.forEach((event) => {
-            routeChangelogBody.appendChild(renderEventCard(event, commitBySha))
+            routeChangelogBody.appendChild(
+              renderEventCard(event, commitBySha, {
+                showTitle: true,
+                item: { eventKind: 'route', routeKey: leaf.key, event },
+              }),
+            )
           })
           routeChangelogDetails.appendChild(routeChangelogBody)
           routeChangelogSection.appendChild(routeChangelogDetails)
@@ -1714,9 +1758,9 @@
         return `${type}${schemaFlags(Boolean(entry.nullable), Boolean(entry.optional))}`
       }
 
-      function formatPathLabel(path, entry) {
+      function formatPathLabel(path) {
         const basePath = typeof path === 'string' ? path : ''
-        return `${basePath}${schemaFlags(Boolean(entry?.nullable), Boolean(entry?.optional))}`
+        return basePath
       }
 
       function parseSignatureTypeLabel(signature) {
@@ -1812,7 +1856,7 @@
         if ('path' in delta) {
           if (delta.op === 'added') {
             const afterType = formatEntryTypeLabel(delta.after)
-            const pathLabel = formatPathLabel(delta.path, delta.after)
+            const pathLabel = formatPathLabel(delta.path)
             if (afterType) return buildSchemaDiffLine(delta.op, afterType, pathLabel)
             return buildLegacySchemaDiffLine(
               `added ${delta.path}: ${formatRouteSchemaEntry(delta.after)}`,
@@ -1820,7 +1864,7 @@
           }
           if (delta.op === 'removed') {
             const beforeType = formatEntryTypeLabel(delta.before)
-            const pathLabel = formatPathLabel(delta.path, delta.before)
+            const pathLabel = formatPathLabel(delta.path)
             if (beforeType)
               return buildSchemaDiffLine(delta.op, beforeType, pathLabel)
             return buildLegacySchemaDiffLine(
@@ -1830,7 +1874,7 @@
           const beforeType = formatEntryTypeLabel(delta.before) || 'unknown'
           const afterType = formatEntryTypeLabel(delta.after) || 'unknown'
           const pathLabel =
-            formatPathLabel(delta.path, delta.after || delta.before) || delta.path
+            formatPathLabel(delta.path) || delta.path
           return buildSchemaDiffLine(delta.op, beforeType, pathLabel, afterType)
         }
         return null
@@ -1841,7 +1885,92 @@
         return `${diff.field}: ${JSON.stringify(diff.before)} -> ${JSON.stringify(diff.after)}`
       }
 
-      function renderEventCard(event, commitBySha) {
+      const EVENT_ICON_SVGS = {
+        route:
+          '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.4" stroke-linecap="round" stroke-linejoin="round"><path d="M2.5 13V3.5h11V13"/><path d="M8 3.5v9.5"/><path d="M5.5 6h.01M10.5 10h.01"/></svg>',
+        source:
+          '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"><ellipse cx="8" cy="3.5" rx="4.8" ry="2.2"/><path d="M3.2 3.5v7c0 1.2 2.1 2.2 4.8 2.2s4.8-1 4.8-2.2v-7"/><path d="M3.2 7c0 1.2 2.1 2.2 4.8 2.2s4.8-1 4.8-2.2"/></svg>',
+        schema:
+          '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"><path d="M2.5 4.2L8 1.8l5.5 2.4L8 6.6 2.5 4.2Z"/><path d="M2.5 8L8 5.6 13.5 8 8 10.4 2.5 8Z"/><path d="M2.5 11.8 8 9.4l5.5 2.4L8 14.2l-5.5-2.4Z"/></svg>',
+        config:
+          '<svg viewBox="0 0 16 16" fill="none" stroke="currentColor" stroke-width="1.3" stroke-linecap="round" stroke-linejoin="round"><path d="M2 4h12"/><path d="M2 8h12"/><path d="M2 12h12"/><circle cx="6" cy="4" r="1.6" fill="currentColor" stroke="none"/><circle cx="10.5" cy="8" r="1.6" fill="currentColor" stroke="none"/><circle cx="4.5" cy="12" r="1.6" fill="currentColor" stroke="none"/></svg>',
+      }
+
+      function eventVisualByType(type) {
+        switch (type) {
+          case 'route_added':
+            return { actionText: 'added', actionClass: 'event-action-added', icon: 'route' }
+          case 'route_removed':
+            return {
+              actionText: 'removed',
+              actionClass: 'event-action-removed',
+              icon: 'route',
+            }
+          case 'schema_changed':
+            return {
+              actionText: 'modified schema',
+              actionClass: 'event-action-modified',
+              icon: 'schema',
+            }
+          case 'cfg_changed':
+            return {
+              actionText: 'modified config',
+              actionClass: 'event-action-modified',
+              icon: 'config',
+            }
+          case 'source_object_added':
+            return { actionText: 'added', actionClass: 'event-action-added', icon: 'source' }
+          case 'source_object_removed':
+            return {
+              actionText: 'removed',
+              actionClass: 'event-action-removed',
+              icon: 'source',
+            }
+          case 'source_schema_changed':
+            return {
+              actionText: 'modified source object',
+              actionClass: 'event-action-modified',
+              icon: 'source',
+            }
+          default:
+            return {
+              actionText: 'modified',
+              actionClass: 'event-action-modified',
+              icon: 'schema',
+            }
+        }
+      }
+
+      function resolveEventName(item) {
+        if (!item || item.eventKind === 'source') {
+          return item?.displayName || item?.sourceObjectId || 'source object'
+        }
+        const method =
+          typeof item?.event?.method === 'string' ? item.event.method.trim() : ''
+        const path =
+          typeof item?.event?.path === 'string' ? item.event.path.trim() : ''
+        if (method && path) return `${method.toUpperCase()} ${path}`
+        if (path) return path
+        return item?.routeKey || 'route'
+      }
+
+      function renderEventIcon(iconType) {
+        const icon = el('span', `event-icon event-icon-${iconType}`)
+        icon.setAttribute('aria-hidden', 'true')
+        icon.innerHTML = EVENT_ICON_SVGS[iconType] || EVENT_ICON_SVGS.schema
+        return icon
+      }
+
+      function renderEventTitle(item) {
+        const row = el('div', 'event-title-row mono')
+        const visual = eventVisualByType(item?.event?.type)
+        row.appendChild(el('span', visual.actionClass, visual.actionText))
+        row.appendChild(renderEventIcon(visual.icon))
+        row.appendChild(el('span', 'event-name', `[${resolveEventName(item)}]`))
+        return row
+      }
+
+      function renderEventCard(event, commitBySha, options = {}) {
         const card = el('div', 'leaf-content')
         const commit = commitBySha.get(event.commitSha)
         const commitDateTime = formatCommitDateTime(commit?.authorDate)
@@ -1854,7 +1983,9 @@
           .filter(Boolean)
           .join(' - ')
         card.appendChild(el('div', 'meta', commitMeta))
-        card.appendChild(el('div', 'mono', event.type))
+        if (options.showTitle && options.item) {
+          card.appendChild(renderEventTitle(options.item))
+        }
         if (Array.isArray(event.schemaDiff) && event.schemaDiff.length > 0) {
           card.appendChild(
             el('div', 'meta', `schema changes: ${event.schemaDiff.length}`),
@@ -1907,12 +2038,13 @@
           .join(' - ')
       }
 
-      function renderChangelogEventLines(event, commitBySha, contextLabel) {
+      function renderChangelogEventLines(item, commitBySha) {
+        const event = item.event
         const row = el('div', 'changelog-line-item')
         row.appendChild(
           el('div', 'meta', buildCommitMetaLine(event, commitBySha)),
         )
-        row.appendChild(el('div', 'mono', `${contextLabel} (${event.type})`))
+        row.appendChild(renderEventTitle(item))
 
         if (Array.isArray(event.schemaDiff) && event.schemaDiff.length > 0) {
           event.schemaDiff.forEach((delta) => {
@@ -2118,17 +2250,7 @@
           if (state.viewerMode === VIEWER_MODE.changelog) {
             renderCollection(
               filtered,
-              (item) => {
-                const contextLabel =
-                  item.eventKind === 'route'
-                    ? `Route: ${item.routeKey}`
-                    : `Source: ${item.displayName || item.sourceObjectId}`
-                return renderChangelogEventLines(
-                  item.event,
-                  commitBySha,
-                  contextLabel,
-                )
-              },
+              (item) => renderChangelogEventLines(item, commitBySha),
               'No matches.',
             )
           } else {
@@ -2136,9 +2258,15 @@
               filtered,
               (item) => {
                 const details = el('details', 'leaf')
-                const title = `${item.eventKind === 'route' ? `Route: ${item.routeKey}` : `Source: ${item.displayName || item.sourceObjectId}`} (${item.event.type})`
-                details.appendChild(el('summary', '', title))
-                details.appendChild(renderEventCard(item.event, commitBySha))
+                const summary = el('summary')
+                summary.appendChild(renderEventTitle(item))
+                details.appendChild(summary)
+                details.appendChild(
+                  renderEventCard(item.event, commitBySha, {
+                    showTitle: false,
+                    item,
+                  }),
+                )
                 return details
               },
               'No matches.',