Visual Node Editor , HudHudScript

📚 Node Palette

⬛ Console

0 ▼

🔧 Properties

Select a node to edit properties.

📄 Generated Code

// Click "Generate" to see output

👋 Welcome to HudHudScript Visual Editor

This is a Blueprint-style visual programming tool for HudHudScript , the multi-lingual AI agent programming language. You can build programs by connecting nodes visually.

agent MyAgent { provider: gpt-4 task analyzeData { ... } }

🖱 Adding & Navigating Nodes

Right-click on the canvas to open the node search menu. Type to filter, click to add. Drag nodes from the left palette too.

Mouse controls:
• Scroll wheel , zoom in / out
• Middle-click drag or Alt + left-click drag , pan the canvas
• Left-click drag on empty space , selection box

// Right-click → search "agent" → click Agent node

🔗 Connecting Nodes

Drag from an output port (right side) to an input port (left side) to create a connection. Ports are color-coded by type , only compatible types can connect. Click a wire to delete it.

Provider.agent_ref ──► Agent.provider Task.output ──────► Agent.tasks

🌍 Multi-Language Output

Select a language from the toolbar dropdown. Node keywords and generated code will update to use that language's HudHudScript syntax. RTL languages use right-to-left layout automatically.

// Turkish: ajan MyAgent { görev analiz { ... } } // Arabic: wakil MyAgent { muhimma tahlil { ... } }

⚡ Generating Code

Click ▶ Generate to produce HudHudScript source code from your graph. Then use ✓ Check Syntax, ⚙ Compile, or ▶ Run to execute it. Hover over buttons to see the exact CLI command used.

hudhud check output.hudhud hudhud compile output.hudhud hudhud run output.hudhud

🏛 Governance Nodes

HudHudScript has built-in governance: Constitution → Law → Council → Role. Connect them to build a governance hierarchy. The Constitution node contains Laws and Councils; Councils contain Roles and Strategies.

constitution SystemGov { law DataLaw { enforcement: mandatory } council Oversight { model: democracy } }

🎉 You're Ready!

Try loading an example from the Examples dropdown in the toolbar. Use ⚙ Layout to auto-arrange nodes. Press Ctrl+S to save your work. Have fun building!

// Load "Governance System" example to see // a full constitution + council + law graph