@likec4/diagram 1.42.0 → 1.43.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.
Files changed (44) hide show
  1. package/bundle/index.js +3768 -3370
  2. package/dist/LikeC4Diagram.d.ts +1 -1
  3. package/dist/LikeC4Diagram.js +40 -14
  4. package/dist/LikeC4Diagram.props.d.ts +12 -17
  5. package/dist/LikeC4View.d.ts +23 -4
  6. package/dist/LikeC4View.js +6 -6
  7. package/dist/ReactLikeC4.d.ts +1 -1
  8. package/dist/ReactLikeC4.js +3 -5
  9. package/dist/StaticLikeC4Diagram.js +1 -1
  10. package/dist/base/const.d.ts +1 -1
  11. package/dist/base/const.js +1 -1
  12. package/dist/components/Logo.js +42 -0
  13. package/dist/components/RootContainer.js +10 -7
  14. package/dist/context/RootContainerContext.d.ts +11 -0
  15. package/dist/context/RootContainerContext.js +14 -1
  16. package/dist/hooks/useReducedGraphics.d.ts +1 -1
  17. package/dist/index.d.ts +0 -1
  18. package/dist/likec4diagram/DiagramXYFlow.js +2 -4
  19. package/dist/likec4diagram/state/DiagramActorProvider.js +3 -4
  20. package/dist/likec4diagram/ui/notation/NotationPanel.js +5 -8
  21. package/dist/navigationpanel/NavigationPanelControls.js +2 -2
  22. package/dist/navigationpanel/NavigationPanelDropdown.js +30 -6
  23. package/dist/navigationpanel/controls/BurgerButton.js +46 -8
  24. package/dist/navigationpanel/styles.css.js +1 -1
  25. package/dist/node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.1.1/node_modules/@tabler/icons-react/dist/esm/icons/IconDirectionSignFilled.js +14 -0
  26. package/dist/overlays/element-details/ElementDetailsCard.js +11 -83
  27. package/dist/overlays/element-details/MetadataValue.d.ts +9 -0
  28. package/dist/overlays/element-details/MetadataValue.js +261 -0
  29. package/dist/overlays/relationship-details/actor.js +6 -2
  30. package/dist/overlays/relationships-browser/const.d.ts +3 -3
  31. package/dist/overlays/relationships-browser/const.js +3 -3
  32. package/dist/shadowroot/ShadowRoot.js +53 -12
  33. package/dist/shadowroot/styles.css.d.ts +0 -4
  34. package/dist/shadowroot/styles.css.js +1 -41
  35. package/dist/styles.css2.js +1 -1
  36. package/package.json +20 -20
  37. package/panda.buildinfo.json +42 -22
  38. package/styles-min.css +1 -1
  39. package/styles.css +1 -1
  40. package/dist/context/ControlsCustomLayout.d.ts +0 -12
  41. package/dist/context/ControlsCustomLayout.js +0 -8
  42. package/dist/context/ReduceGraphics.d.ts +0 -12
  43. package/dist/context/ReduceGraphics.js +0 -26
  44. package/dist/node_modules/.pnpm/@tabler_icons-react@3.35.0_react@19.1.1/node_modules/@tabler/icons-react/dist/esm/icons/IconMenu2.js +0 -14
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@likec4/diagram",
3
- "version": "1.42.0",
3
+ "version": "1.43.0",
4
4
  "license": "MIT",
5
5
  "bugs": "https://github.com/likec4/likec4/issues",
6
6
  "homepage": "https://likec4.dev",
@@ -65,29 +65,29 @@
65
65
  "@dagrejs/dagre": "1.1.5",
66
66
  "@floating-ui/dom": "^1.7.4",
67
67
  "@lume/kiwi": "^0.4.4",
68
- "@mantine/core": "8.3.1",
69
- "@mantine/hooks": "8.3.1",
68
+ "@mantine/core": "8.3.5",
69
+ "@mantine/hooks": "8.3.5",
70
70
  "@nanostores/react": "1.0.0",
71
71
  "@react-hookz/web": "^25.1.1",
72
- "@xstate/react": "^5.0.5",
73
- "@xyflow/react": "12.8.4",
74
- "@xyflow/system": "0.0.68",
72
+ "@xstate/react": "^6.0.0",
73
+ "@xyflow/react": "12.9.0",
74
+ "@xyflow/system": "0.0.71",
75
75
  "bezier-js": "^6.1.4",
76
76
  "d3-shape": "^3.2.0",
77
- "fast-equals": "^5.2.2",
77
+ "fast-equals": "^5.3.2",
78
78
  "khroma": "2.1.0",
79
- "motion": "^12.23.22",
79
+ "motion": "^12.23.24",
80
80
  "nanostores": "1.0.1",
81
81
  "react-error-boundary": "^6.0.0",
82
82
  "react-shadow": "^20.6.0",
83
- "remeda": "^2.31.1",
83
+ "remeda": "^2.32.0",
84
84
  "type-fest": "^4.41.0",
