{"kind":"AgentDefinition","metadata":{"namespace":"community","name":"draw-io","version":"0.1.0"},"spec":{"agents_md":"---\ndescription: \"Use when creating, editing, or reviewing draw.io diagrams and mxGraph XML in .drawio, .drawio.svg, or .drawio.png files.\"\napplyTo: \"**/*.drawio,**/*.drawio.svg,**/*.drawio.png\"\n---\n\n# draw.io Diagram Standards\n\n\u003e **Skill**: Load `.github/skills/draw-io/SKILL.md` for full workflow, XML recipes, and troubleshooting before generating or editing any `.drawio` file.\n\n---\n\n## Required Workflow\n\nFollow these steps for every draw.io task:\n\n1. **Identify** the diagram type (flowchart / architecture / sequence / ER / UML / network / BPMN)\n2. **Select** the matching template from `.github/skills/draw-io/templates/` and adapt it, or start from the minimal skeleton\n3. **Plan** the layout on paper before writing XML — define tiers, actors, or entities first\n4. **Generate** valid mxGraph XML following the rules below\n5. **Validate** using `python .github/skills/draw-io/scripts/validate-drawio.py \u003cfile\u003e`\n6. **Confirm** the file renders by opening it in VS Code with the draw.io extension (`hediet.vscode-drawio`)\n\n---\n\n## XML Structure Rules (Non-Negotiable)\n\n```xml\n\u003c!-- Set modified to the current ISO 8601 timestamp when generating a new file --\u003e\n\u003cmxfile host=\"Electron\" modified=\"\" version=\"26.0.0\"\u003e\n  \u003cdiagram id=\"unique-id\" name=\"Page Name\"\u003e\n    \u003cmxGraphModel ...\u003e\n      \u003croot\u003e\n        \u003cmxCell id=\"0\" /\u003e                          \u003c!-- REQUIRED: always first --\u003e\n        \u003cmxCell id=\"1\" parent=\"0\" /\u003e               \u003c!-- REQUIRED: always second --\u003e\n        \u003c!-- all other cells go here --\u003e\n      \u003c/root\u003e\n    \u003c/mxGraphModel\u003e\n  \u003c/diagram\u003e\n\u003c/mxfile\u003e\n```\n\n- `id=\"0\"` and `id=\"1\"` **must** be present and must be the first two cells — no exceptions\n- Every cell `id` must be **unique** within the diagram\n- Every vertex (`vertex=\"1\"`) must have a child `\u003cmxGeometry x y width height as=\"geometry\"\u003e`\n- Every edge (`edge=\"1\"`) must have `source`/`target` pointing to existing vertex ids — **exception**: floating edges (sequence diagram lifelines) use `\u003cmxPoint as=\"sourcePoint\"\u003e` and `\u003cmxPoint as=\"targetPoint\"\u003e` inside `\u003cmxGeometry\u003e` instead of `source`/`target` attributes\n- Every cell except id=0 must have `parent` pointing to an existing id\n- Children of a container (swimlane) use **coordinates relative to their parent**, not the canvas\n\n---\n\n## Mandatory Style Conventions\n\n### Semantic Color Palette — Use consistently across the project\n\n| Role | fillColor | strokeColor |\n|---|---|---|\n| Primary / Info (default) | `#dae8fc` | `#6c8ebf` |\n| Success / Start / Positive | `#d5e8d4` | `#82b366` |\n| Warning / Decision | `#fff2cc` | `#d6b656` |\n| Error / End / Danger | `#f8cecc` | `#b85450` |\n| Neutral / Interface | `#f5f5f5` | `#666666` |\n| External / Partner | `#e1d5e7` | `#9673a6` |\n\n### Always include on vertex shapes\n\n```\nwhiteSpace=wrap;html=1;\n```\n\n### Use `html=1` whenever a label contains HTML tags (`\u003cb\u003e`, `\u003ci\u003e`, `\u003cbr\u003e`)\n\n### Standard connectors\n\n```\nedgeStyle=orthogonalEdgeStyle;html=1;\n```\n\n---\n\n## Diagram-Type Quick Reference\n\n| Type | Container | Key shapes | Connector style |\n|---|---|---|---|\n| Flowchart | None | `ellipse` (start/end), `rounded=1` (process), `rhombus` (decision) | `orthogonalEdgeStyle` |\n| Architecture | `swimlane` per tier | `rounded=1` services, cloud/DB shapes | `orthogonalEdgeStyle` with labels |\n| Sequence | None | `mxgraph.uml.actor`, dashed lifeline edges | `endArrow=block` (sync), `endArrow=open;dashed=1` (return) |\n| ER Diagram | `shape=table;childLayout=tableLayout` | `shape=tableRow`, `shape=partialRectangle` | `entityRelationEdgeStyle;endArrow=ERmany;startArrow=ERone` |\n| UML Class | `swimlane` per class | text rows for attributes/methods | `endArrow=block;endFill=0` (inherit), `dashed=1` (realize) |\n\n---\n\n## Layout Best Practices\n\n- Align all coordinates to the **10 px grid** (values divisible by 10)\n- **Horizontal**: 40–60 px gap between same-row shapes\n- **Vertical**: 80–120 px gap between tier rows\n- Standard shape size: `120 × 60` px (process), `200 × 100` px (decision diamond)\n- Default canvas: A4 landscape `1169 × 827` px\n- Maximum **40 cells per page** — split into multiple pages for larger diagrams\n- Add a **title text cell** at top of every page:\n  ```\n  style=\"text;strokeColor=none;fillColor=none;fontSize=18;fontStyle=1;align=center;\"\n  ```\n\n---\n\n## File and Naming Conventions\n\n- Extension: `.drawio` for version-controlled diagrams, `.drawio.svg` for files embedded in Markdown\n- Naming: `kebab-case` — e.g. `order-flow.drawio`, `database-schema.drawio`\n- Location: `docs/` or `architecture/` alongside the code they document\n- Multi-page: use one `\u003cdiagram\u003e` element per logical view within the same `\u003cmxfile\u003e`\n\n---\n\n## Validation Checklist (run before every commit)\n\n- [ ] `\u003cmxCell id=\"0\" /\u003e` and `\u003cmxCell id=\"1\" parent=\"0\" /\u003e` are the first two cells\n- [ ] All cell ids are unique within their diagram\n- [ ] All edge `source`/`target` ids resolve to existing vertices\n- [ ] All vertex cells have `\u003cmxGeometry as=\"geometry\"\u003e`\n- [ ] All cells (except id=0) have a valid `parent`\n- [ ] XML is well-formed — no unclosed tags, no bare `\u0026`, `\u003c`, `\u003e` in attribute values\n- [ ] Semantic color palette used consistently\n- [ ] Title cell present on every page\n\n```bash\n# Run automated validation\npython .github/skills/draw-io/scripts/validate-drawio.py \u003cfile.drawio\u003e\n```\n\n---\n\n## Reference Files\n\n| File | Use For |\n|---|---|\n| `.github/skills/draw-io/SKILL.md` | Full agent workflow, recipes, troubleshooting |\n| `.github/skills/draw-io/references/drawio-xml-schema.md` | Complete mxCell attribute reference |\n| `.github/skills/draw-io/references/style-reference.md` | All style keys, shape names, edge types |\n| `.github/skills/draw-io/references/shape-libraries.md` | Shape library catalog with style strings |\n| `.github/skills/draw-io/templates/` | Ready-to-use `.drawio` templates per diagram type |\n| `.github/skills/draw-io/scripts/validate-drawio.py` | XML structure validator |\n| `.github/skills/draw-io/scripts/add-shape.py` | CLI: add a shape to an existing diagram |\n","description":"Use when creating, editing, or reviewing draw.io diagrams and mxGraph XML in .drawio, .drawio.svg, or .drawio.png files.","import":{"commit_sha":"541b7819d8c3545c6df122491af4fa1eae415779","imported_at":"2026-05-18T20:05:35Z","license_text":"MIT License\n\nCopyright GitHub, Inc.\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in all\ncopies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE\nSOFTWARE.","owner":"github","repo":"github/awesome-copilot","source_url":"https://github.com/github/awesome-copilot/blob/541b7819d8c3545c6df122491af4fa1eae415779/instructions/draw-io.instructions.md"},"manifest":{}},"content_hash":[203,179,188,150,13,133,129,208,215,45,41,131,223,229,71,53,175,52,171,222,250,237,89,40,148,141,198,119,82,34,47,7],"trust_level":"unsigned","yanked":false}