openpencil/packages/docs/user-guide/context-menu.md
Danila Poyarkov 96d8ab5789 Move docs to packages/docs, add Cloudflare Pages deploy
- Move docs/ → packages/docs/ as @open-pencil/docs workspace package
- Add screenshot.png as hero image on landing page
- Add GitHub Actions workflow for Cloudflare Pages deploy (openpencil.dev)
- Remove vitepress from root devDependencies
- Root docs:* scripts delegate via bun --filter
2026-03-01 15:16:16 +03:00

74 lines
2.8 KiB
Markdown

---
title: Context Menu
description: Right-click context menu actions in OpenPencil — clipboard, z-order, grouping, components, and more.
---
# Context Menu
Right-click on the canvas to open the context menu. If you right-click on a node, it is selected first. Right-clicking on empty canvas clears the selection.
## Clipboard Actions
| Action | Shortcut (Mac) | Shortcut (Win/Linux) |
|--------|----------------|----------------------|
| Copy | ⌘ C | Ctrl + C |
| Cut | ⌘ X | Ctrl + X |
| Paste here | ⌘ V | Ctrl + V |
| Duplicate | ⌘ D | Ctrl + D |
| Delete | ⌫ | Backspace / Delete |
Clipboard actions are disabled when nothing is selected (except Paste, which is available when the clipboard has content).
## Z-Order
| Action | Shortcut |
|--------|----------|
| Bring to front | ] |
| Send to back | [ |
Moves the selected node to the top or bottom of its parent's child list.
## Grouping
| Action | Shortcut (Mac) | Shortcut (Win/Linux) |
|--------|----------------|----------------------|
| Group | ⌘ G | Ctrl + G |
| Ungroup | ⇧ ⌘ G | Shift + Ctrl + G |
| Add auto layout | ⇧ A | Shift + A |
- **Group** requires 2 or more selected nodes
- **Ungroup** appears when a group is selected — children are reparented to the group's parent
- **Add auto layout** wraps the selection in a new [auto layout](./auto-layout) frame
## Component Actions
Component actions are displayed in purple to match the component color theme.
| Action | Shortcut (Mac) | Shortcut (Win/Linux) | Available on |
|--------|----------------|----------------------|--------------|
| Create component | ⌥ ⌘ K | Ctrl + Alt + K | Frames, groups, multi-selection |
| Create component set | ⇧ ⌘ K | Shift + Ctrl + K | 2+ selected components |
| Create instance | — | — | Components (no shortcut) |
| Go to main component | — | — | Instances |
| Detach instance | ⌥ ⌘ B | Ctrl + Alt + B | Instances |
See [Components](./components) for details on the component workflow.
## Visibility & Lock
| Action | Shortcut (Mac) | Shortcut (Win/Linux) |
|--------|----------------|----------------------|
| Hide / Show | ⇧ ⌘ H | Shift + Ctrl + H |
| Lock / Unlock | ⇧ ⌘ L | Shift + Ctrl + L |
The label toggles based on the node's current state (e.g., "Hide" for a visible node, "Show" for a hidden one).
## Move to Page
The **Move to page** submenu lists all pages except the current one. Select a page to reparent the selected nodes under that page's canvas.
## Tips
- Right-clicking empty canvas gives you access to Paste — useful for placing content at a specific location.
- Component actions only appear when relevant (e.g., "Create instance" only for component nodes).
- The context menu mirrors the keyboard shortcuts — it's a good way to discover shortcuts you don't know yet.