Features

Everything your users get when you add <pulse-widget> to your page.

Toolbar

A floating pill-shaped bar appears on the page with:

• Presence avatars — colored circles for each user on the page
• Pin mode — click to drop a comment anywhere
• Cursor toggle — show/hide live cursors
• Drawing mode — freehand annotations
• Activity feed — recent room events
• Settings — user preferences (toggles for each feature)

Comment Pins

Users click the pin icon in the toolbar, then click anywhere on the page to start a conversation pinned to that spot.

• Numbered dots appear at each pinned location
• Clicking a dot opens the thread in a popover
• Threads support replies, @mentions, edit, and delete
• Pin positions are responsive (stored as percentages)

Threaded Comments

A slide-out panel shows all threads in the room:

• Active threads appear first, resolved threads below
• Click a thread to expand and see all comments
• Reply to any thread with the input at the bottom
• @mention users by referencing their ID
• Edit and delete your own comments
• Resolve threads when the discussion is done

Live Cursors

See every user's cursor moving in real-time:

• Color-coded with the user's name as a label
• Throttled for performance (updates every 50ms)
• Stale cursors fade out after 3 seconds
• Can be toggled off in settings

Click Indicators

When someone clicks on the page, other users see a brief colored ripple at that position. Useful for "look here!" moments.

Presence

The toolbar shows who's on the page:

• Colored avatar circles (shows initials or profile picture)
• Overflow badge ("+3") when many users are present
• Each user is either online or idle

Follow Mode

Click any user's avatar in the toolbar to follow them — your page auto-scrolls to match their position.

• "Following Alice" banner appears
• Your page scrolls with theirs in real-time
• Click Stop, press Escape, or scroll manually to exit

Typing Indicators

When someone is typing a reply, other users see "Alice is typing..." below the thread. Auto-clears after a few seconds of inactivity.

Reactions

Click the + button below any comment to add an emoji reaction:

• 6 quick-pick emojis (thumbs up/down, heart, party, eyes, rocket)
• Click an existing reaction to toggle it
• Reaction counts update in real-time

Activity Feed

Click the clock icon in the toolbar to see recent room activity:

• New threads (with content preview)
• New comments (with content preview)
• Thread resolved/reopened events
• Relative timestamps ("just now", "5m ago")

Media Attachments

Attach images, audio recordings, and video recordings to comments:

• Images — click the paperclip button to open a multi-select file picker (JPEG, PNG, GIF, WebP)
• Audio — click the mic button to record a voice note in-browser
• Video — click the video camera button to record a clip in-browser
• Up to 5 attachments per comment by default (configurable per environment)
• Attachment previews appear below the input with an X button to remove before sending
• Uploaded attachments render inline in posted comments

For full details, see Media Attachments.

Mention Autocomplete

Type @ in any comment or reply input to see a dropdown of room members:

• Shows online/idle status indicator next to each name
• Navigate with arrow keys, select with Enter or Tab, or click
• Dismissed with Escape or by moving the cursor off the trigger

Requires allowMentions to be enabled in Environment Config.

Lightbox

Clicking an image attachment in a comment opens the lightbox viewer:

• Full-size image centered in a dark overlay
• Prev / Next arrows when multiple images are attached to the same comment
• Left / Right arrow keys for keyboard navigation
• Click outside or press Escape to close

Video Player

Video attachments render as a rectangular inline preview:

• Click to play/pause inline
• Click the expand icon to open a fullscreen overlay
• Fullscreen overlay shows native HTML5 video controls
• Press Escape or click outside to exit fullscreen

Mutual Exclusive Toolbar

Only one mode can be active at a time. Activating a new mode automatically deactivates the previous one:

• Pin mode → entering drawing mode exits pin mode, and vice versa
• Drawing mode → opening the comments panel exits drawing mode
• Opening any panel (comments, notifications, activity) exits pin mode and drawing mode

This prevents conflicting interactions where overlays would interfere with each other.

Drawing / Annotations

Click the pen icon to enter drawing mode:

• Freehand drawing over the page
• Strokes broadcast to all users in real-time
• Strokes auto-fade after 10 seconds
• Great for quick "circle this" style annotations
• Can be disabled per environment via allowDrawing in Environment Config

Text Selections

When a user selects text on the page, other users see the selection highlighted in that user's color. Useful for "I'm looking at this paragraph" context.

Viewport Awareness

Colored pills on the right edge of the page show where other users are scrolled to. Helps you know if someone is reading the header while you're at the footer.

User Settings

Each user can customize their experience via the settings panel:

Setting	What It Controls
Show my cursor	Whether your cursor is visible to others
Show other cursors	Whether you see other people's cursors
Click indicators	Show click ripples
Appear offline	Hide from presence (stop sending heartbeats)
Comment pins	Show/hide the pin dots on the page
Viewport indicators	Show/hide the scroll position pills
Text selections	Show/hide shared selections
Drawing overlay	Show/hide drawing strokes

Settings are saved per user, per room in the browser's localStorage.