npm - @emeryld/rrroutes-contract - Versions diffs - 2.7.2 → 2.7.4 - Mend

@emeryld/rrroutes-contract 2.7.2 → 2.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/README.md +2 -1
package/dist/export/defaultViewerTemplate.d.ts +1 -0
package/dist/export/index.d.ts +1 -0
package/dist/index.cjs +87 -8
package/dist/index.cjs.map +1 -1
package/dist/index.mjs +86 -8
package/dist/index.mjs.map +1 -1
package/package.json +3 -2
package/tools/finalized-leaves-viewer.html +1061 -0

package/tools/finalized-leaves-viewer.html ADDED Viewed

@@ -0,0 +1,1061 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Finalized Leaves Viewer</title>
+    <style>
+      :root {
+        --bg: #f6f8fc;
+        --surface: #ffffff;
+        --surface-2: #f1f4f9;
+        --border: #d9e0eb;
+        --text: #182033;
+        --muted: #64708b;
+        --accent: #1858c6;
+        --ok: #1f8f4e;
+        --danger: #d12b2b;
+      }
+      * {
+        box-sizing: border-box;
+      }
+      body {
+        margin: 0;
+        font-family: 'Iosevka Web', 'SFMono-Regular', Menlo, Consolas, monospace;
+        color: var(--text);
+        background: var(--bg);
+      }
+      mark {
+        background: #ffec99;
+        color: #402f00;
+        border-radius: 2px;
+        padding: 0 1px;
+      }
+      .wrap {
+        max-width: 1200px;
+        margin: 0 auto;
+        padding: 20px;
+      }
+      .card {
+        background: var(--surface);
+        border: 1px solid #e7ecf4;
+        border-radius: 6px;
+        padding: 12px;
+      }
+      .controls {
+        display: grid;
+        gap: 10px;
+      }
+      .field-row {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+      .field-actions {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+      .field-item {
+        display: inline-flex;
+        align-items: center;
+        gap: 6px;
+        padding: 3px 0;
+      }
+      input[type='text'],
+      select {
+        width: 100%;
+        border: 1px solid var(--border);
+        border-radius: 4px;
+        padding: 8px 10px;
+        font: inherit;
+        background: #fff;
+      }
+      button {
+        border: 1px solid var(--border);
+        border-radius: 4px;
+        padding: 7px 10px;
+        font: inherit;
+        background: #fff;
+        color: var(--text);
+        cursor: pointer;
+      }
+      button:hover {
+        background: var(--surface-2);
+      }
+      .meta {
+        color: var(--muted);
+        font-size: 12px;
+      }
+      #results {
+        margin-top: 14px;
+        display: grid;
+        gap: 0;
+      }
+      details.leaf {
+        border-top: 1px solid var(--border);
+        padding: 10px 2px;
+      }
+      summary {
+        cursor: pointer;
+        font-weight: 700;
+        color: var(--accent);
+      }
+      .leaf-content {
+        display: grid;
+        gap: 4px;
+        margin-top: 10px;
+      }
+      .section {
+        border-top: 1px solid #e8edf5;
+        padding: 10px 0 2px;
+      }
+      .section h3 {
+        margin: 0 0 8px;
+        font-size: 13px;
+      }
+      .grid-2 {
+        display: grid;
+        gap: 6px;
+        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+      }
+      .kv {
+        border-bottom: 1px dashed #e2e8f2;
+        padding: 4px 0 6px;
+      }
+      .kv .k {
+        font-size: 11px;
+        color: var(--muted);
+      }
+      .kv .v {
+        margin-top: 2px;
+        word-break: break-word;
+      }
+      .chips {
+        display: flex;
+        gap: 6px;
+        flex-wrap: wrap;
+      }
+      .chips.filters {
+        margin-top: 2px;
+      }
+      .chip {
+        border: 1px solid #e0e6f0;
+        border-radius: 4px;
+        padding: 2px 6px;
+        font-size: 12px;
+        background: #f6f8fc;
+      }
+      .chip.ok {
+        border-color: #b5e4c8;
+        color: var(--ok);
+        background: #effbf4;
+      }
+      .empty {
+        color: var(--muted);
+      }
+      .mono {
+        font-family: inherit;
+      }
+      .schema-block {
+        border-top: 1px solid #e8edf5;
+        padding: 8px 0 2px;
+        margin-bottom: 6px;
+      }
+      .schema-block:last-child {
+        margin-bottom: 0;
+      }
+      .schema-header {
+        font-weight: 700;
+        margin-bottom: 6px;
+      }
+      .schema-tree details {
+        margin-left: 12px;
+        border-left: 1px solid #e8edf5;
+        padding-left: 8px;
+      }
+      .tree-row {
+        display: grid;
+        grid-template-columns: 1fr auto;
+        gap: 8px;
+        padding: 3px 0;
+        align-items: center;
+      }
+      .schema-tree summary .tree-row {
+        display: inline-grid;
+        vertical-align: middle;
+      }
+      .tree-name {
+        display: inline-flex;
+        align-items: baseline;
+        gap: 2px;
+      }
+      .tree-col-muted {
+        color: var(--muted);
+        font-size: 12px;
+      }
+      .required-star {
+        color: var(--danger);
+        font-weight: 700;
+      }
+      .tree-pill {
+        border: 1px solid #e0e6f0;
+        border-radius: 4px;
+        padding: 1px 6px;
+        font-size: 11px;
+        background: #f2f5fa;
+      }
+    </style>
+  </head>
+  <body>
+    <div class="wrap">
+      <h1>Finalized Leaves Viewer</h1>
+      <div class="card controls">
+        <label>
+          Load export JSON file:
+          <input id="fileInput" type="file" accept="application/json,.json" />
+        </label>
+        <label>
+          Search text:
+          <input id="searchInput" type="text" placeholder="Type to search..." />
+        </label>
+        <label>
+          Type filter:
+          <input id="typeFilterInput" type="text" placeholder='Type/kind/enum (e.g. "paid")' />
+        </label>
+        <div class="field-row">
+          <label class="field-item">
+            <input id="caseSensitive" type="checkbox" />
+            <span>case sensitive</span>
+          </label>
+          <label class="field-item">
+            <input id="regexSearch" type="checkbox" />
+            <span>regex</span>
+          </label>
+          <label class="field-item">
+            <input id="hasEnumOnly" type="checkbox" />
+            <span>has enum only</span>
+          </label>
+          <label class="field-item">
+            <span>type match</span>
+            <select id="typeMatchMode">
+              <option value="contains" selected>contains</option>
+              <option value="exact">exact</option>
+            </select>
+          </label>
+        </div>
+        <div id="fieldCheckboxes" class="field-row"></div>
+        <div class="field-actions">
+          <button id="selectAllFields" type="button">Select all</button>
+          <button id="clearAllFields" type="button">Clear all</button>
+          <button id="schemasOnlyFields" type="button">Schemas only</button>
+          <button id="metadataOnlyFields" type="button">Metadata only</button>
+          <button id="resetFilters" type="button">Reset filters</button>
+        </div>
+        <div id="activeFilterChips" class="chips filters"></div>
+        <div id="status" class="meta">Load a JSON export to begin.</div>
+      </div>
+      <div id="results"></div>
+    </div>
+    <!--__FINALIZED_LEAVES_BAKED_PAYLOAD__-->
+    <script>
+      const SEARCH_FIELDS = [
+        { id: 'method', label: 'method', get: (leaf) => [leaf.method] },
+        { id: 'path', label: 'path', get: (leaf) => [leaf.path] },
+        { id: 'key', label: 'key', get: (leaf) => [leaf.key] },
+        { id: 'summary', label: 'summary', get: (leaf) => [leaf.cfg?.summary] },
+        {
+          id: 'description',
+          label: 'description',
+          get: (leaf) => [leaf.cfg?.description],
+        },
+        { id: 'docsGroup', label: 'docsGroup', get: (leaf) => [leaf.cfg?.docsGroup] },
+        { id: 'tags', label: 'tags', get: (leaf) => leaf.cfg?.tags || [] },
+        { id: 'stability', label: 'stability', get: (leaf) => [leaf.cfg?.stability] },
+        { id: 'docsMeta', label: 'docsMeta', get: (leaf) => [leaf.cfg?.docsMeta] },
+        {
+          id: 'params',
+          label: 'params',
+          get: (leaf, schemaFlatByLeaf) =>
+            schemaSectionToSearchTokens(schemaFlatByLeaf?.[leaf.key], 'params'),
+        },
+        {
+          id: 'query',
+          label: 'query',
+          get: (leaf, schemaFlatByLeaf) =>
+            schemaSectionToSearchTokens(schemaFlatByLeaf?.[leaf.key], 'query'),
+        },
+        {
+          id: 'body',
+          label: 'body',
+          get: (leaf, schemaFlatByLeaf) =>
+            schemaSectionToSearchTokens(schemaFlatByLeaf?.[leaf.key], 'body'),
+        },
+        {
+          id: 'output',
+          label: 'output',
+          get: (leaf, schemaFlatByLeaf) =>
+            schemaSectionToSearchTokens(schemaFlatByLeaf?.[leaf.key], 'output'),
+        },
+      ]
+      const SCHEMA_SECTIONS = ['params', 'query', 'body', 'output']
+      const SCHEMA_FIELD_IDS = new Set(SCHEMA_SECTIONS)
+      const METADATA_FIELD_IDS = new Set(
+        SEARCH_FIELDS.map((field) => field.id).filter((id) => !SCHEMA_FIELD_IDS.has(id)),
+      )
+      const state = { payload: null, leaves: [] }
+      const fileInput = document.getElementById('fileInput')
+      const searchInput = document.getElementById('searchInput')
+      const typeFilterInput = document.getElementById('typeFilterInput')
+      const caseSensitiveInput = document.getElementById('caseSensitive')
+      const regexSearchInput = document.getElementById('regexSearch')
+      const hasEnumOnlyInput = document.getElementById('hasEnumOnly')
+      const typeMatchModeInput = document.getElementById('typeMatchMode')
+      const fieldCheckboxes = document.getElementById('fieldCheckboxes')
+      const activeFilterChips = document.getElementById('activeFilterChips')
+      const selectAllFieldsBtn = document.getElementById('selectAllFields')
+      const clearAllFieldsBtn = document.getElementById('clearAllFields')
+      const schemasOnlyFieldsBtn = document.getElementById('schemasOnlyFields')
+      const metadataOnlyFieldsBtn = document.getElementById('metadataOnlyFields')
+      const resetFiltersBtn = document.getElementById('resetFilters')
+      const statusEl = document.getElementById('status')
+      const resultsEl = document.getElementById('results')
+      const URL_PARAM_KEY = 'filters'
+      let isHydratingFromUrl = false
+      function escapeHtml(value) {
+        return String(value)
+          .replace(/&/g, '&amp;')
+          .replace(/</g, '&lt;')
+          .replace(/>/g, '&gt;')
+          .replace(/"/g, '&quot;')
+          .replace(/'/g, '&#39;')
+      }
+      function escapeRegExp(value) {
+        return value.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+      }
+      function createSearchEngine(queryRaw, options) {
+        const query = queryRaw || ''
+        const caseSensitive = Boolean(options.caseSensitive)
+        const regex = Boolean(options.regex)
+        if (!query) {
+          return {
+            active: false,
+            error: null,
+            test: () => true,
+            highlight: (text) => escapeHtml(text ?? ''),
+          }
+        }
+        if (regex) {
+          try {
+            const flags = caseSensitive ? 'g' : 'gi'
+            const rx = new RegExp(query, flags)
+            return {
+              active: true,
+              error: null,
+              test: (text) => {
+                const source = String(text ?? '')
+                const probe = new RegExp(rx.source, rx.flags)
+                return probe.test(source)
+              },
+              highlight: (text) => {
+                const source = String(text ?? '')
+                return escapeHtml(source).replace(
+                  new RegExp(rx.source, rx.flags),
+                  (m) => `<mark>${m}</mark>`,
+                )
+              },
+            }
+          } catch (error) {
+            return {
+              active: true,
+              error: error instanceof Error ? error.message : 'Invalid regex',
+              test: () => false,
+              highlight: (text) => escapeHtml(text ?? ''),
+            }
+          }
+        }
+        const needle = caseSensitive ? query : query.toLowerCase()
+        const flags = caseSensitive ? 'g' : 'gi'
+        const safe = escapeRegExp(query)
+        return {
+          active: true,
+          error: null,
+          test: (text) => {
+            const source = String(text ?? '')
+            const hay = caseSensitive ? source : source.toLowerCase()
+            return hay.includes(needle)
+          },
+          highlight: (text) =>
+            escapeHtml(String(text ?? '')).replace(
+              new RegExp(safe, flags),
+              (m) => `<mark>${m}</mark>`,
+            ),
+        }
+      }
+      function toTokens(value) {
+        if (value === null || value === undefined) return []
+        if (typeof value === 'string') return [value]
+        if (typeof value === 'number' || typeof value === 'boolean') return [String(value)]
+        if (Array.isArray(value)) return value.flatMap((item) => toTokens(item))
+        if (typeof value === 'object') return [JSON.stringify(value)]
+        return []
+      }
+      function flatSchemaToSearchTokens(flatSchema) {
+        if (!flatSchema || typeof flatSchema !== 'object') return []
+        const tokens = new Set()
+        Object.entries(flatSchema).forEach(([path, info]) => {
+          if (path) {
+            tokens.add(path)
+            path.split('.').forEach((segment) => {
+              if (segment) tokens.add(segment)
+            })
+          }
+          if (info && typeof info === 'object') {
+            tokens.add(JSON.stringify(info))
+            if (info.type) tokens.add(String(info.type))
+            if (info.kind) tokens.add(String(info.kind))
+            if (info.description) tokens.add(String(info.description))
+            if (Array.isArray(info.enumValues)) {
+              info.enumValues.forEach((value) => tokens.add(String(value)))
+            }
+          } else if (info !== null && info !== undefined) {
+            tokens.add(String(info))
+          }
+        })
+        tokens.add(JSON.stringify(flatSchema))
+        return Array.from(tokens)
+      }
+      function schemaSectionToSearchTokens(flatSchema, sectionName) {
+        if (!flatSchema || typeof flatSchema !== 'object') return []
+        const sectionEntries = Object.entries(flatSchema).filter(
+          ([path]) => path === sectionName || path.startsWith(`${sectionName}.`),
+        )
+        if (sectionEntries.length === 0) return []
+        return flatSchemaToSearchTokens(Object.fromEntries(sectionEntries))
+      }
+      function typeFilterTokensByLeaf(flatSchema) {
+        if (!flatSchema || typeof flatSchema !== 'object') return { tokens: [], hasEnum: false }
+        const tokens = new Set()
+        let hasEnum = false
+        Object.values(flatSchema).forEach((info) => {
+          if (!info || typeof info !== 'object') return
+          if (info.type) tokens.add(String(info.type))
+          if (info.kind) tokens.add(String(info.kind))
+          if (Array.isArray(info.enumValues) && info.enumValues.length > 0) {
+            hasEnum = true
+            info.enumValues.forEach((value) => tokens.add(String(value)))
+          }
+        })
+        return { tokens: Array.from(tokens), hasEnum }
+      }
+      function selectedFieldIds() {
+        return SEARCH_FIELDS.filter((field) => {
+          const input = document.getElementById(`field-${field.id}`)
+          return Boolean(input && input.checked)
+        }).map((field) => field.id)
+      }
+      function matchesLeaf(leaf, engine, selectedIds) {
+        if (!engine.active) return true
+        if (selectedIds.length === 0) return false
+        const schemaFlatByLeaf = state.payload?.schemaFlatByLeaf || {}
+        return SEARCH_FIELDS.some((field) => {
+          if (!selectedIds.includes(field.id)) return false
+          const tokens = toTokens(field.get(leaf, schemaFlatByLeaf))
+          return tokens.some((token) => engine.test(token))
+        })
+      }
+      function matchesTypeFilter(leaf, typeEngine, matchMode, hasEnumOnly) {
+        const schemaFlatByLeaf = state.payload?.schemaFlatByLeaf || {}
+        const { tokens, hasEnum } = typeFilterTokensByLeaf(schemaFlatByLeaf?.[leaf.key])
+        if (hasEnumOnly && !hasEnum) return false
+        if (!typeEngine.active) return true
+        if (matchMode === 'exact') {
+          const sourceTokens = typeEngine.caseSensitive
+            ? tokens
+            : tokens.map((token) => token.toLowerCase())
+          const needle = typeEngine.caseSensitive ? typeEngine.query : typeEngine.query.toLowerCase()
+          return sourceTokens.includes(needle)
+        }
+        return tokens.some((token) => typeEngine.test(token))
+      }
+      function createTypeSearchEngine(queryRaw) {
+        const query = queryRaw || ''
+        const caseSensitive = Boolean(caseSensitiveInput.checked)
+        if (!query) return { active: false, query, caseSensitive, test: () => true }
+        const needle = caseSensitive ? query : query.toLowerCase()
+        return {
+          active: true,
+          query,
+          caseSensitive,
+          test: (text) => {
+            const source = String(text ?? '')
+            const hay = caseSensitive ? source : source.toLowerCase()
+            return hay.includes(needle)
+          },
+        }
+      }
+      function el(tag, className, text) {
+        const node = document.createElement(tag)
+        if (className) node.className = className
+        if (text !== undefined) node.textContent = text
+        return node
+      }
+      function setHighlighted(node, text, engine) {
+        node.innerHTML = engine.highlight(text ?? '')
+      }
+      function kv(key, value, engine) {
+        const box = el('div', 'kv')
+        box.appendChild(el('div', 'k', key))
+        const valueNode = el('div', 'v mono')
+        setHighlighted(valueNode, value === undefined ? '—' : String(value), engine)
+        box.appendChild(valueNode)
+        return box
+      }
+      function renderSchemaSummary(name, schema, engine) {
+        const row = el('div', 'kv')
+        row.appendChild(el('div', 'k', name))
+        const valueNode = el('div', 'v mono')
+        if (!schema) {
+          setHighlighted(valueNode, 'not defined', engine)
+          row.appendChild(valueNode)
+          return row
+        }
+        const parts = [schema.kind]
+        if (schema.optional) parts.push('optional')
+        if (schema.nullable) parts.push('nullable')
+        if (Array.isArray(schema.enumValues) && schema.enumValues.length > 0) {
+          parts.push(`enum: ${schema.enumValues.join('|')}`)
+        }
+        if (schema.properties) {
+          parts.push(`properties: ${Object.keys(schema.properties).length}`)
+        }
+        setHighlighted(valueNode, parts.join(' | '), engine)
+        row.appendChild(valueNode)
+        return row
+      }
+      function splitFlatSchemaBySection(flatSchema) {
+        const result = {
+          params: {},
+          query: {},
+          body: {},
+          output: {},
+        }
+        if (!flatSchema) return result
+        Object.entries(flatSchema).forEach(([path, info]) => {
+          const section = SCHEMA_SECTIONS.find(
+            (name) => path === name || path.startsWith(`${name}.`),
+          )
+          if (!section) return
+          result[section][path] = info
+        })
+        return result
+      }
+      function createTreeNode(name = '') {
+        return {
+          name,
+          info: null,
+          fullPath: null,
+          children: {},
+        }
+      }
+      function buildSchemaTree(entries, sectionName) {
+        const root = createTreeNode(sectionName)
+        Object.entries(entries)
+          .sort(([a], [b]) => a.localeCompare(b))
+          .forEach(([fullPath, info]) => {
+            const trimmed = fullPath === sectionName ? '' : fullPath.slice(sectionName.length + 1)
+            const segments = trimmed ? trimmed.split('.') : []
+            let current = root
+            segments.forEach((segment) => {
+              if (!current.children[segment]) {
+                current.children[segment] = createTreeNode(segment)
+              }
+              current = current.children[segment]
+            })
+            current.info = info
+            current.fullPath = fullPath
+          })
+        return root
+      }
+      function renderTreeNode(node, engine, isRoot) {
+        const childKeys = Object.keys(node.children)
+        const hasChildren = childKeys.length > 0
+        const hasInfo = Boolean(node.info)
+        const appendNameCell = (row) => {
+          const nameWrap = el('span', 'mono tree-name')
+          const nameNode = el('span')
+          setHighlighted(nameNode, node.name, engine)
+          nameWrap.appendChild(nameNode)
+          if (node.info && !node.info.optional) {
+            const star = el('span', 'required-star', '*')
+            nameWrap.appendChild(star)
+          }
+          if (node.info?.nullable) {
+            nameWrap.appendChild(el('span', 'tree-col-muted', '-'))
+          }
+          row.appendChild(nameWrap)
+        }
+        const appendTypeCell = (row, info) => {
+          const type = el('span', 'tree-pill')
+          setHighlighted(type, info?.type || info?.kind || '—', engine)
+          row.appendChild(type)
+        }
+        if (isRoot || hasChildren) {
+          const details = el('details')
+          details.open = true
+          const summary = el('summary')
+          const row = el('div', 'tree-row')
+          appendNameCell(row)
+          appendTypeCell(row, hasInfo ? node.info : null)
+          summary.appendChild(row)
+          details.appendChild(summary)
+          const container = el('div', 'schema-tree')
+          childKeys
+            .sort((a, b) => a.localeCompare(b))
+            .forEach((key) => container.appendChild(renderTreeNode(node.children[key], engine, false)))
+          details.appendChild(container)
+          return details
+        }
+        const row = el('div', 'tree-row')
+        appendNameCell(row)
+        appendTypeCell(row, node.info)
+        return row
+      }
+      function renderSeparatedSchemas(flatSchema, engine) {
+        const section = el('div', 'section')
+        section.appendChild(el('h3', '', 'Schemas (separated by section)'))
+        const grouped = splitFlatSchemaBySection(flatSchema)
+        SCHEMA_SECTIONS.forEach((sectionName) => {
+          const block = el('div', 'schema-block')
+          const header = el('div', 'schema-header mono')
+          setHighlighted(header, sectionName, engine)
+          block.appendChild(header)
+          const entries = grouped[sectionName]
+          if (!entries || Object.keys(entries).length === 0) {
+            block.appendChild(el('div', 'empty', 'No entries'))
+          } else {
+            const tree = buildSchemaTree(entries, sectionName)
+            block.appendChild(renderTreeNode(tree, engine, true))
+          }
+          section.appendChild(block)
+        })
+        return section
+      }
+      function renderLeaf(leaf, engine) {
+        const details = el('details', 'leaf')
+        const summary = el('summary')
+        setHighlighted(summary, `${String(leaf.method || '').toUpperCase()} ${leaf.path || ''}`, engine)
+        details.appendChild(summary)
+        const content = el('div', 'leaf-content')
+        const cfg = leaf.cfg || {}
+        const flatSchema = state.payload?.schemaFlatByLeaf?.[leaf.key]
+        const overview = el('div', 'section')
+        overview.appendChild(el('h3', '', 'Overview'))
+        const grid = el('div', 'grid-2')
+        grid.appendChild(kv('key', leaf.key, engine))
+        grid.appendChild(kv('method', leaf.method, engine))
+        grid.appendChild(kv('path', leaf.path, engine))
+        grid.appendChild(kv('group', cfg.docsGroup, engine))
+        grid.appendChild(kv('stability', cfg.stability, engine))
+        grid.appendChild(kv('feed', cfg.feed ? 'true' : 'false', engine))
+        grid.appendChild(kv('deprecated', cfg.deprecated ? 'true' : 'false', engine))
+        grid.appendChild(kv('hidden', cfg.docsHidden ? 'true' : 'false', engine))
+        overview.appendChild(grid)
+        content.appendChild(overview)
+        const docs = el('div', 'section')
+        docs.appendChild(el('h3', '', 'Documentation'))
+        const docGrid = el('div', 'grid-2')
+        docGrid.appendChild(kv('summary', cfg.summary, engine))
+        docGrid.appendChild(kv('description', cfg.description, engine))
+        docs.appendChild(docGrid)
+        const tagsRow = el('div', 'chips')
+        ;(cfg.tags || []).forEach((tag) => {
+          const chip = el('span', 'chip')
+          setHighlighted(chip, tag, engine)
+          tagsRow.appendChild(chip)
+        })
+        if ((cfg.tags || []).length === 0) {
+          tagsRow.appendChild(el('span', 'empty', 'No tags'))
+        }
+        docs.appendChild(tagsRow)
+        if (cfg.docsMeta && Object.keys(cfg.docsMeta).length > 0) {
+          Object.entries(cfg.docsMeta).forEach(([k, v]) => {
+            docs.appendChild(kv(`meta.${k}`, typeof v === 'string' ? v : JSON.stringify(v), engine))
+          })
+        }
+        content.appendChild(docs)
+        const schemas = el('div', 'section')
+        schemas.appendChild(el('h3', '', 'Schema Summaries'))
+        const schemaGrid = el('div', 'grid-2')
+        const schemaObj = cfg.schemas || {}
+        schemaGrid.appendChild(renderSchemaSummary('params', schemaObj.params, engine))
+        schemaGrid.appendChild(renderSchemaSummary('query', schemaObj.query, engine))
+        schemaGrid.appendChild(renderSchemaSummary('body', schemaObj.body, engine))
+        schemaGrid.appendChild(renderSchemaSummary('output', schemaObj.output, engine))
+        schemaGrid.appendChild(renderSchemaSummary('outputMeta', schemaObj.outputMeta, engine))
+        schemaGrid.appendChild(renderSchemaSummary('queryExtension', schemaObj.queryExtension, engine))
+        schemas.appendChild(schemaGrid)
+        content.appendChild(schemas)
+        const files = el('div', 'section')
+        files.appendChild(el('h3', '', 'Body Files'))
+        if (Array.isArray(cfg.bodyFiles) && cfg.bodyFiles.length > 0) {
+          const chips = el('div', 'chips')
+          cfg.bodyFiles.forEach((file) => {
+            const chip = el('span', 'chip ok')
+            setHighlighted(chip, `${file.name} (max ${file.maxCount})`, engine)
+            chips.appendChild(chip)
+          })
+          files.appendChild(chips)
+        } else {
+          files.appendChild(el('div', 'empty', 'No file upload fields.'))
+        }
+        content.appendChild(files)
+        content.appendChild(renderSeparatedSchemas(flatSchema, engine))
+        details.appendChild(content)
+        return details
+      }
+      function renderResults() {
+        const engine = createSearchEngine(searchInput.value.trim(), {
+          caseSensitive: caseSensitiveInput.checked,
+          regex: regexSearchInput.checked,
+        })
+        const typeEngine = createTypeSearchEngine(typeFilterInput.value.trim())
+        const hasEnumOnly = Boolean(hasEnumOnlyInput.checked)
+        const typeMatchMode = typeMatchModeInput.value === 'exact' ? 'exact' : 'contains'
+        if (engine.error) {
+          statusEl.textContent = `Invalid regex: ${engine.error}`
+          resultsEl.innerHTML = ''
+          resultsEl.appendChild(el('div', 'empty', 'Fix the regex to continue.'))
+          renderActiveFilterChips({
+            selectedIds: selectedFieldIds(),
+            hasRegexError: true,
+          })
+          return
+        }
+        const selectedIds = selectedFieldIds()
+        const filtered = state.leaves.filter(
+          (leaf) =>
+            matchesLeaf(leaf, engine, selectedIds) &&
+            matchesTypeFilter(leaf, typeEngine, typeMatchMode, hasEnumOnly),
+        )
+        statusEl.textContent = `${filtered.length} / ${state.leaves.length} routes matched.`
+        resultsEl.innerHTML = ''
+        renderActiveFilterChips({ selectedIds, hasRegexError: false })
+        if (filtered.length === 0) {
+          resultsEl.appendChild(el('div', 'empty', 'No matches.'))
+          syncFilterStateToUrl()
+          return
+        }
+        filtered.forEach((leaf) => {
+          resultsEl.appendChild(renderLeaf(leaf, engine))
+        })
+        syncFilterStateToUrl()
+      }
+      function renderFieldCheckboxes() {
+        fieldCheckboxes.innerHTML = ''
+        SEARCH_FIELDS.forEach((field) => {
+          const label = el('label', 'field-item')
+          const input = document.createElement('input')
+          input.type = 'checkbox'
+          input.id = `field-${field.id}`
+          input.checked = true
+          input.addEventListener('change', renderResults)
+          label.appendChild(input)
+          label.appendChild(el('span', '', field.label))
+          fieldCheckboxes.appendChild(label)
+        })
+      }
+      function setFieldSelection(allowedIds) {
+        SEARCH_FIELDS.forEach((field) => {
+          const input = document.getElementById(`field-${field.id}`)
+          if (!input) return
+          input.checked = allowedIds.has(field.id)
+        })
+        renderResults()
+      }
+      function resetFiltersToDefault() {
+        searchInput.value = ''
+        typeFilterInput.value = ''
+        caseSensitiveInput.checked = false
+        regexSearchInput.checked = false
+        hasEnumOnlyInput.checked = false
+        typeMatchModeInput.value = 'contains'
+        setFieldSelection(new Set(SEARCH_FIELDS.map((field) => field.id)))
+      }
+      function renderActiveFilterChips({ selectedIds, hasRegexError }) {
+        activeFilterChips.innerHTML = ''
+        const chips = []
+        const searchValue = searchInput.value.trim()
+        const typeValue = typeFilterInput.value.trim()
+        if (searchValue) chips.push(`search: ${searchValue}`)
+        if (typeValue) chips.push(`type: ${typeValue}`)
+        if (typeMatchModeInput.value === 'exact') chips.push('type mode: exact')
+        if (caseSensitiveInput.checked) chips.push('case sensitive')
+        if (regexSearchInput.checked) chips.push('regex')
+        if (hasEnumOnlyInput.checked) chips.push('has enum only')
+        if (hasRegexError) chips.push('regex error')
+        const allIds = SEARCH_FIELDS.map((field) => field.id)
+        if (selectedIds.length !== allIds.length) {
+          chips.push(`fields: ${selectedIds.join(', ') || 'none'}`)
+        }
+        if (chips.length === 0) {
+          activeFilterChips.appendChild(el('span', 'empty', 'No active filters'))
+          return
+        }
+        chips.forEach((chipText) => {
+          const chip = el('span', 'chip')
+          chip.textContent = chipText
+          activeFilterChips.appendChild(chip)
+        })
+      }
+      function collectFilterState() {
+        return {
+          search: searchInput.value,
+          typeFilter: typeFilterInput.value,
+          caseSensitive: caseSensitiveInput.checked,
+          regex: regexSearchInput.checked,
+          hasEnumOnly: hasEnumOnlyInput.checked,
+          typeMatchMode: typeMatchModeInput.value === 'exact' ? 'exact' : 'contains',
+          selectedFields: selectedFieldIds(),
+        }
+      }
+      function syncFilterStateToUrl() {
+        if (isHydratingFromUrl) return
+        const data = collectFilterState()
+        const params = new URLSearchParams(window.location.hash.replace(/^#/, ''))
+        const serialized = encodeURIComponent(JSON.stringify(data))
+        params.set(URL_PARAM_KEY, serialized)
+        const nextHash = params.toString()
+        if (window.location.hash !== `#${nextHash}`) {
+          window.location.hash = nextHash
+        }
+      }
+      function hydrateFilterStateFromUrl() {
+        const params = new URLSearchParams(window.location.hash.replace(/^#/, ''))
+        const raw = params.get(URL_PARAM_KEY)
+        if (!raw) return
+        try {
+          const parsed = JSON.parse(decodeURIComponent(raw))
+          isHydratingFromUrl = true
+          if (typeof parsed.search === 'string') searchInput.value = parsed.search
+          if (typeof parsed.typeFilter === 'string') typeFilterInput.value = parsed.typeFilter
+          caseSensitiveInput.checked = Boolean(parsed.caseSensitive)
+          regexSearchInput.checked = Boolean(parsed.regex)
+          hasEnumOnlyInput.checked = Boolean(parsed.hasEnumOnly)
+          if (parsed.typeMatchMode === 'exact' || parsed.typeMatchMode === 'contains') {
+            typeMatchModeInput.value = parsed.typeMatchMode
+          }
+          if (Array.isArray(parsed.selectedFields)) {
+            const allowed = new Set(parsed.selectedFields)
+            SEARCH_FIELDS.forEach((field) => {
+              const input = document.getElementById(`field-${field.id}`)
+              if (!input) return
+              input.checked = allowed.has(field.id)
+            })
+          }
+        } catch (error) {
+          // Ignore malformed hash state.
+        } finally {
+          isHydratingFromUrl = false
+        }
+      }
+      async function handleFile(file) {
+        const text = await file.text()
+        const parsed = JSON.parse(text)
+        if (!parsed || !Array.isArray(parsed.leaves)) {
+          throw new Error('Invalid export file: expected top-level "leaves" array.')
+        }
+        state.payload = parsed
+        state.leaves = parsed.leaves
+        renderResults()
+      }
+      function initializeFromBakedPayload() {
+        const baked = window.__FINALIZED_LEAVES_PAYLOAD
+        if (!baked || !Array.isArray(baked.leaves)) return
+        state.payload = baked
+        state.leaves = baked.leaves
+        statusEl.textContent = `Loaded baked payload with ${state.leaves.length} routes.`
+        renderResults()
+      }
+      fileInput.addEventListener('change', async (event) => {
+        const file = event.target.files?.[0]
+        if (!file) return
+        try {
+          await handleFile(file)
+        } catch (error) {
+          statusEl.textContent = error instanceof Error ? error.message : String(error)
+          resultsEl.innerHTML = ''
+        }
+      })
+      searchInput.addEventListener('input', renderResults)
+      typeFilterInput.addEventListener('input', renderResults)
+      caseSensitiveInput.addEventListener('change', renderResults)
+      regexSearchInput.addEventListener('change', renderResults)
+      hasEnumOnlyInput.addEventListener('change', renderResults)
+      typeMatchModeInput.addEventListener('change', renderResults)
+      selectAllFieldsBtn.addEventListener('click', () =>
+        setFieldSelection(new Set(SEARCH_FIELDS.map((field) => field.id))),
+      )
+      clearAllFieldsBtn.addEventListener('click', () => setFieldSelection(new Set()))
+      schemasOnlyFieldsBtn.addEventListener('click', () => setFieldSelection(SCHEMA_FIELD_IDS))
+      metadataOnlyFieldsBtn.addEventListener('click', () => setFieldSelection(METADATA_FIELD_IDS))
+      resetFiltersBtn.addEventListener('click', resetFiltersToDefault)
+      renderFieldCheckboxes()
+      hydrateFilterStateFromUrl()
+      initializeFromBakedPayload()
+      renderResults()
+    </script>
+  </body>
+</html>