spexcode 0.2.1 → 0.2.3

package/spec-cli/src/supervise.ts

@@ -3,13 +3,14 @@
 import net from 'node:net'
 import http from 'node:http'
 import { spawn, type ChildProcess } from 'node:child_process'
-import { statSync, readdirSync, type Dirent } from 'node:fs'
+import { statSync, readdirSync, mkdirSync, writeFileSync, readFileSync, rmSync, type Dirent } from 'node:fs'
 import { fileURLToPath } from 'node:url'
 import { dirname, join } from 'node:path'
 import { installProcessGuards } from './resilience.js'
 import { listenOrExit } from './listen.js'
 import { resolvePublicConfig, startGateway, ensureDashboardBuilt, resolveDistDir } from './gateway.js'
 import { tsxBin } from './tsx-bin.js'
+import { runtimeRoot } from './layout.js'
 
 // the supervisor OWNS the public port, so it must outlive any transient throw: an uncaught error here is
 // logged and survived, never an exit that closes the port (and the tmux session) and takes the frontend down.
@@ -74,8 +75,11 @@ async function boot(): Promise<Backend | null> {
   const port = await freePort()
   // PORT pins the child's PRIVATE bind port; SPEXCODE_API_URL pins everything the child SPAWNS (launched
   // sessions + their hooks) at the PUBLIC port, so a launched agent's own `spex` reaches the stable proxy
-  // and never inherits this ephemeral, soon-retired port (apiBase() prefers SPEXCODE_API_URL over PORT).
-  const child = spawn(tsx, [entry], { stdio: 'inherit', env: { ...process.env, PORT: String(port), SPEXCODE_API_URL: process.env.SPEXCODE_API_URL || childApiBase } })
+  // and never inherits this ephemeral, soon-retired port. ALWAYS childApiBase, never the ambient
+  // process.env.SPEXCODE_API_URL: the env this serve itself inherited may carry ANOTHER project's backend
+  // (the exact misroute [[remote-client]]'s ladder exists to kill), and a worker's env is its routing
+  // LIFELINE — it must be a deterministic backend-injected fact, not an inheritance gamble.
+  const child = spawn(tsx, [entry], { stdio: 'inherit', env: { ...process.env, PORT: String(port), SPEXCODE_API_URL: childApiBase } })
   // if the ACTIVE backend dies unexpectedly (crash, OOM), restart it so the public port keeps serving.
   // Planned retirement sets current to the NEW child first, so the old child's exit fails this identity
   // check and is ignored. boot()'s ~5s health budget rate-limits any crash loop.
@@ -130,7 +134,27 @@ const proxy = net.createServer((client) => {
   client.pipe(up); up.pipe(client)
 })
 
-const shutdown = () => { try { current?.child.kill('SIGTERM') } catch { /* */ } process.exit(0) }
+// @@@ endpoint record - this project's live backend endpoint, written into the per-project runtime tier
+// (~/.spexcode/projects/<enc>/backend.json) only AFTER the public bind succeeds. It's what lets a bare
+// `spex` run from this project's tree find ITS OWN backend instead of an env URL inherited from another
+// project's ([[remote-client]]'s resolution ladder). Readers /health-probe before trusting, so a crash
+// leaves at worst a dead record that is ignored — never followed. The recorded URL is the LOOPBACK face
+// local agents reach (equals the public port when public mode is off), never the password-gated gateway.
+const backendRecordPath = () => join(runtimeRoot(), 'backend.json')
+function recordEndpoint(url: string): void {
+  try {
+    mkdirSync(runtimeRoot(), { recursive: true })
+    writeFileSync(backendRecordPath(), JSON.stringify({ url, pid: process.pid, startedAt: new Date().toISOString() }, null, 2) + '\n')
+  } catch (e) {
+    console.error(`[supervisor] could not record the backend endpoint (${(e as Error).message}) — cwd-based \`spex\` discovery won't find this backend`)
+  }
+}
+// best-effort removal on a clean stop, only if the record is OURS (a newer serve may have overwritten it).
+function dropEndpoint(): void {
+  try { if (JSON.parse(readFileSync(backendRecordPath(), 'utf8'))?.pid === process.pid) rmSync(backendRecordPath()) } catch { /* not ours / already gone */ }
+}
+
+const shutdown = () => { dropEndpoint(); try { current?.child.kill('SIGTERM') } catch { /* */ } process.exit(0) }
 process.on('SIGINT', shutdown)
 process.on('SIGTERM', shutdown)
 
@@ -146,10 +170,10 @@ if (publicCfg) {
   // public mode: the raw proxy stays on loopback; the password-gated gateway owns the public port.
   const distDir = resolveDistDir() // bundled <pkg>/dashboard-dist when installed, else monorepo spec-dashboard/dist
   ensureDashboardBuilt(repoRoot, distDir)
-  listenOrExit(proxy, proxyPort, { host: '127.0.0.1', label: 'supervisor (loopback proxy)', cleanup: reapChild, onListen: () => console.log(`spec-cli supervisor on loopback :${proxyPort} (zero-downtime reloads, backend :${first.port})`) })
+  listenOrExit(proxy, proxyPort, { host: '127.0.0.1', label: 'supervisor (loopback proxy)', cleanup: reapChild, onListen: () => { recordEndpoint(childApiBase); console.log(`spec-cli supervisor on loopback :${proxyPort} (zero-downtime reloads, backend :${first.port})`) } })
   startGateway({ publicPort, upstreamPort: proxyPort, password: publicCfg.password, tls: publicCfg.tls, distDir, onBindFail: reapChild })
 } else {
-  listenOrExit(proxy, publicPort, { label: 'supervisor', cleanup: reapChild, onListen: () => console.log(`spec-cli supervisor serving on http://localhost:${publicPort} (zero-downtime reloads, backend :${first.port})`) })
+  listenOrExit(proxy, publicPort, { label: 'supervisor', cleanup: reapChild, onListen: () => { recordEndpoint(childApiBase); console.log(`spec-cli supervisor serving on http://localhost:${publicPort} (zero-downtime reloads, backend :${first.port})`) } })
 }
 
 // watch every imported source tree; debounce a burst of writes (a merge touching several files across

package/spec-cli/src/tree.ts

@@ -0,0 +1,118 @@
+// @@@ spex tree - the CLI's human-readable graph view: the same assembled board the dashboard's
+// tidy-tree renders, as an indented terminal tree. Pure presentation over buildBoard()'s nodes —
+// no read path of its own; status colours and badge semantics mirror the dashboard (drift /
+// stale-yatsu / open-issues counts). Governed by the spex-tree spec node.
+
+// the subset of a board node this view consumes (buildBoard attaches more; we read only these).
+export type TreeNode = {
+  id: string
+  parent: string | null
+  title: string
+  status: string
+  version?: number
+  drift?: number
+  ghost?: boolean
+  openIssues?: unknown[]
+  scenarios?: { name: string }[]
+  evals?: { scenario: string; fresh?: boolean }[]
+}
+
+export type TreeOpts = { node?: string; depth?: number; color?: boolean }
+
+// dashboard status palette mapped onto ANSI: merged=green, active=cyan (live/in-flight, distinct
+// from the warning yellow), drift=yellow (the dashboard's warning colour), pending=muted grey.
+const STATUS_ANSI: Record<string, string> = { merged: '32', active: '36', drift: '33', pending: '90' }
+
+// stale-yatsu count: declared scenarios whose LATEST reading exists but is no longer fresh.
+// board `evals` is already latest-per-scenario, so this is a straight filter — the same freshness
+// axis the dashboard's grey ✓/✗ badges read (score.jsx readingScore).
+function staleYatsu(n: TreeNode): number {
+  if (!n.scenarios?.length || !n.evals?.length) return 0
+  const latest = new Map(n.evals.map((r) => [r.scenario, r]))
+  return n.scenarios.filter((s) => { const r = latest.get(s.name); return r && r.fresh === false }).length
+}
+
+function childrenIndex(nodes: TreeNode[]): Map<string | null, TreeNode[]> {
+  const byParent = new Map<string | null, TreeNode[]>()
+  for (const n of nodes) {
+    const list = byParent.get(n.parent) ?? []
+    list.push(n)
+    byParent.set(n.parent, list)
+  }
+  return byParent
+}
+
+// resolve the display roots: --node picks one subtree; default is the forest of parentless nodes
+// (a node whose parent id isn't on the board — a ghost mid-add, say — surfaces as a root rather
+// than vanishing). Unknown --node throws (fail loud, caller prints + exits 2), never an empty tree.
+function roots(nodes: TreeNode[], nodeId?: string): TreeNode[] {
+  if (nodeId) {
+    const hit = nodes.find((n) => n.id === nodeId)
+    if (!hit) throw new Error(`no spec node "${nodeId}" — spex tree lists every id; spex search <topic> finds one by intent`)
+    return [hit]
+  }
+  const ids = new Set(nodes.map((n) => n.id))
+  return nodes.filter((n) => n.parent === null || !ids.has(n.parent))
+}
+
+export function renderTree(nodes: TreeNode[], opts: TreeOpts = {}): string {
+  const color = opts.color ?? false
+  const c = (code: string, t: string) => (color ? `\x1b[${code}m${t}\x1b[0m` : t)
+  const byParent = childrenIndex(nodes)
+  const lines: string[] = []
+
+  const badges = (n: TreeNode): string => {
+    const parts: string[] = []
+    if (n.ghost) parts.push(c('90', 'ghost'))
+    if (n.drift) parts.push(c('33', `drift:${n.drift}`))
+    const stale = staleYatsu(n)
+    if (stale) parts.push(c('90', `stale:${stale}`))
+    if (n.openIssues?.length) parts.push(c('31', `issues:${n.openIssues.length}`))
+    return parts.length ? '  ' + parts.join(' ') : ''
+  }
+
+  const line = (n: TreeNode, prefix: string, branch: string) => {
+    const code = STATUS_ANSI[n.status] ?? '0'
+    // base state is invisible: merged (~80% of nodes) is the healthy ground state, already carried by
+    // the dot's colour — only deviations get a text label. Without colour the word IS the signal, so
+    // every status (merged included) prints in plain-text mode.
+    const label = color && n.status === 'merged' ? '' : ' ' + c(code, `[${n.status}]`)
+    const title = n.title && n.title !== n.id ? ' ' + c('90', '· ' + n.title) : ''
+    lines.push(`${prefix}${branch}${c(code, '●')} ${n.id}${label}${title}${badges(n)}`)
+  }
+
+  const walk = (n: TreeNode, prefix: string, branch: string, childPrefix: string, depth: number) => {
+    line(n, prefix, branch)
+    const kids = byParent.get(n.id) ?? []
+    if (!kids.length) return
+    if (opts.depth !== undefined && depth >= opts.depth) {
+      lines.push(`${childPrefix}${c('90', `└─ … ${kids.length} more (raise --depth)`)}`)
+      return
+    }
+    kids.forEach((k, i) => {
+      const last = i === kids.length - 1
+      walk(k, childPrefix, last ? '└─ ' : '├─ ', childPrefix + (last ? '   ' : '│  '), depth + 1)
+    })
+  }
+
+  for (const r of roots(nodes, opts.node)) walk(r, '', '', '', 0)
+  return lines.join('\n')
+}
+
+// the machine exit: the same filtered subtree as NESTED objects, badge counts precomputed — a
+// shaped view, not a replacement for `spex board` (which stays the full flat payload). Pruned
+// children degrade to their ids, so --depth still tells the machine what exists below the cut.
+export function treeJson(nodes: TreeNode[], opts: TreeOpts = {}): object[] {
+  const byParent = childrenIndex(nodes)
+  const shape = (n: TreeNode, depth: number): object => {
+    const kids = byParent.get(n.id) ?? []
+    const pruned = opts.depth !== undefined && depth >= opts.depth
+    return {
+      id: n.id, title: n.title, status: n.status, version: n.version ?? 0,
+      drift: n.drift ?? 0, staleYatsu: staleYatsu(n), openIssues: n.openIssues?.length ?? 0,
+      ...(n.ghost ? { ghost: true } : {}),
+      children: pruned ? kids.map((k) => k.id) : kids.map((k) => shape(k, depth + 1)),
+    }
+  }
+  return roots(nodes, opts.node).map((r) => shape(r, 0))
+}

package/spec-cli/templates/hooks/post-merge

@@ -21,7 +21,7 @@ if command -v spex >/dev/null 2>&1; then
   spex issues nudge "$node"
 elif [ -x "$repo_root/node_modules/.bin/spex" ]; then
   "$repo_root/node_modules/.bin/spex" issues nudge "$node"
-elif [ -x "$main_root/spec-cli/node_modules/.bin/tsx" ] && [ -f "$main_root/spec-cli/src/cli.ts" ]; then
-  "$main_root/spec-cli/node_modules/.bin/tsx" "$main_root/spec-cli/src/cli.ts" issues nudge "$node"
+elif [ -x "$main_root/spec-cli/bin/spex.mjs" ]; then
+  "$main_root/spec-cli/bin/spex.mjs" issues nudge "$node"
 fi
 exit 0

package/spec-cli/templates/hooks/pre-commit

@@ -7,7 +7,7 @@
 # no node_modules of its own, so the dogfood tsx path reaches the main checkout's. First that exists wins:
 #   1. `spex` on PATH                  - installed globally / on the shell PATH.
 #   2. <repo>/node_modules/.bin/spex   - a project that did `npm i @spexcode/spec-cli` (the dep's bin).
-#   3. monorepo tsx + cli.ts by path   - dogfood: run the CLI from source.
+#   3. monorepo launcher by path       - dogfood: bin/spex.mjs (owns tsx resolution + the mid-merge guard).
 main_root=$(dirname "$(git rev-parse --path-format=absolute --git-common-dir 2>/dev/null)")
 repo_root=$(git rev-parse --show-toplevel 2>/dev/null)
 spex_kind=
@@ -15,21 +15,33 @@ if command -v spex >/dev/null 2>&1; then
   spex_kind=path
 elif [ -x "$repo_root/node_modules/.bin/spex" ]; then
   spex_kind=local
-elif [ -x "$main_root/spec-cli/node_modules/.bin/tsx" ] && [ -f "$main_root/spec-cli/src/cli.ts" ]; then
-  spex_kind=tsx
+elif [ -x "$main_root/spec-cli/bin/spex.mjs" ]; then
+  spex_kind=pkg
 fi
 spex_cli() {
   case "$spex_kind" in
     path)  spex "$@" ;;
     local) "$repo_root/node_modules/.bin/spex" "$@" ;;
