@diagrammo/dgmo 0.87.0 → 0.89.0

package/dist/{renderer-YIZ7G4HU.js → renderer-TJJGFQGT.js}

@@ -1,8 +1,8 @@
 import {
   renderLiveLinkCard
 } from "./chunk-A6YINTY6.js";
-import "./chunk-D4M25W6R.js";
-import "./chunk-MSXRNVHB.js";
+import "./chunk-DDPGEGHB.js";
+import "./chunk-Q6SQISHT.js";
 import "./chunk-EOYPX6SF.js";
 import "./chunk-WP2RLGDI.js";
 import "./chunk-A2RUBBVT.js";
@@ -13,7 +13,7 @@ import "./chunk-2CW5ZTNH.js";
 import "./chunk-BDXC7MDK.js";
 import "./chunk-ICLB27PZ.js";
 import "./chunk-WQ6G6FFM.js";
-import "./chunk-NF5YKFRH.js";
+import "./chunk-B3S76BZO.js";
 import "./chunk-PIXJL77H.js";
 import "./chunk-3C2FWS2J.js";
 import "./chunk-P3SKSKJI.js";
@@ -35,26 +35,26 @@ import "./chunk-6K7RODXG.js";
 import "./chunk-66YFDTT6.js";
 import "./chunk-GDJW64XE.js";
 import "./chunk-QFHWYWQL.js";
-import "./chunk-GUYVKGFN.js";
+import "./chunk-DPSMX4EY.js";
 import "./chunk-GSYZZFI5.js";
 import "./chunk-GUTZCRBT.js";
-import "./chunk-BAZT6CIF.js";
-import "./chunk-KAO7JL4I.js";
+import "./chunk-ITSBBQTH.js";
 import "./chunk-RE27AX7O.js";
-import "./chunk-AQIBKTPG.js";
+import "./chunk-K5XT7NHD.js";
 import "./chunk-3RYBTEF5.js";
-import "./chunk-UNNJCSSQ.js";
-import "./chunk-3TYUXC7D.js";
+import "./chunk-JVZ7KFAX.js";
+import "./chunk-2SKMEL7V.js";
 import "./chunk-7WGCQE2E.js";
 import "./chunk-EQW6HOP4.js";
 import "./chunk-DAOFNU6J.js";
-import "./chunk-VPASQOR3.js";
+import "./chunk-NIUO2TNR.js";
+import "./chunk-LFKSHDVI.js";
 import "./chunk-C3Z4DX3V.js";
 import "./chunk-JRUEIRJB.js";
 import "./chunk-7TF3QOOD.js";
 import "./chunk-AYOVY75O.js";
 import "./chunk-NXMESY4J.js";
-import "./chunk-A4XPI4YN.js";
+import "./chunk-MFW6P7WH.js";
 import "./chunk-WPL5PFXE.js";
 import "./chunk-J64NZ6NF.js";
 import "./chunk-O753JUEZ.js";
@@ -68,8 +68,8 @@ import "./chunk-4WW3SGMH.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
 import "./chunk-5NU7NII2.js";
-import "./chunk-IDJGV6VM.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-3CTUWCO7.js → renderer-VGQMJC5K.js}

@@ -3,31 +3,31 @@ import {
   focusEventLine,
   renderEventLine,
   renderEventLineForExport
-} from "./chunk-FBKPSU3A.js";
+} from "./chunk-EXKCRXPO.js";
 import "./chunk-NPWVOFB3.js";
 import "./chunk-R2K5L4UA.js";
 import "./chunk-S7W75MIM.js";
 import "./chunk-Z6DXWULM.js";
-import "./chunk-LPXC4I4R.js";
+import "./chunk-UWKRPQZO.js";
 import "./chunk-YRYKTYMQ.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-RE6TVIAV.js";
-import "./chunk-QFIXL3OK.js";
-import "./chunk-3DOQOXXI.js";
-import "./chunk-LD2JSKU3.js";
+import "./chunk-UKJLPA7R.js";
+import "./chunk-SEKNYIMO.js";
+import "./chunk-CNUN5GO6.js";
+import "./chunk-OOCVGX4W.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
 import "./chunk-GDJW64XE.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-DAOFNU6J.js";
