Keyboard shortcuts

Shortcuts are written for macOS. On Windows and Linux, ⌘ is Ctrl, ⌥ is Alt and ⇧ is Shift. The tables below say so themselves when you read them on a Windows machine.

Single-letter shortcuts are ignored while you are typing in a field, so a prop value can still contain the letter s or the digit 2.

There is no command palette, no project-wide search, and no shortcut reference inside the app. Every search box in Stacki is scoped to one panel, and the only place a key is discoverable is the tooltip on a rail button. This page is the list.

Panels

The left rail holds ten panels, one icon each. Pressing the key of the panel that is already open collapses it, which gives the canvas the whole window.

Shortcut	Panel	Notes
P	Pages
Z	Navigator
K	Properties	Bound only while a component is open
⇧A	Components
J	Assets	Bare J; ⌘J is the terminal
⌥C	CMS
⌥V	Variables
G	Style selectors
C	Code
⌥H	Git

The rail’s keys are matched on the physical key rather than the character, which is why the ⌥ pairs work at all: Option rewrites ⌥C to ç and ⌥H to ˙ before a page would ever see a letter. Holding ⌘ or Ctrl makes the rail ignore the key entirely, so none of these collides with the shortcuts below.

The right panel has two:

Shortcut	Does
S	Style tab
D	Settings tab

Both are bare keys, so they only fire outside a field — which is also why D never collides with ⌘D.

Editing

Shortcut	Does
⌘F, ⌘E or ⌘K	Open the insert palette
⌘⇧A	Make a component out of the selection, naming dialog up
⌘Enter	Style tab, caret in the selector field
Enter	Open the selection’s code window (frontmatter, <style>, <script>)
⌘C	Copy the selected node
⌘V	Paste it
⌘D	Duplicate it
Delete / Backspace	Remove it
⌘Z	Undo
⇧⌘Z or ⌘Y	Redo
⇧⌘C	Copy Selection — the trail to it, as file:line pointers
⌘J or Ctrl`	Toggle the terminal
⌥P	Step into the interactive preview, back out of it, or back to now

⌘F is not a search. It opens the insert palette, and so do ⌘E and ⌘K — three keys for one thing, because the palette answers whichever a person’s other tools taught them. Inside the code editor all three are released so CodeMirror keeps its own find.

A rich text field claims ⌘K and ⌘E first, for a link and for code. ⌘C and ⌘V fall back to normal text behaviour when a field has focus or text is selected, and paste is left alone entirely while the clip-path editor is open, because that tool reads the clipboard itself.

⌘⇧A and ⌘Enter are deliberately handled before the “am I typing” check, so they act on the selected node wherever focus happens to be.

Undo and redo are global: CSS edits, CMS edits and asset changes are on the same stack as page edits, and they work from anywhere in the app, including without a page open. They do stand aside for a field that already undid its own typing — a value half-typed in a box is not a step on the page’s stack.

⌥P is the toolbar’s preview button, which names whichever of the three it will do: Preview (⌥P), Exit preview (⌥P), or Back to now (⌥P) while you are looking at an older version. Returning from an older version wins over the toggle. Entering needs a dev server, so without one the key does nothing.

Canvas

Shortcut	Does
1	Desktop
2	Tablet, 768px
3	Phone, 375px
4	Canvas — all breakpoints at once
Esc	Leave the preview, or an older version you were looking at
Esc	Otherwise, step out of a component you drilled into, one level

Esc lets fields, menus, dialogs and the code window answer it first.

Navigator

Shortcut	Does
← / →	Previous / next sibling
↑	Parent
↓	First child

::before and ::after are rows in the tree, so they are part of this: a ::before is the first child’s left-hand sibling, ↓ enters one, and ↑ from one goes to the element that draws it. Any modifier held cancels the move.

Fields

Shortcut	Does
↑ / ↓ in a number field	Step by 1
⇧ + step	Step by 10
⌥ + step	Step by 0.1
⌥-click a spacing value	Remove it
⇧-drag a spacing side	Change all four sides
⌥-drag a spacing side	Change that side and its opposite
Enter	Commit and blur
Esc	Cancel and put the old value back

In the style panel, = in any value field opens the large value editor — = is not something a CSS value starts with — and ⇧-clicking a section heading collapses or expands all of the sections at once.

The selector box is the one field where blur is not a commit: text left half-typed there is abandoned, and only Enter or a suggestion adds the selector.

App commands

One range of keys belongs to installed apps, and no Stacki shortcut uses it.

Shortcut	Does
⌘⌥⇧1 … 9	Run the app command bound to that key

On Windows and Linux the range is CtrlAltShift with a digit from 1 to 9. An installed app may bind a command to any key in the range, and the key runs it from anywhere in the editor: a panel, the canvas or an app’s own window, whether or not the app is open. A key no app has bound does nothing. When two apps ask for the same key, the one installed first keeps it.

Rich text headings stay on ⌥⌘0 to 6, without ⇧. With ⇧ held, a digit is an app command, never a heading.

Application menu

On macOS the native menu takes these keys before the page sees them, so they are routed back into the editor over IPC — which is why they act on the selected node when no field has focus, and on the text when one does.

Shortcut	Menu item
⌘,	File → Settings…
⌘O	File → Open Project…
⇧⌘W	File → Close Project
⌘Z / ⇧⌘Z	Edit → Undo / Redo
⌘C / ⌘V	Edit → Copy / Paste
⇧⌘C	Edit → Copy Selection
⌘E	Edit → Insert Element…

Check for Updates… also sits in the File menu, with no key. ⇧⌘C saves any pending edit before it reads the file, because typing is written on a debounce and the line numbers would otherwise be one edit old. The menus are File, Edit, View and Window. There is no Help menu, which is the other half of why there is no shortcut reference in the app.