85
- "xstate": "^5.20.2",
86
- "@likec4/styles": "1.42.0",
87
- "@likec4/core": "1.42.0"
85
+ "xstate": "^5.23.0",
86
+ "@likec4/core": "1.43.0",
87
+ "@likec4/styles": "1.43.0"
88
88
  },
89
89
  "peerDependencies": {
90
- "@pandacss/dev": "^1.4.1",
90
+ "@pandacss/dev": "^1.4.3",
91
91
  "@types/react": "^18.x || ^19.x",
92
92
  "@types/react-dom": "^18.x || ^19.x",
93
93
  "react": "^18.x || ^19.x",
@@ -105,26 +105,26 @@
105
105
  }
106
106
  },
107
107
  "devDependencies": {
108
- "@pandacss/dev": "^1.4.1",
108
+ "@pandacss/dev": "^1.4.3",
109
109
  "@statelyai/inspect": "^0.4.0",
110
110
  "@tabler/icons-react": "3.35.0",
111
111
  "@types/bezier-js": "^4.1.3",
112
112
  "@types/d3-shape": "^3.1.7",
113
- "@types/node": "~20.19.11",
113
+ "@types/node": "~20.19.22",
114
114
  "@types/react": "19.1.16",
115
115
  "@types/react-dom": "19.1.9",
116
116
  "@vitejs/plugin-react": "^5.0.4",
117
- "oxlint": "1.18.0",
117
+ "oxlint": "1.24.0",
118
118
  "postcss": "8.5.6",
119
119
  "react": "19.1.1",
120
120
  "react-dom": "19.1.1",
121
- "typescript": "5.9.2",
122
- "vite": "^7.1.7",
121
+ "typescript": "5.9.3",
122
+ "vite": "^7.1.11",
123
123
  "vite-plugin-dts": "^4.5.4",
124
124
  "vitest": "3.2.4",
125
125
  "wireit": "0.14.12",
126
- "zx": "8.8.4",
127
- "@likec4/tsconfig": "1.42.0",
126
+ "zx": "8.8.5",
127
+ "@likec4/tsconfig": "1.43.0",
128
128
  "@likec4/devops": "1.42.0"
129
129
  },