-    tsx)   "$main_root/spec-cli/node_modules/.bin/tsx" "$main_root/spec-cli/src/cli.ts" "$@" ;;
+    pkg)   "$main_root/spec-cli/bin/spex.mjs" "$@" ;;
     *)     return 127 ;;
   esac
 }
 
+# @@@ tree-unchanged stamp - a commit whose tree EQUALS HEAD's tree (`git write-tree` over the commit's own
+# index — the hook's GIT_INDEX_FILE, a temp HEAD-tree index for `commit --only --allow-empty`) adds NO
+# content: it cannot smuggle code past the main-guard below and cannot introduce spec↔code drift, so the
+# whole hook passes it. This is `spex ack`'s empty Spec-OK stamp — the reason ack works on a trunk merge
+# commit (amending it would re-author the merge after MERGE_HEAD is gone and read as direct authoring) and
+# with a DIRTY real index (the lint shim below reads the real index via git.ts's env-strip, which would
+# otherwise block the stamp on the very drift it acknowledges). Deliberately a one-line tree compare, not an
+# "is this an amend?" heuristic (undecidable at pre-commit time).
+if [ "$(git write-tree 2>/dev/null)" = "$(git rev-parse 'HEAD^{tree}' 2>/dev/null || echo none)" ]; then
+  exit 0
+fi
+
 # @@@ main-guard - the worktree model: never author directly on the trunk; the trunk only RECEIVES merges.
