@ews-admin/global-design-system 1.36.0 → 1.38.0

package/dist/index.js

@@ -1030,13 +1030,21 @@ function useSelectField({ name, control, options: _options, rules, defaultValue,
     };
 }
 
-const BCP47 = { fr: "fr-FR", en: "en-US", ar: "ar-SA" };
+const BCP47$2 = { fr: "fr-FR", en: "en-US", ar: "ar-SA" };
 function getSpeechRecognition() {
     if (typeof window === "undefined")
         return undefined;
     const w = window;
     return w.SpeechRecognition ?? w.webkitSpeechRecognition;
 }
+/** True once mounted in a browser that has the speech recognition API (false on the server). */
+function useSpeechSupported() {
+    const [supported, setSupported] = React.useState(false);
+    React.useEffect(() => {
+        setSupported(getSpeechRecognition() !== undefined);
+    }, []);
+    return supported;
+}
 /**
  * Push-to-talk on the browser speech API (MED-1783). `supported` is false on
  * the server and in browsers without the API, so the app can hide the mic.
@@ -1060,7 +1068,7 @@ function useSpeechRecognition({ language, onResult, onInterim, }) {
         if (!Ctor || recognitionRef.current)
             return;
         const recognition = new Ctor();
-        recognition.lang = BCP47[language] ?? language;
+        recognition.lang = BCP47$2[language] ?? language;
         recognition.interimResults = true;
         recognition.continuous = true;
         transcriptRef.current = "";
@@ -3476,14 +3484,192 @@ const PinCodeInput = ({ length = 4, onComplete, onChange, masked = true, autoCom
             }, type: "text", inputMode: "numeric", pattern: "[0-9]*", autoComplete: index === 0 ? autoComplete : "off", autoCorrect: "off", spellCheck: false, value: digit && masked ? MASK : digit, disabled: disabled, "aria-label": digitLabel(index + 1, length), "aria-invalid": invalid || undefined, "data-filled": !!digit, onChange: (event) => handleChange(index, event), onKeyDown: (event) => handleKeyDown(index, event), onPaste: (event) => handlePaste(index, event), onFocus: (event) => event.target.select(), className: cn("h-14 w-12 rounded-lg border bg-white text-center text-2xl font-medium text-ews-gray-900 outline-none", "transition-colors focus:border-ews-primary focus:ring-2 focus:ring-ews-primary", "disabled:cursor-not-allowed disabled:opacity-60", invalid ? "border-ews-error" : digit ? "border-ews-primary" : "border-ews-gray-300", disabled && digit && "animate-pulse") }, index))) }));
 };
 
+/**
+ * A visible tooltip for an icon button (hover and keyboard focus), so users
+ * know what the mic and the dictation buttons do. The button keeps its own
+ * aria-label; the tooltip is tied to it with aria-describedby.
+ */
+const ActionTooltip = ({ label, children, className }) => {
+    const id = React.useId();
+    return (jsxRuntime.jsxs("span", { className: cn("group relative inline-flex", className), children: [children(id), jsxRuntime.jsx("span", { id: id, role: "tooltip", className: cn("pointer-events-none absolute bottom-full start-1/2 z-50 mb-2 -translate-x-1/2 whitespace-nowrap rounded-md", "bg-ews-gray-900 px-2 py-1 text-xs font-medium text-white opacity-0 shadow transition-opacity duration-150", "group-hover:opacity-100 group-focus-within:opacity-100 rtl:translate-x-1/2"), children: label })] }));
+};
+
+const DEFAULT_TEXTS$1 = {
+    cancel: "Annuler la dictée",
+    done: "Terminer et modifier le texte",
+    send: "Envoyer",
+    unavailable: "Micro indisponible : autorisez-le (page https requise).",
+};
+const BCP47$1 = { fr: "fr-FR", en: "en-US", ar: "ar-SA" };
+const BARS = 28;
+const BLOCKING_ERRORS$1 = new Set(["not-allowed", "service-not-allowed", "audio-capture"]);
+const formatElapsed = (seconds) => `${Math.floor(seconds / 60)}:${String(seconds % 60).padStart(2, "0")}`;
+/**
+ * The recording bar of the mockup (audio3): cancel, a live waveform, the
+ * elapsed time, done and send. Recording starts as soon as it shows. The
+ * waveform follows the mic level when the browser gives it, and moves while
+ * words come in otherwise.
+ */
+const AssistantDictationBar = ({ language, onCancel, onDone, onSend, texts, className, }) => {
+    const t = { ...DEFAULT_TEXTS$1, ...texts };
+    const [levels, setLevels] = React.useState(() => Array(BARS).fill(0.15));
+    const [elapsed, setElapsed] = React.useState(0);
+    const [unavailable, setUnavailable] = React.useState(() => typeof window !== "undefined" && window.isSecureContext === false);
+    const transcriptRef = React.useRef("");
+    const recognitionRef = React.useRef(null);
+    const actionRef = React.useRef(null);
+    const callbacks = React.useRef({ onCancel, onDone, onSend });
+    callbacks.current = { onCancel, onDone, onSend };
+    const pushLevel = React.useCallback((level) => {
+        setLevels((current) => [...current.slice(1), Math.max(0.12, Math.min(1, level))]);
+    }, []);
+    const finish = React.useCallback(() => {
+        const text = transcriptRef.current.trim();
+        const action = actionRef.current;
+        if (action === "send" && text)
+            callbacks.current.onSend(text);
+        else if (action === "done")
+            callbacks.current.onDone(text);
+        else
+            callbacks.current.onCancel();
+    }, []);
+    // Speech recognition, from the first render.
+    React.useEffect(() => {
+        if (unavailable)
+            return;
+        const Ctor = getSpeechRecognition();
+        if (!Ctor) {
+            setUnavailable(true);
+            return;
+        }
+        const recognition = new Ctor();
+        recognition.lang = BCP47$1[language] ?? language;
+        recognition.interimResults = true;
+        recognition.continuous = true;
+        recognition.onresult = (event) => {
+            let text = "";
+            for (let i = 0; i < event.results.length; i++)
+                text += event.results[i][0]?.transcript ?? "";
+            if (text.length !== transcriptRef.current.length)
+                pushLevel(0.4 + Math.random() * 0.6);
+            transcriptRef.current = text;
+        };
+        recognition.onerror = (event) => {
+            if (event.error && BLOCKING_ERRORS$1.has(event.error)) {
+                recognition.onend = null;
+                recognitionRef.current = null;
+                setUnavailable(true);
+            }
+        };
+        recognition.onend = () => {
+            if (recognitionRef.current !== recognition)
+                return;
+            recognitionRef.current = null;
+            if (actionRef.current)
+                finish();
+            else {
+                // The browser stopped after a silence: keep recording.
+                try {
+                    recognition.start();
+                    recognitionRef.current = recognition;
+                }
+                catch {
+                    /* ignore: the user can still press done */
+                }
+            }
+        };
+        recognitionRef.current = recognition;
+        recognition.start();
+        return () => {
+            recognition.onend = null;
+            recognitionRef.current = null;
+            recognition.abort();
+        };
+    }, [finish, language, pushLevel, unavailable]);
+    // Live mic level for the waveform, where the browser allows it.
+    React.useEffect(() => {
+        if (unavailable || typeof navigator === "undefined" || !navigator.mediaDevices?.getUserMedia)
+            return;
+        const w = window;
+        const AudioCtx = w.AudioContext ?? w.webkitAudioContext;
+        if (!AudioCtx)
+            return;
+        let stream = null;
+        let context = null;
+        let frame = 0;
+        let cancelled = false;
+        navigator.mediaDevices
+            .getUserMedia({ audio: true })
+            .then((media) => {
+            if (cancelled) {
+                media.getTracks().forEach((track) => track.stop());
+                return;
+            }
+            stream = media;
+            context = new AudioCtx();
+            const analyser = context.createAnalyser();
+            analyser.fftSize = 256;
+            context.createMediaStreamSource(media).connect(analyser);
+            const data = new Uint8Array(analyser.frequencyBinCount);
+            let last = 0;
+            const tick = (now) => {
+                if (now - last > 80) {
+                    analyser.getByteTimeDomainData(data);
+                    let peak = 0;
+                    for (const value of data)
+                        peak = Math.max(peak, Math.abs(value - 128));
+                    pushLevel(peak / 64);
+                    last = now;
+                }
+                frame = requestAnimationFrame(tick);
+            };
+            frame = requestAnimationFrame(tick);
+            return undefined;
+        })
+            .catch(() => undefined);
+        return () => {
+            cancelled = true;
+            cancelAnimationFrame(frame);
+            stream?.getTracks().forEach((track) => track.stop());
+            void context?.close();
+        };
+    }, [pushLevel, unavailable]);
+    // Elapsed time.
+    React.useEffect(() => {
+        if (unavailable)
+            return;
+        const timer = setInterval(() => setElapsed((value) => value + 1), 1000);
+        return () => clearInterval(timer);
+    }, [unavailable]);
+    const end = (action) => {
+        actionRef.current = action;
+        const recognition = recognitionRef.current;
+        if (!recognition || action === "cancel") {
+            if (recognition) {
+                recognition.onend = null;
+                recognitionRef.current = null;
+                recognition.abort();
+            }
+            finish();
+            return;
+        }
+        // stop() delivers the last words, then onend calls finish().
+        recognition.stop();
+    };
+    return (jsxRuntime.jsxs("div", { className: cn("flex w-full items-center gap-2 rounded-full bg-ews-gray-100 px-3 py-1.5", className), "data-testid": "assistant-dictation", children: [jsxRuntime.jsx("button", { type: "button", onClick: () => end("cancel"), "aria-label": t.cancel, title: t.cancel, className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-full text-ews-gray-600 hover:bg-ews-gray-200 focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-dictation-cancel", children: jsxRuntime.jsx(lucideReact.X, { className: "h-5 w-5", "aria-hidden": "true" }) }), unavailable ? (jsxRuntime.jsx("p", { className: "flex-1 truncate text-sm text-ews-error", role: "alert", "data-testid": "assistant-dictation-unavailable", children: t.unavailable })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("div", { className: "flex h-8 flex-1 items-center justify-center gap-[3px]", "aria-hidden": "true", "data-testid": "assistant-dictation-wave", children: levels.map((level, index) => (jsxRuntime.jsx("span", { className: "w-[3px] rounded-full bg-ews-gray-700 transition-[height] duration-100", style: { height: `${Math.round(level * 100)}%` } }, index))) }), jsxRuntime.jsx("span", { className: "w-10 shrink-0 text-end text-sm tabular-nums text-ews-gray-600", "data-testid": "assistant-dictation-time", children: formatElapsed(elapsed) })] })), jsxRuntime.jsx("button", { type: "button", onClick: () => end("done"), disabled: unavailable, "aria-label": t.done, title: t.done, className: "flex h-9 w-9 shrink-0 items-center justify-center rounded-full text-ews-gray-700 hover:bg-ews-gray-200 focus:outline-none focus:ring-2 focus:ring-ews-primary disabled:opacity-40", "data-testid": "assistant-dictation-done", children: jsxRuntime.jsx(lucideReact.Check, { className: "h-5 w-5", "aria-hidden": "true" }) }), jsxRuntime.jsx("button", { type: "button", onClick: () => end("send"), disabled: unavailable, "aria-label": t.send, title: t.send, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-ews-primary text-white shadow-sm hover:bg-ews-primary-hover focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1 disabled:opacity-40", "data-testid": "assistant-dictation-send", children: jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-5 w-5", "aria-hidden": "true" }) })] }));
+};
+
 const MAX_MESSAGE_LENGTH = 2000;
 /**
- * The composer of the mockup: textarea, hint, push-to-talk mic (hold to
- * record, release to send) and a send button. Enter sends, Shift+Enter breaks.
+ * The composer of the mockup: textarea, hint, a dictation button (waveform:
+ * a recording bar transcribes into the field), a mic (the voice conversation)
+ * and send. Both voice buttons show a tooltip. Enter sends, Shift+Enter breaks.
  */
-const AssistantComposer = ({ language, onSend, disabled = false, voice = true, texts, className, }) => {
+const AssistantComposer = ({ language, onSend, disabled = false, voice = true, onVoice, draft = null, texts, className, }) => {
     const [value, setValue] = React.useState("");
+    const [dictating, setDictating] = React.useState(false);
     const textareaRef = React.useRef(null);
+    const speechSupported = useSpeechSupported();
     const submit = React.useCallback((content) => {
         const trimmed = content.trim();
         if (!trimmed || disabled)
@@ -3491,32 +3677,34 @@ const AssistantComposer = ({ language, onSend, disabled = false, voice = true, t
         onSend(trimmed.slice(0, MAX_MESSAGE_LENGTH));
         setValue("");
     }, [disabled, onSend]);
-    const speech = useSpeechRecognition({
-        language,
-        onInterim: (text) => setValue(text),
-        onResult: (text) => submit(text),
-    });
+    const handledDraftRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!draft || draft.id === handledDraftRef.current)
+            return;
+        handledDraftRef.current = draft.id;
+        setValue(draft.content.slice(0, MAX_MESSAGE_LENGTH));
+        textareaRef.current?.focus();
+    }, [draft]);
     const onKeyDown = (event) => {
         if (event.key === "Enter" && !event.shiftKey) {
             event.preventDefault();
             submit(value);
         }
     };
-    const showMic = voice && speech.supported;
+    const showVoice = voice && speechSupported;
+    const dictateLabel = texts.dictate ?? "Dicter un message";
     // A plain div rather than a <form>: Enter and the send button submit, and a
     // form followed by a sibling trips React hydration under happy-dom (the apps'
     // server-rendering tests) although browsers are fine.
-    return (jsxRuntime.jsxs("div", { className: cn("w-full", className), children: [jsxRuntime.jsxs("div", { className: cn("flex items-end gap-2 rounded-2xl border border-ews-gray-200 bg-white px-3 py-2 shadow-sm", "focus-within:border-ews-primary focus-within:ring-2 focus-within:ring-ews-primary/20"), children: [jsxRuntime.jsx("textarea", { ref: textareaRef, value: value, onChange: (event) => setValue(event.target.value), onKeyDown: onKeyDown, rows: 1, maxLength: MAX_MESSAGE_LENGTH, placeholder: speech.listening ? texts.listening : texts.placeholder, "aria-label": texts.placeholder, disabled: disabled, className: "max-h-40 min-h-[2.5rem] flex-1 resize-none bg-transparent py-2 text-base text-ews-gray-900 placeholder:text-ews-gray-400 focus:outline-none disabled:opacity-60" }), showMic && (jsxRuntime.jsx("button", { type: "button", "aria-label": texts.holdToTalk, "aria-pressed": speech.listening, title: texts.holdToTalk, disabled: disabled, onMouseDown: speech.start, onMouseUp: speech.stop, onMouseLeave: speech.listening ? speech.stop : undefined, onTouchStart: speech.start, onTouchEnd: speech.stop, onKeyDown: (event) => {
-                            if (event.key === " " || event.key === "Enter") {
-                                event.preventDefault();
-                                if (speech.listening)
-                                    speech.stop();
-                                else
-                                    speech.start();
-                            }
-                        }, className: cn("rounded-full p-2 transition-colors focus:outline-none focus:ring-2 focus:ring-ews-primary", speech.listening
-                            ? "bg-ews-error text-white animate-pulse"
-                            : "text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-primary", "disabled:opacity-50"), "data-testid": "assistant-mic", children: jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5", "aria-hidden": "true" }) })), jsxRuntime.jsx("button", { type: "button", onClick: () => submit(value), "aria-label": texts.send, title: texts.send, disabled: disabled || value.trim().length === 0, className: "rounded-full bg-ews-primary p-2 text-white transition-colors hover:bg-ews-primary-hover focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1 disabled:opacity-40", "data-testid": "assistant-send", children: jsxRuntime.jsx(lucideReact.SendHorizontal, { className: "h-5 w-5 rtl:-scale-x-100", "aria-hidden": "true" }) })] }), jsxRuntime.jsx("p", { className: "mt-1.5 px-2 text-xs text-ews-gray-400", children: texts.hint })] }));
+    return (jsxRuntime.jsxs("div", { className: cn("w-full", className), children: [dictating ? (jsxRuntime.jsx(AssistantDictationBar, { language: language, texts: texts.dictation, onCancel: () => setDictating(false), onDone: (text) => {
+                    setDictating(false);
+                    if (text)
+                        setValue((current) => (current ? `${current} ${text}` : text).slice(0, MAX_MESSAGE_LENGTH));
+                    setTimeout(() => textareaRef.current?.focus(), 0);
+                }, onSend: (text) => {
+                    setDictating(false);
+                    submit(value ? `${value} ${text}` : text);
+                } })) : (jsxRuntime.jsxs("div", { className: cn("flex items-end gap-2 rounded-2xl border border-ews-gray-200 bg-white px-3 py-2 shadow-sm", "focus-within:border-ews-primary focus-within:ring-2 focus-within:ring-ews-primary/20"), children: [jsxRuntime.jsx("textarea", { ref: textareaRef, value: value, onChange: (event) => setValue(event.target.value), onKeyDown: onKeyDown, rows: 1, maxLength: MAX_MESSAGE_LENGTH, placeholder: texts.placeholder, "aria-label": texts.placeholder, disabled: disabled, className: "max-h-40 min-h-[2.5rem] flex-1 resize-none bg-transparent py-2 text-base text-ews-gray-900 placeholder:text-ews-gray-400 focus:outline-none disabled:opacity-60" }), showVoice && (jsxRuntime.jsx(ActionTooltip, { label: dictateLabel, children: (describedBy) => (jsxRuntime.jsx("button", { type: "button", "aria-label": dictateLabel, "aria-describedby": describedBy, disabled: disabled, onClick: () => setDictating(true), className: "rounded-full p-2 text-ews-gray-500 transition-colors hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary disabled:opacity-50", "data-testid": "assistant-dictate", children: jsxRuntime.jsx(lucideReact.AudioLines, { className: "h-5 w-5", "aria-hidden": "true" }) })) })), showVoice && onVoice && (jsxRuntime.jsx(ActionTooltip, { label: texts.holdToTalk, children: (describedBy) => (jsxRuntime.jsx("button", { type: "button", "aria-label": texts.holdToTalk, "aria-describedby": describedBy, disabled: disabled, onClick: onVoice, className: "rounded-full p-2 text-ews-gray-500 transition-colors hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary disabled:opacity-50", "data-testid": "assistant-mic", children: jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5", "aria-hidden": "true" }) })) })), jsxRuntime.jsx("button", { type: "button", onClick: () => submit(value), "aria-label": texts.send, title: texts.send, disabled: disabled || value.trim().length === 0, className: "rounded-full bg-ews-primary p-2 text-white transition-colors hover:bg-ews-primary-hover focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1 disabled:opacity-40", "data-testid": "assistant-send", children: jsxRuntime.jsx(lucideReact.SendHorizontal, { className: "h-5 w-5 rtl:-scale-x-100", "aria-hidden": "true" }) })] })), jsxRuntime.jsx("p", { className: "mt-1.5 px-2 text-xs text-ews-gray-400", children: texts.hint })] }));
 };
 
 /**
@@ -3566,7 +3754,8 @@ function renderInline(text, keyPrefix, options) {
             nodes.push(text.slice(last, start));
         const token = match[0];
         if (token.startsWith("**")) {
-            nodes.push(jsxRuntime.jsx("strong", { children: token.slice(2, -2) }, `${keyPrefix}-b${index}`));
+            // MED-1801: a bold run can hold a link, e.g. **[Dr Ba](/doctors/8)**.
+            nodes.push(jsxRuntime.jsx("strong", { children: renderInline(token.slice(2, -2), `${keyPrefix}-b${index}`, options) }, `${keyPrefix}-b${index}`));
         }
         else {
             const close = token.indexOf("](");
@@ -3615,10 +3804,169 @@ const AssistantMessages = ({ messages, activity, onRetry, texts, linkOptions, cl
             }), jsxRuntime.jsx("div", { ref: endRef })] }));
 };
 
-/** One of the cards under the hero (mockup med1): title, description, sent as a prompt on click. */
+/** One of the cards under the hero (mockups med1 and tools): icon, title, description, sent as a prompt on click. */
 const AssistantSuggestionCard = ({ suggestion, onSelect, exampleLabel, disabled = false, className, }) => {
     const isExample = suggestion.kind === "example";
-    return (jsxRuntime.jsxs("button", { type: "button", disabled: disabled, onClick: () => onSelect(suggestion), className: cn("flex h-full w-full flex-col items-start gap-2 rounded-xl border border-ews-gray-200 bg-white p-4 text-start shadow-sm transition-colors", "hover:border-ews-primary hover:bg-ews-gray-50 focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1", "disabled:cursor-not-allowed disabled:opacity-60", className), "data-testid": `assistant-suggestion-${suggestion.id}`, children: [jsxRuntime.jsx("span", { className: "text-ews-gray-400", "aria-hidden": "true", children: suggestion.icon ?? (isExample ? jsxRuntime.jsx(lucideReact.Sparkles, { className: "h-4 w-4" }) : jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-4 w-4" })) }), jsxRuntime.jsx("span", { className: "font-semibold text-ews-gray-900", children: suggestion.title }), suggestion.description && (jsxRuntime.jsx("span", { className: "text-sm text-ews-gray-600", children: suggestion.description })), isExample && (jsxRuntime.jsx("span", { className: "mt-auto text-xs uppercase tracking-wide text-ews-gray-400", children: exampleLabel }))] }));
+    return (jsxRuntime.jsxs("button", { type: "button", disabled: disabled, onClick: () => onSelect(suggestion), className: cn(
+        // A soft grey card without border (mockup tools); it lifts with a shadow on hover.
+        "flex h-full w-full flex-col items-start gap-2 rounded-2xl bg-ews-gray-100 p-4 text-start transition-[background-color,box-shadow]", "hover:bg-ews-gray-50 hover:shadow-lg focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1", "disabled:cursor-not-allowed disabled:opacity-60", className), "data-testid": `assistant-suggestion-${suggestion.id}`, children: [jsxRuntime.jsx("span", { className: "mb-2 text-ews-gray-600", "aria-hidden": "true", children: suggestion.icon ?? (isExample ? jsxRuntime.jsx(lucideReact.Sparkles, { className: "h-4 w-4" }) : jsxRuntime.jsx(lucideReact.ArrowRight, { className: "h-4 w-4" })) }), jsxRuntime.jsx("span", { className: "font-semibold leading-snug text-ews-gray-900", children: suggestion.title }), suggestion.description && (jsxRuntime.jsx("span", { className: "text-sm leading-snug text-ews-gray-400", children: suggestion.description })), isExample && (jsxRuntime.jsx("span", { className: "mt-auto text-xs uppercase tracking-wide text-ews-gray-400", children: exampleLabel }))] }));
+};
+
+const DEFAULT_TEXTS = {
+    title: "Conversation vocale avec Medecine360",
+    listening: "À l'écoute…",
+    thinking: "Réflexion…",
+    speaking: "Réponse…",
+    muted: "Micro coupé",
+    mute: "Couper le micro",
+    unmute: "Réactiver le micro",
+    end: "Terminer",
+    unavailable: "Le micro n'est pas accessible. Autorisez-le dans le navigateur ; il ne fonctionne que sur une page sécurisée (https).",
+};
+/** Errors after which listening again cannot work until the user acts. */
+const BLOCKING_ERRORS = new Set(["not-allowed", "service-not-allowed", "audio-capture"]);
+const BCP47 = { fr: "fr-FR", en: "en-US", ar: "ar-SA" };
+/** Markdown and links read aloud as plain words. */
+function toSpokenText(markdown) {
+    return markdown
+        .replace(/\[([^\]]+)\]\([^)]+\)/g, "$1")
+        .replace(/https?:\/\/\S+/g, "")
+        .replace(/\*\*/g, "")
+        .replace(/^\s*[-*•]\s+/gm, "")
+        .replace(/\s+/g, " ")
+        .trim();
+}
+/**
+ * MED-1801 (voice): the voice conversation screen of the mockup. Listening
+ * starts as soon as it opens; a finished sentence is sent to the same
+ * conversation; the mic pauses while the assistant answers (read aloud when
+ * the browser can) and resumes after. Mute stops the mic; Terminer closes.
+ */
+const AssistantVoiceMode = ({ language, messages, busy, onSend, onClose, texts, speak = true, }) => {
+    const t = { ...DEFAULT_TEXTS, ...texts };
+    const [muted, setMuted] = React.useState(false);
+    const [speaking, setSpeaking] = React.useState(false);
+    const [interim, setInterim] = React.useState("");
+    // The mic cannot work: insecure page (http) or permission refused.
+    const [unavailable, setUnavailable] = React.useState(() => typeof window !== "undefined" && window.isSecureContext === false);
+    const recognitionRef = React.useRef(null);
+    const restartTimerRef = React.useRef(null);
+    const sentRef = React.useRef(false);
+    // Only the turns of this voice session are shown.
+    const [firstIndex] = React.useState(messages.length);
+    const spokenRef = React.useRef(null);
+    const callbacks = React.useRef({ onSend });
+    callbacks.current = { onSend };
+    const stopListening = React.useCallback(() => {
+        if (restartTimerRef.current)
+            clearTimeout(restartTimerRef.current);
+        restartTimerRef.current = null;
+        const recognition = recognitionRef.current;
+        recognitionRef.current = null;
+        if (recognition) {
+            recognition.onend = null;
+            recognition.abort();
+        }
+    }, []);
+    const startListening = React.useCallback(() => {
+        const Ctor = getSpeechRecognition();
+        if (!Ctor || recognitionRef.current)
+            return;
+        const recognition = new Ctor();
+        recognition.lang = BCP47[language] ?? language;
+        recognition.interimResults = true;
+        recognition.continuous = true;
+        sentRef.current = false;
+        recognition.onresult = (event) => {
+            let text = "";
+            let final = false;
+            for (let i = 0; i < event.results.length; i++) {
+                text += event.results[i][0]?.transcript ?? "";
+                if (event.results[i].isFinal)
+                    final = true;
+            }
+            const trimmed = text.trim();
+            setInterim(trimmed);
+            if (final && trimmed && !sentRef.current) {
+                sentRef.current = true;
+                setInterim("");
+                recognitionRef.current = null;
+                recognition.onend = null;
+                recognition.stop();
+                callbacks.current.onSend(trimmed);
+            }
+        };
+        recognition.onerror = (event) => {
+            // Permission refused or no mic: stop here and say so, never retry in a loop.
+            if (event.error && BLOCKING_ERRORS.has(event.error)) {
+                recognitionRef.current = null;
+                recognition.onend = null;
+                setUnavailable(true);
+            }
+            /* other errors (no-speech, network): onend follows and listens again */
+        };
+        recognition.onend = () => {
+            // The browser ends recognition after a silence: listen again, a moment later.
+            if (recognitionRef.current === recognition) {
+                recognitionRef.current = null;
+                restartTimerRef.current = setTimeout(() => startListeningRef.current(), 250);
+            }
+        };
+        recognitionRef.current = recognition;
+        recognition.start();
+    }, [language]);
+    const startListeningRef = React.useRef(startListening);
+    startListeningRef.current = startListening;
+    const last = messages[messages.length - 1];
+    const canSpeak = speak && typeof window !== "undefined" && "speechSynthesis" in window;
+    // Read the finished answer aloud, once.
+    React.useEffect(() => {
+        if (busy || !last || last.role !== "assistant" || last.status === "streaming")
+            return;
+        if (messages.length <= firstIndex || spokenRef.current === last.id)
+            return;
+        spokenRef.current = last.id;
+        const text = toSpokenText(last.content);
+        if (!canSpeak || !text)
+            return;
+        const utterance = new SpeechSynthesisUtterance(text);
+        utterance.lang = BCP47[language] ?? language;
+        utterance.onend = () => setSpeaking(false);
+        utterance.onerror = () => setSpeaking(false);
+        setSpeaking(true);
+        window.speechSynthesis.speak(utterance);
+    }, [busy, canSpeak, firstIndex, language, last, messages.length]);
+    // Listen whenever nobody else is talking.
+    const shouldListen = !muted && !busy && !speaking && !unavailable;
+    React.useEffect(() => {
+        if (shouldListen)
+            startListening();
+        else
+            stopListening();
+    }, [shouldListen, startListening, stopListening]);
+    React.useEffect(() => () => {
+        stopListening();
+        if (typeof window !== "undefined" && "speechSynthesis" in window)
+            window.speechSynthesis.cancel();
+    }, [stopListening]);
+    const phase = unavailable
+        ? "unavailable"
+        : muted
+            ? "muted"
+            : busy
+                ? "thinking"
+                : speaking
+                    ? "speaking"
+                    : "listening";
+    const status = {
+        listening: t.listening,
+        thinking: t.thinking,
+        speaking: t.speaking,
+        muted: t.muted,
+        unavailable: t.unavailable,
+    }[phase];
+    const turns = messages.slice(firstIndex).filter((message) => message.content.trim().length > 0);
+    return (jsxRuntime.jsxs("div", { dir: language === "ar" ? "rtl" : "ltr", className: "absolute inset-0 z-30 flex flex-col bg-white", role: "dialog", "aria-label": t.title, "data-phase": phase, "data-testid": "assistant-voice-mode", children: [jsxRuntime.jsxs("div", { className: "flex items-center gap-2 px-5 pt-4 text-sm text-ews-gray-600", children: [jsxRuntime.jsx("span", { className: "h-2 w-2 rounded-full bg-emerald-500", "aria-hidden": "true" }), t.title] }), jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-3 pt-8", children: [jsxRuntime.jsx("div", { className: cn("h-32 w-32 rounded-full shadow-[0_0_60px_rgba(33,89,108,0.35)] transition-transform duration-700", "bg-[radial-gradient(circle_at_30%_25%,#ffffff_0%,#c0d0d4_35%,#21596c_75%,#1a4756_100%)]", phase === "listening" && "animate-pulse", phase === "speaking" && "scale-110", (phase === "muted" || phase === "unavailable") && "opacity-50"), "aria-hidden": "true", "data-testid": "assistant-voice-orb" }), jsxRuntime.jsx("p", { className: cn("max-w-xs px-4 text-center text-sm", phase === "unavailable" ? "text-ews-error" : "text-ews-gray-500"), role: phase === "unavailable" ? "alert" : undefined, "aria-live": "polite", "data-testid": "assistant-voice-status", children: status })] }), jsxRuntime.jsxs("div", { className: "flex-1 space-y-3 overflow-y-auto px-5 py-6", "data-testid": "assistant-voice-transcript", children: [turns.map((message) => (jsxRuntime.jsx("div", { className: cn("flex", message.role === "user" ? "justify-end" : "justify-start"), children: jsxRuntime.jsx("p", { className: cn("max-w-[85%] rounded-2xl px-4 py-2 text-sm", message.role === "user" ? "bg-ews-gray-100 text-ews-gray-800" : "bg-ews-primary-light/40 text-ews-gray-900"), children: message.role === "assistant" ? toSpokenText(message.content) : message.content }) }, message.id))), interim && (jsxRuntime.jsx("div", { className: "flex justify-end", children: jsxRuntime.jsx("p", { className: "max-w-[85%] rounded-2xl bg-ews-gray-100 px-4 py-2 text-sm italic text-ews-gray-500", "data-testid": "assistant-voice-interim", children: interim }) }))] }), jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-3 pb-6", children: [jsxRuntime.jsx("button", { type: "button", disabled: unavailable, onClick: () => setMuted((value) => !value), "aria-pressed": muted, "aria-label": muted ? t.unmute : t.mute, title: muted ? t.unmute : t.mute, className: "flex h-11 w-11 items-center justify-center rounded-full border border-ews-gray-200 text-ews-gray-600 hover:bg-ews-gray-50 disabled:opacity-40", "data-testid": "assistant-voice-mute", children: muted ? jsxRuntime.jsx(lucideReact.MicOff, { className: "h-5 w-5", "aria-hidden": "true" }) : jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5", "aria-hidden": "true" }) }), jsxRuntime.jsx("button", { type: "button", onClick: onClose, className: "rounded-full bg-red-600 px-6 py-2.5 text-sm font-semibold text-white shadow hover:bg-red-700", "data-testid": "assistant-voice-end", children: t.end })] })] }));
 };
 
 const DIRECTION$1 = {
@@ -3640,7 +3988,7 @@ function conversationTitle(firstMessage, max = 60) {
  * Server-rendering safe: nothing touches `window` at render time, the
  * speech API is detected after mount.
  */
-const AssistantChat = ({ transport, language, texts, suggestions, conversations = [], activeConversationId = null, initialMessages, onConversationCreated, onSelectConversation, onNewConversation, signInHref, headerAction, disclaimer, heroBackground, voice = true, pendingConfirmation = null, onConfirm, onCancelConfirmation, layout = "page", queuedPrompt = null, onNavigate, historyOpen = false, onHistoryOpenChange, className, }) => {
+const AssistantChat = ({ transport, language, texts, suggestions, conversations = [], activeConversationId = null, initialMessages, onConversationCreated, onSelectConversation, onNewConversation, signInHref, headerAction, disclaimer, heroBackground, voice = true, pendingConfirmation = null, onConfirm, onCancelConfirmation, layout = "page", queuedPrompt = null, voiceRequest = null, composerDraft = null, onNavigate, historyOpen = false, onHistoryOpenChange, className, }) => {
     const [messages, setMessages] = React.useState(initialMessages ?? []);
     const [activity, setActivity] = React.useState(null);
     const [busy, setBusy] = React.useState(false);
@@ -3751,6 +4099,15 @@ const AssistantChat = ({ transport, language, texts, suggestions, conversations
         handledPromptRef.current = queuedPrompt.id;
         void send(queuedPrompt.content);
     }, [busy, queuedPrompt, send]);
+    // Voice conversation screen, opened by the mic (here or in the launcher bar).
+    const [voiceOpen, setVoiceOpen] = React.useState(false);
+    const handledVoiceRef = React.useRef(null);
+    React.useEffect(() => {
+        if (!voiceRequest || voiceRequest.id === handledVoiceRef.current)
+            return;
+        handledVoiceRef.current = voiceRequest.id;
+        setVoiceOpen(true);
+    }, [voiceRequest]);
     /** Retry re-sends the user message that preceded the failed answer. */
     const retry = React.useCallback((failed) => {
         const index = messages.findIndex((message) => message.id === failed.id);
@@ -3773,13 +4130,17 @@ const AssistantChat = ({ transport, language, texts, suggestions, conversations
     const compact = layout === "panel";
     const withList = layout !== "panel";
     const historyLabel = texts.history ?? texts.recentConversations;
-    return (jsxRuntime.jsxs("div", { dir: dir, lang: language, className: cn("overflow-hidden bg-white", layout === "page" && "grid min-h-[36rem] grid-cols-1 rounded-2xl border border-ews-gray-200 shadow-sm md:grid-cols-[16rem_1fr]", layout === "wide" && "grid h-full min-h-0 grid-cols-1 md:grid-cols-[16rem_1fr]", compact && "relative flex h-full min-h-0 flex-col", className), "data-layout": layout, "data-testid": "assistant-chat", children: [withList && (jsxRuntime.jsx(AssistantConversationList, { conversations: conversations, activeConversationId: activeConversationId, onSelect: onSelectConversation, onNew: startNewConversation, texts: texts, signInHref: signInHref, className: "hidden border-e border-ews-gray-200 md:flex" })), compact && historyOpen && (jsxRuntime.jsxs("div", { className: "absolute inset-0 z-10 flex", "data-testid": "assistant-history", children: [jsxRuntime.jsx(AssistantConversationList, { conversations: conversations, activeConversationId: activeConversationId, onSelect: (id) => {
+    return (jsxRuntime.jsxs("div", { dir: dir, lang: language, className: cn("relative overflow-hidden bg-white", layout === "page" && "grid min-h-[36rem] grid-cols-1 rounded-2xl border border-ews-gray-200 shadow-sm md:grid-cols-[16rem_1fr]", layout === "wide" && "grid h-full min-h-0 grid-cols-1 md:grid-cols-[16rem_1fr]", compact && "relative flex h-full min-h-0 flex-col", className), "data-layout": layout, "data-testid": "assistant-chat", children: [withList && (jsxRuntime.jsx(AssistantConversationList, { conversations: conversations, activeConversationId: activeConversationId, onSelect: onSelectConversation, onNew: startNewConversation, texts: texts, signInHref: signInHref, className: "hidden border-e border-ews-gray-200 md:flex" })), compact && historyOpen && (jsxRuntime.jsxs("div", { className: "absolute inset-0 z-10 flex", "data-testid": "assistant-history", children: [jsxRuntime.jsx(AssistantConversationList, { conversations: conversations, activeConversationId: activeConversationId, onSelect: (id) => {
                             onSelectConversation?.(id);
                             onHistoryOpenChange?.(false);
                         }, onNew: () => {
                             startNewConversation();
                             onHistoryOpenChange?.(false);
-                        }, texts: texts, signInHref: signInHref, className: "w-72 max-w-full border-e border-ews-gray-200 shadow-xl" }), jsxRuntime.jsx("div", { className: "flex-1 bg-black/20", onClick: () => onHistoryOpenChange?.(false), "data-testid": "assistant-history-overlay" })] })), jsxRuntime.jsxs("div", { className: "flex min-h-0 min-w-0 flex-1 flex-col", children: [jsxRuntime.jsxs("header", { className: "flex items-center justify-between gap-3 border-b border-ews-gray-200 px-4 py-3", children: [jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [jsxRuntime.jsx("span", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-ews-primary text-sm font-bold text-white", "aria-hidden": "true", children: texts.brandName.charAt(0) }), jsxRuntime.jsx("span", { className: "truncate font-semibold text-ews-gray-900", children: texts.brandName }), jsxRuntime.jsx("span", { className: "rounded-full bg-ews-gray-100 px-2 py-0.5 text-xs font-medium text-ews-gray-600", children: "AI" }), jsxRuntime.jsxs("span", { className: "flex items-center gap-1 text-xs text-ews-gray-500", children: [jsxRuntime.jsx("span", { className: "h-2 w-2 rounded-full bg-ews-success", "aria-hidden": "true" }), texts.online] })] }), jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [compact && onHistoryOpenChange && (jsxRuntime.jsx("button", { type: "button", onClick: () => onHistoryOpenChange(!historyOpen), "aria-label": historyLabel, "aria-pressed": historyOpen, title: historyLabel, className: cn("rounded-full p-2 hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary", historyOpen ? "bg-ews-gray-100 text-ews-primary" : "text-ews-gray-500"), "data-testid": "assistant-history-toggle", children: jsxRuntime.jsx(lucideReact.History, { className: "h-4 w-4", "aria-hidden": "true" }) })), !withList && !empty && (jsxRuntime.jsx("button", { type: "button", onClick: startNewConversation, "aria-label": texts.newConversation, title: texts.newConversation, className: "rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-new-conversation", children: jsxRuntime.jsx(lucideReact.SquarePen, { className: "h-4 w-4", "aria-hidden": "true" }) })), headerAction] })] }), jsxRuntime.jsx("div", { className: "flex flex-1 flex-col overflow-y-auto", children: empty ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("section", { className: cn("relative overflow-hidden bg-ews-primary-light text-center", compact ? "px-4 py-6" : "px-6 py-10"), children: [heroBackground && jsxRuntime.jsx("div", { className: "absolute inset-0", "aria-hidden": "true", children: heroBackground }), jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsx("h2", { className: cn("font-bold text-ews-gray-900", compact ? "text-xl" : "text-2xl sm:text-3xl"), children: texts.heroTitle }), jsxRuntime.jsx("p", { className: cn("mx-auto mt-2 max-w-xl text-ews-gray-700", compact && "text-sm"), children: texts.heroSubtitle })] })] }), jsxRuntime.jsx("div", { className: cn("grid gap-3 px-4 py-5", compact ? "grid-cols-1" : "sm:grid-cols-2 lg:grid-cols-4"), "data-testid": "assistant-suggestions", children: suggestions.map((suggestion) => (jsxRuntime.jsx(AssistantSuggestionCard, { suggestion: suggestion, onSelect: (selected) => void send(selected.prompt), exampleLabel: texts.exampleLabel, disabled: busy }, suggestion.id))) })] })) : (jsxRuntime.jsxs("div", { className: "flex-1 px-4 py-5", children: [jsxRuntime.jsx(AssistantMessages, { messages: messages, activity: activity, onRetry: retry, texts: texts, linkOptions: onNavigate
+                        }, texts: texts, signInHref: signInHref, className: "w-72 max-w-full border-e border-ews-gray-200 shadow-xl" }), jsxRuntime.jsx("div", { className: "flex-1 bg-black/20", onClick: () => onHistoryOpenChange?.(false), "data-testid": "assistant-history-overlay" })] })), jsxRuntime.jsxs("div", { className: "relative flex min-h-0 min-w-0 flex-1 flex-col", children: [jsxRuntime.jsxs("header", { className: "flex items-center justify-between gap-3 border-b border-ews-gray-200 px-4 py-3", children: [jsxRuntime.jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [jsxRuntime.jsx("span", { className: "flex h-8 w-8 shrink-0 items-center justify-center rounded-lg bg-ews-primary text-sm font-bold text-white", "aria-hidden": "true", children: texts.brandName.charAt(0) }), jsxRuntime.jsx("span", { className: "truncate font-semibold text-ews-gray-900", children: texts.brandName }), jsxRuntime.jsx("span", { className: "rounded-full bg-ews-gray-100 px-2 py-0.5 text-xs font-medium text-ews-gray-600", children: "AI" }), jsxRuntime.jsxs("span", { className: "flex items-center gap-1 text-xs text-ews-gray-500", children: [jsxRuntime.jsx("span", { className: "h-2 w-2 rounded-full bg-ews-success", "aria-hidden": "true" }), texts.online] })] }), jsxRuntime.jsxs("div", { className: "flex shrink-0 items-center gap-1", children: [compact && onHistoryOpenChange && (jsxRuntime.jsx("button", { type: "button", onClick: () => onHistoryOpenChange(!historyOpen), "aria-label": historyLabel, "aria-pressed": historyOpen, title: historyLabel, className: cn("rounded-full p-2 hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary", historyOpen ? "bg-ews-gray-100 text-ews-primary" : "text-ews-gray-500"), "data-testid": "assistant-history-toggle", children: jsxRuntime.jsx(lucideReact.History, { className: "h-4 w-4", "aria-hidden": "true" }) })), !withList && !empty && (jsxRuntime.jsx("button", { type: "button", onClick: startNewConversation, "aria-label": texts.newConversation, title: texts.newConversation, className: "rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-new-conversation", children: jsxRuntime.jsx(lucideReact.SquarePen, { className: "h-4 w-4", "aria-hidden": "true" }) })), headerAction] })] }), jsxRuntime.jsx("div", { className: "flex flex-1 flex-col overflow-y-auto", children: empty ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("section", { className: cn("relative overflow-hidden bg-ews-primary-light text-center", 
+                                    // Extra bottom room: the white sheet of cards overlaps the hero (mockup tools).
+                                    compact ? "px-4 pb-12 pt-8" : "px-6 pb-16 pt-12"), children: [heroBackground && jsxRuntime.jsx("div", { className: "absolute inset-0", "aria-hidden": "true", children: heroBackground }), jsxRuntime.jsxs("div", { className: "relative", children: [jsxRuntime.jsx("h2", { className: cn("font-bold text-ews-gray-900", compact ? "text-xl" : "text-2xl sm:text-3xl"), children: texts.heroTitle }), jsxRuntime.jsx("p", { className: cn("mx-auto mt-2 max-w-xl text-ews-gray-700", compact && "text-sm"), children: texts.heroSubtitle })] })] }), jsxRuntime.jsx("div", { 
+                                    // A white sheet rounded on top, slid over the bottom of the hero, holding the cards.
+                                    className: cn("relative -mt-6 grid flex-1 content-start gap-3 rounded-t-3xl bg-white px-4 py-5", compact ? "grid-cols-2" : "grid-cols-2 lg:grid-cols-4"), "data-testid": "assistant-suggestions", children: suggestions.map((suggestion) => (jsxRuntime.jsx(AssistantSuggestionCard, { suggestion: suggestion, onSelect: (selected) => void send(selected.prompt), exampleLabel: texts.exampleLabel, disabled: busy }, suggestion.id))) })] })) : (jsxRuntime.jsxs("div", { className: "flex-1 px-4 py-5", children: [jsxRuntime.jsx(AssistantMessages, { messages: messages, activity: activity, onRetry: retry, texts: texts, linkOptions: onNavigate
                                         ? {
                                             onLinkClick: (href, event) => {
                                                 if (event.defaultPrevented || event.button !== 0 || event.metaKey || event.ctrlKey)
@@ -3788,13 +4149,15 @@ const AssistantChat = ({ transport, language, texts, suggestions, conversations
                                                     event.preventDefault();
                                             },
                                         }
-                                        : undefined }), pendingConfirmation && onConfirm && onCancelConfirmation && (jsxRuntime.jsx(AssistantConfirmationCard, { confirmation: pendingConfirmation, onConfirm: onConfirm, onCancel: onCancelConfirmation, texts: texts, className: "mt-4" }))] })) }), jsxRuntime.jsxs("div", { className: "border-t border-ews-gray-200 px-4 pb-3 pt-3", children: [jsxRuntime.jsx(AssistantComposer, { language: language, onSend: (content) => void send(content), disabled: busy, voice: voice, texts: {
+                                        : undefined }), pendingConfirmation && onConfirm && onCancelConfirmation && (jsxRuntime.jsx(AssistantConfirmationCard, { confirmation: pendingConfirmation, onConfirm: onConfirm, onCancel: onCancelConfirmation, texts: texts, className: "mt-4" }))] })) }), jsxRuntime.jsxs("div", { className: "border-t border-ews-gray-200 px-4 pb-3 pt-3", children: [jsxRuntime.jsx(AssistantComposer, { language: language, onSend: (content) => void send(content), disabled: busy, voice: voice, onVoice: () => setVoiceOpen(true), draft: composerDraft, texts: {
+                                    dictate: texts.dictate,
+                                    dictation: texts.dictation,
                                     placeholder: texts.composerPlaceholder,
                                     hint: texts.composerHint,
                                     send: texts.send,
                                     holdToTalk: texts.holdToTalk,
                                     listening: texts.listening,
-                                } }), disclaimer && jsxRuntime.jsx("div", { className: "mt-2 px-2 text-xs text-ews-gray-500", children: disclaimer })] })] })] }));
+                                } }), disclaimer && jsxRuntime.jsx("div", { className: "mt-2 px-2 text-xs text-ews-gray-500", children: disclaimer })] }), voiceOpen && (jsxRuntime.jsx(AssistantVoiceMode, { language: language, messages: messages, busy: busy, onSend: (content) => void send(content), onClose: () => setVoiceOpen(false), texts: texts.voiceMode }))] })] }));
 };
 
 /**
@@ -3931,11 +4294,18 @@ const AssistantLauncher = ({ launcherTexts, open, defaultOpen = false, onOpenCha
         setDraft("");
         setOpen(true);
     }, [setOpen]);
-    const speech = useSpeechRecognition({
-        language: chatProps.language,
-        onInterim: (text) => setDraft(text),
-        onResult: (text) => submitFromBar(text),
-    });
+    // One click on the bar mic (or the voice button) opens the panel straight in
+    // the voice conversation, listening at once.
+    const [voiceRequest, setVoiceRequest] = React.useState(null);
+    const openVoice = React.useCallback(() => {
+        setVoiceRequest({ id: generateId("v") });
+        setOpen(true);
+    }, [setOpen]);
+    const speechSupported = useSpeechSupported();
+    // The waveform button records a dictation in the bar itself (recording bar).
+    const [dictating, setDictating] = React.useState(false);
+    const [composerDraft, setComposerDraft] = React.useState(null);
+    const dictateLabel = chatProps.texts.dictate ?? launcherTexts.voice ?? "Dicter un message";
     const handleConversationCreated = React.useCallback((conversation) => {
         if (!hostManaged) {
             setStoredConversations(saveAssistantConversation(conversation));
@@ -3995,31 +4365,35 @@ const AssistantLauncher = ({ launcherTexts, open, defaultOpen = false, onOpenCha
     if (hidden)
         return null;
     const dir = DIRECTION[chatProps.language];
-    const showMic = voice && speech.supported;
+    const showMic = voice && speechSupported;
     const expandLabel = launcherTexts.expand ?? launcherTexts.open;
     const collapseLabel = launcherTexts.collapse ?? launcherTexts.close;
     const texts = launcherTexts.history ? { ...chatProps.texts, history: launcherTexts.history } : chatProps.texts;
-    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isOpen && (jsxRuntime.jsx("div", { dir: dir, className: "pointer-events-none fixed inset-x-0 z-40 flex justify-center px-4", style: { bottom: bottomOffset }, "data-testid": "assistant-launcher-bar", children: jsxRuntime.jsxs("div", { role: "group", "aria-label": launcherTexts.open, className: cn("pointer-events-auto flex w-full max-w-2xl items-center gap-2 rounded-2xl border border-ews-gray-100 bg-white py-2 pe-2 ps-3", "shadow-[0_8px_30px_rgba(15,23,42,0.14)]", className), children: [jsxRuntime.jsx("button", { ref: barRef, type: "button", onClick: () => setOpen(true), "aria-label": launcherTexts.open, "aria-haspopup": "dialog", "aria-expanded": false, "aria-controls": panelId, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-ews-primary to-ews-primary-hover text-base font-bold text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ews-primary/40", "data-testid": "assistant-launcher", children: chatProps.texts.brandName.charAt(0) }), jsxRuntime.jsx("input", { type: "text", readOnly: true, value: draft, onMouseDown: (event) => {
-                                event.preventDefault();
+    return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [!isOpen && (jsxRuntime.jsx("div", { dir: dir, className: "pointer-events-none fixed inset-x-0 z-40 flex justify-center px-4", style: { bottom: bottomOffset }, "data-testid": "assistant-launcher-bar", children: jsxRuntime.jsxs("div", { role: "group", "aria-label": launcherTexts.open, className: cn("pointer-events-auto flex w-full max-w-2xl items-center gap-2 rounded-2xl border border-ews-gray-100 bg-white py-2 pe-2 ps-3", "shadow-[0_8px_30px_rgba(15,23,42,0.14)]", className), children: [jsxRuntime.jsx("button", { ref: barRef, type: "button", onClick: () => setOpen(true), "aria-label": launcherTexts.open, "aria-haspopup": "dialog", "aria-expanded": false, "aria-controls": panelId, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-xl bg-gradient-to-br from-ews-primary to-ews-primary-hover text-base font-bold text-white shadow-sm focus:outline-none focus:ring-2 focus:ring-ews-primary/40", "data-testid": "assistant-launcher", children: chatProps.texts.brandName.charAt(0) }), dictating ? (jsxRuntime.jsx(AssistantDictationBar, { language: chatProps.language, texts: chatProps.texts.dictation, className: "min-w-0 flex-1", onCancel: () => setDictating(false), onDone: (text) => {
+                                setDictating(false);
+                                if (text)
+                                    setComposerDraft({ id: generateId("d"), content: text });
                                 setOpen(true);
-                            }, onFocus: () => setOpen(true), onKeyDown: (event) => {
-                                if (event.key === "Enter" || event.key === " ") {
-                                    event.preventDefault();
-                                    setOpen(true);
-                                }
-                            }, placeholder: speech.listening ? chatProps.texts.listening : launcherTexts.open, "aria-label": launcherTexts.open, "aria-haspopup": "dialog", "aria-controls": panelId, className: "min-w-0 flex-1 cursor-text bg-transparent py-2 text-lg text-ews-gray-800 placeholder:text-ews-gray-400 focus:outline-none", "data-testid": "assistant-launcher-input" }), showMic && (jsxRuntime.jsx("button", { type: "button", "aria-label": chatProps.texts.holdToTalk, "aria-pressed": speech.listening, title: chatProps.texts.holdToTalk, onMouseDown: speech.start, onMouseUp: speech.stop, onMouseLeave: speech.listening ? speech.stop : undefined, onTouchStart: speech.start, onTouchEnd: speech.stop, onKeyDown: (event) => {
-                                if (event.key === " " || event.key === "Enter") {
-                                    event.preventDefault();
-                                    if (speech.listening)
-                                        speech.stop();
-                                    else
-                                        speech.start();
-                                }
-                            }, className: cn("flex h-10 w-10 shrink-0 items-center justify-center rounded-full transition-colors focus:outline-none focus:ring-2 focus:ring-ews-primary", speech.listening
-                                ? "bg-ews-error text-white animate-pulse"
-                                : "text-ews-gray-600 hover:bg-ews-gray-100 hover:text-ews-primary"), "data-testid": "assistant-launcher-mic", children: jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5", "aria-hidden": "true" }) })), jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(true), "aria-label": launcherTexts.voice ?? launcherTexts.open, title: launcherTexts.voice ?? launcherTexts.open, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-ews-gray-100 text-ews-gray-700 transition-colors hover:bg-ews-gray-200 focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-launcher-voice", children: jsxRuntime.jsx(lucideReact.AudioLines, { className: "h-5 w-5", "aria-hidden": "true" }) }), jsxRuntime.jsx("button", { type: "button", onClick: () => submitFromBar(draft), "aria-label": chatProps.texts.send, title: chatProps.texts.send, className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-ews-primary text-white shadow-sm transition-colors hover:bg-ews-primary-hover focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1", "data-testid": "assistant-launcher-send", children: jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-5 w-5", "aria-hidden": "true" }) })] }) })), jsxRuntime.jsxs("div", { dir: dir, className: cn("fixed inset-0 z-[90]", !isOpen && "hidden"), "aria-hidden": !isOpen, "data-testid": "assistant-launcher-panel", children: [jsxRuntime.jsx("div", { className: "absolute inset-0 bg-black/40", onClick: () => setOpen(false), "data-testid": "assistant-launcher-overlay" }), jsxRuntime.jsx("section", { ref: panelRef, id: panelId, role: "dialog", "aria-modal": "true", "aria-label": launcherTexts.open, "data-expanded": isExpanded, className: cn("absolute inset-y-0 end-0 flex w-full flex-col bg-white shadow-2xl transition-[width,max-width] duration-200", 
+                            }, onSend: (text) => {
+                                setDictating(false);
+                                submitFromBar(text);
+                            } })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("input", { type: "text", readOnly: true, value: draft, onMouseDown: (event) => {
+                                        event.preventDefault();
+                                        setOpen(true);
+                                    }, onFocus: () => setOpen(true), onKeyDown: (event) => {
+                                        if (event.key === "Enter" || event.key === " ") {
+                                            event.preventDefault();
+                                            setOpen(true);
+                                        }
+                                    }, placeholder: launcherTexts.open, "aria-label": launcherTexts.open, "aria-haspopup": "dialog", "aria-controls": panelId, className: "min-w-0 flex-1 cursor-text bg-transparent py-2 text-lg text-ews-gray-800 placeholder:text-ews-gray-400 focus:outline-none", "data-testid": "assistant-launcher-input" }), showMic && (jsxRuntime.jsx(ActionTooltip, { label: chatProps.texts.holdToTalk, children: (describedBy) => (jsxRuntime.jsx("button", { type: "button", "aria-label": chatProps.texts.holdToTalk, "aria-describedby": describedBy, onClick: openVoice, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full text-ews-gray-600 transition-colors hover:bg-ews-gray-100 hover:text-ews-primary focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-launcher-mic", children: jsxRuntime.jsx(lucideReact.Mic, { className: "h-5 w-5", "aria-hidden": "true" }) })) })), jsxRuntime.jsx(ActionTooltip, { label: dictateLabel, children: (describedBy) => (jsxRuntime.jsx("button", { type: "button", onClick: speechSupported ? () => setDictating(true) : () => setOpen(true), "aria-label": dictateLabel, "aria-describedby": describedBy, className: "flex h-10 w-10 shrink-0 items-center justify-center rounded-full bg-ews-gray-100 text-ews-gray-700 transition-colors hover:bg-ews-gray-200 focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-launcher-voice", children: jsxRuntime.jsx(lucideReact.AudioLines, { className: "h-5 w-5", "aria-hidden": "true" }) })) }), jsxRuntime.jsx("button", { type: "button", onClick: () => submitFromBar(draft), "aria-label": chatProps.texts.send, title: chatProps.texts.send, className: "flex h-11 w-11 shrink-0 items-center justify-center rounded-xl bg-ews-primary text-white shadow-sm transition-colors hover:bg-ews-primary-hover focus:outline-none focus:ring-2 focus:ring-ews-primary focus:ring-offset-1", "data-testid": "assistant-launcher-send", children: jsxRuntime.jsx(lucideReact.ArrowUp, { className: "h-5 w-5", "aria-hidden": "true" }) })] }))] }) })), jsxRuntime.jsxs("div", { dir: dir, className: cn("fixed inset-0 z-[90]", !isOpen && "hidden"), "aria-hidden": !isOpen, "data-testid": "assistant-launcher-panel", children: [jsxRuntime.jsx("div", { 
+                        // Mobile: a dimmed page under a full-screen panel. From tablets up the panel floats over the
+                        // page, which stays visible (no dimming); a click outside still closes it.
+                        className: "absolute inset-0 bg-black/40 sm:bg-transparent", onClick: () => setOpen(false), "data-testid": "assistant-launcher-overlay" }), jsxRuntime.jsx("section", { ref: panelRef, id: panelId, role: "dialog", "aria-modal": "true", "aria-label": launcherTexts.open, "data-expanded": isExpanded, className: cn("absolute inset-y-0 end-0 flex w-full flex-col bg-white shadow-2xl transition-[width,max-width,height] duration-200", 
+                        // From tablets up: a floating card (MED-1801, like the Notiwa widget), clear of the top,
+                        // the bottom and the side of the screen, rounded, with a soft border and shadow.
+                        "sm:inset-y-auto sm:bottom-6 sm:end-6 sm:overflow-hidden sm:rounded-3xl sm:border sm:border-ews-gray-100", "sm:shadow-[0_24px_60px_rgba(15,23,42,0.22)]", isExpanded ? "sm:h-[calc(100vh-3rem)]" : "sm:h-[calc(100vh-6rem)]", 
                         // Expanded: a dashboard reaching the middle of the screen (never full width), tablets and up.
-                        isExpanded ? "sm:max-w-md md:w-[max(50vw,40rem)] md:max-w-none" : "sm:max-w-md", panelClassName), children: jsxRuntime.jsx(AssistantChat, { ...chatProps, texts: texts, voice: voice, layout: isExpanded ? "wide" : "panel", queuedPrompt: queuedPrompt, conversations: hostManaged ? hostConversations : storedConversations, activeConversationId: hostManaged ? hostActiveId : managedActiveId, initialMessages: hostManaged ? hostInitialMessages : managedMessages, onConversationCreated: handleConversationCreated, onSelectConversation: handleSelectConversation, onNewConversation: handleNewConversation, historyOpen: historyOpen, onHistoryOpenChange: setHistoryOpen, className: "flex-1", headerAction: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [headerAction, jsxRuntime.jsx("button", { type: "button", onClick: () => setExpanded(!isExpanded), "aria-label": isExpanded ? collapseLabel : expandLabel, "aria-pressed": isExpanded, title: isExpanded ? collapseLabel : expandLabel, className: "hidden rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-gray-900 focus:outline-none focus:ring-2 focus:ring-ews-primary md:inline-flex", "data-testid": "assistant-launcher-expand", children: isExpanded ? (jsxRuntime.jsx(lucideReact.Minimize2, { className: "h-5 w-5", "aria-hidden": "true" })) : (jsxRuntime.jsx(lucideReact.Maximize2, { className: "h-5 w-5", "aria-hidden": "true" })) }), jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(false), "aria-label": launcherTexts.close, title: launcherTexts.close, className: "rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-gray-900 focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-launcher-close", children: jsxRuntime.jsx(lucideReact.X, { className: "h-5 w-5", "aria-hidden": "true" }) })] }) }) })] })] }));
+                        isExpanded ? "sm:max-w-md md:w-[max(50vw,40rem)] md:max-w-none" : "sm:max-w-md", panelClassName), children: jsxRuntime.jsx(AssistantChat, { ...chatProps, texts: texts, voice: voice, layout: isExpanded ? "wide" : "panel", queuedPrompt: queuedPrompt, voiceRequest: voiceRequest, composerDraft: composerDraft, conversations: hostManaged ? hostConversations : storedConversations, activeConversationId: hostManaged ? hostActiveId : managedActiveId, initialMessages: hostManaged ? hostInitialMessages : managedMessages, onConversationCreated: handleConversationCreated, onSelectConversation: handleSelectConversation, onNewConversation: handleNewConversation, historyOpen: historyOpen, onHistoryOpenChange: setHistoryOpen, className: "flex-1", headerAction: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [headerAction, jsxRuntime.jsx("button", { type: "button", onClick: () => setExpanded(!isExpanded), "aria-label": isExpanded ? collapseLabel : expandLabel, "aria-pressed": isExpanded, title: isExpanded ? collapseLabel : expandLabel, className: "hidden rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-gray-900 focus:outline-none focus:ring-2 focus:ring-ews-primary md:inline-flex", "data-testid": "assistant-launcher-expand", children: isExpanded ? (jsxRuntime.jsx(lucideReact.Minimize2, { className: "h-5 w-5", "aria-hidden": "true" })) : (jsxRuntime.jsx(lucideReact.Maximize2, { className: "h-5 w-5", "aria-hidden": "true" })) }), jsxRuntime.jsx("button", { type: "button", onClick: () => setOpen(false), "aria-label": launcherTexts.close, title: launcherTexts.close, className: "rounded-full p-2 text-ews-gray-500 hover:bg-ews-gray-100 hover:text-ews-gray-900 focus:outline-none focus:ring-2 focus:ring-ews-primary", "data-testid": "assistant-launcher-close", children: jsxRuntime.jsx(lucideReact.X, { className: "h-5 w-5", "aria-hidden": "true" }) })] }) }) })] })] }));
 };
 
 /** Turns one SSE text stream into assistant events; frames may arrive split across chunks. */
@@ -4388,9 +4762,11 @@ exports.AssistantChat = AssistantChat;
 exports.AssistantComposer = AssistantComposer;
 exports.AssistantConfirmationCard = AssistantConfirmationCard;
 exports.AssistantConversationList = AssistantConversationList;
+exports.AssistantDictationBar = AssistantDictationBar;
 exports.AssistantLauncher = AssistantLauncher;
 exports.AssistantMessages = AssistantMessages;
 exports.AssistantSuggestionCard = AssistantSuggestionCard;
+exports.AssistantVoiceMode = AssistantVoiceMode;
 exports.BLOOD_TYPES = BLOOD_TYPES;
 exports.Button = Button;
 exports.COUNTRY_CODES = COUNTRY_CODES;
@@ -4445,12 +4821,14 @@ exports.parseAssistantEventStream = parseAssistantEventStream;
 exports.parseDateSafe = parseDateSafe;
 exports.renderAssistantMarkdown = renderAssistantMarkdown;
 exports.saveAssistantConversation = saveAssistantConversation;
+exports.toSpokenText = toSpokenText;
 exports.useDebounce = useDebounce;
 exports.useDebouncedCallback = useDebouncedCallback;
 exports.useIdleLock = useIdleLock;
 exports.useMediaQuery = useMediaQuery;
 exports.useSelectField = useSelectField;
 exports.useSpeechRecognition = useSpeechRecognition;
+exports.useSpeechSupported = useSpeechSupported;
 exports.useTheme = useTheme;
 Object.keys(lucideReact).forEach(function (k) {
     if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {