@spectratools/graphic-designer-cli 0.3.2 → 0.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -76,6 +76,19 @@ design qa --in ./output/design-v2-*.png --spec ./output/design-v2-*.spec.json
76
76
  design publish --in ./output/design-v2-*.png --target gist
77
77
  ```
78
78
 
79
+ ### Compare Rendered Output to Target
80
+
81
+ ```bash
82
+ design compare \
83
+ --target ./designs/reference.png \
84
+ --rendered ./output/design-v2-g0.4.0-sabc123.png \
85
+ --grid 3 \
86
+ --threshold 0.8 \
87
+ --format json
88
+ ```
89
+
90
+ Returns overall similarity, per-region (A1..Cn) similarity scores, and verdict (`match`, `close`, `mismatch`).
91
+
79
92
  ## Carbon-Style Rendering
80
93
 
81
94
  Code and terminal screenshots use design parameters inspired by [Carbon](https://carbon.now.sh) (MIT):
@@ -114,6 +127,17 @@ Plus a **freestyle draw layer** with 8 draw command types: `rect`, `circle`, `te
114
127
  - **stack** — vertical or horizontal stack
115
128
  - **manual** — explicit x/y coordinates
116
129
 
130
+ ### Connection Routing Modes
131
+
132
+ Per-connection `routing` supports:
133
+
134
+ - `auto` — backward compatible behavior (`ELK` route when available, otherwise orthogonal)
135
+ - `orthogonal` — forced right-angle path
136
+ - `curve` — outward-bowing cubic bezier
137
+ - `arc` — outward elliptical arc (kappa-bezier approximation)
138
+
139
+ `layout.diagramCenter` can optionally override the center point used by `curve` and `arc` routing. When omitted, center is derived from the laid-out element centroid (fallback: canvas center).
140
+
117
141
  ## Programmatic Usage
118
142
 
119
143
  ```ts
@@ -131,9 +155,9 @@ const spec = parseDesignSpec({
131
155
  elements: [
132
156
  { type: 'flow-node', id: 'a', label: 'Start', shape: 'rounded-box', color: '#7c3aed' },
133
157
  { type: 'flow-node', id: 'b', label: 'End', shape: 'rounded-box', color: '#059669' },
134
- { type: 'connection', from: 'a', to: 'b', label: 'next' },
158
+ { type: 'connection', from: 'a', to: 'b', label: 'next', routing: 'arc' },
135
159
  ],
136
- layout: { mode: 'auto', algorithm: 'layered' },
160
+ layout: { mode: 'auto', algorithm: 'layered', diagramCenter: { x: 600, y: 340 } },
137
161
  });
138
162
 
139
163
  const render = await renderDesign(spec, { generatorVersion: '0.3.0' });
@@ -165,6 +189,12 @@ design-v2-g<version>-s<specHash>.spec.json # normalized validated spec
165
189
 
166
190
  Custom theme overrides are supported via the `themeOverrides` field in DesignSpec.
167
191
 
192
+ ## Agent Workflow
193
+
194
+ For AI agents using this tool in a self-correcting loop,
195
+ see [AGENT_WORKFLOW.md](./AGENT_WORKFLOW.md) for the recommended
196
+ render → compare → QA → iterate workflow.
197
+
168
198
  ## Credits
169
199
 
170
200
  - Code screenshot styling inspired by [Carbon](https://carbon.now.sh) (MIT)