Hacktoberfest 2026: the issues maintainers tagged for October, open and beginner-friendly. Browse Hacktoberfest issues

Studio: press ? to open the keyboard shortcuts panel

Open Beginner friendly
#5,580 1 comment 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

@B-Payal is already working on this.

Since Oct 14, 2026.

  • #6042 by @xiajiahang — open

Assessment

Difficulty
2/5
Estimated time
1-3 hours
Newbie friendliness
82/100
Issue type
Feature
Clarity
Clearly specified
Activity status
Active
Tech stack
react, typescript
Domain
frontend

Research direction

Start with the shortcuts panel in packages/studio/src/player/components/ShortcutsPanel.tsx and the shortcut sections in studioShortcuts.ts, then find where the global keydown handling lives in the studio player. Bind ? (Shift+/) to toggle the panel, ignoring events whose target is an input, textarea or contenteditable element, and add ? to the listed shortcuts. Done when the panel opens and closes with ? and Esc, does nothing while typing in a text field, and a test in the studio package covers open, close and the text-field case.

Written by the indexing model from the issue text.

Description

desktop-candidate difficulty/easy enhancement good first issue help wanted triage/ready

Studio already has a shortcuts panel (the keyboard button in the timeline toolbar, packages/studio/src/player/components/ShortcutsPanel.tsx, sections in studioShortcuts.ts). There is no key that opens it, so people who look for shortcuts with ?, as in most editors, find nothing.

Done when

  • Pressing ? (Shift+/) opens the shortcuts panel; pressing it again or Esc closes it.
  • It does nothing while focus is in a text field, input or contenteditable.
  • The panel lists ? itself.
  • A test covers open, close and the text-field case.

Desktop candidate: this component is also used by the HyperFrames Desktop app, so the change reaches it with the next version bump.

Reviewer: @miguel-heygen. New to the repo? Start with CONTRIBUTING.md; run bun install, then the package's tests, before opening a PR.

Dominant language
TypeScript
Stars
54.1k
Forks
4.9k
Avg merge
10h 29m
Merged PRs (30d)
649

Getting set up

This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from heygen-com/hyperframes

All issues in heygen-com/hyperframes

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.