feat: add dual-mode tree editor with Code Mode, variables, and markdown sync
Implements the full dual-mode tree editor (Plan Phases 1-5): Backend: - JSONB↔Markdown bidirectional serializer/parser with mistune - Markdown validator with line/column error reporting - 3 API endpoints: export-markdown, import-markdown, validate-markdown - Variable extraction/resolution service ([USER_INPUT], [VAR], [SAVE_AS]) - Session variables JSONB column (migration 028) - 39 tree markdown tests + variable service tests (403 total passing) Frontend: - Monaco-based Code Mode with custom Monarch tokenizer and dark theme - Autocomplete for @node_id refs, type values, variable names - Debounced validation (800ms) with inline Monaco error markers - Syntax help panel (absolute overlay, toggleable) - Starter template for new trees with valid cross-references - Bidirectional metadata sync (name/description/category/tags frontmatter) - Synchronous tree→markdown serializer (fixes async race condition) - Pre-save validation blocks save on broken refs or missing tree name - Mode-aware undo/redo: Monaco native in Code Mode, throttled zundo in Flow Mode - Variable prompt modal and frontend resolver for session navigation Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
49
frontend/src/lib/variableResolver.ts
Normal file
49
frontend/src/lib/variableResolver.ts
Normal file
@@ -0,0 +1,49 @@
|
||||
/**
|
||||
* Frontend-side variable substitution for display during navigation.
|
||||
*
|
||||
* - [VAR:name] → replaced with variables[name]
|
||||
* - [USER_INPUT:prompt] → replaced with variables[prompt]
|
||||
* - [SAVE_AS:name] → removed from display
|
||||
*/
|
||||
export function resolveVariables(text: string, variables: Record<string, string>): string {
|
||||
// Replace [VAR:name]
|
||||
let result = text.replace(/\[VAR:([^\]]+)\]/g, (_, name) => {
|
||||
const key = name.trim()
|
||||
return variables[key] ?? `[VAR:${key}]`
|
||||
})
|
||||
|
||||
// Replace [USER_INPUT:prompt]
|
||||
result = result.replace(/\[USER_INPUT:([^\]]+)\]/g, (_, prompt) => {
|
||||
const key = prompt.trim()
|
||||
return variables[key] ?? `[USER_INPUT:${key}]`
|
||||
})
|
||||
|
||||
// Remove [SAVE_AS:name]
|
||||
result = result.replace(/\[SAVE_AS:[^\]]+\]/g, '')
|
||||
|
||||
return result
|
||||
}
|
||||
|
||||
/**
|
||||
* Extract all [USER_INPUT:prompt] tokens from text.
|
||||
* Returns array of prompt strings.
|
||||
*/
|
||||
export function extractUserInputPrompts(text: string): string[] {
|
||||
const prompts: string[] = []
|
||||
const re = /\[USER_INPUT:([^\]]+)\]/g
|
||||
let match
|
||||
while ((match = re.exec(text)) !== null) {
|
||||
const prompt = match[1].trim()
|
||||
if (!prompts.includes(prompt)) {
|
||||
prompts.push(prompt)
|
||||
}
|
||||
}
|
||||
return prompts
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if text contains any variable tokens.
|
||||
*/
|
||||
export function hasVariableTokens(text: string): boolean {
|
||||
return /\[(USER_INPUT|VAR|SAVE_AS):[^\]]+\]/.test(text)
|
||||
}
|
||||
Reference in New Issue
Block a user