Skip to content

feat: Add radial / hub-and-spoke Conceptual DSL diagram type#94

Merged
jongalloway merged 3 commits intomainfrom
copilot/add-radial-hub-and-spoke-diagram
Mar 14, 2026
Merged

feat: Add radial / hub-and-spoke Conceptual DSL diagram type#94
jongalloway merged 3 commits intomainfrom
copilot/add-radial-hub-and-spoke-diagram

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 14, 2026

Summary

Implements the diagram: radial Conceptual DSL type as specified in the issue. Hub-and-spoke diagrams are common in strategy and architecture presentations — a central concept surrounded by supporting pillars, capabilities, or themes.

Syntax

diagram: radial
center: Platform
items:
  - Security
  - Reliability
  - Developer Experience
  - Observability

Changes

Parser (ConceptualDslParser.Radial.cs)

  • Parses center: as the hub label and items: as the spoke list
  • Validates 3–8 items (error otherwise); requires non-empty center:
  • Creates center node (center) with radial:isCenter = true metadata
  • Creates item nodes (item_0item_N-1) with radial:itemIndex metadata
  • Adds EdgeRouting.Straight spoke edges from center to each item

Layout (DefaultLayoutEngine.Radial.cs)

  • Center node rendered as Shape.Circle, sized to fit its label
  • Item nodes placed evenly on a computed radius starting at 12 o'clock (−π/2)
  • Radius accounts for both item node spacing and minimum gap from center
  • Colors: center node gets palette[0]; items cycle through remaining palette entries
  • Title offset respected when diagram.Title is set

Tests

  • Parser tests (15 new): CanParse, nodes/labels, metadata keys, spoke edge creation, straight routing, item count validation (2/9 → error; 3/5/8 → ok), missing section errors, empty center error, CR/LF line endings
  • Layout tests (6 new): center is Circle shape, items equidistant from hub, hub at geometric center of items, first item at top, all nodes positive size, all positions non-negative
  • E2E snapshot: conceptual-radial.input + conceptual-radial.expected.svg

Docs

  • README.md: gallery thumbnail, chooser table row, #### radial syntax section
  • doc/PackageReadme.md: radial added to supported diagram list

Test results

All 558 tests pass (497 unit + 61 E2E snapshots).

Security

No vulnerabilities found (CodeQL: 0 alerts).

Copilot AI and others added 2 commits March 14, 2026 17:53
Co-authored-by: jongalloway <68539+jongalloway@users.noreply.github.com>
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Adds a new Conceptual DSL diagram type (diagram: radial) to DiagramForge, enabling hub-and-spoke (radial) diagrams end-to-end through parsing, layout, docs, and snapshot coverage.

Changes:

  • Introduces radial parsing (center: + items:) with validation and straight-routed spoke edges.
  • Implements a radial layout that positions items evenly around a circular center node with theme palette coloring.
  • Adds unit tests, E2E fixtures/snapshot, and documentation updates for the new diagram type.

Reviewed changes

Copilot reviewed 10 out of 11 changed files in this pull request and generated 1 comment.

Show a summary per file
File Description
src/DiagramForge/Parsers/Conceptual/ConceptualDslParser.cs Updates supported-diagram-type documentation to include radial.
src/DiagramForge/Parsers/Conceptual/ConceptualDslParser.Dispatch.cs Registers the radial parser handler.
src/DiagramForge/Parsers/Conceptual/ConceptualDslParser.Radial.cs Implements radial DSL parsing (center/items, validation, nodes, straight edges, metadata).
src/DiagramForge/Layout/DefaultLayoutEngine.Conceptual.cs Registers the radial conceptual layout handler.
src/DiagramForge/Layout/DefaultLayoutEngine.Radial.cs Implements radial node sizing/placement and palette-based styling.
tests/DiagramForge.Tests/Parsers/ConceptualDslParserTests.cs Adds parser test coverage for radial parsing, metadata, routing, and validations.
tests/DiagramForge.Tests/Layout/DefaultLayoutEngineTests.cs Adds layout tests for radial geometry and basic invariants.
tests/DiagramForge.E2ETests/Fixtures/conceptual-radial.input Adds an E2E fixture input for the new radial diagram.
tests/DiagramForge.E2ETests/Fixtures/conceptual-radial.expected.svg Adds the expected SVG snapshot output for radial rendering.
doc/PackageReadme.md Updates supported-diagram list to include conceptual funnel + radial.
README.md Adds radial to the gallery and documents syntax/usage in the Conceptual DSL section.

You can also share your feedback on Copilot code review. Take the survey.

Comment on lines +76 to +80
// Cycle through remaining palette entries for items
string itemFill = palette[(i + 1) % palette.Length];
node.FillColor = itemFill;
node.StrokeColor = theme.NodeStrokePalette is { Count: > 0 }
? theme.NodeStrokePalette[(i + 1) % theme.NodeStrokePalette.Count]
@jongalloway
Copy link
Copy Markdown
Owner

@copilot address comments

Co-authored-by: jongalloway <68539+jongalloway@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 14, 2026

@copilot address comments

Fixed in fa1bb13. Items now cycle over palette[1..] when the palette has more than one entry, so they can never wrap back to palette[0] (the center color). The same slicing logic is applied to NodeStrokePalette. For a single-color palette, all nodes share that one color as before.

@jongalloway jongalloway merged commit 29e67a2 into main Mar 14, 2026
5 checks passed
@jongalloway jongalloway deleted the copilot/add-radial-hub-and-spoke-diagram branch March 14, 2026 18:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Conceptual: Radial / hub-and-spoke diagram support

3 participants