-# Reject a direct commit while HEAD is the trunk. Merges pass (MERGE_HEAD present).
-# Escape hatch for seeding / eager topology: SPEXCODE_ALLOW_MAIN=1 git commit …
+# Reject a direct commit while HEAD is the trunk. Merges pass (MERGE_HEAD present), and a tree-unchanged
+# stamp already passed above. Escape hatch for seeding / eager topology: SPEXCODE_ALLOW_MAIN=1 git commit …
 #
 # The trunk is resolved the SAME way the rest of SpexCode resolves it — `spex internal trunk` = layout.ts
 # mainBranch() (config override → the main checkout's current branch → 'main') — so the guard protects
@@ -48,7 +60,7 @@ trunk=$(spex_cli internal trunk 2>/dev/null | head -1)
 if [ "$branch" = "$trunk" ] && [ ! -f "$git_dir/MERGE_HEAD" ] && [ -z "${SPEXCODE_ALLOW_MAIN:-}" ]; then
   echo "✗ SpexCode: direct commits on $trunk (the trunk) are blocked." >&2
   echo "  Work in a worktree (.worktrees/<node>, branch node/<id>) and merge back." >&2
-  echo "  Merges pass automatically; for seeding/topology: SPEXCODE_ALLOW_MAIN=1 git commit …" >&2
+  echo "  Merges and tree-unchanged stamps (spex ack) pass automatically; for seeding/topology: SPEXCODE_ALLOW_MAIN=1 git commit …" >&2
   exit 1
 fi
 
