@likec4/diagram 1.38.1 → 1.39.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 (86) hide show
  1. package/bundle/{chunk-BZV0K82k.js → chunk-Bg7UjtMS.js} +332 -326
  2. package/bundle/custom.js +59 -59
  3. package/bundle/index.js +244 -170
  4. package/dist/LikeC4Diagram.props.d.ts +15 -8
  5. package/dist/base/BaseXYFlow.js +5 -5
  6. package/dist/base/index.d.ts +1 -2
  7. package/dist/base/primitives/MarkdownBlock.js +2 -1
  8. package/dist/base/primitives/customEdge.d.ts +3 -3
  9. package/dist/base/primitives/element/ElementTitle.js +2 -10
  10. package/dist/base/types.d.ts +62 -5
  11. package/dist/base/types.js +54 -0
  12. package/dist/bundle/LikeC4View.d.ts +2 -2
  13. package/dist/bundle/LikeC4View.props.d.ts +4 -3
  14. package/dist/bundle/ReactLikeC4.d.ts +4 -4
  15. package/dist/custom/customNodes.d.ts +2 -1
  16. package/dist/hooks/useXYFlow.d.ts +28 -29
  17. package/dist/likec4diagram/custom/edges/RelationshipEdge.d.ts +4 -5
  18. package/dist/likec4diagram/custom/nodes/ElementActions.js +1 -1
  19. package/dist/likec4diagram/types.d.ts +2 -1
  20. package/dist/likec4diagram/useViewToNodesEdges.js +1 -1
  21. package/dist/likec4model/LikeC4ModelContext.d.ts +5 -2
  22. package/dist/likec4model/useLikeC4ElementsTree.js +1 -1
  23. package/dist/likec4model/useLikeC4Model.d.ts +7 -20
  24. package/dist/navigationpanel/NavigationPanel.js +3 -1
  25. package/dist/navigationpanel/NavigationPanelDropdown.js +1 -1
  26. package/dist/navigationpanel/walkthrough/ActiveWalkthroughControls.js +6 -4
  27. package/dist/navigationpanel/walkthrough/WalkthroughPanel.d.ts +1 -0
  28. package/dist/navigationpanel/walkthrough/WalkthroughPanel.js +83 -0
  29. package/dist/overlays/element-details/actor.d.ts +556 -557
  30. package/dist/overlays/relationship-details/RelationshipDetails.d.ts +2 -3
  31. package/dist/overlays/relationship-details/actor.d.ts +1 -1
  32. package/dist/overlays/relationship-details/actor.js +7 -7
  33. package/dist/overlays/relationship-details/compute.js +2 -1
  34. package/dist/overlays/relationship-details/custom/edgeTypes.d.ts +2 -3
  35. package/dist/overlays/relationship-details/hooks.d.ts +18 -19
  36. package/dist/overlays/relationship-details/layout.js +2 -1
  37. package/dist/overlays/relationships-browser/RelationshipsBrowser.d.ts +2 -3
  38. package/dist/overlays/relationships-browser/actor.d.ts +12 -12
  39. package/dist/overlays/relationships-browser/actor.js +8 -8
  40. package/dist/overlays/relationships-browser/custom/edgeTypes.d.ts +2 -3
  41. package/dist/overlays/relationships-browser/layout.js +2 -1
  42. package/dist/search/components/ElementsColumn.js +1 -1
  43. package/dist/state/DiagramActorProvider.js +2 -2
  44. package/dist/state/assign.js +6 -6
  45. package/dist/state/diagram-machine.js +14 -14
  46. package/dist/styles-min.css +1 -1
  47. package/dist/styles-xyflow.css +1 -1
  48. package/dist/styles.css +1 -1
  49. package/dist/styles.css2.js +1 -1
  50. package/dist/utils/xyflow.js +2 -2
  51. package/package.json +16 -16
  52. package/panda.buildinfo.json +14 -11
  53. package/src/LikeC4Diagram.props.ts +16 -16
  54. package/src/base/index.ts +1 -2
  55. package/src/base/primitives/MarkdownBlock.tsx +1 -0
  56. package/src/base/primitives/customEdge.ts +5 -5
  57. package/src/base/primitives/element/ElementTitle.tsx +10 -22
  58. package/src/base/types.ts +122 -13
  59. package/src/bundle/LikeC4View.props.ts +4 -3
  60. package/src/bundle/LikeC4View.tsx +6 -6
  61. package/src/bundle/ReactLikeC4.tsx +7 -6
  62. package/src/custom/customNodes.ts +3 -1
  63. package/src/hooks/useSetState.ts +2 -2
  64. package/src/likec4diagram/custom/nodes/ElementActions.tsx +2 -1
  65. package/src/likec4diagram/types.ts +1 -1
  66. package/src/likec4diagram/useViewToNodesEdges.ts +1 -1
  67. package/src/likec4model/LikeC4ModelContext.tsx +5 -2
  68. package/src/likec4model/useLikeC4ElementsTree.ts +3 -3
  69. package/src/likec4model/useLikeC4Model.ts +8 -5
  70. package/src/navigationpanel/NavigationPanel.tsx +2 -0
  71. package/src/navigationpanel/NavigationPanelDropdown.tsx +1 -1
  72. package/src/navigationpanel/walkthrough/ActiveWalkthroughControls.tsx +3 -1
  73. package/src/navigationpanel/walkthrough/WalkthroughPanel.tsx +88 -0
  74. package/src/overlays/relationship-details/compute.ts +3 -12
  75. package/src/overlays/relationship-details/layout.ts +3 -3
  76. package/src/overlays/relationships-browser/actor.ts +2 -1
  77. package/src/overlays/relationships-browser/layout.ts +3 -3
  78. package/src/search/components/ElementsColumn.tsx +3 -3
  79. package/src/utils/xyflow.ts +2 -2
  80. package/dist/base/types.Base.d.ts +0 -54
  81. package/dist/base/types.Base.js +0 -48
  82. package/dist/likec4diagram/custom/edges/NotePopover.d.ts +0 -4
  83. package/src/base/types.Base.ts +0 -104
  84. package/src/likec4diagram/custom/edges/NotePopover.tsx +0 -95
  85. /package/dist/{likec4diagram/custom/edges/NotePopover.css.d.ts → navigationpanel/walkthrough/WalkthroughPanel.css.d.ts} +0 -0
  86. /package/src/{likec4diagram/custom/edges/NotePopover.css.ts → navigationpanel/walkthrough/WalkthroughPanel.css.ts} +0 -0
