@diagrammo/dgmo 0.8.22 → 0.8.25

package/docs/guide/chart-area.md

@@ -8,12 +8,12 @@ x-label Year
 era 1710 -> 1716 Rise (green)
 era 1716 -> 1720 Decline (red)
 
-1710: 3
-1712: 5
-1714: 9
-1716: 14
-1718: 8
-1720: 4
+1710 3
+1712 5
+1714 9
+1716 14
+1718 8
+1720 4
 ```
 
 ## Syntax
@@ -24,7 +24,7 @@ series Series Name
 x-label X Axis Label
 y-label Y Axis Label
 
-Label: value
+Label value
 ```
 
 ## Era Bands
@@ -38,12 +38,12 @@ x-label Year
 era 1710 -> 1714 Early Growth (blue)
 era 1714 -> 1720 Decline (red)
 
-1710: 3
-1712: 5
-1714: 9
-1716: 14
-1718: 8
-1720: 4
+1710 3
+1712 5
+1714 9
+1716 14
+1718 8
+1720 4
 ```
 
 Era syntax: `era <start> -> <end> Label (color)`
@@ -64,10 +64,10 @@ Era syntax: `era <start> -> <end> Label (color)`
 
 ## Data Format
 
-Each data line follows the pattern `Label: value`:
+Each data line follows the pattern `Label value`:
 
 ```
-1710: 3
-1712: 5
-1714: 9
+1710 3
+1712 5
+1714 9
 ```

package/docs/guide/chart-bar-stacked.md

@@ -4,10 +4,10 @@
 bar-stacked Cargo by Voyage
 series Rum, Spices, Silk, Gold
 
-Voyage 1 40, 20, 10, 30
-Voyage 2 25, 35, 20, 20
-Voyage 3 15, 10, 45, 30
-Voyage 4 30, 25, 15, 30
+Voyage 1 40 20 10 30
+Voyage 2 25 35 20 20
+Voyage 3 15 10 45 30
+Voyage 4 30 25 15 30
 ```
 
 ## Syntax
@@ -16,7 +16,7 @@ Voyage 4 30, 25, 15, 30
 bar-stacked Chart Title
 series Series1, Series2, Series3
 
-Label value1, value2, value3
+Label value1 value2 value3
 ```
 
 ## Metadata Keys
@@ -30,11 +30,11 @@ Label value1, value2, value3
 
 ## Data Format
 
-Each data line provides comma-separated values matching the series order:
+Each data line provides space-separated values matching the series order:
 
 ```
-Voyage 1 40, 20, 10, 30
-Voyage 2 25, 35, 20, 20
+Voyage 1 40 20 10 30
+Voyage 2 25 35 20 20
 ```
 
 ## Series Colors
@@ -54,8 +54,8 @@ bar-stacked Port Revenue by Trade
 orientation-horizontal
 series Imports(blue), Exports(green), Tariffs(orange)
 
-Port Royal 300, 450, 80
-Tortuga 150, 200, 30
-Nassau 400, 350, 120
-Havana 500, 600, 150
+Port Royal 300 450 80
+Tortuga 150 200 30
+Nassau 400 350 120
+Havana 500 600 150
 ```

package/docs/guide/chart-cycle.md

