dialog-ide 0.5.0

package/dist/dialoged/skein/ui/render.js

@@ -0,0 +1,332 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderNavbar = renderNavbar;
+exports.renderKnotList = renderKnotList;
+exports.renderApp = renderApp;
+exports.renderPage = renderPage;
+const dynamic_1 = require("../dynamic");
+const ansi_1 = require("./ansi");
+const diff_1 = require("./diff");
+const knot_menu_1 = require("./knot-menu");
+const marker_colors_1 = require("./marker-colors");
+const tree_pane_1 = require("./tree-pane");
+const STATUS_BORDER_CLASS = {
+    valid: 'border-base-300',
+    new: 'border-warning',
+    error: 'border-error'
+};
+function escapeHtml(text) {
+    return text
+        .replace(/&/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;');
+}
+function visibleWhitespace(text) {
+    return text.replace(/ /g, '·​').replace(/\n/g, '↵\n');
+}
+const DIFF_SEGMENT_CLASS = {
+    added: 'text-info font-bold',
+    removed: 'text-error font-bold line-through'
+};
+function renderDiff(response, unblessedResponse) {
+    if (unblessedResponse === null) {
+        return response !== null ? (0, ansi_1.ansiToHtml)(response) : '';
+    }
+    const segments = (0, diff_1.diffText)(response !== null ? (0, ansi_1.ansiToMarkers)(response) : null, (0, ansi_1.ansiToMarkers)(unblessedResponse));
+    return segments
+        .map((segment) => {
+        const escaped = escapeHtml(segment.value);
+        if (segment.type === 'unchanged') {
+            return escaped;
+        }
+        return `<span class="${DIFF_SEGMENT_CLASS[segment.type]}">${visibleWhitespace(escaped)}</span>`;
+    })
+        .join('');
+}
+function selectedKnots(tree) {
+    const chain = [];
+    let currentId = 0;
+    while (currentId !== null) {
+        const knot = tree.getDerivedKnot(currentId);
+        if (!knot) {
+            break;
+        }
+        chain.push(knot);
+        currentId = knot.selectedChild;
+    }
+    return chain;
+}
+function totals(tree) {
+    const counts = { valid: 0, new: 0, error: 0 };
+    for (const wireKnot of tree.getAllKnots()) {
+        const derived = tree.getDerivedKnot(wireKnot.id);
+        if (derived) {
+            counts[derived.state]++;
+        }
+    }
+    return counts;
+}
+function reachedViaKeystroke(tree, knot) {
+    return tree.promptTypeAt(knot.parentId) === 'key';
+}
+const dynamicProcessor = new dynamic_1.DynamicProcessor();
+const EMPTY_DYNAMIC_STATE = { flags: new Set(), vars: {} };
+function findDynamicState(tree, knotId) {
+    let currentId = knotId;
+    while (currentId !== null) {
+        const state = tree.getDynamicState(currentId);
+        if (state) {
+            return state;
+        }
+        currentId = tree.getKnot(currentId)?.parentId ?? null;
+    }
+    return null;
+}
+function comparePred(a, b) {
+    return a.replace(/#/g, '').localeCompare(b.replace(/#/g, ''));
+}
+const DYNAMIC_CHIP_CLASS = {
+    added: 'border-success bg-success/20 text-success-content',
+    removed: 'border-warning bg-warning/20 text-warning-content',
+    changed: 'border-info bg-info/10'
+};
+function renderDynamicChanges(tree, knot) {
+    if (knot.parentId === null) {
+        return '';
+    }
+    const after = tree.getDynamicState(knot.id);
+    if (!after) {
+        return '';
+    }
+    const before = findDynamicState(tree, knot.parentId) ?? EMPTY_DYNAMIC_STATE;
+    const { added, removed, changed } = dynamicProcessor.diff(before, after);
+    const tuples = [
+        ...Array.from(added, (predicate) => ['added', predicate]),
+        ...Array.from(removed, (predicate) => ['removed', predicate]),
+        ...Array.from(changed, ([, afterValue]) => ['changed', afterValue])
+    ].sort((a, b) => comparePred(a[1], b[1]));
+    if (tuples.length === 0) {
+        return '';
+    }
+    const chips = tuples
+        .map(([kind, predicate]) => {
+        const prefix = kind === 'added' ? '<span class="font-bold mr-1">+</span>' : kind === 'removed' ? '<span class="font-bold mr-1">&minus;</span>' : '';
+        return `<span class="rounded-box border ${DYNAMIC_CHIP_CLASS[kind]} px-2 py-1">${prefix}${escapeHtml(predicate)}</span>`;
+    })
+        .join('');
+    return `<div class="font-sans flex flex-wrap gap-1 mt-4 text-xs">${chips}</div>`;
+}
+function renderKnot(tree, knot, activeKnotId, transcriptMenuId, showDynamicState) {
+    const active = knot.id === activeKnotId;
+    const activeBorderClass = active ? ' border-l-primary' : '';
+    const activeMarker = active
+        ? '<div class="icon icon-arrow-right" role="img" aria-label="Selected"></div>'
+        : '';
+    const statusIcon = knot.state === 'new'
+        ? '<div class="icon icon-warning w-4 h-4" role="img" aria-label="New knot"></div>'
+        : knot.state === 'error'
+            ? '<div class="icon icon-error w-4 h-4" role="img" aria-label="Error knot"></div>'
+            : '';
+    const floatCluster = `<div class="float-right flex flex-row items-center gap-1 pl-2 pb-1">${knot.locked ? '<div class="icon icon-lock" role="img" aria-label="Locked"></div>' : ''}${knot.marker
+        ? `<span class="w-3 h-3 rounded-full shrink-0 ${marker_colors_1.MARKER_SWATCH_CLASS[knot.marker]}" aria-hidden="true"></span>`
+        : ''}${knot.label
+        ? `<span class="font-bold bg-neutral text-neutral-content px-1 py-0.5 rounded text-sm">${escapeHtml(knot.label)}</span>`
+        : ''}${(0, knot_menu_1.renderKnotMenu)(knot.id, knot.unblessedResponse !== null, knot.id === transcriptMenuId, '/actions/open-transcript-menu', active, knot.label, knot.command, 'prominent', tree.promptTypeAt(knot.parentId) === 'key', tree.getEngine(), knot.marker)}</div>`;
+    const keystrokeChip = reachedViaKeystroke(tree, knot)
+        ? `<div class="w-fit bg-neutral-content rounded-md border border-neutral px-2 py-1 text-sm">${escapeHtml(knot.command)}</div>`
+        : '';
+    const responseText = renderDiff(knot.response || null, knot.unblessedResponse);
+    const monoClass = knot.state !== 'valid' ? ' font-mono' : '';
+    const dynamicChanges = showDynamicState ? renderDynamicChanges(tree, knot) : '';
+    const responseContainerContent = [floatCluster, keystrokeChip, responseText, dynamicChanges].filter(Boolean).join('');
+    return `<div class="flex flex-row" id="knot-${knot.id}"
+    data-knot-id="${knot.id}"
+    data-on:click="if (!evt.target.closest('details')) { $knotId = ${knot.id}; @post('/actions/select-knot') }">
+  <div class="w-5 shrink-0 flex flex-col items-center justify-start pt-2 gap-1 pr-1">
+    ${activeMarker}
+    ${statusIcon}
+  </div>
+  <div class="border-x-8 grow ${activeBorderClass} ${STATUS_BORDER_CLASS[knot.state]}">
+    <div class="w-full flow-root whitespace-pre-wrap break-words p-2 bg-base-100${monoClass}">${responseContainerContent}</div>
+  </div>
+</div>`;
+}
+function activeInputType(tree) {
+    return tree.promptTypeAt(tree.getActiveKnotId());
+}
+const SPECIAL_KEYSTROKE_BUTTONS = [
+    { key: 'enter', label: 'Enter' },
+    { key: 'space', label: 'Space' },
+    { key: 'backspace', label: 'Backspace' }
+];
+function renderKeystrokeInput() {
+    const buttons = SPECIAL_KEYSTROKE_BUTTONS.map(({ key, label }) => `<button type="button" class="btn btn-sm" data-on:click="$newKeystroke = '${key}'; @post('/actions/send-keystroke')">${label}</button>`).join('\n  ');
+    return `<div class="flex items-center gap-2 mt-4 mb-8">
+  <span class="text-gray-400" aria-hidden="true">Key:</span>
+  <input id="new-command-input" type="text" aria-label="Enter keystroke" maxlength="1" size="2"
+         class="w-12 text-center rounded-md border-base-300 shadow-sm focus:border-primary focus:ring-primary sm:text-sm p-2 border"
+         data-init="el.focus(); el.scrollIntoView({block: 'nearest', behavior: 'smooth'})"
+         data-on:keydown="if (evt.key === 'Enter') { evt.preventDefault(); $newKeystroke = 'enter'; @post('/actions/send-keystroke') }
+           else if (evt.key === 'Backspace') { evt.preventDefault(); $newKeystroke = 'backspace'; @post('/actions/send-keystroke') }
+           else if (evt.key.length === 1) { evt.preventDefault(); $newKeystroke = evt.key; @post('/actions/send-keystroke') }" />
+  <span class="text-sm text-base-content/60">or</span>
+  ${buttons}
+</div>`;
+}
+function renderCommandInput(tree) {
+    if (activeInputType(tree) === 'key') {
+        return renderKeystrokeInput();
+    }
+    return `<div class="flex items-center gap-2 mt-4 mb-8">
+  <span class="text-gray-400" aria-hidden="true">&gt;</span>
+  <input id="new-command-input" type="text" name="command" aria-label="Enter command"
+         placeholder="Enter command..."
+         class="flex-1 rounded-md border-base-300 shadow-sm focus:border-primary focus:ring-primary sm:text-sm p-2 border"
+         data-bind="newCommand" data-init="el.focus(); el.scrollIntoView({block: 'nearest', behavior: 'smooth'})"
+         data-on:change="@post('/actions/send-command')" />
+</div>`;
+}
+const EMPTY_SEARCH_RESULTS = { results: [], totalMatches: 0 };
+const SEARCH_RESULT_KEYDOWN = "if (evt.key === 'ArrowDown') { evt.preventDefault(); sk.navigateSearchResults(el, 1) }" +
+    " else if (evt.key === 'ArrowUp') { evt.preventDefault(); sk.navigateSearchResults(el, -1) }" +
+    " else if (evt.key === 'Escape') { $searchQuery = ''; @post('/actions/search') }";
+function renderSearchResults(searchResults) {
+    const { results, totalMatches } = searchResults;
+    if (results.length === 0) {
+        return `<div class="absolute top-full left-0 mt-1 w-96 max-w-[90vw] bg-base-100 border border-base-300 rounded-md shadow-xl z-20 p-3 text-sm text-base-content/60">No matches.</div>`;
+    }
+    const rows = results
+        .map((result) => {
+        const promptLine = result.knotId !== 0 ? `<span class="text-sm">&gt; ${result.command}</span>` : '';
+        const labelChip = result.label
+            ? `<span class="font-bold bg-neutral text-neutral-content px-1 py-0.5 rounded text-sm ml-auto shrink-0">${result.label}</span>`
+            : '';
+        return `<li>
+      <button type="button" data-search-result class="w-full text-left px-3 py-2 hover:bg-base-200 focus:bg-base-200 focus:outline-none flex flex-col gap-1"
+        data-on:click="$knotId = ${result.knotId}; $searchQuery = ''; @post('/actions/select-knot'); @post('/actions/search')"
+        data-on:keydown="${SEARCH_RESULT_KEYDOWN}">
+        <div class="flex items-center gap-2">${promptLine}${labelChip}</div>
+        <span class="text-sm break-words">${result.snippet}</span>
+      </button>
+    </li>`;
+    })
+        .join('');
+    const truncatedNote = totalMatches > results.length
+        ? `<div class="px-3 py-1.5 text-xs text-base-content/60 border-t border-base-300">Showing ${results.length} of ${totalMatches} matches - add more search text to narrow it down.</div>`
+        : '';
+    return `<div class="absolute top-full left-0 mt-1 w-96 max-w-[90vw] bg-base-100 border border-base-300 rounded-md shadow-xl z-20 max-h-96 overflow-y-auto">
+    <ul class="p-0" role="listbox">${rows}</ul>
+    ${truncatedNote}
+  </div>`;
+}
+function renderSearchBox(searchQuery, searchResults) {
+    const showResults = searchQuery.trim() !== '';
+    return `<div class="relative" id="skein-search-box">
+    <label class="input input-sm flex items-center gap-2">
+      <div class="icon icon-search w-4 h-4 opacity-60" aria-hidden="true"></div>
+      <input type="search" id="skein-search-input" aria-label="Search knots" placeholder="Search" value="${escapeHtml(searchQuery)}"
+        data-bind="searchQuery" data-on:input__debounce.300ms="@post('/actions/search')"
+        data-on:keydown="if (evt.key === 'Escape') { $searchQuery = ''; @post('/actions/search') }
+          else if (evt.key === 'ArrowDown') { evt.preventDefault(); sk.navigateSearchResults(el, 1) }
+          else if ((evt.metaKey || evt.ctrlKey) && evt.key.toLowerCase() === 'a') { evt.preventDefault(); el.select() }" />
+    </label>
+    ${showResults ? renderSearchResults(searchResults) : ''}
+  </div>`;
+}
+function renderNavbar(info, tree, showDynamicState = false, searchQuery = '', searchResults = EMPTY_SEARCH_RESULTS, markerFilter = null) {
+    const t = totals(tree);
+    const spineLeafId = tree.getSelectedLeafId();
+    const dgdebug = info.engine === 'dgdebug';
+    return `<nav class="bg-base-100 text-base-content border-base-200 divide-base-200 px-2 sm:px-4 py-2.5 w-full border-b shrink-0"
+  data-spine-leaf-id="${spineLeafId}">
+  <div class="w-full flex items-center gap-2">
+    <div class="join shrink-0">
+      <div class="bg-success text-success-content p-2 font-semibold rounded-l-lg" aria-label="${t.valid} ok knots">${t.valid}</div>
+      <button type="button" class="bg-warning text-warning-content p-2 font-semibold disabled:opacity-100" aria-label="${t.new} new knots"
+        ${t.new === 0 ? 'disabled' : ''} data-on:click="$seekStatus = 'new'; @post('/actions/seek-status')"
+        title="${t.new === 0 ? 'No new knots' : 'Jump to the next new knot, cycling through all of them'}">${t.new}</button>
+      <button type="button" class="bg-error text-error-content p-2 font-semibold rounded-r-lg disabled:opacity-100" aria-label="${t.error} error knots"
+        ${t.error === 0 ? 'disabled' : ''} data-on:click="$seekStatus = 'error'; @post('/actions/seek-status')"
+        title="${t.error === 0 ? 'No error knots' : 'Jump to the next error knot, cycling through all of them'}">${t.error}</button>
+    </div>
+    ${renderSearchBox(searchQuery, searchResults)}
+    <button type="button" class="btn btn-sm ${showDynamicState ? 'btn-primary' : 'btn-ghost'}" ${dgdebug ? '' : 'disabled'}
+      aria-pressed="${showDynamicState}"
+      data-on:click="@post('/actions/toggle-dynamic-state')"
+      title="${dgdebug ? 'Show which dynamic properties (flags/variables) changed after each knot' : 'Dynamic state requires the dgdebug engine'}">
+      <div class="icon icon-dynamic" aria-hidden="true"></div><span class="hidden lg:inline">Dynamic State</span>
+    </button>
+    <div class="join shrink-0" role="group" aria-label="Filter by marker">
+      ${marker_colors_1.ALL_MARKERS.map((marker) => `
+      <button type="button" class="btn btn-sm btn-square join-item ${markerFilter === marker ? 'btn-primary' : 'btn-ghost'}"
+        aria-pressed="${markerFilter === marker}" aria-label="Filter to knots marked ${marker_colors_1.MARKER_LABEL[marker]}"
+        data-on:click="$marker = ${marker}; @post('/actions/set-marker-filter')"
+        title="Show only knots marked ${marker_colors_1.MARKER_LABEL[marker]} (or with a descendant marked ${marker_colors_1.MARKER_LABEL[marker]}) - click again to clear">
+        <span class="w-3 h-3 rounded-full ${marker_colors_1.MARKER_SWATCH_CLASS[marker]}" aria-hidden="true"></span>
+      </button>`).join('')}
+    </div>
+    <div class="flex items-center gap-1 shrink-0 ml-auto">
+      <button type="button" class="btn btn-primary" data-on:click="@post('/actions/save')" title="Save this skein to its file - the only thing that ever writes to disk (⌘S)">
+        <div class="icon icon-save" aria-hidden="true"></div><span class="hidden lg:inline">Save</span>
+      </button>
+      <button type="button" class="btn btn-primary" data-on:click="@post('/actions/replay-all')" title="Re-run every command on every path in the tree against a fresh process (⌥⇧R)">
+        <div class="icon icon-play" aria-hidden="true"></div><span class="hidden lg:inline">Replay All</span>
+      </button>
+      <button type="button" class="btn btn-primary" data-on:click="$knotId = ${spineLeafId}; @post('/actions/bless-changes')" title="Bless every changed knot visible in the transcript (the active spine) (⌥⇧B)">
+        <div class="icon icon-bless" aria-hidden="true"></div><span class="hidden lg:inline">Bless Transcript</span>
+      </button>
+    </div>
+  </div>
+</nav>`;
+}
+function renderKnotList(tree, transcriptMenuId = null, showDynamicState = false) {
+    const activeId = tree.getActiveKnotId();
+    return selectedKnots(tree)
+        .map((knot) => renderKnot(tree, knot, activeId, transcriptMenuId, showDynamicState))
+        .join('\n');
+}
+function renderApp(info, tree, graphMenuId = null, transcriptMenuId = null, showDynamicState = false, searchQuery = '', searchResults = EMPTY_SEARCH_RESULTS, markerFilter = null) {
+    return `<div id="skein-app" class="flex flex-col h-screen">
+  ${renderNavbar(info, tree, showDynamicState, searchQuery, searchResults, markerFilter)}
+  <div class="flex-1 min-h-0 flex flex-row w-full">
+    <div id="tree-pane-outer"
+      class="shrink-0 h-full flex flex-row"
+      style="width: 21rem"
+      data-preserve-attr="style"
+      data-init="sk.initTreePaneResize()">
+      <div class="flex-1 min-w-0 bg-base-200 border-r border-base-300 relative">
+        ${(0, tree_pane_1.renderTreePane)(tree, graphMenuId, markerFilter)}
+        <div class="absolute bottom-6 right-4 join join-vertical shadow-md">
+          <button type="button" class="btn btn-sm btn-square join-item" aria-label="Zoom in" title="Zoom in (scroll up also zooms, centered on the cursor)" data-on:click="sk.zoomTreeGraphIn()">+</button>
+          <button type="button" class="btn btn-sm btn-square join-item" aria-label="Zoom out" title="Zoom out (scroll down also zooms, centered on the cursor)" data-on:click="sk.zoomTreeGraphOut()">&minus;</button>
+        </div>
+      </div>
+      <div id="tree-pane-handle" class="w-1 shrink-0 cursor-col-resize bg-base-300 hover:bg-primary transition-colors"></div>
+    </div>
+    <div class="flex-1 min-w-0 overflow-y-auto px-2">
+      ${renderKnotList(tree, transcriptMenuId, showDynamicState)}
+      ${renderCommandInput(tree)}
+    </div>
+  </div>
+</div>`;
+}
+function renderPage(info, tree, graphMenuId = null, transcriptMenuId = null, showDynamicState = false, searchQuery = '', searchResults = EMPTY_SEARCH_RESULTS, markerFilter = null) {
+    const body = info && tree
+        ? renderApp(info, tree, graphMenuId, transcriptMenuId, showDynamicState, searchQuery, searchResults, markerFilter)
+        : '<div id="skein-app" class="p-4">No skein session running.</div>';
+    return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="UTF-8" />
+<title>Dialog Skein</title>
+<link rel="stylesheet" href="/style.css" />
+<script type="module" src="/js/skein-loader.js"></script>
+</head>
+<body data-init="@get('/events', {openWhenHidden: true})">
+${body}
+</body>
+</html>`;
+}
+//# sourceMappingURL=render.js.map

package/dist/dialoged/skein/ui/render.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"render.js","sourceRoot":"","sources":["../../../../src/dialoged/skein/ui/render.ts"],"names":[],"mappings":"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"}

package/dist/dialoged/skein/ui/traceRender.d.ts

@@ -0,0 +1,11 @@
+import { TraceTree } from '../trace';
+export interface CurrentTraceState {
+    tree: TraceTree;
+    commandLabel: string;
+    sourceKnotId: number | null;
+    searchTerm: string;
+    projectRoot: string;
+}
+export declare function renderTraceApp(state: CurrentTraceState | null, loading?: boolean): string;
+export declare function renderTracePage(state: CurrentTraceState | null, loading?: boolean): string;
+//# sourceMappingURL=traceRender.d.ts.map

package/dist/dialoged/skein/ui/traceRender.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"traceRender.d.ts","sourceRoot":"","sources":["../../../../src/dialoged/skein/ui/traceRender.ts"],"names":[],"mappings":"AASA,OAAO,EAAsB,SAAS,EAAE,MAAM,UAAU,CAAC;AAGzD,MAAM,WAAW,iBAAiB;IAChC,IAAI,EAAE,SAAS,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IAKnB,WAAW,EAAE,MAAM,CAAC;CACrB;AAoFD,wBAAgB,cAAc,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,EAAE,OAAO,GAAE,OAAe,GAAG,MAAM,CAiChG;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,iBAAiB,GAAG,IAAI,EAAE,OAAO,GAAE,OAAe,GAAG,MAAM,CAajG"}

package/dist/dialoged/skein/ui/traceRender.js

@@ -0,0 +1,139 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.renderTraceApp = renderTraceApp;
+exports.renderTracePage = renderTracePage;
+const path = __importStar(require("path"));
+const trace_1 = require("../trace");
+const TYPE_BADGE_CLASS = {
+    enter: 'badge-info',
+    query: 'badge-neutral',
+    found: 'badge-success',
+    now: 'badge-warning'
+};
+function escapeHtml(text) {
+    return text
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;');
+}
+function splitSource(source) {
+    const idx = source.lastIndexOf(':');
+    if (idx <= 0) {
+        return null;
+    }
+    const line = parseInt(source.slice(idx + 1), 10);
+    return Number.isNaN(line) ? null : { file: source.slice(0, idx), line };
+}
+function relativizeSource(source, projectRoot) {
+    const parsed = splitSource(source);
+    if (!parsed) {
+        return null;
+    }
+    const resolved = path.resolve(projectRoot, parsed.file);
+    return { file: path.relative(projectRoot, resolved), line: parsed.line };
+}
+function renderRow(tree, node, projectRoot) {
+    const hasChildren = node.children.length > 0;
+    const chevron = hasChildren ? (node.expanded ? '▾' : '▸') : '';
+    const badgeClass = node.type ? TYPE_BADGE_CLASS[node.type] : '';
+    const displaySource = node.source ? relativizeSource(node.source, projectRoot) : null;
+    const sourceAttrs = displaySource
+        ? ` data-node-id="${node.id}" data-file="${escapeHtml(displaySource.file)}" data-line="${displaySource.line}"`
+        : '';
+    const rowClass = ['trace-row', node.match ? 'trace-row-match' : ''].filter(Boolean).join(' ');
+    const childrenHtml = hasChildren && node.expanded
+        ? `<div class="trace-children">${node.children.map((id) => renderRow(tree, (0, trace_1.getNode)(tree, id), projectRoot)).join('')}</div>`
+        : '';
+    return `<div class="trace-node" style="margin-left: ${node.depth * 1.25}rem;">
+  <div class="${rowClass}"${sourceAttrs}>
+    ${hasChildren
+        ? `<button type="button" class="trace-chevron" data-on:click="$nodeId = ${node.id}; @post('/actions/trace-toggle-node')" aria-label="${node.expanded ? 'Collapse' : 'Expand'}">${chevron}</button>`
+        : `<span class="trace-chevron"></span>`}
+    ${node.type ? `<span class="badge badge-xs ${badgeClass}">${node.type.toUpperCase()}</span>` : ''}
+    <span class="trace-text font-mono">${escapeHtml(node.text ?? '')}</span>
+    ${displaySource ? `<span class="trace-source font-mono">${escapeHtml(`${displaySource.file}:${displaySource.line}`)}</span>` : ''}
+  </div>
+  ${childrenHtml}
+</div>`;
+}
+function renderTraceApp(state, loading = false) {
+    if (loading) {
+        return `<div id="trace-app" class="p-4 flex items-center gap-3 text-base-content/60">
+  <span class="loading loading-spinner loading-md"></span>
+  <span>Tracing…</span>
+</div>`;
+    }
+    if (!state) {
+        return '<div id="trace-app" class="p-4 text-base-content/60">No trace yet - open a knot\'s "..." menu and choose Trace (root traces startup).</div>';
+    }
+    const root = (0, trace_1.getNode)(state.tree, 0);
+    const rows = root
+        ? root.children.map((id) => renderRow(state.tree, (0, trace_1.getNode)(state.tree, id), state.projectRoot)).join('')
+        : '';
+    return `<div id="trace-app" class="h-full flex flex-col">
+  <div class="flex items-center gap-2 p-2 border-b border-base-200 shrink-0">
+    <label class="input input-sm flex items-center gap-2 flex-1">
+      <div class="icon icon-search w-3 h-3 opacity-60" aria-hidden="true"></div>
+      <input type="search" placeholder="Filter trace…" value="${escapeHtml(state.searchTerm)}"
+        data-bind="searchTerm" data-on:input__debounce.300ms="@post('/actions/trace-search')" />
+    </label>
+    <button type="button" class="btn btn-sm btn-ghost" data-on:click="@post('/actions/trace-expand-all')">Expand All</button>
+    <button type="button" class="btn btn-sm btn-ghost" data-on:click="@post('/actions/trace-collapse-all')">Collapse All</button>
+    <span class="text-sm text-base-content/60 font-mono truncate">${escapeHtml(state.commandLabel)}</span>
+  </div>
+  <div id="trace-tree" class="flex-1 overflow-auto p-2 text-sm">
+    ${rows}
+  </div>
+  <div id="trace-source-popover" popover="manual" class="trace-source-popover"></div>
+</div>`;
+}
+function renderTracePage(state, loading = false) {
+    return `<!doctype html>
+<html lang="en">
+<head>
+<meta charset="UTF-8" />
+<title>Trace</title>
+<link rel="stylesheet" href="/style.css" />
+<script type="module" src="/js/trace-loader.js"></script>
+</head>
+<body data-init="@get('/trace/events', {openWhenHidden: true})" class="h-screen">
+${renderTraceApp(state, loading)}
+</body>
+</html>`;
+}
+//# sourceMappingURL=traceRender.js.map

package/dist/dialoged/skein/ui/traceRender.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"traceRender.js","sourceRoot":"","sources":["../../../../src/dialoged/skein/ui/traceRender.ts"],"names":[],"mappings":"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"}

package/dist/dialoged/skein/ui/tree-pane.d.ts

@@ -0,0 +1,3 @@
+import { Marker, SkeinTree } from '../tree';
+export declare function renderTreePane(tree: SkeinTree, graphMenuId?: number | null, markerFilter?: Marker | null): string;
+//# sourceMappingURL=tree-pane.d.ts.map

package/dist/dialoged/skein/ui/tree-pane.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tree-pane.d.ts","sourceRoot":"","sources":["../../../../src/dialoged/skein/ui/tree-pane.ts"],"names":[],"mappings":"AAsBA,OAAO,EAA2B,MAAM,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAiPrE,wBAAgB,cAAc,CAAC,IAAI,EAAE,SAAS,EAAE,WAAW,GAAE,MAAM,GAAG,IAAW,EAAE,YAAY,GAAE,MAAM,GAAG,IAAW,GAAG,MAAM,CAY7H"}