Velt Huddle Best Practices

Velt Huddle Best Practices

Comprehensive implementation guide for Velt's real-time audio, video, and screen sharing huddle feature. Contains 11 rules across 6 categories covering setup, configuration, webhooks, UI customization, wireframe template variables, and debugging.

When to Apply

Reference these guidelines when:

• Adding audio/video/screen sharing to a collaborative app
• Configuring huddle types (audio, video, screen, all)
• Enabling ephemeral chat within huddles
• Implementing flock mode (follow me) for shared navigation
• Adding huddle bubble on user cursors
• Handling huddle webhook events (created, joined)
• Customizing huddle tool button UI
• Debugging huddle connection or permission issues

Rule Categories by Priority

Quick Reference

Core Setup (CRITICAL)

• core-auth-provider — Use authProvider on VeltProvider, never identify()
• core-setup — Add VeltHuddle at app root + VeltHuddleTool in toolbar
• core-document-setup — Set document context to scope huddle per document

Configuration (HIGH-MEDIUM)

• config-huddle-types — Select audio/video/screen/all mode
• config-chat — Enable/disable ephemeral chat within huddle
• config-flock-mode — Follow me mode on avatar click
• config-cursor-mode — Huddle bubble on user cursors

Events (MEDIUM)

• events-webhooks — Huddle created/joined webhook integration

UI Customization (MEDIUM)

• ui-customization — Slots, CSS parts, custom button templates

Wireframe Variables (MEDIUM)

• wireframe-variables-huddle — componentConfig.* flat-config variables on the huddle root, the huddle tool, and per-attendee tiles

Debugging (LOW-MEDIUM)

• debug-common-issues — Troubleshooting huddle issues

Compiled Documents

• AGENTS.md — Compressed index of all rules with file paths (start here)
• AGENTS.full.md — Full verbose guide with all rules expanded inline