Detail Panel¶

The detail panel provides comprehensive editing and viewing capabilities for any selected node.

Opening the Panel¶

• Press Space with a node selected
• Enter a node that shows no children, by double-clicking it or by pressing Enter with it selected. You land inside the node as with any other, and the panel opens for it, since the view has nothing else to show. What counts is what the view would show: a node whose children are all hidden, because they are completed and completed nodes are hidden, or because their type is filtered out, opens the panel just like a node with no children at all. Going back, or stepping there through the breadcrumbs, does not open the panel.
• Double-click a node's title to open in edit mode

Panel Modes¶

Pinned Mode¶

Click the pin icon to keep the panel open when clicking elsewhere. Useful when editing while browsing.

Fullscreen Mode¶

Click the expand icon or press Escape to toggle fullscreen. Provides maximum editing space.

Narrow Window Behavior: On narrow screens (below the responsive threshold), opening the detail panel automatically enters fullscreen mode to provide adequate editing space.

Detached Window¶

The detached window hides the pin, fullscreen, detach and link-search controls. Each of them acts on the main window's layout or opens the spotlight, neither of which the detached window has, so they are absent rather than present and inert.

Open the detail panel in a separate window:

1. Click the "Open in Window" button in the panel header (or use context menu > "Open in Window")
2. A separate window opens with the node's detail view
3. Changes sync between windows via BroadcastChannel

Detached window features:

• Independent window that can be moved to another monitor
• Real-time sync with the main window
• Detaching the same node again focuses the existing window instead of opening a second one
• Quitting the app closes detached windows
• URL format: ?detached={nodeId}

Wrap With Parent¶

Creates a new item and moves the current one under it. The panel asks for the new item's title in an in-app dialog.

Native browser dialogs are not used anywhere in the app: Electron does not implement window.prompt, so it returns nothing without showing anything, and a feature built on it fails silently. The dialog is rendered once at the app root and shared through composables/usePrompt.js, so any component can ask for a value without adding one of its own.

Action Row¶

The row at the bottom of the panel holds Wrap with Parent, Move to Root, Export and Delete. At the default panel width the four share one row. A label is never broken across lines: when the panel is dragged too narrow for all four buttons, the row wraps and Delete moves to a second row, still at the right edge. Export opens a menu of formats and is marked with a chevron.

Sections¶

The detail panel is divided into sections that open and close from the section bar.

Section Bar¶

One bar under the title holds a button for every section: Notes, Table, Tasks and Metadata for most nodes; Notes and Details for persons and organizations. The buttons keep the same order and the same position whichever sections are open, in the side panel, in fullscreen mode and in a detached window.

• Clicking a button opens or closes its section. The button of an open section is highlighted.
• The Tasks button shows the completed and total task counts when the node has tasks.
• Open sections appear below the bar in the order of the buttons. A section body carries no title of its own; the bar is the only place a section is named.

How Sections Share the Panel¶

The panel does not scroll as a whole; each section scrolls within itself. The rules are the same in the side panel, in fullscreen mode, in a detached window, and for every node type, including persons and organizations.

• While the notes section is open it keeps at least 40% of the height below the section bar, whatever else is open. Opening Metadata, Tasks, or a table cannot push the notes out of view.
• The sections below the notes take the height their content needs, up to what the notes leave, and scroll within that space when the content is taller.
• Closing the notes gives the whole height to the other sections.
• A section other than the notes is no taller than its contents: a node without a table shows only the Add Table button, with no reserved space under it.
• The section buttons and the contents of every open section start at the same left edge.
• In the side panel each open section takes a full row. In fullscreen mode and in a detached window the table takes a full row, and Tasks and Metadata share one when both are open.

Notes Section¶

The notes section supports full Markdown editing.

View Modes:

Syntax highlighting in Edit and Split mode:

