Skip to content

fix(studio): redesign off-screen indicators as edge-clamped pills#1375

Closed
miguel-heygen wants to merge 1 commit into
mainfrom
fix/offscreen-indicator-pills
Closed

fix(studio): redesign off-screen indicators as edge-clamped pills#1375
miguel-heygen wants to merge 1 commit into
mainfrom
fix/offscreen-indicator-pills

Conversation

@miguel-heygen

Copy link
Copy Markdown
Collaborator

Summary

  • Replace full-size dotted rectangle off-screen indicators with small edge-clamped pills at the composition border
  • Each pill shows the element name (data-name or id fallback) + directional arrow (→ ← ↑ ↓)
  • Pills clamped to nearest composition edge, positioned along the edge based on element center projection
  • Click to select, drag to move (same interactions as before)
  • Time-aware: only shows indicators for elements off-screen at the current seek time

Before/After

Before: Full-size dotted rectangles at the element's actual position outside composition bounds — cluttered and ugly

After: Small labeled pills pinned to the composition edge — clean and scannable

Test plan

  • Build passes
  • Typecheck clean
  • Lint clean
  • Element off-screen to the right shows pill on right edge with →
  • Element off-screen below shows pill on bottom edge with ↓
  • Multiple off-screen elements stack pills without overlap
  • Click pill selects element
  • Drag pill moves element

Closes #1374

Replace full-size dotted rectangle indicators with small pill chips
pinned to the composition border. Each pill shows the element name
and a directional arrow. Edge clamping computed from element center
relative to composition bounds. Click to select, drag to move.
@miguel-heygen miguel-heygen force-pushed the fix/offscreen-indicator-pills branch from f88044e to 1b6d602 Compare June 12, 2026 15:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

fix(studio): Redesign off-screen indicators as edge-clamped pills

1 participant