130
130
  "scripts": {
package/panda.buildinfo.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
- "schemaVersion": "1.4.1",
2
+ "schemaVersion": "1.4.3",
3
3
  "styles": {
4
4
  "atomic": [
5
5
  "background]___[value:dots",
@@ -116,11 +116,11 @@
116
116
  "maxWidth]___[value:200px",
117
117
  "display]___[value:none",
118
118
  "display]___[value:block]___[cond:@/md",
119
- "gap]___[value:[3px]",
119
+ "gap]___[value:1",
120
120
  "flexShrink]___[value:1",
121
121
  "flexGrow]___[value:1",
122
122
  "overflow]___[value:hidden",
123
- "gap]___[value:[1px]",
123
+ "gap]___[value:0.5",
124
124
  "flexGrow]___[value:0",
125
125
  "display]___[value:none]___[cond:_empty",
126
126
  "layerStyle]___[value:likec4.dropdown",
@@ -168,9 +168,10 @@
168
168
  "color]___[value:mantine.colors.gray[5]",
169
169
  "color]___[value:mantine.colors.dark[3]]___[cond:_dark",
170
170
  "color]___[value:mantine.colors.text/90",
171
- "color]___[value:mantine.colors.text]___[cond:_hover",
171
+ "color]___[value:[var(--mantine-color-bright)]]___[cond:_hover",
172
172
  "truncate]___[value:true",
173
173
  "color]___[value:mantine.colors.dimmed",
174
+ "color]___[value:mantine.colors.text]___[cond:_hover",
174
175
  "backgroundColor]___[value:[rgb(34 34 34 / var(--_opacity, 95%))]",
175
176
  "backgroundColor]___[value:[rgb(250 250 250 / var(--_opacity, 95%))]]___[cond:_light",
176
177
  "backdropFilter]___[value:auto",
@@ -253,7 +254,6 @@
253
254
  "display]___[value:none]___[cond:_reduceGraphicsOnPan<___>_before",
254
255
  "cursor]___[value:pointer]___[cond::where(.react-flow__node.selectable:not(.dragging)) &",
255
256
  "alignItems]___[value:flex-end",
256
- "gap]___[value:1",
257
257
  "justifyItems]___[value:stretch",
258
258
  "bottom]___[value:0",
259
259
  "padding]___[value:1",
@@ -270,7 +270,6 @@
270
270
  "fontSize]___[value:lg",
271
271
  "borderRadius]___[value:[4px]",
272
272
  "paddingInline]___[value:1.5",
273
- "gap]___[value:0.5",
274
273
  "alignItems]___[value:baseline",
275
274
  "flexWrap]___[value:wrap",
276
275
  "translate]___[value:auto",
@@ -312,6 +311,10 @@
312
311
  "color]___[value:var(--likec4-palette-hiContrast)]___[cond:_light",
313
312
  "color]___[value:var(--likec4-palette-loContrast)]___[cond:_dark",
314
313
  "whiteSpaceCollapse]___[value:preserve-breaks",
314
+ "padding]___[value:0.5",
315
+ "width]___[value:[20px]",
316
+ "width]___[value:[64px]]___[cond:@/md",
317
+ "display]___[value:none]___[cond:@/md",
315
318
  "color]___[value:likec4.panel.action-icon.text",
316
319
  "color]___[value:likec4.panel.action-icon.text.hover]___[cond:_hover",
317
320
  "backgroundColor]___[value:likec4.panel.action-icon.bg",
@@ -322,6 +325,7 @@
322
325
  "boxShadow]___[value:xl",
323
326
  "display]___[value:flex]___[cond:@/xs",
324
327
  "paddingBlock]___[value:1",
328
+ "gap]___[value:[1px]",
325
329
  "marginTop]___[value:1",
326
330
  "fontSize]___[value:xs",
327
331
  "marginBottom]___[value:xxs",
@@ -511,18 +515,37 @@
511
515
  "stroke]___[value:1.6",
512
516
  "paddingTop]___[value:xs",
513
517
  "gap]___[value:6",
514
- "gap]___[value:[4px 4px]",
515
- "paddingRight]___[value:xxs",
516
- "transitionProperty]___[value:all",
517
- "transitionDuration]___[value:fast",
518
- "transitionTimingFunction]___[value:inOut",
519
- "color]___[value:mantine.colors.gray[8]",
520
- "transitionTimingFunction]___[value:out]___[cond:_groupHover",
521
- "color]___[value:mantine.colors.defaultColor]___[cond:_groupHover",
522
- "background]___[value:mantine.colors.defaultHover]___[cond:_groupHover",
523
- "overscrollBehavior]___[value:none",
524
- "whiteSpace]___[value:pre",
525
- "fontFamily]___[value:mono",
518
+ "gridAutoRows]___[value:min-content",
519
+ "gap]___[value:[12px 16px]",
520
+ "width]___[value:300",
521
+ "whiteSpace]___[value:pre-wrap",
522
+ "textOverflow]___[value:unset",
523
+ "textOverflow]___[value:ellipsis",
524
+ "wordBreak]___[value:break-word",
525
+ "wordBreak]___[value:normal",
526
+ "padding]___[value:xs",
527
+ "minWidth]___[value:0",
528
+ "minHeight]___[value:32px",
529
+ "padding]___[value:[4px 8px]",
530
+ "backgroundColor]___[value:mantine.colors.white",
531
+ "borderColor]___[value:mantine.colors.gray[3]",
532
+ "maxWidth]___[value:min(200px, 100%)",
533
+ "minWidth]___[value:60px",
534
+ "flex]___[value:0 1 auto",
535
+ "backgroundColor]___[value:mantine.colors.dark[9]]___[cond:_dark",
536
+ "color]___[value:mantine.colors.text]___[cond:_dark",
537
+ "justifyContent]___[value:flex-end",
538
+ "transition]___[value:all 150ms ease",
539
+ "color]___[value:mantine.colors.primary[6]]___[cond:_hover",
540
+ "backgroundColor]___[value:mantine.colors.dark[7]]___[cond:_hover<___>_dark",
541
+ "color]___[value:mantine.colors.primary[4]]___[cond:_hover<___>_dark",
542
+ "color]___[value:mantine.colors.gray[6]",
543
+ "padding]___[value:[1px 4px]",
544
+ "borderRadius]___[value:xs",
545
+ "color]___[value:mantine.colors.dark[2]]___[cond:_dark",
546
+ "fontWeight]___[value:700",
547
+ "justifySelf]___[value:stretch",
548
+ "alignSelf]___[value:start",
526
549
  "marginBottom]___[value:sm]___[cond:&[data-level='1']",
527
550
  "marginBottom]___[value:0",
528
551
  "transition]___[value:fast]___[cond:& > *",
@@ -614,7 +637,6 @@
614
637
  "justifyItems]___[value:start",
615
638
  "maxHeight]___[value:70vh",
616
639
  "maxHeight]___[value:calc(100cqh - 70px)]___[cond:xs",
617
- "padding]___[value:xs",
618
640
  "color]___[value:dark",
619
641
  "backgroundColor]___[value:mantine.colors.gray[0]]___[cond:_hover",
620
642
  "backgroundColor]___[value:mantine.colors.defaultHover]___[cond:_hover<___>_dark",
@@ -752,7 +774,6 @@
752
774
  "letterSpacing]___[value:.75px",
753
775
  "color]___[value:[var(--_color)/75]",
754
776
  "backgroundColor]___[value:var(--likec4-palette-fill)",
755
- "borderRadius]___[value:xs",
756
777
  "width]___[value:5px",
757
778
  "width]___[value:7px]___[cond:_whenHovered",
758
779
  "width]___[value:7px]___[cond:_whenSelected",
@@ -810,8 +831,7 @@
810
831
  "paddingTop]___[value:4",
811
832
  "gap]___[value:6px",
812
833
  "paddingInline]___[value:4px",
813
- "maxWidth]___[value:220px",
814
- "textOverflow]___[value:ellipsis"
834
+ "maxWidth]___[value:220px"
815
835
  ],
816
836
  "recipes": {
817
837
  "overlay": [