@fiodos/web-core 0.1.7 → 0.1.10

package/dist/cjs/dropin/createFiodosAgent.d.ts

@@ -27,8 +27,12 @@ export interface CreateFiodosAgentOptions {
     manifest?: AppManifest;
     /** Action handlers / context validators (defaults to empty registries). */
     registries?: ActionRegistries;
-    /** Agent reply locale (e.g. 'es', 'en'). Defaults to the browser language. */
+    /** Agent UI locale (e.g. 'en', 'es'). Defaults to `'en'`. */
     locale?: string;
+    /** Live locale resolver — overrides `locale` when set. */
+    getLocale?: () => string;
+    /** Auto-detect locale when `locale` / `getLocale` are unset. Default: none (English). */
+    localeDetection?: 'browser' | 'document';
     /** STT locale (e.g. 'es-ES', 'en-US'). Defaults to the browser language. */
     sttLocale?: string;
     /** Host router navigate delegate. Defaults to location.assign. */

package/dist/cjs/dropin/createFiodosAgent.js

@@ -32,10 +32,27 @@ function browserLocale() {
     const lang = typeof navigator !== 'undefined' && navigator.language ? navigator.language : 'en-US';
     return { locale: lang.split('-')[0] || 'en', sttLocale: lang };
 }
+function resolveAgentLocale(options) {
+    const fromApp = options.getLocale?.()?.trim();
+    if (fromApp)
+        return fromApp;
+    if (options.locale?.trim())
+        return options.locale.trim();
+    if (options.localeDetection === 'browser')
+        return browserLocale().locale;
+    if (options.localeDetection === 'document') {
+        const docLang = typeof document !== 'undefined'
+            ? document.documentElement.lang?.split(/[-_]/)[0]?.trim()
+            : '';
+        if (docLang)
+            return docLang;
+    }
+    return 'en';
+}
 /** Build the controller + adapters from a known manifest (shared by both paths). */
 function assemble(options, manifest, baseUrl) {
     const fallback = browserLocale();
-    const locale = options.locale ?? fallback.locale;
+    const locale = resolveAgentLocale(options);
     const sttLocale = options.sttLocale ?? options.locale ?? fallback.sttLocale;
     const backend = (0, backendClient_1.createFiodosBackendClient)({
         baseUrl,

package/dist/cjs/orb/mountOrb.js

@@ -42,6 +42,11 @@ const CSS = `
 .fyodos-bubble-row{display:flex;gap:8px;align-items:flex-end;padding:8px 10px;border-top:1px solid rgba(160,180,220,0.18);}
 .fyodos-bubble-row input{flex:1;border:1px solid rgba(15,23,42,0.12);outline:none;border-radius:10px;padding:9px 11px;font-size:15px;}
 .fyodos-bubble-row button{appearance:none;border:none;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;padding:0;font-size:17px;font-weight:700;line-height:1;color:#000;cursor:pointer;}
+.fyodos-thought{position:absolute;appearance:none;box-sizing:border-box;display:flex;align-items:center;width:max-content;max-width:min(280px,70vw);white-space:nowrap;overflow:hidden;text-align:left;line-height:1.25;font-weight:500;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.22);animation:fyodos-thought-in .18s ease-out;}
+@keyframes fyodos-thought-in{from{opacity:0;transform:translateY(4px) scale(0.96)}to{opacity:1;transform:none}}
+@keyframes fyodos-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
+.fyodos-thought-track{display:flex;flex-shrink:0;width:max-content;will-change:transform;}
+.fyodos-thought-track>span{flex-shrink:0;padding-right:48px;white-space:nowrap;}
 @keyframes fyodos-fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
 @keyframes fyodos-blink{0%,100%{opacity:.25}50%{opacity:.9}}
 @keyframes fy-spin{to{transform:rotate(360deg)}}
@@ -130,6 +135,12 @@ function mountOrb(controller, options = {}) {
     let publishedAppearance = null;
     let chipTheme = null;
     let modalTheme;
+    let bubbleTheme = (0, core_1.resolveBubbleTheme)(null);
+    let bubbleEnabled = true;
+    // Dashboard VOICE switch. Default true (voice on). When false the orb never
+    // listens/speaks: a tap opens the keyboard directly and text turns are silent.
+    let voiceInputEnabled = true;
+    let currentRoute = null;
     let screenPosition = options.corner
         ? cornerToPosition(options.corner)
         : { ...core_1.DEFAULT_ORB_SCREEN_POSITION };
@@ -160,6 +171,35 @@ function mountOrb(controller, options = {}) {
     anchor.appendChild(btn);
     root.appendChild(anchor);
     let chipEl = null;
+    // Thought bubble: a short, screen-aware CTA beside the orb. Created once and
+    // shown/hidden by syncThoughtBubble; tapping it opens the keyboard.
+    const thoughtBubbleEl = document.createElement('div');
+    thoughtBubbleEl.className = 'fyodos-thought';
+    thoughtBubbleEl.setAttribute('role', 'button');
+    thoughtBubbleEl.tabIndex = 0;
+    thoughtBubbleEl.style.display = 'none';
+    thoughtBubbleEl.addEventListener('click', () => {
+        haptics.trigger('orbTap');
+        controller.primeAudio();
+        if (enableTextInput) {
+            const prompt = resolveCurrentBubblePrompt();
+            openTextPanel(prompt
+                ? (0, core_1.bubblePromptToAffirmative)(prompt, {
+                    locale: controller.config.locale,
+                    messages: controller.messages,
+                })
+                : undefined);
+            return;
+        }
+        void controller.toggleListening();
+    });
+    thoughtBubbleEl.addEventListener('keydown', (event) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            thoughtBubbleEl.click();
+        }
+    });
+    anchor.appendChild(thoughtBubbleEl);
     container.appendChild(root);
     // ── Position (dashboard position; user drag is SESSION-only, never persisted) ─
     // The orb ALWAYS starts at the dashboard-published position on every load.
@@ -209,6 +249,9 @@ function mountOrb(controller, options = {}) {
                 chipEl.style.right = '';
             }
         }
+        // Keep the thought bubble on the orb's free side too while it is visible.
+        if (thoughtBubbleEl.style.display !== 'none')
+            positionThoughtBubble();
     }
     window.addEventListener('resize', reposition);
     // Recalc when a scrollbar appears/disappears as the page content changes (the
@@ -423,9 +466,14 @@ function mountOrb(controller, options = {}) {
         // STAYS OPEN. This is the unified, reference-matching behaviour.
         void controller.submitTextTurn(value);
     }
-    function openTextPanel() {
+    function openTextPanel(seed, autoSend = false) {
         controller.cancelAll();
+        const draft = seed?.trim() ?? '';
+        textInput.value = draft;
         setBubble(true);
+        if (autoSend && draft) {
+            queueMicrotask(() => submitText());
+        }
     }
     // ── Keyboard chip (rebuilt when theme changes / visibility toggles) ──────────
     // Appears beside the ACTIVE orb — whether listening for real (voice granted)
@@ -459,6 +507,102 @@ function mountOrb(controller, options = {}) {
         anchor.appendChild(chipEl);
         applyDeployment();
     }
+    // ── Thought bubble (screen-aware CTA beside the orb) ─────────────────────────
+    function resolveCurrentBubblePrompt() {
+        return (0, core_1.resolveBubblePrompt)((0, core_1.matchRouteIntent)(currentRoute, controller.config.manifest.routes), controller.messages, { locale: controller.config.locale, actions: controller.config.manifest.actions });
+    }
+    // Render the CTA on ONE line at its NATURAL size. When the phrase is too long
+    // to fit the max width, scroll it (marquee, right-to-left, looping) instead of
+    // shrinking the font or truncating — the bubble keeps a constant height.
+    function layoutThoughtContent(prompt) {
+        const t = bubbleTheme;
+        const { padH } = (0, core_1.resolveBubblePadding)(t);
+        // Measure the natural (single-copy) text width at the base font size.
+        thoughtBubbleEl.style.width = '';
+        thoughtBubbleEl.textContent = prompt;
+        const measured = thoughtBubbleEl.scrollWidth;
+        const viewport = typeof window !== 'undefined' ? window.innerWidth : 280;
+        const maxW = Math.min(280, viewport * 0.7);
+        const overflow = measured > maxW - t.borderWidth * 2;
+        if (!overflow) {
+            thoughtBubbleEl.style.width = '';
+            return;
+        }
+        const textWidth = Math.max(0, measured - padH * 2);
+        const durationSec = Math.max(4, (textWidth + 48) / 30);
+        thoughtBubbleEl.style.width = `${maxW}px`;
+        thoughtBubbleEl.textContent = '';
+        const track = document.createElement('div');
+        track.className = 'fyodos-thought-track';
+        track.style.animation = `fyodos-marquee ${durationSec}s linear infinite`;
+        const first = document.createElement('span');
+        first.textContent = prompt;
+        const second = document.createElement('span');
+        second.textContent = prompt;
+        second.setAttribute('aria-hidden', 'true');
+        track.appendChild(first);
+        track.appendChild(second);
+        thoughtBubbleEl.appendChild(track);
+    }
+    function applyThoughtBubbleTheme() {
+        const t = bubbleTheme;
+        const { fontPx, padH, approxHeight } = (0, core_1.resolveBubblePadding)(t);
+        const shapeCss = (0, core_1.bubbleShapeToCss)(t, approxHeight);
+        thoughtBubbleEl.style.fontSize = `${fontPx}px`;
+        thoughtBubbleEl.style.height = `${approxHeight}px`;
+        thoughtBubbleEl.style.padding = `0 ${padH}px`;
+        thoughtBubbleEl.style.color = t.textColor;
+        thoughtBubbleEl.style.background = t.backgroundColor;
+        thoughtBubbleEl.style.border = `${t.borderWidth}px solid ${t.borderColor}`;
+        const setImportant = (prop, value) => {
+            if (!value) {
+                thoughtBubbleEl.style.removeProperty(prop);
+                return;
+            }
+            thoughtBubbleEl.style.setProperty(prop, value, 'important');
+        };
+        setImportant('border-radius', shapeCss.borderRadius);
+        setImportant('border-top-left-radius', shapeCss.borderTopLeftRadius);
+        setImportant('border-top-right-radius', shapeCss.borderTopRightRadius);
+        setImportant('border-bottom-left-radius', shapeCss.borderBottomLeftRadius);
+        setImportant('border-bottom-right-radius', shapeCss.borderBottomRightRadius);
+        setImportant('clip-path', shapeCss.clipPath);
+    }
+    function positionThoughtBubble() {
+        const dep = (0, core_1.resolveOrbDeployment)(effectivePosition());
+        if (dep.horizontal === 'left') {
+            thoughtBubbleEl.style.right = 'calc(100% + 10px)';
+            thoughtBubbleEl.style.left = '';
+        }
+        else {
+            thoughtBubbleEl.style.left = 'calc(100% + 10px)';
+            thoughtBubbleEl.style.right = '';
+        }
+        if (dep.vertical === 'up') {
+            thoughtBubbleEl.style.top = '0';
+            thoughtBubbleEl.style.bottom = '';
+            thoughtBubbleEl.style.transform = '';
+        }
+        else {
+            thoughtBubbleEl.style.bottom = '0';
+            thoughtBubbleEl.style.top = '';
+            thoughtBubbleEl.style.transform = '';
+        }
+    }
+    function syncThoughtBubble(state) {
+        const idle = !state.showThinking && !state.showWaveform && state.phase !== 'speaking' && !micFallbackActive;
+        const prompt = bubbleEnabled && !bubbleOpen && idle ? resolveCurrentBubblePrompt() : null;
+        if (!prompt) {
+            thoughtBubbleEl.style.display = 'none';
+            return;
+        }
+        thoughtBubbleEl.setAttribute('aria-label', prompt);
+        // Display before measuring so `scrollWidth` (used to detect overflow) is real.
+        thoughtBubbleEl.style.display = 'flex';
+        applyThoughtBubbleTheme();
+        layoutThoughtContent(prompt);
+        positionThoughtBubble();
+    }
     // ── Overlays (confirmation + consent) ────────────────────────────────────────
     let overlayEl = null;
     function clearOverlay() {
@@ -571,9 +715,16 @@ function mountOrb(controller, options = {}) {
             setBubble(false);
             return;
         }
+        // Voice disabled in the dashboard: never listen/speak. Tap opens the keyboard
+        // directly (text turns are silent by default); animations are unchanged.
+        if (!voiceInputEnabled && enableTextInput) {
+            micFallbackActive = false;
+            openTextPanel();
+            return;
+        }
         // `voiceAvailable` is dynamic: the Web Speech API may be present yet the mic
         // denied/blocked, in which case we skip voice and go straight to the keyboard.
-        if (controller.voiceAvailable) {
+        if (controller.voiceAvailable && voiceInputEnabled) {
             micFallbackActive = false;
             void controller.toggleListening();
             return;
@@ -663,6 +814,7 @@ function mountOrb(controller, options = {}) {
             sendBtn.disabled = false;
         }
         syncChip(state);
+        syncThoughtBubble(state);
         if (state.confirmationMessage !== lastConfirm) {
             lastConfirm = state.confirmationMessage;
             if (state.confirmationMessage)
@@ -680,6 +832,26 @@ function mountOrb(controller, options = {}) {
     }
     const unsubscribe = controller.subscribe(render);
     render(controller.getState());
+    // Track the current route so the thought bubble re-resolves its CTA on
+    // navigation. No universal navigation event exists, so poll + listen to
+    // popstate / visibility for snappier updates.
+    const readRoute = () => {
+        let next = null;
+        try {
+            next = controller.config.navigation.getCurrentRoute();
+        }
+        catch {
+            /* navigation read is best-effort */
+        }
+        if (next !== currentRoute) {
+            currentRoute = next;
+            syncThoughtBubble(controller.getState());
+        }
+    };
+    readRoute();
+    const routeTimer = window.setInterval(readRoute, 700);
+    window.addEventListener('popstate', readRoute);
+    document.addEventListener('visibilitychange', readRoute);
     // ── Live dashboard config ────────────────────────────────────────────────────
     const stopWatch = (0, publishedConfig_1.watchPublishedConfig)(controller, {
         pollMs: options.appearancePollMs,
@@ -692,6 +864,9 @@ function mountOrb(controller, options = {}) {
                 publishedAppearance = config.appearance;
                 chipTheme = config.keyboardChip;
                 modalTheme = config.modalTheme;
+                bubbleTheme = config.bubbleTheme;
+                bubbleEnabled = config.bubbleEnabled;
+                voiceInputEnabled = config.voiceInputEnabled;
                 if (usePublishedPosition && config.screenPosition)
                     screenPosition = config.screenPosition;
             }
@@ -702,6 +877,7 @@ function mountOrb(controller, options = {}) {
                 chipEl = null;
             }
             syncChip(controller.getState());
+            syncThoughtBubble(controller.getState());
             if (bubbleOpen)
                 applyBubbleTheme();
         },
@@ -710,6 +886,9 @@ function mountOrb(controller, options = {}) {
         unmount() {
             unsubscribe();
             stopWatch();
+            window.clearInterval(routeTimer);
+            window.removeEventListener('popstate', readRoute);
+            document.removeEventListener('visibilitychange', readRoute);
             window.removeEventListener('resize', reposition);
             contentObserver?.disconnect();
             visualViewport?.removeEventListener('resize', onViewportChange);

package/dist/cjs/orb/publishedConfig.d.ts

@@ -9,7 +9,7 @@
  * mobile — in real time, via polling. So Vue/Svelte/Angular read the dashboard
  * config identically to the reference, instead of ignoring it.
  */
-import { type OrbScreenPosition, type PublishedModalTheme } from '@fiodos/core';
+import { type OrbScreenPosition, type PublishedModalTheme, type ResolvedBubbleTheme } from '@fiodos/core';
 import type { AgentController } from '../controller/AgentController';
 import { type ChipTheme, type OrbAppearance } from './orbView';
 export interface ResolvedOrbConfig {
@@ -17,6 +17,16 @@ export interface ResolvedOrbConfig {
     keyboardChip: ChipTheme | null;
     modalTheme: PublishedModalTheme | undefined;
     screenPosition: OrbScreenPosition | undefined;
+    /** Resolved orb thought-bubble theme (defaults filled). */
+    bubbleTheme: ResolvedBubbleTheme;
+    /** Dashboard on/off for the thought bubble. Default true (absent = enabled). */
+    bubbleEnabled: boolean;
+    /**
+     * Dashboard on/off for the orb's VOICE channel (`voiceInputEnabled`). False
+     * ONLY when the developer turned voice off; then the orb opens the keyboard
+     * directly on tap and never plays TTS. Default true (absent = voice on).
+     */
+    voiceInputEnabled: boolean;
     /**
      * Dashboard master visibility switch (`orbEnabled`). False ONLY when the
      * developer explicitly turned the orb off. The orb is hidden when false and

package/dist/cjs/orb/publishedConfig.js

@@ -14,7 +14,8 @@ exports.watchPublishedConfig = watchPublishedConfig;
  */
 const core_1 = require("@fiodos/core");
 const orbView_1 = require("./orbView");
-function toResolved(props, enabled) {
+function toResolved(props, published) {
+    const enabled = published.orbEnabled !== false;
     const theme = props.theme;
     const appearance = {
         accentColor: theme.accentColor ?? orbView_1.DEFAULT_ORB_APPEARANCE.accentColor,
@@ -33,6 +34,9 @@ function toResolved(props, enabled) {
         keyboardChip: theme.keyboardChip ?? null,
         modalTheme: props.modalTheme,
         screenPosition: props.screenPosition,
+        bubbleTheme: (0, core_1.resolveBubbleTheme)(published.bubbleTheme),
+        bubbleEnabled: published.bubbleEnabled !== false,
+        voiceInputEnabled: published.voiceInputEnabled !== false,
         enabled,
     };
 }
@@ -54,7 +58,7 @@ function watchPublishedConfig(controller, options) {
             if (cancelled)
                 return;
             options.onChange(res.published
-                ? toResolved((0, core_1.mapPublishedConfigToOrbProps)(res.published), res.published.orbEnabled !== false)
+                ? toResolved((0, core_1.mapPublishedConfigToOrbProps)(res.published), res.published)
                 : null);
         }
         catch {

package/dist/cjs/version.d.ts

@@ -5,5 +5,5 @@
  * Auto-generated by scripts/sync-sdk-version.mjs from package.json. Do not edit
  * by hand — change package.json `version` and re-run the sync/release script.
  */
-export declare const SDK_VERSION = "0.1.7";
+export declare const SDK_VERSION = "0.1.10";
 export declare const SDK_PACKAGE = "@fiodos/web-core";

package/dist/cjs/version.js

@@ -8,5 +8,5 @@ exports.SDK_PACKAGE = exports.SDK_VERSION = void 0;
  * Auto-generated by scripts/sync-sdk-version.mjs from package.json. Do not edit
  * by hand — change package.json `version` and re-run the sync/release script.
  */
-exports.SDK_VERSION = '0.1.7';
+exports.SDK_VERSION = '0.1.10';
 exports.SDK_PACKAGE = '@fiodos/web-core';

package/dist/esm/dropin/createFiodosAgent.d.ts

@@ -27,8 +27,12 @@ export interface CreateFiodosAgentOptions {
     manifest?: AppManifest;
     /** Action handlers / context validators (defaults to empty registries). */
     registries?: ActionRegistries;
-    /** Agent reply locale (e.g. 'es', 'en'). Defaults to the browser language. */
+    /** Agent UI locale (e.g. 'en', 'es'). Defaults to `'en'`. */
     locale?: string;
+    /** Live locale resolver — overrides `locale` when set. */
+    getLocale?: () => string;
+    /** Auto-detect locale when `locale` / `getLocale` are unset. Default: none (English). */
+    localeDetection?: 'browser' | 'document';
     /** STT locale (e.g. 'es-ES', 'en-US'). Defaults to the browser language. */
     sttLocale?: string;
     /** Host router navigate delegate. Defaults to location.assign. */

package/dist/esm/dropin/createFiodosAgent.js

@@ -29,10 +29,27 @@ function browserLocale() {
     const lang = typeof navigator !== 'undefined' && navigator.language ? navigator.language : 'en-US';
     return { locale: lang.split('-')[0] || 'en', sttLocale: lang };
 }
+function resolveAgentLocale(options) {
+    const fromApp = options.getLocale?.()?.trim();
+    if (fromApp)
+        return fromApp;
+    if (options.locale?.trim())
+        return options.locale.trim();
+    if (options.localeDetection === 'browser')
+        return browserLocale().locale;
+    if (options.localeDetection === 'document') {
+        const docLang = typeof document !== 'undefined'
+            ? document.documentElement.lang?.split(/[-_]/)[0]?.trim()
+            : '';
+        if (docLang)
+            return docLang;
+    }
+    return 'en';
+}
 /** Build the controller + adapters from a known manifest (shared by both paths). */
 function assemble(options, manifest, baseUrl) {
     const fallback = browserLocale();
-    const locale = options.locale ?? fallback.locale;
+    const locale = resolveAgentLocale(options);
     const sttLocale = options.sttLocale ?? options.locale ?? fallback.sttLocale;
     const backend = createFiodosBackendClient({
         baseUrl,

package/dist/esm/orb/mountOrb.js

@@ -16,7 +16,7 @@
  *  - CONFIRMATIONS: the same security model (manifest decides; strict phrase /
  *    deliberate tap for payment-grade; loose "yes" never resolves strict).
  */
-import { DEFAULT_ORB_SCREEN_POSITION, createWebOrbHaptics, resolveOrbAnchorPx, resolveOrbDeployment, snapOrbScreenPositionToSide, viewportPixelsToOrbScreenPosition, } from '@fiodos/core';
+import { DEFAULT_ORB_SCREEN_POSITION, createWebOrbHaptics, matchRouteIntent, resolveBubblePrompt, bubblePromptToAffirmative, resolveBubbleTheme, resolveBubblePadding, bubbleShapeToCss, resolveOrbAnchorPx, resolveOrbDeployment, snapOrbScreenPositionToSide, viewportPixelsToOrbScreenPosition, } from '@fiodos/core';
 import { buildKeyboardChip, createOrbVisual, DEFAULT_ORB_APPEARANCE, } from './orbView.js';
 import { watchPublishedConfig } from './publishedConfig.js';
 const STYLE_ID = 'fyodos-orb-styles';
@@ -39,6 +39,11 @@ const CSS = `
 .fyodos-bubble-row{display:flex;gap:8px;align-items:flex-end;padding:8px 10px;border-top:1px solid rgba(160,180,220,0.18);}
 .fyodos-bubble-row input{flex:1;border:1px solid rgba(15,23,42,0.12);outline:none;border-radius:10px;padding:9px 11px;font-size:15px;}
 .fyodos-bubble-row button{appearance:none;border:none;flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;min-width:32px;padding:0;font-size:17px;font-weight:700;line-height:1;color:#000;cursor:pointer;}
+.fyodos-thought{position:absolute;appearance:none;box-sizing:border-box;display:flex;align-items:center;width:max-content;max-width:min(280px,70vw);white-space:nowrap;overflow:hidden;text-align:left;line-height:1.25;font-weight:500;cursor:pointer;box-shadow:0 8px 24px rgba(0,0,0,0.22);animation:fyodos-thought-in .18s ease-out;}
+@keyframes fyodos-thought-in{from{opacity:0;transform:translateY(4px) scale(0.96)}to{opacity:1;transform:none}}
+@keyframes fyodos-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
+.fyodos-thought-track{display:flex;flex-shrink:0;width:max-content;will-change:transform;}
+.fyodos-thought-track>span{flex-shrink:0;padding-right:48px;white-space:nowrap;}
 @keyframes fyodos-fade-in{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
 @keyframes fyodos-blink{0%,100%{opacity:.25}50%{opacity:.9}}
 @keyframes fy-spin{to{transform:rotate(360deg)}}
@@ -127,6 +132,12 @@ export function mountOrb(controller, options = {}) {
     let publishedAppearance = null;
     let chipTheme = null;
     let modalTheme;
+    let bubbleTheme = resolveBubbleTheme(null);
+    let bubbleEnabled = true;
+    // Dashboard VOICE switch. Default true (voice on). When false the orb never
+    // listens/speaks: a tap opens the keyboard directly and text turns are silent.
+    let voiceInputEnabled = true;
+    let currentRoute = null;
     let screenPosition = options.corner
         ? cornerToPosition(options.corner)
         : { ...DEFAULT_ORB_SCREEN_POSITION };
@@ -157,6 +168,35 @@ export function mountOrb(controller, options = {}) {
     anchor.appendChild(btn);
     root.appendChild(anchor);
     let chipEl = null;
+    // Thought bubble: a short, screen-aware CTA beside the orb. Created once and
+    // shown/hidden by syncThoughtBubble; tapping it opens the keyboard.
+    const thoughtBubbleEl = document.createElement('div');
+    thoughtBubbleEl.className = 'fyodos-thought';
+    thoughtBubbleEl.setAttribute('role', 'button');
+    thoughtBubbleEl.tabIndex = 0;
+    thoughtBubbleEl.style.display = 'none';
+    thoughtBubbleEl.addEventListener('click', () => {
+        haptics.trigger('orbTap');
+        controller.primeAudio();
+        if (enableTextInput) {
+            const prompt = resolveCurrentBubblePrompt();
+            openTextPanel(prompt
+                ? bubblePromptToAffirmative(prompt, {
+                    locale: controller.config.locale,
+                    messages: controller.messages,
+                })
+                : undefined);
+            return;
+        }
+        void controller.toggleListening();
+    });
+    thoughtBubbleEl.addEventListener('keydown', (event) => {
+        if (event.key === 'Enter' || event.key === ' ') {
+            event.preventDefault();
+            thoughtBubbleEl.click();
+        }
+    });
+    anchor.appendChild(thoughtBubbleEl);
     container.appendChild(root);
     // ── Position (dashboard position; user drag is SESSION-only, never persisted) ─
     // The orb ALWAYS starts at the dashboard-published position on every load.
@@ -206,6 +246,9 @@ export function mountOrb(controller, options = {}) {
                 chipEl.style.right = '';
             }
         }
+        // Keep the thought bubble on the orb's free side too while it is visible.
+        if (thoughtBubbleEl.style.display !== 'none')
+            positionThoughtBubble();
     }
     window.addEventListener('resize', reposition);
     // Recalc when a scrollbar appears/disappears as the page content changes (the
@@ -420,9 +463,14 @@ export function mountOrb(controller, options = {}) {
         // STAYS OPEN. This is the unified, reference-matching behaviour.
         void controller.submitTextTurn(value);
     }
-    function openTextPanel() {
+    function openTextPanel(seed, autoSend = false) {
         controller.cancelAll();
+        const draft = seed?.trim() ?? '';
+        textInput.value = draft;
         setBubble(true);
+        if (autoSend && draft) {
+            queueMicrotask(() => submitText());
+        }
     }
     // ── Keyboard chip (rebuilt when theme changes / visibility toggles) ──────────
     // Appears beside the ACTIVE orb — whether listening for real (voice granted)
@@ -456,6 +504,102 @@ export function mountOrb(controller, options = {}) {
         anchor.appendChild(chipEl);
         applyDeployment();
     }
+    // ── Thought bubble (screen-aware CTA beside the orb) ─────────────────────────
+    function resolveCurrentBubblePrompt() {
+        return resolveBubblePrompt(matchRouteIntent(currentRoute, controller.config.manifest.routes), controller.messages, { locale: controller.config.locale, actions: controller.config.manifest.actions });
+    }
+    // Render the CTA on ONE line at its NATURAL size. When the phrase is too long
+    // to fit the max width, scroll it (marquee, right-to-left, looping) instead of
+    // shrinking the font or truncating — the bubble keeps a constant height.
+    function layoutThoughtContent(prompt) {
+        const t = bubbleTheme;
+        const { padH } = resolveBubblePadding(t);
+        // Measure the natural (single-copy) text width at the base font size.
+        thoughtBubbleEl.style.width = '';
+        thoughtBubbleEl.textContent = prompt;
+        const measured = thoughtBubbleEl.scrollWidth;
+        const viewport = typeof window !== 'undefined' ? window.innerWidth : 280;
+        const maxW = Math.min(280, viewport * 0.7);
+        const overflow = measured > maxW - t.borderWidth * 2;
+        if (!overflow) {
+            thoughtBubbleEl.style.width = '';
+            return;
+        }
+        const textWidth = Math.max(0, measured - padH * 2);
+        const durationSec = Math.max(4, (textWidth + 48) / 30);
+        thoughtBubbleEl.style.width = `${maxW}px`;
+        thoughtBubbleEl.textContent = '';
+        const track = document.createElement('div');
+        track.className = 'fyodos-thought-track';
+        track.style.animation = `fyodos-marquee ${durationSec}s linear infinite`;
+        const first = document.createElement('span');
+        first.textContent = prompt;
+        const second = document.createElement('span');
+        second.textContent = prompt;
+        second.setAttribute('aria-hidden', 'true');
+        track.appendChild(first);
+        track.appendChild(second);
+        thoughtBubbleEl.appendChild(track);
+    }
+    function applyThoughtBubbleTheme() {
+        const t = bubbleTheme;
+        const { fontPx, padH, approxHeight } = resolveBubblePadding(t);
+        const shapeCss = bubbleShapeToCss(t, approxHeight);
+        thoughtBubbleEl.style.fontSize = `${fontPx}px`;
+        thoughtBubbleEl.style.height = `${approxHeight}px`;
+        thoughtBubbleEl.style.padding = `0 ${padH}px`;
+        thoughtBubbleEl.style.color = t.textColor;
+        thoughtBubbleEl.style.background = t.backgroundColor;
+        thoughtBubbleEl.style.border = `${t.borderWidth}px solid ${t.borderColor}`;
+        const setImportant = (prop, value) => {
+            if (!value) {
+                thoughtBubbleEl.style.removeProperty(prop);
+                return;
+            }
+            thoughtBubbleEl.style.setProperty(prop, value, 'important');
+        };
+        setImportant('border-radius', shapeCss.borderRadius);
+        setImportant('border-top-left-radius', shapeCss.borderTopLeftRadius);
+        setImportant('border-top-right-radius', shapeCss.borderTopRightRadius);
+        setImportant('border-bottom-left-radius', shapeCss.borderBottomLeftRadius);
+        setImportant('border-bottom-right-radius', shapeCss.borderBottomRightRadius);
+        setImportant('clip-path', shapeCss.clipPath);
+    }
+    function positionThoughtBubble() {
+        const dep = resolveOrbDeployment(effectivePosition());
+        if (dep.horizontal === 'left') {
+            thoughtBubbleEl.style.right = 'calc(100% + 10px)';
+            thoughtBubbleEl.style.left = '';
+        }
+        else {
+            thoughtBubbleEl.style.left = 'calc(100% + 10px)';
+            thoughtBubbleEl.style.right = '';
+        }
+        if (dep.vertical === 'up') {
+            thoughtBubbleEl.style.top = '0';
+            thoughtBubbleEl.style.bottom = '';
+            thoughtBubbleEl.style.transform = '';
+        }
+        else {
+            thoughtBubbleEl.style.bottom = '0';
+            thoughtBubbleEl.style.top = '';
+            thoughtBubbleEl.style.transform = '';
+        }
+    }
+    function syncThoughtBubble(state) {
+        const idle = !state.showThinking && !state.showWaveform && state.phase !== 'speaking' && !micFallbackActive;
+        const prompt = bubbleEnabled && !bubbleOpen && idle ? resolveCurrentBubblePrompt() : null;
+        if (!prompt) {
+            thoughtBubbleEl.style.display = 'none';
+            return;
+        }
+        thoughtBubbleEl.setAttribute('aria-label', prompt);
+        // Display before measuring so `scrollWidth` (used to detect overflow) is real.
+        thoughtBubbleEl.style.display = 'flex';
+        applyThoughtBubbleTheme();
+        layoutThoughtContent(prompt);
+        positionThoughtBubble();
+    }
     // ── Overlays (confirmation + consent) ────────────────────────────────────────
     let overlayEl = null;
     function clearOverlay() {
@@ -568,9 +712,16 @@ export function mountOrb(controller, options = {}) {
             setBubble(false);
             return;
         }
+        // Voice disabled in the dashboard: never listen/speak. Tap opens the keyboard
+        // directly (text turns are silent by default); animations are unchanged.
+        if (!voiceInputEnabled && enableTextInput) {
+            micFallbackActive = false;
+            openTextPanel();
+            return;
+        }
         // `voiceAvailable` is dynamic: the Web Speech API may be present yet the mic
         // denied/blocked, in which case we skip voice and go straight to the keyboard.
-        if (controller.voiceAvailable) {
+        if (controller.voiceAvailable && voiceInputEnabled) {
             micFallbackActive = false;
             void controller.toggleListening();
             return;
@@ -660,6 +811,7 @@ export function mountOrb(controller, options = {}) {
             sendBtn.disabled = false;
         }
         syncChip(state);
+        syncThoughtBubble(state);
         if (state.confirmationMessage !== lastConfirm) {
             lastConfirm = state.confirmationMessage;
             if (state.confirmationMessage)
@@ -677,6 +829,26 @@ export function mountOrb(controller, options = {}) {
     }
     const unsubscribe = controller.subscribe(render);
     render(controller.getState());
+    // Track the current route so the thought bubble re-resolves its CTA on
+    // navigation. No universal navigation event exists, so poll + listen to
+    // popstate / visibility for snappier updates.
+    const readRoute = () => {
+        let next = null;
+        try {
+            next = controller.config.navigation.getCurrentRoute();
+        }
+        catch {
+            /* navigation read is best-effort */
+        }
+        if (next !== currentRoute) {
+            currentRoute = next;
+            syncThoughtBubble(controller.getState());
+        }
+    };
+    readRoute();
+    const routeTimer = window.setInterval(readRoute, 700);
+    window.addEventListener('popstate', readRoute);
+    document.addEventListener('visibilitychange', readRoute);
     // ── Live dashboard config ────────────────────────────────────────────────────
     const stopWatch = watchPublishedConfig(controller, {
         pollMs: options.appearancePollMs,
@@ -689,6 +861,9 @@ export function mountOrb(controller, options = {}) {
                 publishedAppearance = config.appearance;
                 chipTheme = config.keyboardChip;
                 modalTheme = config.modalTheme;
+                bubbleTheme = config.bubbleTheme;
+                bubbleEnabled = config.bubbleEnabled;
+                voiceInputEnabled = config.voiceInputEnabled;
                 if (usePublishedPosition && config.screenPosition)
                     screenPosition = config.screenPosition;
             }
@@ -699,6 +874,7 @@ export function mountOrb(controller, options = {}) {
                 chipEl = null;
             }
             syncChip(controller.getState());
+            syncThoughtBubble(controller.getState());
             if (bubbleOpen)
                 applyBubbleTheme();
         },
@@ -707,6 +883,9 @@ export function mountOrb(controller, options = {}) {
         unmount() {
             unsubscribe();
             stopWatch();
+            window.clearInterval(routeTimer);
+            window.removeEventListener('popstate', readRoute);
+            document.removeEventListener('visibilitychange', readRoute);
             window.removeEventListener('resize', reposition);
             contentObserver?.disconnect();
             visualViewport?.removeEventListener('resize', onViewportChange);

package/dist/esm/orb/publishedConfig.d.ts

@@ -9,7 +9,7 @@
  * mobile — in real time, via polling. So Vue/Svelte/Angular read the dashboard
  * config identically to the reference, instead of ignoring it.
  */
-import { type OrbScreenPosition, type PublishedModalTheme } from '@fiodos/core';
+import { type OrbScreenPosition, type PublishedModalTheme, type ResolvedBubbleTheme } from '@fiodos/core';
 import type { AgentController } from '../controller/AgentController.js';
 import { type ChipTheme, type OrbAppearance } from './orbView.js';
 export interface ResolvedOrbConfig {
@@ -17,6 +17,16 @@ export interface ResolvedOrbConfig {
     keyboardChip: ChipTheme | null;
     modalTheme: PublishedModalTheme | undefined;
     screenPosition: OrbScreenPosition | undefined;
+    /** Resolved orb thought-bubble theme (defaults filled). */
+    bubbleTheme: ResolvedBubbleTheme;
+    /** Dashboard on/off for the thought bubble. Default true (absent = enabled). */
+    bubbleEnabled: boolean;
+    /**
+     * Dashboard on/off for the orb's VOICE channel (`voiceInputEnabled`). False
+     * ONLY when the developer turned voice off; then the orb opens the keyboard
+     * directly on tap and never plays TTS. Default true (absent = voice on).
+     */
+    voiceInputEnabled: boolean;
     /**
      * Dashboard master visibility switch (`orbEnabled`). False ONLY when the
      * developer explicitly turned the orb off. The orb is hidden when false and

package/dist/esm/orb/publishedConfig.js

@@ -9,9 +9,10 @@
  * mobile — in real time, via polling. So Vue/Svelte/Angular read the dashboard
  * config identically to the reference, instead of ignoring it.
  */
-import { mapPublishedConfigToOrbProps, } from '@fiodos/core';
+import { mapPublishedConfigToOrbProps, resolveBubbleTheme, } from '@fiodos/core';
 import { DEFAULT_ORB_APPEARANCE } from './orbView.js';
-function toResolved(props, enabled) {
+function toResolved(props, published) {
+    const enabled = published.orbEnabled !== false;
     const theme = props.theme;
     const appearance = {
         accentColor: theme.accentColor ?? DEFAULT_ORB_APPEARANCE.accentColor,
@@ -30,6 +31,9 @@ function toResolved(props, enabled) {
         keyboardChip: theme.keyboardChip ?? null,
         modalTheme: props.modalTheme,
         screenPosition: props.screenPosition,
+        bubbleTheme: resolveBubbleTheme(published.bubbleTheme),
+        bubbleEnabled: published.bubbleEnabled !== false,
+        voiceInputEnabled: published.voiceInputEnabled !== false,
         enabled,
     };
 }
@@ -51,7 +55,7 @@ export function watchPublishedConfig(controller, options) {
             if (cancelled)
                 return;
             options.onChange(res.published
-                ? toResolved(mapPublishedConfigToOrbProps(res.published), res.published.orbEnabled !== false)
+                ? toResolved(mapPublishedConfigToOrbProps(res.published), res.published)
                 : null);
         }
         catch {

package/dist/esm/version.d.ts

@@ -5,5 +5,5 @@
  * Auto-generated by scripts/sync-sdk-version.mjs from package.json. Do not edit
  * by hand — change package.json `version` and re-run the sync/release script.
  */
-export declare const SDK_VERSION = "0.1.7";
+export declare const SDK_VERSION = "0.1.10";
 export declare const SDK_PACKAGE = "@fiodos/web-core";

package/dist/esm/version.js

@@ -5,5 +5,5 @@
  * Auto-generated by scripts/sync-sdk-version.mjs from package.json. Do not edit
  * by hand — change package.json `version` and re-run the sync/release script.
  */
-export const SDK_VERSION = '0.1.7';
+export const SDK_VERSION = '0.1.10';
 export const SDK_PACKAGE = '@fiodos/web-core';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fiodos/web-core",
-  "version": "0.1.7",
+  "version": "0.1.10",
   "description": "Framework-agnostic browser layer for the Fiodos agent: a vanilla AgentController (orchestrator), DOM adapters (navigation/voice/storage), HTTP client and decision engine over @fiodos/core. Shared base for @fiodos/vue, @fiodos/svelte and @fiodos/angular (no framework imports).",
   "license": "SEE LICENSE IN LICENSE",
   "publishConfig": {
@@ -29,7 +29,7 @@
     "prepublishOnly": "node ../../scripts/sync-sdk-version.mjs && npm run build"
   },
   "dependencies": {
-    "@fiodos/core": "^0.1.0"
+    "@fiodos/core": "^0.1.7"
   },
   "devDependencies": {
     "@types/node": "^22.0.0",