velt-huddle-best-practices

Files (16)

• AGENTS.full.md
• AGENTS.md
• SKILL.md
• metadata.json
• _sections.md · rules/shared/
• config-chat.md · rules/shared/config/
• config-cursor-mode.md · rules/shared/config/
• config-flock-mode.md · rules/shared/config/
• config-huddle-types.md · rules/shared/config/
• core-auth-provider.md · rules/shared/core/
• core-document-setup.md · rules/shared/core/
• core-setup.md · rules/shared/core/
• debug-common-issues.md · rules/shared/debug/
• events-webhooks.md · rules/shared/events/
• ui-customization.md · rules/shared/ui/
• wireframe-variables-huddle.md · rules/shared/wireframe-variables/

SKILL.md (first lines)

# 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

| Priority | Category | Impact | Prefix |
|----------|----------|--------|--------|
| 1 | Core Setup | CRITICAL | `core-` |
| 2 | Configuration | HIGH-MEDIUM | `config-` |
| 3 | Events | MEDIUM | `events-` |
| 4 | UI Customization | MEDIUM | `ui-` |
| 5 | Wireframe Variables | MEDIUM | `wireframe-variables-` |
| 6 | Debugging | LOW-MEDIUM | `debug-` |

## 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

From velt-js/velt-plugin-cursor, MIT.