+import "./chunk-NIUO2TNR.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-IDJGV6VM.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-ELYPDPNF.js → renderer-VYWCMRWA.js}

@@ -2,19 +2,20 @@ import {
   bracketExportDimensions,
   renderBracket,
   renderBracketForExport
-} from "./chunk-Q2U5635V.js";
+} from "./chunk-44FTCIRI.js";
 import "./chunk-S7W75MIM.js";
 import "./chunk-Z6DXWULM.js";
-import "./chunk-3DOQOXXI.js";
+import "./chunk-ABP5BUD6.js";
+import "./chunk-CNUN5GO6.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-WH2HWE5Z.js → renderer-WB75JME5.js}

@@ -1,24 +1,24 @@
 import {
   renderSitemap,
   renderSitemapForExport
-} from "./chunk-PUVTFUNH.js";
+} from "./chunk-WRCAH3UO.js";
 import "./chunk-R2K5L4UA.js";
 import "./chunk-S7W75MIM.js";
 import "./chunk-Z6DXWULM.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-3DOQOXXI.js";
-import "./chunk-LD2JSKU3.js";
+import "./chunk-CNUN5GO6.js";
+import "./chunk-OOCVGX4W.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-IYULMRBE.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-BICLPGAH.js → renderer-WQ654YT5.js}

@@ -1,11 +1,11 @@
 import {
   renderVersionControl,
   renderVersionControlForExport
-} from "./chunk-UY6TEJJH.js";
+} from "./chunk-HJRP6PXL.js";
 import "./chunk-XCKNFFKM.js";
 import "./chunk-VLC6WNRD.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-6BUUTWVS.js → renderer-XFEZ5UBE.js}

@@ -1,18 +1,18 @@
 import {
   renderTreemap,
   renderTreemapForExport
-} from "./chunk-UNAP6O26.js";
-import "./chunk-LNO3ASX5.js";
-import "./chunk-3DOQOXXI.js";
+} from "./chunk-QIOYTQDZ.js";
+import "./chunk-HUNDJTTH.js";
+import "./chunk-CNUN5GO6.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-4NZZ5J2F.js → renderer-XHEMXBQM.js}

@@ -1,20 +1,20 @@
 import {
   renderFamily,
   renderFamilyForExport
-} from "./chunk-LJFXC3IP.js";
+} from "./chunk-2GM7N5TV.js";
 import "./chunk-IVKC4GID.js";
 import "./chunk-2CW5ZTNH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-3DOQOXXI.js";
+import "./chunk-CNUN5GO6.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-RENDISO5.js → renderer-YTEZK3GC.js}

@@ -3,27 +3,27 @@ import {
   renderPert,
   renderPertAnalysisBlock,
   renderPertForExport
-} from "./chunk-P5V63L35.js";
-import "./chunk-MGBV4JEI.js";
-import "./chunk-N4XHXBDQ.js";
+} from "./chunk-WP22MHH6.js";
+import "./chunk-EDXGEQW3.js";
+import "./chunk-PMNITNPR.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-3DOQOXXI.js";
-import "./chunk-LD2JSKU3.js";
+import "./chunk-CNUN5GO6.js";
+import "./chunk-OOCVGX4W.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
-import "./chunk-UNNJCSSQ.js";
-import "./chunk-3TYUXC7D.js";
+import "./chunk-JVZ7KFAX.js";
+import "./chunk-2SKMEL7V.js";
 import "./chunk-EQW6HOP4.js";
 import "./chunk-DAOFNU6J.js";
 import "./chunk-NOTA6TEI.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-X5A5VIRD.js → renderer-ZXQXRNDR.js}

@@ -1,8 +1,8 @@
 import {
   renderBoxesAndLines,
   renderBoxesAndLinesForExport
-} from "./chunk-O6MMQQLF.js";
-import "./chunk-HAH5X345.js";
+} from "./chunk-ECMA6XE2.js";
+import "./chunk-KATED53P.js";
 import "./chunk-XBJJP2HN.js";
 import "./chunk-5DH3KYFH.js";
 import "./chunk-NPWVOFB3.js";
