Increase margin top for messages

[MrCoder]

A user has used //. to produce a margin before a self sync message.

loop(CONDITION____________){
  //.
  SELF_EEEEEEE
  if(CONDITION____________){
    //.
    A.SYNC_EEEEEEE
  }
}

See: https://diagramly.ai/diagrams/4f1565e1-db4f-4b00-8635-2ea8a6104c3f

The diagram on the left looks cramped.

[MrCoder]

This issue is most prominent in the following scenarios:

1. Under Condition, whether it's self or other messages
2. Under Return message
3. Under Async message

Return message

A->B.Message {
  @return B->A:response
}
//.
A->A.SELF_EEE

A->B.Message {
  @return B->A:response
}
//.
A->B.MSG_EEE

See: https://diagramly.ai/diagrams/11b207a6-81be-456e-a2af-006673c677b6

Async Message

A->B:MESSAGE1
B->A:MESSAGE2

See: https://diagramly.ai/diagrams/02594359-9c92-4dff-a59c-46b08fc2aeee

[MrCoder]

Note: we did not take this approach.

If we had ppplied p-1 to condition.

[MrCoder]

Analysis from Claude.

---

I'll analyze the frequency of each type of spacing comment to help prioritize which default margins would give you the most impact. Let me count through the code:

RETURN-related spacing:

//. SYNC SELF after RETURN
//. SYNC after RETURN

Count: 8 instances

CONDITION-related spacing:

//. SYNC SELF after CONDITION (close)
//. SYNC SELF after CONDITION (not close)
//. ASYNC after CONDITION (not close)

Count: 5 instances

FRAGMENT/SECTION spacing:

//. SYNC after ALT FRAGMENT
//. SYNC SELF in SECTION

Count: 2 instances

Other (dividers/documentation):

//. Just to divide...
//.

Count: 2 instances

Priority order based on frequency:

1. Return messages (8 occurrences) - Highest impact
2. Condition blocks (5 occurrences) - Second highest impact
3. Fragments/Sections (2 occurrences) - Lower priority
4. Pure divider comments (2 occurrences) - Can be handled by proper section styling

I would recommend tackling them in this order:

1. First add default margins after return messages since they're the most common case
2. Then handle condition block spacing
3. Finally add fragment/section margins

This way you'll eliminate the majority of the spacing comments with the first two improvements.

[MrCoder]

Index: src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Interaction/Occurrence/Occurrence.vue
IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
===================================================================
diff --git a/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Interaction/Occurrence/Occurrence.vue b/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Interaction/Occurrence/Occurrence.vue
--- a/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Interaction/Occurrence/Occurrence.vue	(revision fa325226b8a358e5a2496624ac2bad9eecdb6e95)
+++ b/src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Interaction/Occurrence/Occurrence.vue	(date 1736294063773)
@@ -101,7 +101,8 @@
 .occurrence {
   width: 15px;
   /* 6 = (OccurrenceWidth(15)+1)/2 - OccurrenceBorderWidth(2)*/
-  padding: 16px 0 16px 6px;
+  padding: 16px 0 8px 6px;
+  margin-bottom: 8px;
 }
 
 :deep(> .statement-container:last-child > .interaction.return:last-of-type) {
@@ -115,9 +116,9 @@
       > .interaction.return:last-of-type
       > .message
   ) {
-  bottom: -17px;
+  bottom: -10px;
   /* Move the absolutely positioned return message to the bottom. -17 to offset the padding of Occurrence. */
-  /* height: 0; */
+ height: 0;
 }
 
 .right-to-left.occurrence {

[MrCoder]

Issue on Par.

par {
  A.E
  B.E
  C.E
}