mirror of
https://github.com/github/awesome-copilot.git
synced 2026-04-11 18:55:55 +00:00
3b2c4fb913
* Add draw-io diagram generator skill for awesome github copilot * Add comprehensive shape libraries and style reference documentation for draw.io - Introduced a new markdown file for draw.io shape libraries detailing various built-in shapes, their style keys, and usage. - Added a complete style reference for `<mxCell>` elements, including universal style keys, shape-specific keys, edge styles, and color palettes. - Included examples for common styles and shapes to aid users in creating diagrams effectively. * Add draw-io diagram validation and shape addition scripts * Add new diagram templates for flowchart, sequence, and UML class diagrams - Created a flowchart template with a structured layout including start, steps, decision points, and end. - Added a sequence diagram template illustrating interactions between a client, API server, and database with activation boxes and message arrows. - Introduced a UML class diagram template featuring an interface, classes, attributes, methods, and relationships, including composition and realization. * Add draw-io diagram generator skill to README with detailed usage instructions and bundled assets * Add draw.io instructions with workflow, XML structure rules, style conventions, and validation checklist * Add draw.io diagram standards to README instructions for enhanced diagram creation and editing * Moving diagram templates to assets/ to follow agentskills structure - Moved flowchart template with start, steps, decision points, and end nodes. - Moved sequence diagram template illustrating interactions between a client, API server, and database. - Moved UML class diagram template featuring an interface, classes, attributes, methods, and relationships. * Clarify installation instructions for draw.io VS Code extension in SKILL.md
draw-io Scripts
Utility scripts for working with .drawio diagram files in the cxp-bu-order-ms project.
Requirements
- Python 3.8+
- No external dependencies (uses standard library only:
xml.etree.ElementTree,argparse,json,sys,pathlib)
Scripts
validate-drawio.py
Validates the XML structure of a .drawio file against required constraints.
Usage
python scripts/validate-drawio.py <path-to-diagram.drawio>
Examples
# Validate a single file
python scripts/validate-drawio.py docs/architecture.drawio
# Validate all drawio files in a directory
for f in docs/**/*.drawio; do python scripts/validate-drawio.py "$f"; done
Checks performed
| Check | Description |
|---|---|
| Root cells | Verifies id="0" and id="1" cells are present in every diagram page |
| Unique IDs | All mxCell id values are unique within a diagram |
| Edge connectivity | Every edge has valid source and target attributes pointing to existing cells |
| Geometry | Every vertex cell has an mxGeometry child element |
| Parent chain | Every cell's parent attribute references an existing cell id |
| XML well-formedness | File is valid XML |
Exit codes
0— Validation passed1— One or more validation errors found (errors printed to stdout)
add-shape.py
Adds a new shape (vertex cell) to an existing .drawio diagram file.
Usage
python scripts/add-shape.py <diagram.drawio> <label> <x> <y> [options]
Arguments
| Argument | Required | Description |
|---|---|---|
diagram |
Yes | Path to the .drawio file |
label |
Yes | Text label for the new shape |
x |
Yes | X coordinate (pixels from top-left) |
y |
Yes | Y coordinate (pixels from top-left) |
Options
| Option | Default | Description |
|---|---|---|
--width |
120 |
Shape width in pixels |
--height |
60 |
Shape height in pixels |
--style |
"rounded=1;whiteSpace=wrap;html=1;" |
draw.io style string |
--diagram-index |
0 |
Index of the diagram page (0-based) |
--dry-run |
false | Print the new cell XML without modifying the file |
Examples
# Add a basic rounded box
python scripts/add-shape.py docs/flowchart.drawio "New Step" 400 300
# Add a custom styled shape
python scripts/add-shape.py docs/flowchart.drawio "Decision" 400 400 \
--width 160 --height 80 \
--style "rhombus;whiteSpace=wrap;html=1;fillColor=#fff2cc;strokeColor=#d6b656;"
# Preview without writing
python scripts/add-shape.py docs/architecture.drawio "Service X" 600 200 --dry-run
Output
Prints the new cell id on success:
Added shape id="auto_abc123" to page 0 of docs/flowchart.drawio
Common Workflows
Validate before committing
# Validate all diagrams
find . -name "*.drawio" -not -path "*/node_modules/*" | \
xargs -I{} python scripts/validate-drawio.py {}
Quickly add a placeholder node
python scripts/add-shape.py docs/architecture.drawio "TODO: Service" 800 400 \
--style "rounded=1;whiteSpace=wrap;html=1;fillColor=#f8cecc;strokeColor=#b85450;"
Check a template is valid
python scripts/validate-drawio.py .github/skills/draw-io-diagram-generator/templates/flowchart.drawio