package/dist/state/diagram-machine.js CHANGED
@@ -4,6 +4,7 @@ import { nodeToRect } from '@xyflow/system';
4
4
  import { hasAtLeast, prop, clamp, first } from 'remeda';
5
5
  import { setup, emit, assign, enqueueActions, sendTo, assertEvent, cancel, stopChild, raise, spawnChild, and, or } from 'xstate';
6
6
  import { MinZoom } from '../base/const.js';
7
+ import { Base } from '../base/types.js';
7
8
  import { AllDisabled } from '../context/DiagramFeatures.js';
8
9
  import { createLayoutConstraints } from '../likec4diagram/useLayoutConstraints.js';
9
10
  import { overlaysActorLogic } from '../overlays/overlaysActor.js';
@@ -14,7 +15,6 @@ import { hotkeyActorLogic } from './hotkeyActor.js';
14
15
  import { DiagramToggledFeaturesPersistence } from './persistence.js';
15
16
  import { syncManualLayoutActorLogic } from './syncManualLayoutActor.js';
16
17
  import { findDiagramNode, typedSystem, focusedBounds } from './utils.js';
17
- import { setData, setDimmed, setHovered } from '../base/types.Base.js';
18
18
 
19
19
  const _diagramMachine = setup({
20
20
  types: {
@@ -255,7 +255,7 @@ const _diagramMachine = setup({
255
255
  return {
256
256
  xynodes: context.xynodes.map((n) => {
257
257
  if (n.id === params.node.id) {
258
- return setHovered(n, true);
258
+ return Base.setHovered(n, true);
259
259
  }
260
260
  return n;
261
261
  })
@@ -265,7 +265,7 @@ const _diagramMachine = setup({
265
265
  return {
266
266
  xynodes: context.xynodes.map((n) => {
267
267
  if (n.id === params.node.id) {
268
- return setHovered(n, false);
268
+ return Base.setHovered(n, false);
269
269
  }
270
270
  return n;
271
271
  })
@@ -277,7 +277,7 @@ const _diagramMachine = setup({
277
277
  enqueue.assign({
278
278
  xyedges: context.xyedges.map((e) => {
279
279
  if (e.id === event.edge.id) {
280
- edge = setHovered(e, true);
280
+ edge = Base.setHovered(e, true);
281
281
  return edge;
282
282
  }
283
283
  return e;
@@ -295,7 +295,7 @@ const _diagramMachine = setup({
295
295
  enqueue.assign({
296
296
  xyedges: context.xyedges.map((e) => {
297
297
  if (e.id === event.edge.id) {
298
- edge = setHovered(e, false);
298
+ edge = Base.setHovered(e, false);
299
299
  return edge;
300
300
  }
301
301
  return e;
@@ -313,13 +313,13 @@ const _diagramMachine = setup({
313
313
  const xynodes = context.xynodes.map((n) => {
314
314
  const node = findDiagramNode(context, n.id);
315
315
  if (node && node.notation === params.notation.title && node.shape === params.notation.shape && node.color === params.notation.color && kinds.includes(node.kind)) {
316
- return setDimmed(n, false);
316
+ return Base.setDimmed(n, false);
317
317
  }
318
- return setDimmed(n, "immediate");
318
+ return Base.setDimmed(n, "immediate");
319
319
  });
320
320
  return {
321
321
  xynodes,
322
- xyedges: context.xyedges.map(setDimmed("immediate"))
322
+ xyedges: context.xyedges.map(Base.setDimmed("immediate"))
323
323
  };
324
324
  }),
325
325
  "tag.highlight": assign(({ context, event }) => {
@@ -327,15 +327,15 @@ const _diagramMachine = setup({
327
327
  return {
328
328
  xynodes: context.xynodes.map((n) => {
329
329
  if (n.data.tags?.includes(event.tag)) {
330
- return setDimmed(n, false);
330
+ return Base.setDimmed(n, false);
331
331
  }
332
- return setDimmed(n, true);
332
+ return Base.setDimmed(n, true);
333
333
  })
334
334
  };
335
335
  }),
336
336
  "undim everything": assign(({ context }) => ({
337
- xynodes: context.xynodes.map(setDimmed(false)),
338
- xyedges: context.xyedges.map(setData({
337
+ xynodes: context.xynodes.map(Base.setDimmed(false)),
338
+ xyedges: context.xyedges.map(Base.setData({
339
339
  dimmed: false,
340
340
  active: false
341
341
  }))
@@ -912,8 +912,8 @@ const _diagramMachine = setup({
912
912
  },
913
913
  "xyflow.viewportMoved": {
914
914
  actions: assign({
915
- viewportChangedManually: ({ event }) => event.manually,
916
- viewport: ({ event }) => event.viewport
915
+ viewportChangedManually: (({ event }) => event.manually),
916
+ viewport: (({ event }) => event.viewport)
917
917
  })
918
918
  },
919
919
  "xyflow.edgeEditingStarted": {