@@ -10,16 +10,16 @@ import "./chunk-S7W75MIM.js";
 import "./chunk-Z6DXWULM.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-3DOQOXXI.js";
+import "./chunk-CNUN5GO6.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{renderer-radial-XZ5TKUT4.js → renderer-radial-NA5DVBG4.js}

@@ -1,16 +1,16 @@
 import {
   renderTreemapRadial,
   renderTreemapRadialForExport
-} from "./chunk-NZCSVD4M.js";
-import "./chunk-LNO3ASX5.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+} from "./chunk-Y7PSAHAY.js";
+import "./chunk-HUNDJTTH.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/dist/{state-renderer-5IQ4OJUI.js → state-renderer-4S2C2CHB.js}

@@ -1,10 +1,10 @@
 import {
   renderState,
   renderStateForExport
-} from "./chunk-B7CU2HW5.js";
+} from "./chunk-DZPHN2WN.js";
 import "./chunk-26EVL454.js";
 import "./chunk-ZNNVI5SR.js";
-import "./chunk-HAH5X345.js";
+import "./chunk-KATED53P.js";
 import "./chunk-XBJJP2HN.js";
 import "./chunk-6EK55ART.js";
 import "./chunk-RJNZHFNG.js";
@@ -15,14 +15,12 @@ import "./chunk-Z6DXWULM.js";
 import "./chunk-EPDBWATV.js";
 import "./chunk-24YPR5EH.js";
 import "./chunk-XCKNFFKM.js";
-import "./chunk-3DOQOXXI.js";
-import "./chunk-LD2JSKU3.js";
+import "./chunk-CNUN5GO6.js";
+import "./chunk-OOCVGX4W.js";
 import "./chunk-VLC6WNRD.js";
-import "./chunk-LHL6HDUL.js";
-import "./chunk-FM3WAVB6.js";
+import "./chunk-7SX4IY6T.js";
+import "./chunk-NS7L7YKH.js";
 import "./chunk-ICLB27PZ.js";
-import "./chunk-RH2PROYG.js";
-import "./chunk-KAO7JL4I.js";
 import "./chunk-AYOVY75O.js";
 import "./chunk-NXMESY4J.js";
 import "./chunk-J64NZ6NF.js";
@@ -31,7 +29,9 @@ import "./chunk-N7VMGZCU.js";
 import "./chunk-NOTA6TEI.js";
 import "./chunk-L5AFONQU.js";
 import "./chunk-44GP7PD5.js";
-import "./chunk-7HWY4QAJ.js";
+import "./chunk-I6GGMCTV.js";
+import "./chunk-KAO7JL4I.js";
+import "./chunk-L24LESXF.js";
 import "./chunk-2M4IGSCY.js";
 import "./chunk-BYU54C3S.js";
 import "./chunk-5WRI5ZAA.js";

package/docs/ai-integration.md

@@ -9,10 +9,12 @@ Use AI coding tools to generate `.dgmo` diagrams. This guide covers Claude Code,
 Install the `dgmo` CLI, then run one command:
 
 ```bash
-brew install diagrammo/dgmo/dgmo   # or: npm install -g @diagrammo/dgmo-cli
-dgmo install                       # auto-detects every AI assistant you have
+npm install -g @diagrammo/dgmo-cli   # macOS and Linux
+dgmo install                         # auto-detects every AI assistant you have
 ```
 