@@ -0,0 +1,156 @@
+# Cycle Diagram
+
+```dgmo
+cycle OODA Loop
+
+Observe | color: blue
+  Gather raw information from the environment
+  Monitor unfolding circumstances
+  -Unfold circumstances-> | color: blue
+
+Orient | color: green
+  Analyze and synthesize observations
+  Form a mental model of the situation
+  -Form hypothesis-> | color: green
+
+Decide | color: orange
+  Select a course of action
+  -Commit to action-> | color: orange
+
+Act | color: red
+  Execute the chosen course of action
+  Generate results that feed back
+  -Generate feedback-> | color: red
+```
+
+## Overview
+
+Cycle diagrams show a circular process flow where nodes are arranged on a circle and directed edges connect each to the next, with the last wrapping back to the first. They are ideal for OODA loops, PDCA cycles, product lifecycles, continuous improvement processes, and any workflow that repeats.
+
+## Syntax
+
+```
+cycle Title
+
+NodeLabel
+NodeLabel | color: blue, span: 2
+```
+
+The first line declares the chart type and title. Each top-level line declares a node. Nodes are positioned around a circle in declaration order.
+
+## Nodes
+
+Every non-indented, non-directive line is a node:
+
+```
+cycle Seasons
+
+Spring | color: green
+Summer | color: yellow
+Autumn | color: orange
+Winter | color: blue
+```
+
+### Node Pipe Metadata
+
+| Key | Type | Default | Description |
+|-----|------|---------|-------------|
+| `color` | palette name | auto | Node fill color |
+| `span` | positive number | `1` | Relative arc distance to next node |
+| `description` | string | — | One-liner shown below the label |
+
+### Descriptions
+
+Indented lines under a node add description text. Markdown inline formatting is supported (`**bold**`, `*italic*`, `` `code` ``, `[links](url)`). Bullet points with `- item` render as `• item`.
+
+```
+Observe | color: blue
+  Gather raw information from the environment
+  Monitor unfolding circumstances
+```
+
+If both `| description: text` and indented lines exist, they concatenate (pipe first, then indented).
+
+## Edges
+
+Edges are **implicit** — every node connects to the next, with the last wrapping to the first. The `->` syntax annotates edges with labels, descriptions, and styling:
+
+```
+Observe | color: blue
+  -Unfold circumstances-> | color: blue
+    Synthesize raw data into context
+
+Orient | color: green
+  -> | width: 4
+```
+
+Edge lines are indented under their source node. A label goes between `-` and `->`. Pipe metadata supports `color` and `width`.
+
+### Edge Descriptions
+
+Indented lines under an edge line add description text:
+
+```
+Observe
+  -Analyze->
+    Break down observations into components
+    Identify **key patterns**
+```
+
+## Span
+
+The `span` metadata controls relative arc distance between nodes. A node with `span: 2` gets twice the arc space to the next node:
+
+```
+cycle Weighted Process
+
+Important Step | span: 2
+Quick Step
+Another Step | span: 1.5
+```
+
+## Directives
+
+| Directive | Effect |
+|-----------|--------|
+| `direction-counterclockwise` | Reverse cycle direction (default: clockwise) |
+| `hide-descriptions` | Hide description text on all nodes and edges |
+| `circle-nodes` | Render nodes as circles instead of rounded rectangles |
+
+```
+cycle Simple Loop
+
+direction-counterclockwise
+
+Plan
+Do
+Check
+Act
+```
+
+## Complete Example
+
+```dgmo
+cycle PDCA Continuous Improvement
+
+Plan | color: blue, span: 1.5
+  Define objectives and processes
+  Establish expected outcomes
+  -Start implementation->
+
+Do | color: green
+  Execute the plan on a small scale
+  Collect data for analysis
+  -Gather results->
+
+Check | color: orange
+  Compare results against expectations
+  Identify deviations and root causes
+  -Propose changes-> | color: orange
+
+Act | color: red
+  Standardize successful changes
+  Address remaining gaps
+  -Feed back into planning-> | color: red
+    Begin the next improvement cycle
+```

package/docs/guide/chart-doughnut.md

@@ -3,11 +3,11 @@
 ```dgmo
 doughnut Plunder Distribution
 
-Captain's Share: 40
-Quartermaster: 20
-Crew Split: 25
-Ship Repairs: 10
-Provisions: 5
+Captain's Share 40
+Quartermaster 20
+Crew Split 25
+Ship Repairs 10
+Provisions 5
 ```
 
 ## Syntax
@@ -15,7 +15,7 @@ Provisions: 5
 ```
 doughnut Chart Title
 
-Label: value
+Label value
 ```
 
 ## Metadata Keys
@@ -27,12 +27,12 @@ Label: value
 
 ## Data Format
 
