busbar-sf-agentscript 0.0.2

AgentScript parser, graph analysis, and LSP for Salesforce Agentforce
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>AgentScript Report</title>
  <script src="https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.min.js"></script>
  <style>
    *, *::before, *::after { box-sizing: border-box; }
    body { margin: 0; background: #0d1117; color: #c9d1d9; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; display: flex; min-height: 100vh; }
    #sidebar { width: 240px; min-height: 100vh; background: #161b22; border-right: 1px solid #30363d; position: fixed; top: 0; left: 0; bottom: 0; overflow-y: auto; display: flex; flex-direction: column; }
    .sidebar-header { padding: 20px 16px 16px; border-bottom: 1px solid #30363d; }
    .sidebar-title { font-size: 0.75rem; font-weight: 600; color: #8b949e; text-transform: uppercase; letter-spacing: 0.05em; }
    .sidebar-count { font-size: 0.7rem; color: #484f58; margin-top: 2px; }
    .nav-item { padding: 8px 16px; cursor: pointer; color: #c9d1d9; font-size: 0.875rem; border-left: 3px solid transparent; display: flex; align-items: center; gap: 8px; transition: background 0.1s; }
    .nav-item:hover { background: #21262d; }
    .nav-item.active { color: #58a6ff; border-left-color: #58a6ff; background: rgba(88,166,255,0.05); }
    .nav-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .badge { font-size: 0.65rem; color: #484f58; background: #21262d; border-radius: 10px; padding: 1px 6px; flex-shrink: 0; }
    .nav-item.active .badge { background: rgba(88,166,255,0.15); color: #58a6ff; }
    #main { margin-left: 240px; padding: 32px; flex: 1; min-width: 0; }
    .agent-section { display: none; }
    .agent-section.active { display: block; }
    .agent-header { margin-bottom: 24px; }
    .agent-name { font-size: 1.5rem; color: #58a6ff; margin: 0 0 4px 0; font-weight: 600; }
    .agent-file { font-size: 0.8rem; color: #484f58; font-family: monospace; }
    .graph-container { background: #161b22; border-radius: 8px; padding: 24px; border: 1px solid #30363d; overflow: auto; }
    .stats-bar { margin-top: 12px; font-size: 0.8rem; color: #8b949e; background: #161b22; border-radius: 6px; padding: 10px 16px; border: 1px solid #30363d; display: flex; gap: 20px; flex-wrap: wrap; }
    .stats-bar strong { color: #c9d1d9; }
    .legend { margin-top: 10px; font-size: 0.72rem; color: #484f58; }
    .mermaid svg { max-width: 100%; height: auto; }
  </style>
</head>
<body>
  <nav id="sidebar">
    <div class="sidebar-header">
      <div class="sidebar-title">AgentScript</div>
      <div class="sidebar-count">1 agent</div>
    </div>
    
      <div class="nav-item" id="nav-simple" data-id="simple" onclick="showAgent('simple')">
        <span class="nav-name">simple</span>
        
      </div>
  </nav>
  <main id="main">
    
      <div class="agent-section" id="section-simple">
        <div class="agent-header">
          <h1 class="agent-name">simple</h1>
          <div class="agent-file">test/commands/agency/fixtures/simple.agent</div>
        </div>
        <div class="graph-container">
          <div class="mermaid">flowchart LR
  start_agent([start_agent])</div>
        </div>
        <div class="legend">
          → transition &nbsp;|&nbsp; ⇒ delegate &nbsp;|&nbsp; ([entry]) = entry topic
        </div>
      </div>
  </main>
  <script>
    mermaid.initialize({ startOnLoad: false, theme: 'dark' });

    const rendered = new Set();

    function showAgent(id) {
      document.querySelectorAll('.agent-section').forEach(el => el.classList.remove('active'));
      document.querySelectorAll('.nav-item').forEach(el => el.classList.remove('active'));
      const section = document.getElementById('section-' + id);
      const nav = document.getElementById('nav-' + id);
      if (!section) return;
      section.classList.add('active');
      if (nav) nav.classList.add('active');
      if (!rendered.has(id)) {
        rendered.add(id);
        mermaid.run({ nodes: section.querySelectorAll('.mermaid') });
      }
      history.replaceState(null, '', '#' + id);
    }

    const hash = location.hash.slice(1);
    const firstId = 'simple';
    showAgent(hash && document.getElementById('section-' + hash) ? hash : firstId);
  </script>
</body>
</html>