@@ -58,16 +70,23 @@ fi
 # hook's GIT_DIR, so lint validates THIS worktree's `.spec`).
 if [ -z "${SPEXCODE_SKIP_LINT:-}" ]; then
   if [ -n "$spex_kind" ]; then
-    if ! spex_cli lint >&2; then
+    spex_cli lint >&2
+    lint_rc=$?
+    # exit 75 = the launcher's mid-merge guard (spex's own source holds conflict markers — transient).
+    # Degrade to advisory rather than walling every commit behind a merge someone else is resolving.
+    if [ "$lint_rc" -eq 75 ]; then
+      echo "• SpexCode: spec-lint skipped — spex is paused mid-merge (exit 75); CI still enforces." >&2
+    elif [ "$lint_rc" -ne 0 ]; then
       echo "✗ SpexCode: spec-lint failed — fix the spec↔code links or bypass with SPEXCODE_SKIP_LINT=1." >&2
       exit 1
-    fi
-    # @@@ yatsu backstop - reject a staged yatsu offender: a stray pixel blob copied into the tree (blobs
-    # belong in the shared git common dir, never committed) OR a malformed yatsu.md (a scenario schema
-    # violation). Logic lives in spec-yatsu; this is the lint-shim's twin. (this node's contract)
-    if ! spex_cli yatsu check-staged >&2; then
-      echo "✗ SpexCode: yatsu check-staged failed (see above) — fix it or bypass with SPEXCODE_SKIP_LINT=1." >&2
-      exit 1
+    else
+      # @@@ yatsu backstop - reject a staged yatsu offender: a stray pixel blob copied into the tree (blobs
+      # belong in the shared git common dir, never committed) OR a malformed yatsu.md (a scenario schema
+      # violation). Logic lives in spec-yatsu; this is the lint-shim's twin. (this node's contract)
+      if ! spex_cli yatsu check-staged >&2; then
+        echo "✗ SpexCode: yatsu check-staged failed (see above) — fix it or bypass with SPEXCODE_SKIP_LINT=1." >&2
+        exit 1
+      fi
     fi
   else
     # Advisory hook: no CLI found (project hasn't installed @spexcode/spec-cli; monorepo not `npm install`ed).