-Each data line follows the pattern `Label: value`:
+Each data line follows the pattern `Label value`:
 
 ```
-Captain's Share: 40
-Quartermaster: 20
-Crew Split: 25
+Captain's Share 40
+Quartermaster 20
+Crew Split 25
 ```
 
 Segments are automatically colored using the Nord palette.

package/docs/guide/chart-funnel.md

@@ -3,11 +3,11 @@
 ```dgmo
 funnel Pirate Recruitment Pipeline
 
-Port Visitors: 1000
-Tavern Recruits: 500
-Crew Trials: 200
-Sworn Pirates: 100
-Veteran Buccaneers: 50
+Port Visitors 1000
+Tavern Recruits 500
+Crew Trials 200
+Sworn Pirates 100
+Veteran Buccaneers 50
 ```
 
 ## Syntax
@@ -15,7 +15,7 @@ Veteran Buccaneers: 50
 ```
 funnel Chart Title
 
-Label: value
+Label value
 ```
 
 ## Metadata Keys
@@ -30,9 +30,9 @@ Label: value
 Each data line defines a stage with its value. Stages are displayed top-to-bottom with widths proportional to their values:
 
 ```
-Visitors: 1000
-Signups: 500
-Purchases: 100
+Visitors 1000
+Signups 500
+Purchases 100
 ```
 
 List stages from largest to smallest for a classic funnel shape.

package/docs/guide/chart-heatmap.md

@@ -4,12 +4,12 @@
 heatmap Pirate Activity by Sea Region
 columns Jan, Feb, Mar, Apr, May, Jun
 
-Caribbean: 5, 4, 5, 3, 4, 5
-Atlantic: 2, 3, 2, 4, 3, 2
-Mediterranean: 3, 2, 1, 2, 3, 4
-Indian Ocean: 4, 5, 4, 5, 4, 3
-South China Sea: 1, 2, 3, 2, 1, 2
-West Africa: 3, 3, 4, 3, 5, 4
+Caribbean 5 4 5 3 4 5
+Atlantic 2 3 2 4 3 2
+Mediterranean 3 2 1 2 3 4
+Indian Ocean 4 5 4 5 4 3
+South China Sea 1 2 3 2 1 2
+West Africa 3 3 4 3 5 4
 ```
 
 ## Syntax
@@ -18,7 +18,7 @@ West Africa: 3, 3, 4, 3, 5, 4
 heatmap Chart Title
 columns Col1, Col2, Col3
 
-Row Label: value1, value2, value3
+Row Label value1 value2 value3
 ```
 
 ## Metadata Keys
@@ -31,11 +31,11 @@ Row Label: value1, value2, value3
 
 ## Data Format
 
-Each data line defines a row with comma-separated values matching the column count:
+Each data line defines a row with space-separated values matching the column count:
 
 ```
-Caribbean: 5, 4, 5, 3, 4, 5
-Atlantic: 2, 3, 2, 4, 3, 2
+Caribbean 5 4 5 3 4 5
+Atlantic 2 3 2 4 3 2
 ```
 
 The row label becomes the Y axis label. Cell colors are scaled automatically based on value range.

package/docs/guide/chart-journey-map.md

