@diagrammo/dgmo 0.8.4 → 0.8.5
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/.claude/commands/dgmo.md +267 -0
- package/dist/cli.cjs +188 -185
- package/dist/editor.cjs +2 -0
- package/dist/editor.cjs.map +1 -1
- package/dist/editor.js +2 -0
- package/dist/editor.js.map +1 -1
- package/dist/highlight.cjs +560 -0
- package/dist/highlight.cjs.map +1 -0
- package/dist/highlight.d.cts +32 -0
- package/dist/highlight.d.ts +32 -0
- package/dist/highlight.js +530 -0
- package/dist/highlight.js.map +1 -0
- package/dist/index.cjs +117 -9
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +22 -1
- package/dist/index.d.ts +22 -1
- package/dist/index.js +116 -9
- package/dist/index.js.map +1 -1
- package/docs/language-reference.md +17 -9
- package/gallery/fixtures/slope.dgmo +7 -6
- package/package.json +26 -6
- package/src/cli.ts +43 -1
- package/src/d3.ts +161 -19
- package/src/editor/highlight-api.ts +444 -0
- package/src/editor/keywords.ts +2 -0
- package/src/index.ts +96 -31
package/.claude/commands/dgmo.md
CHANGED
|
@@ -379,6 +379,273 @@ API
|
|
|
379
379
|
latency-ms 45
|
|
380
380
|
```
|
|
381
381
|
|
|
382
|
+
### slope
|
|
383
|
+
|
|
384
|
+
```
|
|
385
|
+
slope Fleet Strength
|
|
386
|
+
|
|
387
|
+
period 1715 1725
|
|
388
|
+
|
|
389
|
+
Blackbeard 40 4
|
|
390
|
+
Roberts 12 52
|
|
391
|
+
Anne Bonny (red) 8 15
|
|
392
|
+
```
|
|
393
|
+
|
|
394
|
+
- `period` directive required before data rows (one-line or indented block for multi-token labels)
|
|
395
|
+
- Data rows: `Label value1 value2` — space-separated, no colons
|
|
396
|
+
- Right-scan: parser takes numeric values from the right, everything left is the label
|
|
397
|
+
- Color annotations: `Label (color) value1 value2`
|
|
398
|
+
|
|
399
|
+
### timeline
|
|
400
|
+
|
|
401
|
+
```
|
|
402
|
+
timeline Product Roadmap
|
|
403
|
+
sort tag:Team
|
|
404
|
+
|
|
405
|
+
tag Team alias t
|
|
406
|
+
Engineering(blue)
|
|
407
|
+
Design(purple)
|
|
408
|
+
|
|
409
|
+
era 2024-01 -> 2024-06 Phase 1
|
|
410
|
+
marker 2024-03 Beta Launch
|
|
411
|
+
|
|
412
|
+
2024-01->2024-03 Core API | t: Engineering
|
|
413
|
+
2024-02->2024-05 UX Research | t: Design
|
|
414
|
+
2024-06 GA Release | t: Engineering
|
|
415
|
+
```
|
|
416
|
+
|
|
417
|
+
- Dates: `YYYY`, `YYYY-MM`, `YYYY-MM-DD`. Ranges: `start->end`. Durations: `start->6m`, `->2w`, `->30d`
|
|
418
|
+
- Uncertain end: `2024-03?`. Point events: single date, no range
|
|
419
|
+
- `era start -> end Label` — background band. `marker date Label` — vertical line
|
|
420
|
+
- `## Group(color)` headers for manual grouping, or `tag` + `sort tag:Name` for swimlanes
|
|
421
|
+
- Pipe metadata: `| tagalias: Value`
|
|
422
|
+
|
|
423
|
+
### gantt
|
|
424
|
+
|
|
425
|
+
```
|
|
426
|
+
gantt Sprint Plan
|
|
427
|
+
start 2024-01-15
|
|
428
|
+
today-marker 2024-03-01
|
|
429
|
+
critical-path
|
|
430
|
+
dependencies
|
|
431
|
+
|
|
432
|
+
10bd Design | 80%
|
|
433
|
+
parallel
|
|
434
|
+
[Backend]
|
|
435
|
+
15bd API Layer
|
|
436
|
+
5bd? Auth Module
|
|
437
|
+
-> Frontend.Integration | offset: -3bd
|
|
438
|
+
[Frontend]
|
|
439
|
+
10bd Components
|
|
440
|
+
5bd Integration
|
|
441
|
+
5bd QA Testing
|
|
442
|
+
0d Release
|
|
443
|
+
```
|
|
444
|
+
|
|
445
|
+
- `start YYYY-MM-DD` — project start date (required)
|
|
446
|
+
- Duration: `10bd Task Name` (business days). Uncertain: `5bd?`. Milestone: `0d`
|
|
447
|
+
- `parallel` block for concurrent tracks. `[Group]` for named sections
|
|
448
|
+
- Progress: `| 80%` or trailing `80%`
|
|
449
|
+
- Dependencies: `-> Target.Task` or `-blocks-> Target.Task`. `offset: -3bd` for overlap
|
|
450
|
+
- `today-marker`, `critical-path`, `dependencies` — top-level directives
|
|
451
|
+
- Tags + eras + markers same as timeline
|
|
452
|
+
|
|
453
|
+
### c4
|
|
454
|
+
|
|
455
|
+
```
|
|
456
|
+
c4 Banking System
|
|
457
|
+
|
|
458
|
+
Customer is a person
|
|
459
|
+
description: A customer of the bank
|
|
460
|
+
|
|
461
|
+
Banking is a system
|
|
462
|
+
description: Online banking portal
|
|
463
|
+
containers
|
|
464
|
+
WebApp is a container | tech: React
|
|
465
|
+
API is a container | tech: Node.js
|
|
466
|
+
DB is a container is a database | tech: PostgreSQL
|
|
467
|
+
|
|
468
|
+
Email is a system
|
|
469
|
+
description: External email service
|
|
470
|
+
|
|
471
|
+
Customer -Uses-> Banking
|
|
472
|
+
Banking -Sends emails [SMTP]-> Email
|
|
473
|
+
```
|
|
474
|
+
|
|
475
|
+
- Elements: `Name is a person|system|container|component`
|
|
476
|
+
- Metadata (pipe-delimited): `| description: text, tech: stack`
|
|
477
|
+
- Indented `description:` also works (no pipe needed)
|
|
478
|
+
- Sections: `containers` (inside system), `components` (inside container), `deployment`
|
|
479
|
+
- Deployment: `NodeName is a cloud|database|cache|queue`
|
|
480
|
+
- Arrows: sync `-label [tech]->`, async `~label [tech]~>`, bidirectional `<->`, `<~>`
|
|
481
|
+
|
|
482
|
+
### class
|
|
483
|
+
|
|
484
|
+
```
|
|
485
|
+
class Type Hierarchy
|
|
486
|
+
|
|
487
|
+
Drawable [interface]
|
|
488
|
+
+ draw(): void
|
|
489
|
+
|
|
490
|
+
Shape implements Drawable [abstract]
|
|
491
|
+
# x: number
|
|
492
|
+
+ area(): number
|
|
493
|
+
count: number {static}
|
|
494
|
+
|
|
495
|
+
Circle extends Shape
|
|
496
|
+
- radius: number
|
|
497
|
+
|
|
498
|
+
Color [enum]
|
|
499
|
+
Red
|
|
500
|
+
Green
|
|
501
|
+
Blue
|
|
502
|
+
|
|
503
|
+
Canvas
|
|
504
|
+
*-- Shape : contains
|
|
505
|
+
..> Logger : uses
|
|
506
|
+
```
|
|
507
|
+
|
|
508
|
+
- Modifiers: `[abstract]`, `[interface]`, `[enum]`
|
|
509
|
+
- Inheritance: `Child extends Parent`, `Child implements Interface`
|
|
510
|
+
- Visibility: `+` public, `#` protected, `-` private. Static: `{static}`
|
|
511
|
+
- Relationships: `A *-- B` (composition), `A o-- B` (aggregation), `A --|> B` (inheritance), `A ..|> B` (implementation), `A ..> B` (dependency), `A -> B` (association)
|
|
512
|
+
- Optional label: `A *-- B : description`
|
|
513
|
+
|
|
514
|
+
### initiative-status
|
|
515
|
+
|
|
516
|
+
```
|
|
517
|
+
initiative-status Q2 Roadmap
|
|
518
|
+
|
|
519
|
+
[Identity]
|
|
520
|
+
Auth Service | done
|
|
521
|
+
SSO Integration | doing
|
|
522
|
+
-> Auth Service | done
|
|
523
|
+
MFA Rollout | blocked
|
|
524
|
+
-> SSO Integration | doing
|
|
525
|
+
|
|
526
|
+
[Payments]
|
|
527
|
+
Payment Gateway | doing
|
|
528
|
+
Billing UI | todo
|
|
529
|
+
-> Payment Gateway | doing
|
|
530
|
+
|
|
531
|
+
Auth Service -> Payment Gateway: validates | done
|
|
532
|
+
```
|
|
533
|
+
|
|
534
|
+
- Status values: `done`, `doing`, `todo`, `blocked`, `na`
|
|
535
|
+
- Dependencies: `-> Target | status` (indented) or `Source -> Target: label | status`
|
|
536
|
+
- Groups: `[Group Name]` with indented items
|
|
537
|
+
- Tags supported for phase/team coloring
|
|
538
|
+
|
|
539
|
+
### venn
|
|
540
|
+
|
|
541
|
+
```
|
|
542
|
+
venn Full-Stack Skills
|
|
543
|
+
|
|
544
|
+
Frontend(blue) alias fe
|
|
545
|
+
Backend(green) alias be
|
|
546
|
+
DevOps(orange) alias de
|
|
547
|
+
|
|
548
|
+
fe + be Web Systems
|
|
549
|
+
be + de Platform Ops
|
|
550
|
+
fe + be + de Full Stack
|
|
551
|
+
```
|
|
552
|
+
|
|
553
|
+
- Sets: `Name(color) alias id` — declares a circle
|
|
554
|
+
- Overlaps: `id + id Label` — names the intersection region
|
|
555
|
+
- Option: `values on` to show sizes. Sized form: `id(color): 120 "Label"`
|
|
556
|
+
|
|
557
|
+
### quadrant
|
|
558
|
+
|
|
559
|
+
```
|
|
560
|
+
quadrant Feature Priorities
|
|
561
|
+
|
|
562
|
+
x-label Low Effort, High Effort
|
|
563
|
+
y-label Low Impact, High Impact
|
|
564
|
+
|
|
565
|
+
top-left Quick Wins(green)
|
|
566
|
+
top-right Major Projects
|
|
567
|
+
bottom-left Fill-ins
|
|
568
|
+
bottom-right Avoid(red)
|
|
569
|
+
|
|
570
|
+
Dark Mode (blue) 0.25, 0.85
|
|
571
|
+
API v2 0.8, 0.9
|
|
572
|
+
Fix Typos 0.1, 0.15
|
|
573
|
+
```
|
|
574
|
+
|
|
575
|
+
- Axis labels: `x-label Low, High` and `y-label Low, High`
|
|
576
|
+
- Quadrant labels: `top-left`, `top-right`, `bottom-left`, `bottom-right`
|
|
577
|
+
- Data: `Label (color) x, y` where x,y are 0–1
|
|
578
|
+
|
|
579
|
+
### sankey / chord
|
|
580
|
+
|
|
581
|
+
```
|
|
582
|
+
// sankey — flow diagram
|
|
583
|
+
sankey Budget Allocation
|
|
584
|
+
|
|
585
|
+
Revenue (green)
|
|
586
|
+
Costs: 600
|
|
587
|
+
Profit (blue): 400
|
|
588
|
+
|
|
589
|
+
// arrow syntax also works
|
|
590
|
+
Revenue -> Marketing: 200
|
|
591
|
+
|
|
592
|
+
// chord — same syntax, circular layout
|
|
593
|
+
chord Team Collaboration
|
|
594
|
+
Engineering -> Design 85
|
|
595
|
+
Design -> Product 68
|
|
596
|
+
```
|
|
597
|
+
|
|
598
|
+
- Indented syntax: parent → child with `Target: weight`
|
|
599
|
+
- Arrow syntax: `Source -> Target: weight` (sankey) or `Source -> Target weight` (chord)
|
|
600
|
+
- Node colors: `Name (color)`. Link colors: `Target: 600 (red)`
|
|
601
|
+
|
|
602
|
+
### state
|
|
603
|
+
|
|
604
|
+
```
|
|
605
|
+
state Order Lifecycle
|
|
606
|
+
direction LR
|
|
607
|
+
|
|
608
|
+
[*] -> Pending -submit-> Validating
|
|
609
|
+
|
|
610
|
+
Validating
|
|
611
|
+
-approved-> Processing
|
|
612
|
+
-rejected-> Cancelled(red)
|
|
613
|
+
|
|
614
|
+
## Fulfillment(blue)
|
|
615
|
+
Processing -ship-> Shipped
|
|
616
|
+
Shipped -delivered-> Done
|
|
617
|
+
|
|
618
|
+
Cancelled -> [*]
|
|
619
|
+
Done -> [*]
|
|
620
|
+
```
|
|
621
|
+
|
|
622
|
+
- `[*]` — start/end pseudostate (filled circle)
|
|
623
|
+
- Transitions: `A -> B`, `A -label-> B`, `A -(color)-> B`
|
|
624
|
+
- Chains: `A -> B -> C` on one line
|
|
625
|
+
- Indented transitions use parent as source
|
|
626
|
+
- Groups: `## GroupName(color)` with indented states
|
|
627
|
+
- Options: `direction LR` (left-right) or `TB` (top-bottom, default)
|
|
628
|
+
|
|
629
|
+
### scatter
|
|
630
|
+
|
|
631
|
+
```
|
|
632
|
+
scatter Funding vs Revenue
|
|
633
|
+
x-label Funding ($M)
|
|
634
|
+
y-label Revenue ($M)
|
|
635
|
+
|
|
636
|
+
[SaaS](blue)
|
|
637
|
+
Acme 12, 8.5
|
|
638
|
+
DataSync 5.2, 3.1
|
|
639
|
+
|
|
640
|
+
[Fintech](green)
|
|
641
|
+
PayFlow 45, 32
|
|
642
|
+
LendTech 18, 12.5
|
|
643
|
+
```
|
|
644
|
+
|
|
645
|
+
- Data: `Label x, y` or `Label x, y, size` (bubble chart)
|
|
646
|
+
- Groups: `[Category](color)` headers
|
|
647
|
+
- Options: `labels on`, `xlabel`, `ylabel`, `sizelabel`
|
|
648
|
+
|
|
382
649
|
## Anti-Patterns
|
|
383
650
|
|
|
384
651
|
```
|