package/spec-cli/templates/hooks/prepare-commit-msg

@@ -33,5 +33,12 @@ if [ -z "$sid" ] && [ -n "${CODEX_THREAD_ID:-}" ]; then # codex: alias the threa
 fi
 
 [ -z "$sid" ] && exit 0
-printf '\nSession: %s\n' "$sid" >> "$msg_file"
+# Stamp via interpret-trailers (git's own sample-hook mechanism), NOT a raw printf append: appending after a
+# message that already carries a trailer block (e.g. `spex ack`'s Spec-OK) opens a new paragraph, and git then
+# parses ONLY the last paragraph as trailers — the earlier trailers silently become body prose. interpret-trailers
+# appends into the existing block, keeping ONE parseable block. It needs the file newline-terminated first:
+# on an unterminated message (git merge -m writes MERGE_MSG without one) it folds the trailer into the subject
+# paragraph, where git's trailer parser never looks — the reason merge commits' Session: never parsed.
+[ -n "$(tail -c1 "$msg_file")" ] && echo >> "$msg_file"
+git interpret-trailers --in-place --trailer "Session: $sid" "$msg_file"
 exit 0

package/spec-cli/templates/spexcode.json

@@ -1,5 +1,12 @@
 {
   "lint": {
     "governedRoots": ["."]
+  },
+  "sessions": {
+    "launchers": {
+      "claude": { "harness": "claude", "cmd": "claude --dangerously-skip-permissions" },
+      "codex": { "harness": "codex", "cmd": "codex --yolo" }
+    },
+    "defaultLauncher": "claude"
   }
 }

package/spec-dashboard/dist/assets/Dashboard-C5ap-Sga.css

@@ -0,0 +1 @@
+.react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #777;--xy-background-pattern-lines-color-default: #777;--xy-background-pattern-cross-color-default: #777;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1;touch-action:none}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}