Blocks
Blocks are the fundamental units of content in Ideon. Every item on the canvas is a block.
Core Concepts
- Position: Every block has x, y coordinates.
- Dimensions: Most blocks can be resized.
- Connections: Blocks can be connected to visualize relationships. Links can also have text labels.
- Selection: Blocks can be grouped and moved together.
Block Types
0. Core Block
The root block of every project. It is automatically created when a project is initialized.
- Features: Displays the project title and description.
- Use Case: Serves as the central anchor or "home" for the project canvas.
1. Note Block
A simple text note supporting Markdown.
- Features: Rich text, lists, code blocks.
- Shortcuts:
Ctrl+B(Bold),Ctrl+I(Italic),Ctrl+U(Underline),Ctrl+K(Link),Ctrl+Z(Undo),Ctrl+Y(Redo). - Use Case: Quick thoughts, sticky notes, labels.
2. Snippet Block
A code editor with syntax highlighting.
- Features: Supports several languages, copy-to-clipboard.
- Use Case: Storing algorithms, config files, or queries.
3. Link Block
A bookmark to an external resource.
- Features: Automatically fetches and displays a rich preview card with the page title, description, and image.
- Use Case: linking to documentation, inspiration, or external tools.
4. Contact Block
Represents a person or a role.
- Features: Name, role, contact info.
- Use Case: Mapping stakeholders, team members, or user personas.
5. Checklist Block
A task list with checkboxes.
- Features:
- Add/remove items, check/uncheck.
- Drag-and-drop: Reorder tasks or move them between different checklist blocks.
- Indentation: Use
Tabto indent (nest) tasks andShift+Tabto outdent.
- Use Case: Todo lists, requirements, acceptance criteria.
6. Palette Block
A color palette generator and storage.
- Features: Generate palettes, store hex codes.
- Use Case: Design systems, branding.
7. Video Block
Embeds a video player.
- Features: Supports YouTube/Vimeo links.
- Use Case: Tutorials, demos, references.
8. GitHub & Git Block
A powerful integration to display repository metadata and live statistics from various Git providers.
- Multi-Provider Support: Compatible with GitHub, GitLab, Gitea, and Forgejo.
- Live Stats: Displays stars, latest release, last commit date, open issues, and contributors.
- Private & Self-Hosted Repositories:
- To access private repositories or self-hosted instances (e.g., a private GitLab server), you must configure a Git Token in your User Settings.
- Ideon uses the token to authenticate and identify the provider type.
- Use Case: Tracking dependencies, project repositories, or monitoring health across different forges.
9. File Block
Allows uploading or linking to files.
- Features: Uploads stored per project and served via the files API.
- Use Case: Attaching design assets, PDFs, or other documents.
10. Sketch Block
A drawing tool for freehand sketches and diagrams.
- Features: Pen and eraser tools, multiple colors, adjustable stroke width.
- Use Case: Quick diagrams, annotations, wireframing, or visual explanations.
11. Shell Block
A fully interactive terminal embedded in the canvas, powered by xterm.js and node-pty.
- Environment: Runs commands directly on the hosted instance (the server running Ideon).
- Note: SSH connections are not yet supported.
- Features:
- Start/Stop/Kill: Manage the lifecycle of the shell session.
- Stop: Pauses the session while preserving the scrollback buffer for instant resume.
- Kill: Destroys the session entirely.
- Zero RAM: Consumes no memory when stopped.
- Start/Stop/Kill: Manage the lifecycle of the shell session.
- Access Control: Restricted to project creators and owners.
- Use Case: Running scripts, checking logs, or managing infrastructure directly from the canvas.
- Disable: Set
SHELL_MAX_SESSIONS=0in your environment variables to completely disable this feature.
Interacting with Blocks
Ideon provides intuitive ways to interact with blocks on the canvas:
- Drag & Drop: Click and hold any block to move it around the infinite canvas.
- Resize: Drag the corners or edges of a block to adjust its size.
- Connect: Drag a line from one block's handle (the small dots on the sides) to another block to create a relationship.
- Labels: Double-click on a connection line to add a text label (e.g., "depends on", "blocked by").
- Edit: Double-click the body of a block to edit its content (text, code, checklists, etc.).
- React: Hover over a block and click the emoji icon to add a reaction. This is great for asynchronous voting or acknowledging updates without cluttering the canvas.
- Context Menu: Right-click a block to access advanced options like Locking, Duplicate, Delete, or Bring to Front/Send to Back.
- Multi-Select: Hold
Shiftand click multiple blocks, or drag a selection box around them to move or delete them as a group.