Fixed editing style and async message text-align.

Author: MrCoder

src/components/DiagramFrame/SeqDiagram/MessageLayer/Block/Statement/Message/Message.vue

@@ -5,15 +5,13 @@
       'flex-row-reverse': rtl,
       return: type === 'return',
       'right-to-left': rtl,
-      'text-left': isAsync,
-      'text-center': !isAsync,
     }"
     :style="{ 'border-bottom-style': borderStyle || undefined }"
     @click="onClick"
     ref="messageRef"
   >
     <div
-      class="name group flex-grow relative hover:text-skin-message-hover hover:bg-skin-message-hover"
+      class="name group text-center flex-grow relative hover:text-skin-message-hover hover:bg-skin-message-hover"
     >
       <div class="inline-block static min-h-[1em]">
         <div :style="textStyle" :class="classNames">

src/components/DiagramFrame/SeqDiagram/MessageLayer/MessageLabel.vue

@@ -4,7 +4,6 @@
     class="px-1 cursor-text right hover:text-skin-message-hover hover:bg-skin-message-hover"
     :class="{
       'cursor-text': editing,
-      'absolute right-1/2 translate-x-1/2 bottom-0': editing && !isSelfAsync,
     }"
     :contenteditable="editing && mode === RenderMode.Dynamic"
     @dblclick="handleDblClick"
@@ -34,14 +33,13 @@ const props = withDefaults(
   },
 );
 
-const { labelText, labelPosition, isAsync, isSelf } = toRefs(props);
+const { labelText, labelPosition, isAsync } = toRefs(props);
 const store = useStore();
 const mode = computed(() => store.state.mode);
 const code = computed(() => store.getters.code);
 const onContentChange = computed(
   () => store.getters.onContentChange || (() => {}),
 );
-const isSelfAsync = computed(() => !!isAsync?.value && !!isSelf?.value);
 
 function updateCode(code: string) {
   store.dispatch("updateCode", { code });