@@ -0,0 +1,179 @@
+# Journey Map
+
+```dgmo
+journey-map Coffee Shop Visit
+
+[Order]
+  Walk in | 4
+  Wait in line | 2
+  Order drink | 4
+
+[Wait]
+  Find a seat | 3
+  Wait for drink | 2
+
+[Enjoy]
+  Get drink | 5
+```
+
+## Overview
+
+Journey maps visualize a user's experience across a process or service, plotting emotional highs and lows as a continuous curve. Each step has a score (1–5, high is good) that drives the emotion landscape. Phases group related steps, annotations capture pain points, opportunities, and thoughts, and tags add cross-cutting dimensions like channel or touchpoint.
+
+Journey maps are ideal for UX research, customer experience mapping, service design, and identifying friction points.
+
+## Syntax
+
+```
+journey-map Title
+
+persona Name
+
+[Phase Name]
+  Step Name | score
+  Step Name | score Emotion
+```
+
+The first line must be `journey-map` followed by a title. Phases use bracket syntax at indent 0. Steps are indented within phases.
+
+## Persona
+
+Declares the journey's protagonist:
+
+```
+persona Tech-Savvy Shopper
+  28yo developer, price-sensitive, does extensive research
+```
+
+Name is everything after `persona `. Indented lines add description text. Only one persona per diagram.
+
+## Phases
+
+Phases group steps into logical stages:
+
+```
+[Research]
+  Compare specs | 4
+  Watch reviews | 5
+
+[Purchase]
+  Add to cart | 3
+  Complete payment | 3
+```
+
+Phases are optional — steps can appear at root level for a flat continuous flow.
+
+## Steps
+
+Steps appear indented within phases (or at indent 0 in flat mode).
+
+### Score Syntax
+
+The score goes in the pipe, separating step name from data:
+
+```
+Step Name | 4                        // bare score
+Step Name | 4 Delighted              // score + emotion label
+Step Name | 4, ch: Web               // score + tag metadata
+Step Name | 4 Delighted, ch: Web     // score + label + metadata
+Step Name | score: 4, ch: Web        // explicit score key
+Step Name                            // no pipe = scoreless step
+```
+
+- **Score scale**: 1–5 integer (high = good)
+- **Emotion label**: optional single word after the score (e.g., `Frustrated`, `Delighted`, `Neutral`)
+- **Scoreless steps**: render as cards but produce no emotion curve point
+
+## Annotations
+
+Deeper-indented lines under a step add context:
+
+```
+  Forced account creation | 1 Frustrated
+    pain: Wants guest checkout
+    opportunity: Add guest checkout option
+    thought: Why do I need an account?
+    description: User abandoned cart twice
+```
+
+| Prefix | Rendering |
+|--------|-----------|
+| `pain:` | Pain point (red accent) |
+| `opportunity:` | Improvement opportunity (green accent) |
+| `thought:` | User thought (italic) |
+| `description:` | General context text |
+
+Multiple annotations per step are allowed.
+
+## Tag Groups
+
+Tags add color-coded dimensions like channel or touchpoint:
+
+```
+tag Channel ch
+  Web(blue)
+  Mobile(purple)
+  In-Person(green)
+
+[Research]
+  Compare specs | 4, ch: Web
+  Ask friends | 4, ch: In-Person
+```
+
+Reference tag values in step pipes via the alias.
+
+## Flat Mode
+
+Steps at root level (no `[Phase]` brackets) render as a continuous horizontal strip:
+
+```dgmo
+journey-map Quick Feedback
+
+Opened app | 4
+Searched for feature | 3
+Hit error | 1 Frustrated
+  pain: No helpful error message
+Contacted support | 2
+Got resolution | 5 Relieved
+```
+
+## Directives
+
+| Directive | Effect |
+|-----------|--------|
+| `no-legend` | Hide the score legend |
+| `active-tag GroupName` | Set the active tag group for coloring |
+
+## Complete Example
+
+```dgmo
+journey-map Buying a Laptop
+
+persona Tech-Savvy Shopper
+  28yo developer, price-sensitive, does extensive research
+
+tag Channel ch
+  Web(blue)
+  Mobile(purple)
+  Email(teal)
+  In-Person(green)
+
+[Research]
+  Compare specs | 4, ch: Web
+    description: Checked 12 laptops across 4 review sites
+  Watch reviews | 5 Engaged, ch: Mobile
+  Ask friends | 4, ch: In-Person
+
+[Purchase]
+  Add to cart | 3, ch: Web
+  Forced account creation | 1 Frustrated, ch: Web
+    pain: Wants guest checkout
+    pain: Password requirements too strict
+  Complete payment | 3, ch: Web
+
+[Delivery]
+  Track package | 4, ch: Mobile
+  Unboxing | 5 Delighted, ch: In-Person
+    opportunity: Include setup guide
+    thought: Excited to try it out
+```

