You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
Repository navigation
Commit d333eea
Browse filesBrowse the repository at this point in the historyBrowse files
Copy file name to clipboardExpand all lines: docs/editor/diagrams.md
+55-7Lines changed: 55 additions & 7 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -7,7 +7,7 @@ category: Editor
7
7
8
8
# Diagrams
9
9
10
-
Notely supports three diagram formats: **Mermaid** for text-based diagrams written in code, **Excalidraw** for freehand whiteboard-style drawing, and **Draw.io** for structured technical schemas and system architectures.
10
+
Notely supports four diagram and visual prototyping formats: **Mermaid** for text-based diagrams written in code, **Excalidraw** for freehand whiteboard-style drawing, **Draw.io** for structured technical schemas and system architectures, and **Wireframe Studio** for responsive low- and high-fidelity UI mockup prototyping.
11
11
12
12
## Mermaid Diagrams
13
13
@@ -129,11 +129,59 @@ Drop any existing `.drawio` or `.drawio.xml` file directly into the Markdown Edi
129
129
130
130
---
131
131
132
+
## Wireframe Studio
133
+
134
+
**Wireframe Studio** is Notely's integrated, visual UI prototyping tool powered by GrapesJS. It provides a drag-and-drop studio designed for rapid wireframing of desktop, tablet, and mobile user interfaces directly within your notes.
135
+
136
+
### Insert a Wireframe
137
+
138
+
1. Click the **Insert Diagram** icon (`⚡`) on the Markdown toolbar.
139
+
2. Select **Wireframe**.
140
+
3. A wireframe placeholder markdown tag is inserted:
2.**Structure**: Visual DOM layer tree for inspecting parent-child component hierarchies and reordering elements.
171
+
3.**Annotations**: Add design notes, rationale, and UX specifications tied directly to selected wireframe blocks.
172
+
173
+
### Saving & Storage
174
+
175
+
* Clicking **Save Wireframe** renders a PNG preview to `media/wireframes/<id>.png` and persists the full project structure to `.notes-app/wireframes/<id>.wireframe.json`.
176
+
* Wireframes are fully offline, Git-trackable, and cataloged in the **Diagrams & Media Gallery** (`Ctrl/Cmd + Alt + M`) under the **UI Prototypes** category.
Copy file name to clipboardExpand all lines: docs/feature-reference.md
+3-2Lines changed: 3 additions & 2 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -78,10 +78,11 @@ During transfer:
78
78
### Diagrams & Media Gallery
79
79
80
80
Open via **Workspace -> Diagrams & Media Gallery** (`Ctrl/Cmd + Alt + M`) or Command Palette:
81
-
- Catalogs all used diagrams (inline Mermaid, Draw.io, Excalidraw), images, videos, audio, and PDF documents in the workspace.
82
-
-**Physical Disk Scanner & Orphan Detection**: Scans workspace folders (`media/`, `assets/`, `images/`) to identify files present on disk that have zero note references.
81
+
- Catalogs all used diagrams (inline Mermaid, Draw.io, Excalidraw, Wireframe UI prototypes), images, videos, audio, and PDF documents in the workspace.
82
+
-**Physical Disk Scanner & Orphan Detection**: Scans workspace folders (`media/`, `assets/`, `images/`, `media/wireframes/`, `media/draw.io/`) to identify files present on disk that have zero note references.
83
83
-**Unused Media Filter**: Quickly isolate unreferenced assets with the `⚠️ Unused / Orphans` filter tab.
84
84
-**Audio & Media Preview**: Embedded audio players, video thumbnails, and transcript drawer with key points and action items.
85
+
-**UI Prototypes & Wireframe Studio**: View, inspect references, and launch Wireframe Studio to edit interactive UI mockups directly.
85
86
- Reuses Knowledge Graph layout aesthetics with collapsible category filters, search, and stat indicators.
86
87
- Inspect details for any item with high-res/diagram live previews, file paths, and exact note references with line numbers and snippets.
87
88
- Direct "Open Note" navigation and "Copy Markdown Link" actions.
Copy file name to clipboardExpand all lines: docs/git/index.md
+12Lines changed: 12 additions & 0 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -23,3 +23,15 @@ Using Git directly under the hood ensures:
23
23
-**Portability**: Your note history is stored in standard Git format, meaning you can open the folder in any Git client (like GitHub Desktop or VS Code) to view the history.
24
24
-**Precision**: Fine-grained line-by-line diffs of changes.
25
25
-**Safety**: Rollback individual files or entire folders to a previous point in time.
26
+
27
+
---
28
+
29
+
## Attached Code Repositories
30
+
31
+
Beyond version controlling your markdown workspace notes, Notely allows you to attach external local **Git repositories** to link software architecture directly with documentation:
32
+
-**Zero Copying**: Keeps external source code in place on disk.
33
+
-**AST Parsing**: Automatic code symbol extraction (classes, methods, functions, endpoints, database models) across 8+ languages using Tree-sitter.
34
+
-**Knowledge Graph Integration**: Explorable code entity nodes in the [Knowledge Graph](/ai/knowledge-graph).
35
+
-**Referenced Notes**: Mention attached repositories with `[[RepoName]]` or `@RepoName` in any note.
36
+
37
+
See full guide: [Attached Code Repositories](/workspace/attached-repos).
Copy file name to clipboardExpand all lines: docs/workspace/tasks.md
+15-3Lines changed: 15 additions & 3 deletions
Display the source diff
Display the rich diff
Original file line number
Diff line number
Diff line change
@@ -78,7 +78,19 @@ Notely uses a **4-pass alignment algorithm** to maintain task identity across no
78
78
When editing any note, the top header displays a live task completion progress indicator (e.g. `2/5 tasks`). Clicking this indicator opens the **Task Summary Popover**, listing all open and completed tasks for that note with direct line-jump buttons.
79
79
80
80
### Workspace Task Page
81
+
81
82
Access the full Task Workspace via the left sidebar or Command Palette (`Ctrl + Shift + T`):
82
-
-**Filter by Note**: Focus on tasks from the active note or view tasks across all project notes.
83
-
-**Status Tabs**: Easily switch between `All`, `Open`, `In Progress`, and `Completed`.
84
-
-**Search & Sort**: Filter tasks by title, priority, due date, or assignee.
83
+
-**List & Kanban Board Views**: Toggle between high-density **List View** and visual **Kanban Board** (`Columns` toggle button).
84
+
-**Interactive Drag-and-Drop**: Drag task cards between Kanban columns to instantly transition task status or priority. Changes immediately sync back to source Markdown notes.
85
+
-**Kanban Grouping Modes**:
86
+
-**Group by Status**: *To Do*, *In Progress*, *Completed*.
87
+
-**Group by Priority**: *High Priority* (red), *Medium Priority* (amber), *Low Priority* (blue), and *No Priority*.
88
+
-**Smart Timeframe Filters**: Filter tasks quickly using sidebar presets:
89
+
-**Today**: Tasks due on current date.
90
+
-**Upcoming**: Scheduled future tasks.
91
+
-**Overdue**: Incomplete tasks past their due date.
92
+
-**Completed**: Archived done items.
93
+
-**All Tasks**: Workspace-wide master list.
94
+
-**Filter by Note**: Focus solely on tasks originating from the active note or view tasks across all project notes.
95
+
-**Search & Sort**: Filter tasks by title keywords, tags, priority, due date, or assignee.
96
+
-**Task Inspector Drawer**: Click any task card to edit descriptions, due dates, reminder times, assignees, and discussion comments in the detail side panel.
0 commit comments