@olares/lares-mobile 0.15.20 → 0.15.22

package/package.json

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

package/src/App.vue

@@ -102,10 +102,6 @@
       @pick-command="pickCommand"
       @toggle-speak="toggleSpeak"
     />
-    <div v-if="voicePanelState?.readAloudError" class="lares-speak-notice" role="alert">
-      {{ voiceReadAloudError }}
-      <button type="button" @click="voicePanel.retryReadAloud()">{{ t('dictation.retry') }}</button>
-    </div>
     <LaresVoicePanel v-if="voicePanelState" :view="voicePanelState" :t="t"
       @close="runVoicePanel('close')" @edit="voicePanel.edit($event)" @preset="voicePanel.selectPreset($event, true).catch(() => {})"
       @complete="runVoicePanel('complete')" @discard="runVoicePanel('discard')" />
@@ -534,7 +530,6 @@ export default {
     modelBlocked() {
       return !modelState(this.modelStatus).valid;
     },
-    voiceReadAloudError() { return this.t("settings.readAloudSyncFailed"); },
     voiceErrorText() {
       return this.voiceError ? messageFromCode(this.t, this.voiceError, "error.voice_failed") : "";
     },
@@ -1304,6 +1299,7 @@ export default {
       await this.voicePanel.open({ mode: this.voiceDefaultMode, sessionId: this.sessionId || null });
     },
     onVoiceAction({ action, value }) {
+      if (action === "retryReadAloud") { void this.voicePanel.retryReadAloud(); return; }
       if (action === "stopPlayback") { void this.voicePanel.conversation?.controller.stopPlayback().catch(() => {}); return; }
       if (action === "setCancelArmed") { this.voicePanel.setCancelArmed(value); return; }
       if (["holdStart", "holdEnd", "finish", "start", "close"].includes(action)) void Promise.resolve(this.voicePanel[action](value)).catch(() => {});

package/src/chat/Composer.vue

@@ -1,5 +1,9 @@
 <template>
   <form class="lares-composer" :class="{ 'lares-composer--hero': hero }" @submit.prevent="onSend">
+    <div v-if="voiceView?.readAloudError" class="lares-composer__alert" role="alert">
+      <p>{{ t("settings.readAloudSyncFailed") }}</p>
+      <button type="button" @click="$emit('voice-action', { action: 'retryReadAloud' })">{{ t("dictation.retry") }}</button>
+    </div>
     <div
       class="lares-composer__card"
       data-composer-card
@@ -446,6 +450,36 @@ export default {
   padding: 0;
 }
 
+.lares-composer__alert {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  padding: 8px 12px;
+  border-radius: 12px;
+  background: var(--q-background-1);
+  color: var(--q-orange-default);
+  font-size: 13px;
+  line-height: 18px;
+}
+
+.lares-composer__alert p {
+  flex: 1;
+  min-width: 0;
+  margin: 0;
+}
+
+.lares-composer__alert button {
+  flex: none;
+  border: 0;
+  border-radius: 8px;
+  padding: 6px 10px;
+  background: var(--q-blue-alpha);
+  color: var(--q-blue-default);
+  font: inherit;
+  font-size: 13px;
+  font-weight: 600;
+}
+
 .lares-composer__card {
   position: relative;
   display: flex;

package/src/desktop/DesktopComposer.vue

@@ -133,6 +133,10 @@
       :t="t"
       @action="(itemId, action) => $emit('queue-action', itemId, action)"
     />
+    <div v-if="state.voicePanelState?.readAloudError" class="desktop-composer__alert" role="alert">
+      <p>{{ t("settings.readAloudSyncFailed") }}</p>
+      <button type="button" @click="$emit('voice-action', { action: 'retryReadAloud' })">{{ t("dictation.retry") }}</button>
+    </div>
 
     <Transition name="lares-panel" mode="out-in">
       <div v-if="state.approval" key="approval" class="desktop-composer__approval">
@@ -910,6 +914,9 @@ export default {
   margin: 0 auto;
   padding: 8px 0 20px;
 }
+.desktop-composer__alert { display:flex; align-items:center; gap:12px; margin:0 0 8px; padding:8px 12px; border-radius:12px; background:var(--q-background-1); color:var(--q-orange-default); font-size:13px; line-height:18px; }
+.desktop-composer__alert p { flex:1; min-width:0; margin:0; }
+.desktop-composer__alert button { flex:none; border:0; border-radius:8px; padding:6px 10px; background:var(--q-blue-alpha); color:var(--q-blue-default); font:inherit; font-size:13px; font-weight:600; cursor:pointer; }
 .desktop-composer__model-row { display:flex; justify-content:flex-end; gap:2px; min-height:28px; margin-bottom:6px; }
 .desktop-composer[data-hero="true"] .desktop-composer__model-row { justify-content:space-between; }
 .desktop-composer__model,