+Homebrew and Arch/Omarchy (pacman) installs are listed at [diagrammo.app/dev](https://diagrammo.app/dev#cli).
+
 `dgmo install` with **no target** scans for Claude Code, Codex, Claude Desktop, Cursor, Windsurf, and Copilot, then configures each one non-interactively — no prompts, no second package to install. The only binary you ever need is `dgmo`; it provides the MCP server through its own `dgmo mcp` subcommand.
 
 Target a single assistant, or pick a scope, when you want to:
@@ -110,7 +112,7 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 - **Always title it.** Every diagram gets a short title on the type-declaration line (`flowchart Checkout Flow`, `sequence Checkout`, `boxes-and-lines Service Map`) so it is self-describing — never leave the bare type keyword alone. Infer a fitting title from the request when the user gives none.
   <!-- TITLE end -->
   <!-- CATEGORIZE start -->
-- **Categorize and color — by default, not only when obvious.** Before drawing, find the axis that sorts the items into kinds and color by it: layer (frontend / backend / data), role (client / service / datastore), trust zone (internal / external / third-party), status (done / active / blocked), owner/team, or read-path vs write-path. Almost every diagram has such an axis — actively look for one rather than leaving everything monochrome. Express it with a **tag group**, never ad-hoc per-node colors: declare `tag <Axis> as t` (the name is a single word — `tag TrustZone as tz` — or quote a multi-word name: `tag "Trust Zone" as tz`), indent the category values (a trailing color is optional — bare values auto-pick a palette color), set `active-tag <Axis>`, then assign each item `Node t: <Category>` (see the tag-group syntax in the per-type section below). Only the 11 named palette colors exist, and they re-resolve per palette/theme. Color the grouping so the categories — and the boundaries between them — read at a glance. **Buckets, not name tags — never 1:1.** A tag group must have _fewer_ values than it has members: each color should bucket two or more items so the palette compresses the diagram into a few meaningful kinds (aim for ~2–4 categories, and keep distinct colors well under half the item count). If you find yourself giving nearly every item its own value, you've enumerated, not categorized — merge the singletons up a level until each color groups at least two (a `cache` and a `database` are both `datastore`; a caller and a gateway are both `client`; two microservices are both `service`). One color per item is the same visual noise as random colors — the grouping only earns its place when a color means "these belong together." Leave items uncolored only when they genuinely form a single undifferentiated kind, or the user asked for no color.
+- **Categorize and color — by default, not only when obvious.** Before drawing, find the axis that sorts the items into kinds and color by it: layer (frontend / backend / data), role (client / service / datastore), trust zone (internal / external / third-party), status (done / active / blocked), owner/team, or read-path vs write-path. Almost every diagram has such an axis — actively look for one rather than leaving everything monochrome. Express it with a **tag group**, never ad-hoc per-node colors: declare `tag <Axis> as t` (the name is a single word — `tag TrustZone as tz` — or quote a multi-word name: `tag "Trust Zone" as tz`), indent the category values (a trailing color is optional — bare values auto-pick a palette color), set `active-tag <Axis>` in the header — after the tag group and before the first element, because a type such as c4 refuses it after content — then assign each item `Node t: <Category>` (see the tag-group syntax in the per-type section below). **Bracket, block, body, event-line, family and sketch** take the tag group but no `active-tag` line — declare the group and stop there; on event-line, family and sketch the line would be drawn as an element. **Class, flowchart, wireframe, raci, cycle, pyramid, ring, sankey, tech-radar, venn, version-control, wordcloud, arc, bar, clock, countdown, funnel, function, goal, heatmap, line, pie, polar-area, quadrant, radar, scatter and slope** take no tag group at all — skip this rule for them. Most report the lines; cycle, pyramid, ring, sankey, venn, version-control and wordcloud read them as content, and flowchart and tech-radar drop them without a word. Only the 11 named palette colors exist, and they re-resolve per palette/theme. Color the grouping so the categories — and the boundaries between them — read at a glance. **Buckets, not name tags — never 1:1.** A tag group must have _fewer_ values than it has members: each color should bucket two or more items so the palette compresses the diagram into a few meaningful kinds (aim for ~2–4 categories, and keep distinct colors well under half the item count). If you find yourself giving nearly every item its own value, you've enumerated, not categorized — merge the singletons up a level until each color groups at least two (a `cache` and a `database` are both `datastore`; a caller and a gateway are both `client`; two microservices are both `service`). One color per item is the same visual noise as random colors — the grouping only earns its place when a color means "these belong together." Leave items uncolored only when they genuinely form a single undifferentiated kind, or the user asked for no color.
 <!-- CATEGORIZE end -->
 - **Keep labels short.** A few words per node. Move detail into notes or metadata, never a full sentence inside a label.
 - **Let the defaults show.** Don't add `no-*` opt-outs unless the user asked to hide or disable something — they strip helpful labels, values, and color.

package/docs/language-reference.md

@@ -98,7 +98,7 @@ Valid markup is the floor, not the goal. A good diagram reads at a glance. Apply
 - **Always title it.** Every diagram gets a short title on the type-declaration line (`flowchart Checkout Flow`, `sequence Checkout`, `boxes-and-lines Service Map`) so it is self-describing — never leave the bare type keyword alone. Infer a fitting title from the request when the user gives none.
   <!-- TITLE end -->
   <!-- CATEGORIZE start -->
-- **Categorize and color — by default, not only when obvious.** Before drawing, find the axis that sorts the items into kinds and color by it: layer (frontend / backend / data), role (client / service / datastore), trust zone (internal / external / third-party), status (done / active / blocked), owner/team, or read-path vs write-path. Almost every diagram has such an axis — actively look for one rather than leaving everything monochrome. Express it with a **tag group**, never ad-hoc per-node colors: declare `tag <Axis> as t` (the name is a single word — `tag TrustZone as tz` — or quote a multi-word name: `tag "Trust Zone" as tz`), indent the category values (a trailing color is optional — bare values auto-pick a palette color), set `active-tag <Axis>`, then assign each item `Node t: <Category>` (see the tag-group syntax in the per-type section below). Only the 11 named palette colors exist, and they re-resolve per palette/theme. Color the grouping so the categories — and the boundaries between them — read at a glance. **Buckets, not name tags — never 1:1.** A tag group must have _fewer_ values than it has members: each color should bucket two or more items so the palette compresses the diagram into a few meaningful kinds (aim for ~2–4 categories, and keep distinct colors well under half the item count). If you find yourself giving nearly every item its own value, you've enumerated, not categorized — merge the singletons up a level until each color groups at least two (a `cache` and a `database` are both `datastore`; a caller and a gateway are both `client`; two microservices are both `service`). One color per item is the same visual noise as random colors — the grouping only earns its place when a color means "these belong together." Leave items uncolored only when they genuinely form a single undifferentiated kind, or the user asked for no color.
+- **Categorize and color — by default, not only when obvious.** Before drawing, find the axis that sorts the items into kinds and color by it: layer (frontend / backend / data), role (client / service / datastore), trust zone (internal / external / third-party), status (done / active / blocked), owner/team, or read-path vs write-path. Almost every diagram has such an axis — actively look for one rather than leaving everything monochrome. Express it with a **tag group**, never ad-hoc per-node colors: declare `tag <Axis> as t` (the name is a single word — `tag TrustZone as tz` — or quote a multi-word name: `tag "Trust Zone" as tz`), indent the category values (a trailing color is optional — bare values auto-pick a palette color), set `active-tag <Axis>` in the header — after the tag group and before the first element, because a type such as c4 refuses it after content — then assign each item `Node t: <Category>` (see the tag-group syntax in the per-type section below). **Bracket, block, body, event-line, family and sketch** take the tag group but no `active-tag` line — declare the group and stop there; on event-line, family and sketch the line would be drawn as an element. **Class, flowchart, wireframe, raci, cycle, pyramid, ring, sankey, tech-radar, venn, version-control, wordcloud, arc, bar, clock, countdown, funnel, function, goal, heatmap, line, pie, polar-area, quadrant, radar, scatter and slope** take no tag group at all — skip this rule for them. Most report the lines; cycle, pyramid, ring, sankey, venn, version-control and wordcloud read them as content, and flowchart and tech-radar drop them without a word. Only the 11 named palette colors exist, and they re-resolve per palette/theme. Color the grouping so the categories — and the boundaries between them — read at a glance. **Buckets, not name tags — never 1:1.** A tag group must have _fewer_ values than it has members: each color should bucket two or more items so the palette compresses the diagram into a few meaningful kinds (aim for ~2–4 categories, and keep distinct colors well under half the item count). If you find yourself giving nearly every item its own value, you've enumerated, not categorized — merge the singletons up a level until each color groups at least two (a `cache` and a `database` are both `datastore`; a caller and a gateway are both `client`; two microservices are both `service`). One color per item is the same visual noise as random colors — the grouping only earns its place when a color means "these belong together." Leave items uncolored only when they genuinely form a single undifferentiated kind, or the user asked for no color.
 <!-- CATEGORIZE end -->
 - **Keep labels short.** A few words per node. Move detail into notes or metadata, never a full sentence inside a label.
 - **Let the defaults show.** Don't add `no-*` opt-outs unless the user asked to hide or disable something — they strip helpful labels, values, and color.
@@ -214,7 +214,7 @@ tag GroupName as <alias>
 - Must appear before diagram content
 - Bare shorthand is not an alias (TD-18): `tag Priority p` declares a group _named_ "Priority p" — no alias registers, so `p:` assignments silently miss. The parser warns on this shape (spaced name, no alias, alias-shaped trailing word), suggesting `tag Priority as p` or a quoted name
 
-**Diagram types that support tags**: the tag model is near-universal across the structural types — sequence, infra, org, c4, er, kanban, gantt, sitemap, timeline, boxes-and-lines, state (§5.7), pert, swimlane, mindmap, journey-map, event-line, treemap, map, block, sketch, bracket and family all accept `tag <Group> as <alias>` blocks. Check the per-type Options section for the exact directive set; if a type draws a tag legend, it takes tags. **Flowchart, wireframe and raci take no tags** — a `tag` block or `active-tag` on any of them is ignored with a warning, because what an element looks like is fixed by what it is (a flowchart's shape, a wireframe's state keywords) or by the roles (raci).
+**Diagram types that support tags**: the tag model is near-universal across the structural types — sequence, infra, org, c4, er, kanban, gantt, sitemap, timeline, boxes-and-lines, state (§5.7), pert, swimlane, mindmap, journey-map, event-line, treemap, map, block, sketch, bracket and family all accept `tag <Group> as <alias>` blocks. Check the per-type Options section for the exact directive set; if a type draws a tag legend, it takes tags. **Flowchart, wireframe, raci and class take no tags** — a `tag` block or `active-tag` on any of them is ignored with a warning, because what an element looks like is fixed by what it is (a flowchart's shape, a wireframe's state keywords, a class's trailing colour word) or by the roles (raci).
 
 ### 1.4 Same-Line Metadata
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@diagrammo/dgmo",
-  "version": "0.87.0",
+  "version": "0.89.0",
   "description": "DGMO diagram markup language — parser, renderer, and color system",
   "license": "MIT",
   "author": "Diagrammo LLC",

package/dist/{chunk-CLQIXD2C.js → chunk-7Z2VFRP5.js}

@@ -4,12 +4,12 @@ import {
 import {
   noteCanvasShift
 } from "./chunk-6EK55ART.js";
-import {
-  measureText
-} from "./chunk-KAO7JL4I.js";
 import {
   resolveNotes
 } from "./chunk-O753JUEZ.js";
+import {
+  measureText
+} from "./chunk-KAO7JL4I.js";
 
 // src/class/layout.ts
 import dagre from "@dagrejs/dagre";

package/dist/{chunk-UIUXIDBX.js → chunk-CUYHST3B.js}

@@ -4,10 +4,6 @@ import {
 import {
   HEADER_HEIGHT
 } from "./chunk-XCKNFFKM.js";
-import {
-  measureText,
-  truncateText
-} from "./chunk-KAO7JL4I.js";
 import {
   preprocessDescriptionLine
 } from "./chunk-IYULMRBE.js";
@@ -15,6 +11,10 @@ import {
   injectDefaultTagMetadata,
   resolveTagColor
 } from "./chunk-L5AFONQU.js";
+import {
+  measureText,
+  truncateText
+} from "./chunk-KAO7JL4I.js";
 
 // src/mindmap/text-wrap.ts
 var H_PAD = 16;

package/dist/{chunk-2A4DQAXG.js → chunk-IIOLFAGJ.js}

@@ -4,12 +4,12 @@ import {
 import {
   noteCanvasShift
 } from "./chunk-6EK55ART.js";
-import {
-  measureText
-} from "./chunk-KAO7JL4I.js";
 import {
   resolveNotes
 } from "./chunk-O753JUEZ.js";
+import {
+  measureText
+} from "./chunk-KAO7JL4I.js";
 
 // src/er/layout.ts
 import dagre from "@dagrejs/dagre";