Adjust Fragment width according to simple assignment.

src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Fragment/FragmentAlt.vue

@@ -151,7 +151,4 @@ export default {
 * {
   border-color: inherit;
 }
-.fragment {
-  min-width: 200px;
-}
 </style>

src/components/DiagramFrame/SeqDiagram/WidthOfContext.ts

@@ -25,14 +25,13 @@ export function TotalWidth(ctx: any, coordinates: Coordinates) {
     coordinates,
   );
 
-  return Math.max(
+  return (
     coordinates.distance(leftParticipant, rightParticipant) +
-      border.left +
-      border.right +
-      coordinates.half(leftParticipant) +
-      coordinates.half(rightParticipant) +
-      extraWidth,
-    350,
+    border.left +
+    border.right +
+    coordinates.half(leftParticipant) +
+    coordinates.half(rightParticipant) +
+    extraWidth
   );
 }
 
@@ -42,15 +41,17 @@ function extraWidthDueToSelfMessage(
   coordinates: Coordinates,
 ) {
   const allMessages = AllMessages(ctx);
+  console.log("allMessages", allMessages);
   const widths = allMessages
     .filter((m) => m.from === m.to)
     // 37 is arrow width (30) + half occurrence width(7)
     .map(
       (s) =>
-        WidthProviderOnBrowser(s.signature, TextType.MessageContent) +
+        WidthProviderOnBrowser(s.label, TextType.MessageContent) +
         37 -
         coordinates.distance(s.from, rightParticipant) -
         coordinates.half(rightParticipant),
     );
+  console.debug("extraWidthDueToSelfMessage", widths);
   return Math.max.apply(null, [0, ...widths]);
 }

src/parser/MessageLabel.ts

@@ -0,0 +1,32 @@
+// The label in the rendered diagram.
+// `a->b.label`: `label`.
+// `a->b.label()`: `label`.
+// `a=b()`: `b`. Invocation.
+// `a=b`: `a=b`. Simple assignment.
+// `new A`: `«create»`.
+// `new A(1)`: `«1»`.
+
+import sequenceParser from "../generated-parser/sequenceParser";
+
+const seqParser = sequenceParser;
+const MessageContext = seqParser.MessageContext;
+const AsyncMessageContext = seqParser.AsyncMessageContext;
+const CreationContext = seqParser.CreationContext;
+
+// @ts-ignore
+MessageContext.prototype.Label = function () {
+  // @ts-ignore
+  if (this.isSimpleAssignment()) {
+    // @ts-ignore
+    return this.Assignment()?.getLabel() + "=" + this.SignatureText();
+  }
+  // @ts-ignore
+  return this.SignatureText();
+};
+
+// @ts-ignore
+AsyncMessageContext.prototype.Label =
+  AsyncMessageContext.prototype.SignatureText;
+
+// @ts-ignore
+CreationContext.prototype.Label = CreationContext.prototype.SignatureText;

src/parser/index.js

@@ -12,6 +12,7 @@ import "./RefContext";
 import "./Origin";
 import "./Divider/DividerContext";
 import "./SignatureText";
+import "./MessageLabel";
 import "./Messages/MessageContext";
 import "./From";
 import "./key/Key";

src/positioning/MessageContextListener.ts

@@ -18,14 +18,13 @@ export class MessageContextListener extends sequenceParserListener {
     if (this.isBlind) {
       return;
     }
-    const from = ctx.From();
     const owner = ctx?.Owner();
-    const signature = ctx?.SignatureText();
     this.ownableMessages.push({
-      from: from,
-      signature: signature,
+      from: ctx.From(),
+      signature: ctx?.SignatureText(),
+      label: ctx?.Label(),
       type,
-      to: owner,
+      to: owner || ctx.From(),
     });
   };
 

src/positioning/OwnableMessage.ts

@@ -8,5 +8,13 @@ export interface OwnableMessage {
   from: string;
   to: string;
   signature: string;
+  // The label in the rendered diagram.
+  // `a->b.label`: `label`.
+  // `a->b.label()`: `label`.
+  // `a=b()`: `b`. Invocation.
+  // `a=b`: `a=b`. Simple assignment.
+  // `new A`: `«create»`.
+  // `new A(1)`: `«1»`.
+  label: string;
   type: OwnableMessageType;
 }