Keyboard Shortcuts
Master keyboard shortcuts and modifier keys for efficient workflow building in Qontinui Web
State Machine Editor
These shortcuts work in the State Machine page (/states) for managing states and transitions.
StateImage Operations
Drag from the purple dot below a StateImage thumbnail to create a transition to another state
Move a StateImage from one state to another instead of creating a transition
Canvas Navigation
Zoom in/out on the canvas
Pan around the canvas
Selection
Select a state or transition node
Deselect current selection
Modifier Keys Reference
Windows
- AltMove operations (Alt+Drag)
- CtrlMulti-select (future)
- ShiftConstrain movement (future)
macOS
- OptionMove operations (Option+Drag)
- CmdMulti-select (future)
- ShiftConstrain movement (future)
Moving StateImages Between States
There are two ways to move StateImages from one state to another:
Method 1: Properties Panel (Recommended)
- 1Select the source state in the canvas
- 2In the right panel, find the StateImage you want to move
- 3Click the arrow icon (↔) next to the StateImage name
- 4Select the target state from the dropdown menu
- 5The StateImage will be moved instantly
Method 2: Alt/Option + Drag on Canvas
- 1Locate the StateImage thumbnail in the state node on the canvas
- 2Hold Alt (Windows) or Option (macOS)
- 3Drag from the purple dot below the thumbnail
- 4Drop on the target state node
- 5The StateImage will be moved to the target state
Tips & Best Practices
Drag Handle Location
The purple drag handle appears below each StateImage thumbnail in the state node. Hover over a thumbnail to see it.
Visual Feedback
When dragging without Alt/Option, you're creating a transition. The cursor shows a link icon. When Alt/Option is held, you're moving the StateImage.
Undo Moves
If you accidentally move a StateImage to the wrong state, you can move it again using either method to place it correctly.