feat: Add chevron process diagram to Conceptual DSL#93
Conversation
Co-authored-by: jongalloway <68539+jongalloway@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
Adds support for a new Conceptual DSL diagram type: chevrons (a left-to-right, stage-based process diagram) across the parser → layout engine → SVG renderer pipeline, along with unit and snapshot tests plus README documentation.
Changes:
- Register and parse
diagram: chevronswith asteps:list in the Conceptual DSL parser. - Add a chevrons-specific layout handler that sizes/positions stages and writes chevron-related metadata.
- Render chevron stages as polygons in the SVG node writer and add E2E snapshot coverage + README docs.
Reviewed changes
Copilot reviewed 9 out of 10 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| tests/DiagramForge.Tests/Parsers/ConceptualDslParserTests.cs | Adds parser tests for diagram: chevrons and step validation. |
| tests/DiagramForge.Tests/Layout/DefaultLayoutEngineTests.cs | Adds layout/metadata/order/size tests for chevrons. |
| tests/DiagramForge.E2ETests/Fixtures/conceptual-chevrons.input | Adds a new chevrons snapshot fixture input. |
| tests/DiagramForge.E2ETests/Fixtures/conceptual-chevrons.expected.svg | Adds the expected SVG output baseline for the new fixture. |
| src/DiagramForge/Rendering/SvgNodeWriter.cs | Adds SVG polygon rendering for nodes tagged as chevron segments. |
| src/DiagramForge/Parsers/Conceptual/ConceptualDslParser.Dispatch.cs | Registers chevrons parse handler. |
| src/DiagramForge/Parsers/Conceptual/ConceptualDslParser.Chevron.cs | Implements steps: parsing and min-step validation for chevrons. |
| src/DiagramForge/Layout/DefaultLayoutEngine.Conceptual.cs | Registers chevrons layout handler. |
| src/DiagramForge/Layout/DefaultLayoutEngine.Chevron.cs | Implements stage sizing/positioning and chevron metadata for rendering. |
| README.md | Documents the new Conceptual DSL diagram type chevrons. |
You can also share your feedback on Copilot code review. Take the survey.
|
|
||
| #### chevrons | ||
|
|
||
| Horizontal process diagram using connected chevron (arrow) shapes. Ideal for sequential stage flows such as product discovery, delivery pipelines, or onboarding steps. Each step is rendered as a pointed chevron stage; the first stage has a flat left edge and subsequent stages have a notched left edge that visually connects to the previous arrow point. |
| public void Layout_Chevrons_AdjacentNodesHaveGapBetweenThem() | ||
| { | ||
| var diagram = new Diagram { DiagramType = "chevrons" }; | ||
| diagram.AddNode(new Node("node_0", "Discover")) | ||
| .AddNode(new Node("node_1", "Build")); | ||
|
|
||
| _engine.Layout(diagram, _theme); | ||
|
|
||
| var first = diagram.Nodes["node_0"]; | ||
| var second = diagram.Nodes["node_1"]; | ||
|
|
||
| Assert.True(second.X > first.X + first.Width, | ||
| $"Expected a gap between chevron stages, but node_1.X ({second.X}) was not greater than node_0 right edge ({first.X + first.Width})."); | ||
| } |
| private static void ParseChevronsDiagram(string[] lines, IDiagramSemanticModelBuilder builder) | ||
| { | ||
| int sectionLine = FindSectionLine(lines, "steps"); | ||
| if (sectionLine < 0) | ||
| throw new DiagramParseException("Missing required section 'steps:' in chevrons diagram."); | ||
|
|
||
| var items = ReadListItems(lines, sectionLine + 1); | ||
| if (items.Count == 0) | ||
| throw new DiagramParseException("Section 'steps' contains no items."); | ||
|
|
||
| if (items.Count < 2) | ||
| throw new DiagramParseException( | ||
| $"Chevrons diagram requires at least 2 steps, but {items.Count} was provided."); |
| public void CanParse_ReturnsTrue_ForChevrons() | ||
| { | ||
| const string text = "diagram: chevrons\nsteps:\n - Discover\n - Build\n - Launch"; | ||
|
|
||
| Assert.True(_parser.CanParse(text)); | ||
| } | ||
|
|
||
| [Fact] |
|
@copilot address comments |
Co-authored-by: jongalloway <68539+jongalloway@users.noreply.github.com>
All four review comments addressed in b304b99:
E2E snapshot regenerated (width 573.20 → 555.20 reflecting the removed inter-stage gaps). |
Summary
Implements
diagram: chevronsas a new first-class Conceptual DSL diagram type for slide-style horizontal chevron process diagrams, as specified in issue #[Conceptual: Chevron process diagram support].Syntax
Requires at least 2 steps.
Changes
Parser
ConceptualDslParser.Chevron.cs– parsessteps:list (minimum 2 items), producesnode_0..nwithLeftToRightlayout hints; throwsDiagramParseExceptionfor missing/empty steps or a single stepConceptualDslParser.Dispatch.cs– registerschevronsinParseHandlersandKnownTypesLayout
DefaultLayoutEngine.Chevron.cs– horizontal stage layout; computestipDepth = nodeH × 0.35, assigns per-node metadata (conceptual:chevronSegment,chevronIndex,chevronCount,chevronTipDepth), and setslabel:centerXto visually center text within the rectangular body of each chevron (accounting for the notch on subsequent stages)DefaultLayoutEngine.Conceptual.cs– registerschevronslayout handlerRendering
SvgNodeWriter.cs–AppendChevronNoderenders the first chevron as a pentagon (flat left edge, pointed right) and subsequent chevrons as hexagons (notched left edge matching the previous arrow point, pointed right), using theme-aware fill/stroke and shadow supportTests
CanParse, node count, label values, diagram type, error cases (missing section, empty section, single step, CRLF line endings)conceptual-chevrons.input+conceptual-chevrons.expected.svgbaselineDocs
README.md– added chevrons to the Conceptual DSL chooser table; added#### chevronssection with syntax example and description; updated the rule-of-thumb sentence; removed chevrons from the "Planned conceptual additions" noteSecurity Summary
No security vulnerabilities found or introduced (confirmed by CodeQL scan).