The editor shows the Markdown source, never a rendered substitute for it, and styles the source so that markup and content are told apart at a glance. Marker characters (**, *, #, -, >, backticks, link brackets, table pipes) are dimmed to the tertiary text colour. Bold text is bold, italic text italic, headings bold, inline and fenced code monospace, link text and URLs in the accent colour. Without this, **Goals** reads as four asterisks around a word in the editor's proportional font, where the asterisk glyph is lighter than the letters and looks like a stray style rather than markup.

Features:

• External links open in browser
• Fenced code blocks render as monospace blocks in Preview, without language-specific colouring; a mermaid block renders as a diagram
• Tables and lists support

Lists and Enter:

Pressing Enter inside a list or blockquote continues it with the next marker, renumbering ordered lists as it goes. Lists are kept tight: Enter never inserts a blank line between items, whether or not the list already contains one. Pressing Enter on an empty list item ends the list and removes the marker.

Mentions¶

Type @ in the notes editor (Edit or Split mode) to mention and link to person nodes:

1. Type @ followed by a name (e.g., @John)
2. A dropdown appears with matching persons (up to 10 results)
3. Use arrow keys to navigate, Enter or Tab to select — or click a suggestion
4. The mention is inserted and a link to that person is created on the current node

Mention format: @[Person Name](person:123)

In Preview and Split mode the mention renders as a @Name chip rather than raw Markdown.

Keyboard navigation:

While the dropdown is open these keys belong to it, so Enter inserts a mention instead of a newline. When it is closed they behave normally.

Details:

• The person list is scoped to the current workspace and re-loads when you switch workspaces
• Mentions must follow a space, newline, or opening parenthesis; maximum query length is 30 characters
• An already-inserted mention does not re-open the dropdown when the cursor passes over it
• Moving the cursor out of the query, or leaving the editor, dismisses the dropdown
• Linked persons appear in the Linked Items section immediately after insertion

Sensitive Notes:

Toggle the "sensitive" flag to keep a note out of every list view: cards, the table, graph nodes, search results and the hover tooltip show a lock in its place. The panel opens such a note hidden on all three tabs, and hides the text the moment you set the flag; press Show to load it. Clearing the flag loads the text again. When sensitive-note encryption is enabled and the session is locked, the panel asks you to unlock first: with Touch ID when Require Touch ID at startup is on, otherwise with the recovery password. Setting the flag never asks; clearing it does. See sensitive notes.

Children Section¶

Displays and manages child nodes.

Features:

• Hierarchical child list
• Toggle completion status for tasks
• Add new child nodes
• Search within children
• Show/hide linked nodes (non-hierarchical relationships)

Table Section¶

Attach a spreadsheet to any node.

Features:

• Create and delete tables
• Give the table a title: type in the title field at the left of the table's toolbar. Enter or clicking away saves it; Escape puts back what was there. A table without a title shows the placeholder "Add a title" there; the section is already named in the section bar, so the toolbar does not repeat the word "Table"
• Add, remove, and rename columns
• Edit cell values directly
• Cell color formatting (colorblind-friendly palette)
• Copy, cut, and paste a block of cells, with the keyboard or with the Copy and Paste buttons that appear in the table's toolbar while cells are selected. Copy takes the values shown in the grid, including one typed a moment ago that is still being saved.
• A pasted block starts at the top-left cell of the selection. With a cell editor open, a clipboard holding more than one cell is not put into that editor: the block is pasted starting at the cell being edited. A single value is pasted into the editor as text.
• Multi-cell selection: drag across cells, or click a column header to take the whole column
• The selection ends when you click away from the table, in the grid or outside it. The table's own toolbar and menus are part of the table: using them keeps the selection. It has to: while a selection stands the table answers for keys such as Cmd/Ctrl+Backspace even when focus has moved on, so a selection left behind would blank cells in place of the action you meant.
• Columns share the available width equally, so the table always spans the panel; in fullscreen and detached mode the table section takes the full window width while Children and Metadata share a row

Formulas:

Cells support formulas for computed values. Enter a formula by starting with =:

• Formulas are stored separately from display values
• The cell shows the computed result while displaying the formula when editing
• Formula syntax follows standard spreadsheet conventions

Selection indicator:

A selected range is filled with the accent tint and outlined with a solid accent border drawn around the perimeter of the range, not around each cell in it. The fill alone is not a sufficient indicator: the grid is painted on a pure black background where the accent tint at its normal opacity is indistinguishable from the row hover colour.

Clicking a single cell opens its editor rather than marking a selection, so the editor's own focus ring is the indicator in that case.

Editing a cell:

Clicking a cell opens its editor. While the editor is open every keystroke belongs to the editor: characters are typed, Backspace and Delete remove characters, and Cmd/Ctrl + C/V/X operate on the text inside the cell. Enter commits the value and moves to the cell below. None of the table-level shortcuts below, and none of the application-wide shortcuts, fire while a cell editor is open.

The table also keeps the application-wide shortcuts from firing whenever the grid has focus, including after an edit is committed and focus returns to a cell. Enter, Space and n would otherwise navigate into the selected node, toggle the detail panel, or open the new-node dialog while the user is working in the table.

Table-level shortcuts (no cell editor open — select a range by dragging across cells or by clicking a column header):

Editor stability:

Saving a cell writes to the database asynchronously and updates the local cell list, which re-renders the grid. Rows carry a stable identity so those re-renders update the existing rows in place instead of recreating them, and selection highlighting refreshes cells rather than redrawing rows. Both are required so that a save landing while the user is typing in another cell does not destroy that open editor and discard the text.

Metadata Section¶

Displays and edits all node properties in a grid layout.

Editable Fields:

• Title
• Type
• Due date, Start date, End date
• Importance level
• Location
• Email, Phone (for Person nodes)
• Organization, Role (for Person nodes)
• Website
• Color

Organization Autocomplete (Person nodes):

When editing a Person node, the organization field provides autocomplete:

1. Type to search existing organizations in the workspace
2. Arrow keys navigate the dropdown; Enter selects
3. If no match exists, press Enter to create a new organization
4. Multiple organizations can be linked to a person
5. Click the X on an organization tag to unlink it

Organizations are displayed as tags showing the full hierarchy path (e.g., "Company > Department > Team").

Linked Items Section¶

Shows non-hierarchical relationships.

Features:

• View all nodes linked to the current node
• Create new links via search
• Remove existing links
• Navigate to linked nodes

Tags Section¶

Manage node tags for categorization.

Features:

• Add tags with autocomplete
• Remove existing tags
• Search by tag using #tagname in spotlight search

Color Picker¶

Click the color swatch to open the color picker.

Options:

• Visual color selector
• Hex value input
• Clear to remove custom color

Color Inheritance:

Nodes can inherit colors from their parent. When a node has no custom color set:

1. Uses own color if set
2. Falls back to parent's color
3. Falls back to type default color

See Also¶

• Node Types
• Keyboard Shortcuts
• Linking Nodes
• AI Notes