@olares/lares-mobile 0.15.33 → 0.15.34

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@olares/lares-mobile",
-  "version": "0.15.33",
+  "version": "0.15.34",
   "description": "Lares chat component for LarePass",
   "type": "module",
   "repository": {
@@ -28,7 +28,7 @@
     "vue": "^3.2.0"
   },
   "dependencies": {
-    "@olares/lares-core": "0.15.33",
+    "@olares/lares-core": "0.15.34",
     "markdown-it": "^14.3.0"
   }
 }

package/src/chat/Transcript.vue

@@ -28,10 +28,11 @@
       </button>
     </li>
     <li
-      v-for="{ row, index } in shown(block)"
+      v-for="{ row, index, inProcess } in shown(block)"
       :key="row.id || row.key || index"
       class="lares-log__item"
       :data-type="row.type"
+      :data-process="inProcess ? 'true' : undefined"
       :data-pending="row.pending ? 'true' : 'false'"
     >
       <div v-if="row.type === 'user'" class="lares-msg" data-role="user">{{ row.text }}</div>
@@ -77,16 +78,16 @@
           <div class="lares-md" v-html="renderMarkdown(row.text)" />
           <p v-if="row.voiceSummary" class="lares-voice-summary">{{ row.voiceSummary }}</p>
         </template>
-        <div v-if="hasReadout(row)" role="status" class="lares-message-readout">
+        <div v-if="!inProcess && hasReadout(row)" role="status" class="lares-message-readout">
           <span>{{ speechLabel }}</span>
           <button type="button" class="lares-message-stop" @click="readout.stop()">{{ t(readout.status === 'error' ? 'readout.dismiss' : 'readout.stop') }}</button>
         </div>
-        <div v-else-if="ownsPlayback(row)" role="status" class="lares-message-readout">
+        <div v-else-if="!inProcess && ownsPlayback(row)" role="status" class="lares-message-readout">
           <span>{{ t(playbackChrome.status) }}</span>
           <button type="button" class="lares-message-stop" @click="$emit('stop-speaking')">{{ t(playbackChrome.stopLabel) }}</button>
         </div>
         <LaresMessageActions
-          v-if="!row.pending"
+          v-if="!inProcess && !row.pending"
           :text="row.text"
           :reaction="reactions[actionKey(index)] || ''"
           :metrics="row.metrics || null"
@@ -221,8 +222,9 @@ export default {
     renderMarkdown,
     thinkSummary,
     shown(block) {
-      if (block.kind === "fold") return this.processOpen(block) ? block.members : [];
-      return [block];
+      if (block.kind !== "fold") return [block];
+      if (!this.processOpen(block)) return [];
+      return block.members.map((member) => ({ ...member, inProcess: true }));
     },
     processOpen(block) {
       return !block.foldable || Boolean(this.openFolds[block.key]);
@@ -487,6 +489,11 @@ export default {
   margin-top: 8px;
 }
 
+.lares-log__item[data-process="true"] {
+  margin-top: 0;
+  gap: 0;
+}
+
 .lares-msg[data-role="user"] {
   align-self: flex-end;
   max-width: 86%;

package/src/desktop/DesktopShell.vue

@@ -226,6 +226,7 @@ export default {
 .desktop-shell :deep(.lares-log > *) { box-sizing:border-box; width:var(--lares-column); padding-inline:var(--lares-gutter); }
 .desktop-shell :deep(.lares-log__item[data-type="user"]) { margin-top:18px; }
 .desktop-shell :deep(.lares-log__item[data-type="assistant"]) { margin-top:12px; }
+.desktop-shell :deep(.lares-log__item[data-process="true"]) { margin-top:0; }
 .desktop-shell :deep(.lares-msg[data-role="user"]) { max-width:68%; border-radius:16px; padding:10px 14px; }
 .desktop-shell :deep(.lares-md) { font-size:15px; line-height:1.65; }
 @media (max-width:760px) {