package/docs/guide/chart-kanban.md

@@ -59,6 +59,8 @@ Card Title | key: Value, key: Value
 
 Columns are defined with `[Column Name]` syntax. All cards between one column header and the next belong to that column.
 
+Kanban columns model a workflow pipeline. Cards move left to right as work progresses. Each column should answer "what stage is this work in?" If something isn't a stage — like acceptance criteria, decision gates, or definitions of done — model it as a tag on cards rather than a separate column.
+
 ```
 [To Do]
 [In Progress]

package/docs/guide/chart-line.md

@@ -9,13 +9,13 @@ y-label Speed
 era Day 1 -> Day 3 Rough Seas (red)
 era Day 3 -> Day 7 Fair Winds (blue)
 
-Day 1: 8
-Day 2: 10
-Day 3: 7
-Day 4: 12
-Day 5: 9
-Day 6: 11
-Day 7: 6
+Day 1 8
+Day 2 10
+Day 3 7
+Day 4 12
+Day 5 9
+Day 6 11
+Day 7 6
 ```
 
 ## Syntax
@@ -26,7 +26,7 @@ series Series Name
 x-label X Axis Label
 y-label Y Axis Label
 
-Label: value
+Label value
 ```
 
 ## Era Bands
@@ -41,13 +41,13 @@ era '77 -> '81 Carter (blue)
 era '81 -> '89 Reagan (red)
 era '89 -> '93 Bush (red)
 
-'77: 7
-'78: 67
-'79: 91
-'80: 108
-'81: 230
-'82: 294
-'83: 379
+'77 7
+'78 67
+'79 91
+'80 108
+'81 230
+'82 294
+'83 379
 ```
 
 Era syntax: `era <start> -> <end> Label (color)`
@@ -70,10 +70,10 @@ Era syntax: `era <start> -> <end> Label (color)`
 
 ## Data Format
 
-Each data line follows the pattern `Label: value`:
+Each data line follows the pattern `Label value`:
 
 ```
-Day 1: 8
-Day 2: 10
-Day 3: 7
+Day 1 8
+Day 2 10
+Day 3 7
 ```

package/docs/guide/chart-multi-line.md

@@ -9,12 +9,12 @@ x-label Month
 era Jan -> Mar Atlantic Season
 era Mar -> Jun Caribbean Season (teal)
 
-Jan: 3, 5, 2
-Feb: 4, 3, 4
-Mar: 2, 7, 3
-Apr: 6, 4, 1
-May: 5, 6, 5
-Jun: 3, 8, 2
+Jan 3 5 2
+Feb 4 3 4
+Mar 2 7 3
+Apr 6 4 1
+May 5 6 5
+Jun 3 8 2
 ```
 
 ## Syntax
@@ -24,7 +24,7 @@ line Chart Title
 series Series1(color), Series2(color), Series3(color)
 x-label X Axis Label
 
-Label: value1, value2, value3
+Label value1 value2 value3
 ```
 
 ## Metadata Keys
@@ -39,11 +39,11 @@ Label: value1, value2, value3
 
 ## Data Format
 
-Each data line provides comma-separated values matching the series order:
+Each data line provides space-separated values matching the series order:
 
 ```
-Jan: 3, 5, 2
-Feb: 4, 3, 4
+Jan 3 5 2
+Feb 4 3 4
 ```
 
 The number of values per line must match the number of series names.
@@ -60,12 +60,12 @@ x-label Month
 era Jan -> Mar Q1 (green)
 era Apr -> Jun Q2 (orange)
 
-Jan: 3, 5
-Feb: 4, 3
-Mar: 2, 7
-Apr: 6, 4
-May: 5, 6
-Jun: 3, 8
+Jan 3 5
+Feb 4 3
+Mar 2 7
+Apr 6 4
+May 5 6
+Jun 3 8
 ```
 
 Era syntax: `era <start> -> <end> Label (color)`