Appearance
Commands, menus and shortcuts
Everything Reportforge does from a key, a menu or the command palette is one command, so a menu entry, its shortcut and its line in the palette always agree. A command that doesn't apply says why: the menu and the palette show the reason beside it. The palette, the shortcut sheet, going to a workspace and the appearance work on every page; the designer's own commands are there while it is open.
The shortcuts are fixed defaults; they can't be rebound. On macOS, Ctrl becomes ⌘, and the menus, the palette and the shortcut sheet show it that way. Shortcuts don't work while you type in a text field, except Ctrl+K and Ctrl+Shift+P.
Finding a command
- The command palette, Ctrl+K or Ctrl+Shift+P, or the search box at the top of the sidebar. Type part of a command's name or its category, or a report, a library or an administration page to go to. The letters only need to come in order, so
dplfinds Duplicate andview zoomfinds the zoom commands. The commands you ran last come first, under Recent. Up and Down move, Enter runs, Escape closes. A command runs where you opened the palette: from the outline it acts on the outline's rows. - The shortcut sheet,
?(outside text fields) or Ctrl+/. Every key there is, grouped by category. A key that works in one place only says where, such as "Outline". Filter it by name or key, for examplewraporF2.
F1 is kept for in-app help.
The Document commands include Open the draft in the viewer and Open the published version in the viewer: see viewer.md. Go to libraries (Alt+2) opens the Libraries page: see libraries.md.
Context menus
Right-click a box on the canvas, an outline row, a data field, a page thumbnail or a library item to open its menu. From the keyboard, press Shift+F10 or the Menu key on the focused item: the menu opens under it.
A right-click on something that isn't selected selects it first. A right-click on part of a multi-selection keeps the selection, and the menu acts on all of it.
| Menu | Holds |
|---|---|
| Canvas and outline | Cut, copy and paste; duplicate and delete (the outline also has rename); insert a text, heading, box, table, image or list before or after the selection; wrap in a box and unwrap; select the parent; extract a component; on the canvas, the Select submenu: every box under the pointer, to pick one that another covers (canvas-tools.md); for a table, the Table submenu (tables.md); the Arrange submenu: align, distribute and match size (canvas-tools.md); copy style, paste style and paint format (multi-edit.md). |
| Data fields (the Data panel) | Insert the field as text at the selection; insert a list of items as a table or a chart (the region wizard); copy the field's expression. |
| Pages (a thumbnail, or a page template's row in the outline) | Add, duplicate or delete a page template; edit its header, footer, background or overlay in the page template editor; delete every guide of the template. |
| Guides (a guide on the canvas) | Delete the guide, or every guide of its page template. |
| Library items (the Library tab, the insert panel's components, the Assets tab) | Insert the item after the selection; open it (a component of this document opens on its own, a library component shows its preview, an image selects where it is used); show the library release it comes from; send one of the document's own components to a library's draft (libraries.md). |
In a menu, Up and Down move, Home and End go to the first and last item, and typing a letter goes to the next item that starts with it. Right or Enter opens a submenu, and Left or Escape closes it. Enter or Space runs an item, and Escape closes the menu with focus back where it was.
The canvas from the keyboard
The canvas is one tab stop. Inside it, a ring shows the box that has the keyboard, and a screen reader hears its name ("Text, Invoice total (total), page 1").
| Key | Does |
|---|---|
| Down, Up | The next or previous box in reading order, onto the next or previous page at the ends |
| Left, Right | The parent box, or the first box inside |
| Home, End | The page's first or last box |
| Enter | Select the box. Moving around doesn't change the selection. |
| F2 | Edit the box's text in place |
| Shift+F10, Menu | Open the box's menu |
| Delete, Ctrl+D, Ctrl+G, Ctrl+Shift+G | Delete, duplicate, wrap or unwrap the selection |
| Escape | Select nothing |
Once a box in a frame is selected, the arrow keys nudge it by a millimetre (or the document unit's step), and by ten with Shift. Press Escape to select nothing, and the arrows move between boxes again.
The shortcuts
| Key | Does | Where |
|---|---|---|
| Ctrl+Z | Undo | |
| Ctrl+Shift+Z, Ctrl+Y | Redo | |
| Ctrl+X, Ctrl+C, Ctrl+V | Cut, copy and paste nodes; they paste into another template too | |
| Ctrl+=, Ctrl+- | Zoom in and out | |
| Ctrl+R | Rulers on every page, to drag guides from | |
| Escape | Select nothing, or put the format painter's brush down when it is on | |
| Ctrl+Alt+C, Ctrl+Alt+V | Copy a node's style, and paste it onto the selection (multi-edit.md) | |
| Ctrl+K, Ctrl+Shift+P | The command palette | Text fields too |
?, Ctrl+/ | The shortcut sheet | |
| Alt+1, Alt+2, Alt+3 | Go to the catalog, the libraries, administration | |
| Ctrl+Shift+L | Light, dark or the system's mode, round again | |
| Shift+F10, Menu | The focused item's menu | |
| Delete, Backspace | Delete the selection | Outline, canvas |
| Ctrl+D | Duplicate | Outline, canvas |
| Ctrl+G, Ctrl+Shift+G | Wrap in a box, unwrap | Outline, canvas |
| Up, Down | The previous or next row; Shift adds it to the selection, Ctrl moves without selecting | Outline |
| Left, Right | Close the row or go to its parent; open it or go to its first child | Outline |
| Home, End | The first or last row | Outline |
| Enter, Space | Select the row; Shift adds it | Outline |
| F2 | Rename | Outline |
| Alt+Up, Alt+Down | Move up or down within its place | Outline |
| Alt+Left, Alt+Right | Outdent out of its parent, indent into the node before | Outline |
| Ctrl+Shift+M, Ctrl+Shift+S | Merge the picked table cells, split them (tables.md) | Outline, canvas |
| Tab, Shift+Tab | The next or previous table cell, when cells are picked | Canvas |
| Alt+click | Select the box behind the selected one (canvas-tools.md) | Canvas |
| / | Search the style properties to add one (styling.md) | Inspector, Style tab |
The shortcut sheet in the designer always lists every key, including the ones branches add later, and the pointer gestures that go with commands, such as Alt+click.
For developers
The registry is web/packages/commands (framework-free). It holds the command type, the keymap, the menu component, the fuzzy matcher and the recent list. The studio has one registry and keymap, made at the app's root (web/apps/designer/src/commands/studio.ts, adopted by vue-core's adoptCommands), with one keydown listener; the palette and the shortcut sheet are vue-shell's RfCommandPalette and RfShortcutSheet. Its own modules are always there: help.ts, go.ts, appearance.ts and account.ts, typed on StudioContext. The designer's are in the same folder, one module per area: edit.ts, insert.ts, view.ts, outline.ts, canvas.ts, arrange.ts, select.ts, guides.ts, fields.ts, pages.ts, table.ts, library.ts, menu.ts and format.ts (the format painter). index.ts registers them while the designer is open (host.ts), and the designer builds their DesignerContext meanwhile.
- A command has an id, a title, a category, its default keys, the contexts its keys work in (
globalby default, orcanvas,outline,fields,pages,library),when(ctx)(true, or why it doesn't apply) andrun(ctx).gestures(Alt+Click) are listed in the shortcut sheet beside its keys but aren't bound: the canvas handles them. - Keys go to the focused context first, then to
global. A chord with Alt also matches by the physical key (KeyboardEvent.code) when Alt types another character, as Option does on macOS and AltGr on many layouts. The focused context is the nearest element withdata-command-context. In a context, the first command for a key that applies runs. A key bound in the focused element's context is taken even when nothing there applies, so the browser doesn't act on it instead. - Menus (
menus.ts) are groups of commands at fixed orders, with separators between them. The canvas and outline menus leave orders free for other branches:ORDER.style(copy and paste style,format.ts),ORDER.table(the Table submenu)ORDER.arrange(the Arrange submenu,arrange.ts) andORDER.select(the canvas's Select submenu,select.ts). A submenu whose items change each time, such as the boxes under the pointer, takes alist(ctx)instead ofitems. - To add commands, write a module of
Command<DesignerContext>[], add it toCOMMAND_MODULES, and add any menu groups withregistry.menu(…). An element opens a menu withv-context-menu, which names the menu and its subject.