@rimori/react-client 0.4.11-next.2 → 0.4.11-next.4

package/dist/components/ai/Avatar.d.ts

@@ -10,6 +10,8 @@ interface Props {
     autoStartConversation?: FirstMessages;
     className?: string;
     knowledgeId?: string;
+    /** Set to true to disable automatic dialect TTS from userInfo. Default: false (dialect enabled). */
+    disableDialect?: boolean;
 }
-export declare function Avatar({ avatarImageUrl, voiceId, agentTools, autoStartConversation, children, circleSize, className, cache, knowledgeId, }: Props): import("react/jsx-runtime").JSX.Element;
+export declare function Avatar({ avatarImageUrl, voiceId, agentTools, autoStartConversation, children, circleSize, className, cache, knowledgeId, disableDialect, }: Props): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/ai/Avatar.js

@@ -7,12 +7,18 @@ import { useChat } from '../../hooks/UseChatHook';
 import { useRimori } from '../../providers/PluginProvider';
 import { getFirstMessages } from './utils';
 import { useTheme } from '../../hooks/ThemeSetter';
-export function Avatar({ avatarImageUrl, voiceId, agentTools, autoStartConversation, children, circleSize = '300px', className, cache = false, knowledgeId, }) {
-    const { ai, event, plugin } = useRimori();
+export function Avatar({ avatarImageUrl, voiceId, agentTools, autoStartConversation, children, circleSize = '300px', className, cache = false, knowledgeId, disableDialect = false, }) {
+    const { ai, event, plugin, userInfo } = useRimori();
     const { isDark: isDarkThemeValue } = useTheme(plugin.theme);
     const [agentReplying, setAgentReplying] = useState(false);
     const [isProcessingMessage, setIsProcessingMessage] = useState(false);
+    const dialectTtsInstruction = !disableDialect && (userInfo === null || userInfo === void 0 ? void 0 : userInfo.dialect)
+        ? `Speak with a ${userInfo.dialect} accent and pronunciation.`
+        : undefined;
     const sender = useMemo(() => new MessageSender((...args) => ai.getVoice(...args), voiceId, cache), [voiceId, ai, cache]);
+    useEffect(() => {
+        sender.setInstructions(dialectTtsInstruction);
+    }, [sender, dialectTtsInstruction]);
     const { messages, append, isLoading, lastMessage, setMessages } = useChat(agentTools, { knowledgeId });
     useEffect(() => {
         console.log('messages', messages);

package/dist/components/ai/BuddyAssistant.d.ts

@@ -7,9 +7,6 @@ export interface BuddyAssistantAutoStart {
     userMessage?: string;
 }
 export interface BuddyAssistantProps {
-    buddyName: string;
-    avatarImageUrl: string;
-    voiceId: string;
     systemPrompt: string;
     autoStartConversation?: BuddyAssistantAutoStart;
     circleSize?: string;
@@ -18,5 +15,7 @@ export interface BuddyAssistantProps {
     className?: string;
     voiceSpeed?: number;
     tools?: Tool[];
+    /** Set to true to disable automatic dialect from userInfo. Default: false (dialect enabled). */
+    disableDialect?: boolean;
 }
-export declare function BuddyAssistant({ buddyName, avatarImageUrl, voiceId, systemPrompt, autoStartConversation, circleSize, chatPlaceholder, bottomAction, className, voiceSpeed, tools, }: BuddyAssistantProps): import("react/jsx-runtime").JSX.Element;
+export declare function BuddyAssistant({ systemPrompt, autoStartConversation, circleSize, chatPlaceholder, bottomAction, className, voiceSpeed, tools, disableDialect, }: BuddyAssistantProps): JSX.Element;

package/dist/components/ai/BuddyAssistant.js

@@ -9,9 +9,16 @@ import { HiMiniSpeakerWave, HiMiniSpeakerXMark } from 'react-icons/hi2';
 import { BiSolidRightArrow } from 'react-icons/bi';
 let idCounter = 0;
 const genId = () => `ba-${++idCounter}`;
-export function BuddyAssistant({ buddyName, avatarImageUrl, voiceId, systemPrompt, autoStartConversation, circleSize = '160px', chatPlaceholder, bottomAction, className, voiceSpeed = 1, tools, }) {
-    const { ai, event, plugin } = useRimori();
+export function BuddyAssistant({ systemPrompt, autoStartConversation, circleSize = '160px', chatPlaceholder, bottomAction, className, voiceSpeed = 1, tools, disableDialect = false, }) {
+    var _a;
+    const { ai, event, plugin, userInfo } = useRimori();
     const { isDark } = useTheme(plugin.theme);
+    const buddy = (_a = plugin.getUserInfo()) === null || _a === void 0 ? void 0 : _a.study_buddy;
+    const dialect = !disableDialect ? userInfo === null || userInfo === void 0 ? void 0 : userInfo.dialect : undefined;
+    const dialectSystemSuffix = dialect
+        ? `\n\nThe user is learning the regional ${dialect} dialect. Occasionally use typical regional vocabulary and expressions from this dialect to help them learn local language naturally.`
+        : '';
+    const dialectTtsInstruction = dialect ? `Speak with a ${dialect} accent and pronunciation.` : undefined;
     const [ttsEnabled, setTtsEnabled] = useState(true);
     const [chatInput, setChatInput] = useState('');
     const [messages, setMessages] = useState([]);
@@ -21,16 +28,20 @@ export function BuddyAssistant({ buddyName, avatarImageUrl, voiceId, systemPromp
     useEffect(() => {
         ttsEnabledRef.current = ttsEnabled;
     }, [ttsEnabled]);
-    const sender = useMemo(() => new MessageSender((...args) => ai.getVoice(...args), voiceId), [voiceId, ai]);
+    const sender = useMemo(() => { var _a; return new MessageSender((...args) => ai.getVoice(...args), (_a = buddy === null || buddy === void 0 ? void 0 : buddy.voiceId) !== null && _a !== void 0 ? _a : ''); }, [buddy === null || buddy === void 0 ? void 0 : buddy.voiceId, ai]);
+    useEffect(() => {
+        sender.setInstructions(dialectTtsInstruction);
+    }, [sender, dialectTtsInstruction]);
     // Setup sender callbacks and cleanup
     useEffect(() => {
+        sender.setVoiceSpeed(voiceSpeed);
         sender.setOnLoudnessChange((value) => event.emit('self.avatar.triggerLoudness', { loudness: value }));
         sender.setOnEndOfSpeech(() => setIsSpeaking(false));
         return () => sender.cleanup();
     }, [sender]);
-    // Build full API message list with system prompt
+    // Build full API message list with system prompt (dialect appended when enabled)
     const buildApiMessages = (history) => [
-        { role: 'system', content: systemPrompt },
+        { role: 'system', content: systemPrompt + dialectSystemSuffix },
         ...history.map((m) => ({ role: m.role, content: m.content })),
     ];
     const triggerAI = (history) => {
@@ -73,6 +84,8 @@ export function BuddyAssistant({ buddyName, avatarImageUrl, voiceId, systemPromp
         }
         // eslint-disable-next-line react-hooks/exhaustive-deps
     }, []);
+    if (!buddy)
+        return _jsx("div", {});
     const sendMessage = (text) => {
         if (!text.trim() || isLoading)
             return;
@@ -89,13 +102,13 @@ export function BuddyAssistant({ buddyName, avatarImageUrl, voiceId, systemPromp
         setTtsEnabled((prev) => !prev);
     };
     const lastAssistantMessage = [...messages].filter((m) => m.role === 'assistant').pop();
-    return (_jsxs("div", { className: `flex flex-col items-center ${className || ''}`, children: [_jsx(CircleAudioAvatar, { width: circleSize, imageUrl: avatarImageUrl, isDarkTheme: isDark, className: "mx-auto" }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-3xl font-semibold", children: buddyName }), _jsx("button", { type: "button", onClick: handleToggleTts, className: "p-1 rounded-md hover:bg-gray-700/50 transition-colors", title: ttsEnabled ? 'Disable voice' : 'Enable voice', children: ttsEnabled ? (_jsx(HiMiniSpeakerWave, { className: `w-5 h-5 mt-0.5 ${isSpeaking ? 'text-blue-400' : 'text-gray-300'}` })) : (_jsx(HiMiniSpeakerXMark, { className: "w-5 h-5 mt-0.5 text-gray-500" })) })] }), !ttsEnabled && (_jsx("div", { className: "w-full max-w-md rounded-xl bg-gray-800/70 px-4 py-3 text-sm text-gray-200 leading-relaxed border border-gray-700/40 mt-4", children: !(lastAssistantMessage === null || lastAssistantMessage === void 0 ? void 0 : lastAssistantMessage.content) && isLoading ? (_jsxs("span", { className: "inline-flex gap-1 py-0.5", children: [_jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce" }), _jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce", style: { animationDelay: '0.15s' } }), _jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce", style: { animationDelay: '0.3s' } })] })) : (_jsx("span", { className: "whitespace-pre-wrap", children: lastAssistantMessage === null || lastAssistantMessage === void 0 ? void 0 : lastAssistantMessage.content })) })), _jsxs("div", { className: "w-full max-w-md relative mt-4", children: [_jsx("input", { value: chatInput, onChange: (e) => setChatInput(e.target.value), onKeyDown: (e) => {
+    return (_jsxs("div", { className: `flex flex-col items-center ${className || ''}`, children: [_jsx(CircleAudioAvatar, { width: circleSize, imageUrl: buddy.avatarUrl, isDarkTheme: isDark, className: "mx-auto" }), _jsxs("div", { className: "flex items-center gap-2 pl-10", children: [_jsx("span", { className: "text-3xl font-semibold", children: buddy.name }), _jsx("button", { type: "button", onClick: handleToggleTts, className: "p-1 rounded-md hover:bg-gray-700/50 transition-colors", title: ttsEnabled ? 'Disable voice' : 'Enable voice', children: ttsEnabled ? (_jsx(HiMiniSpeakerWave, { className: `w-5 h-5 mt-0.5 ${isSpeaking ? 'text-blue-400' : 'text-gray-300'}` })) : (_jsx(HiMiniSpeakerXMark, { className: "w-5 h-5 mt-0.5 text-gray-500" })) })] }), !ttsEnabled && (_jsx("div", { className: "w-full max-w-md rounded-xl bg-gray-800/70 px-4 py-3 text-sm text-gray-200 leading-relaxed border border-gray-700/40 mt-4", children: !(lastAssistantMessage === null || lastAssistantMessage === void 0 ? void 0 : lastAssistantMessage.content) && isLoading ? (_jsxs("span", { className: "inline-flex gap-1 py-0.5", children: [_jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce" }), _jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce", style: { animationDelay: '0.15s' } }), _jsx("span", { className: "w-1.5 h-1.5 rounded-full bg-gray-400 animate-bounce", style: { animationDelay: '0.3s' } })] })) : (_jsx("span", { className: "whitespace-pre-wrap", children: lastAssistantMessage === null || lastAssistantMessage === void 0 ? void 0 : lastAssistantMessage.content })) })), _jsxs("div", { className: "w-full max-w-md relative mt-4", children: [_jsx("input", { value: chatInput, onChange: (e) => setChatInput(e.target.value), onKeyDown: (e) => {
                             if (e.key === 'Enter' && !e.shiftKey) {
                                 e.preventDefault();
                                 sendMessage(chatInput);
                                 setChatInput('');
                             }
-                        }, placeholder: chatPlaceholder !== null && chatPlaceholder !== void 0 ? chatPlaceholder : `Ask ${buddyName} a question…`, disabled: isLoading, className: "w-full bg-gray-800/50 border border-gray-700 rounded-lg px-3 py-2 pr-16 text-sm text-gray-200 placeholder:text-gray-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-60" }), _jsxs("div", { className: "absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [_jsx(VoiceRecorder, { iconSize: "14", className: "p-1 text-gray-400 hover:text-white transition-colors", disabled: isLoading, onVoiceRecorded: (text) => sendMessage(text), onRecordingStatusChange: () => { } }), _jsx("div", { className: "w-px h-3.5 bg-gray-600" }), _jsx("button", { type: "button", onClick: () => {
+                        }, placeholder: chatPlaceholder !== null && chatPlaceholder !== void 0 ? chatPlaceholder : `Ask ${buddy.name} a question…`, disabled: isLoading, className: "w-full bg-gray-800/50 border border-gray-700 rounded-lg px-3 py-2 pr-16 text-sm text-gray-200 placeholder:text-gray-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-60" }), _jsxs("div", { className: "absolute right-2 top-1/2 -translate-y-1/2 flex items-center gap-1", children: [_jsx(VoiceRecorder, { iconSize: "14", className: "p-1 text-gray-400 hover:text-white transition-colors", disabled: isLoading, onVoiceRecorded: (text) => sendMessage(text), onRecordingStatusChange: () => { } }), _jsx("div", { className: "w-px h-3.5 bg-gray-600" }), _jsx("button", { type: "button", onClick: () => {
                                     sendMessage(chatInput);
                                     setChatInput('');
                                 }, disabled: isLoading || !chatInput.trim(), className: "p-1 text-gray-400 hover:text-white disabled:opacity-40 transition-colors", children: _jsx(BiSolidRightArrow, { className: "w-4 h-4" }) })] })] }), bottomAction && _jsx("div", { className: "w-full max-w-md border-t border-gray-700/60 pt-3", children: bottomAction })] }));

package/dist/components/audio/Playbutton.d.ts

@@ -10,6 +10,10 @@ type AudioPlayerProps = {
     enableSpeedAdjustment?: boolean;
     playListenerEvent?: string;
     size?: string;
+    /** Explicit TTS instruction string. If provided, overrides auto-dialect. */
+    ttsInstructions?: string;
+    /** Set to true to disable automatic dialect from userInfo. Default: false (dialect enabled). */
+    disableDialect?: boolean;
 };
 export declare const AudioPlayOptions: number[];
 export type AudioPlayOptionType = 0.8 | 0.9 | 1.0 | 1.1 | 1.2 | 1.5;

package/dist/components/audio/Playbutton.js

@@ -14,12 +14,12 @@ import { useRimori } from '../../providers/PluginProvider';
 import { EventBus } from '@rimori/client';
 export const AudioPlayOptions = [0.8, 0.9, 1.0, 1.1, 1.2, 1.5];
 let isFetchingAudio = false;
-export const AudioPlayer = ({ text, voice, language, hide, playListenerEvent, initialSpeed = 1.0, playOnMount = false, enableSpeedAdjustment = false, cache = true, size = '25px', }) => {
+export const AudioPlayer = ({ text, voice, language, hide, playListenerEvent, initialSpeed = 1.0, playOnMount = false, enableSpeedAdjustment = false, cache = true, size = '25px', ttsInstructions, disableDialect = false, }) => {
     const [audioUrl, setAudioUrl] = useState(null);
     const [speed, setSpeed] = useState(initialSpeed);
     const [isPlaying, setIsPlaying] = useState(false);
     const [isLoading, setIsLoading] = useState(false);
-    const { ai } = useRimori();
+    const { ai, userInfo } = useRimori();
     const audioRef = useRef(null);
     const eventBusListenerRef = useRef(null);
     useEffect(() => {
@@ -33,7 +33,8 @@ export const AudioPlayer = ({ text, voice, language, hide, playListenerEvent, in
     // Function to generate audio from text using API
     const generateAudio = () => __awaiter(void 0, void 0, void 0, function* () {
         setIsLoading(true);
-        const blob = yield ai.getVoice(text, voice || (language ? 'aws_default' : 'openai_alloy'), 1, language, cache);
+        const effectiveInstructions = ttsInstructions !== null && ttsInstructions !== void 0 ? ttsInstructions : (!disableDialect && (userInfo === null || userInfo === void 0 ? void 0 : userInfo.dialect) ? `Speak with a ${userInfo.dialect} accent and pronunciation.` : undefined);
+        const blob = yield ai.getVoice(text, voice || (language ? 'aws_default' : 'openai_alloy'), 1, language, cache, effectiveInstructions);
         setAudioUrl(URL.createObjectURL(blob));
         setIsLoading(false);
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rimori/react-client",
-  "version": "0.4.11-next.2",
+  "version": "0.4.11-next.4",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -24,7 +24,7 @@
     "format": "prettier --write ."
   },
   "peerDependencies": {
-    "@rimori/client": "2.5.19-next.5",
+    "@rimori/client": "2.5.20-next.1",
     "react": "^18.1.0",
     "react-dom": "^18.1.0"
   },
@@ -47,7 +47,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.37.0",
-    "@rimori/client": "2.5.19-next.5",
+    "@rimori/client": "2.5.20-next.1",
     "@types/react": "^18.3.21",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",

package/src/components/ai/Avatar.tsx

@@ -19,6 +19,8 @@ interface Props {
   autoStartConversation?: FirstMessages;
   className?: string;
   knowledgeId?: string;
+  /** Set to true to disable automatic dialect TTS from userInfo. Default: false (dialect enabled). */
+  disableDialect?: boolean;
 }
 
 export function Avatar({
@@ -31,15 +33,23 @@ export function Avatar({
   className,
   cache = false,
   knowledgeId,
+  disableDialect = false,
 }: Props) {
-  const { ai, event, plugin } = useRimori();
+  const { ai, event, plugin, userInfo } = useRimori();
   const { isDark: isDarkThemeValue } = useTheme(plugin.theme);
   const [agentReplying, setAgentReplying] = useState(false);
   const [isProcessingMessage, setIsProcessingMessage] = useState(false);
+  const dialectTtsInstruction = !disableDialect && userInfo?.dialect
+    ? `Speak with a ${userInfo.dialect} accent and pronunciation.`
+    : undefined;
   const sender = useMemo(
     () => new MessageSender((...args) => ai.getVoice(...args), voiceId, cache),
     [voiceId, ai, cache],
   );
+
+  useEffect(() => {
+    sender.setInstructions(dialectTtsInstruction);
+  }, [sender, dialectTtsInstruction]);
   const { messages, append, isLoading, lastMessage, setMessages } = useChat(agentTools, { knowledgeId });
 
   useEffect(() => {

package/src/components/ai/BuddyAssistant.tsx

@@ -17,9 +17,6 @@ export interface BuddyAssistantAutoStart {
 }
 
 export interface BuddyAssistantProps {
-  buddyName: string;
-  avatarImageUrl: string;
-  voiceId: string;
   systemPrompt: string;
   autoStartConversation?: BuddyAssistantAutoStart;
   circleSize?: string;
@@ -28,15 +25,14 @@ export interface BuddyAssistantProps {
   className?: string;
   voiceSpeed?: number;
   tools?: Tool[];
+  /** Set to true to disable automatic dialect from userInfo. Default: false (dialect enabled). */
+  disableDialect?: boolean;
 }
 
 let idCounter = 0;
 const genId = () => `ba-${++idCounter}`;
 
 export function BuddyAssistant({
-  buddyName,
-  avatarImageUrl,
-  voiceId,
   systemPrompt,
   autoStartConversation,
   circleSize = '160px',
@@ -45,9 +41,16 @@ export function BuddyAssistant({
   className,
   voiceSpeed = 1,
   tools,
-}: BuddyAssistantProps) {
-  const { ai, event, plugin } = useRimori();
+  disableDialect = false,
+}: BuddyAssistantProps): JSX.Element {
+  const { ai, event, plugin, userInfo } = useRimori();
   const { isDark } = useTheme(plugin.theme);
+  const buddy = plugin.getUserInfo()?.study_buddy;
+  const dialect = !disableDialect ? userInfo?.dialect : undefined;
+  const dialectSystemSuffix = dialect
+    ? `\n\nThe user is learning the regional ${dialect} dialect. Occasionally use typical regional vocabulary and expressions from this dialect to help them learn local language naturally.`
+    : '';
+  const dialectTtsInstruction = dialect ? `Speak with a ${dialect} accent and pronunciation.` : undefined;
 
   const [ttsEnabled, setTtsEnabled] = useState(true);
   const [chatInput, setChatInput] = useState('');
@@ -60,18 +63,26 @@ export function BuddyAssistant({
     ttsEnabledRef.current = ttsEnabled;
   }, [ttsEnabled]);
 
-  const sender = useMemo(() => new MessageSender((...args) => ai.getVoice(...args), voiceId), [voiceId, ai]);
+  const sender = useMemo(
+    () => new MessageSender((...args) => ai.getVoice(...args), buddy?.voiceId ?? ''),
+    [buddy?.voiceId, ai],
+  );
+
+  useEffect(() => {
+    sender.setInstructions(dialectTtsInstruction);
+  }, [sender, dialectTtsInstruction]);
 
   // Setup sender callbacks and cleanup
   useEffect(() => {
+    sender.setVoiceSpeed(voiceSpeed);
     sender.setOnLoudnessChange((value: number) => event.emit('self.avatar.triggerLoudness', { loudness: value }));
     sender.setOnEndOfSpeech(() => setIsSpeaking(false));
     return () => sender.cleanup();
   }, [sender]);
 
-  // Build full API message list with system prompt
+  // Build full API message list with system prompt (dialect appended when enabled)
   const buildApiMessages = (history: ChatMessage[]) => [
-    { role: 'system' as const, content: systemPrompt },
+    { role: 'system' as const, content: systemPrompt + dialectSystemSuffix },
     ...history.map((m) => ({ role: m.role, content: m.content })),
   ];
 
@@ -119,6 +130,8 @@ export function BuddyAssistant({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
+  if (!buddy) return <div />;
+
   const sendMessage = (text: string) => {
     if (!text.trim() || isLoading) return;
     const userMsg: ChatMessage = { id: genId(), role: 'user', content: text };
@@ -140,11 +153,11 @@ export function BuddyAssistant({
   return (
     <div className={`flex flex-col items-center ${className || ''}`}>
       {/* Animated circle avatar */}
-      <CircleAudioAvatar width={circleSize} imageUrl={avatarImageUrl} isDarkTheme={isDark} className="mx-auto" />
+      <CircleAudioAvatar width={circleSize} imageUrl={buddy.avatarUrl} isDarkTheme={isDark} className="mx-auto" />
 
       {/* Buddy name + TTS toggle */}
-      <div className="flex items-center gap-2">
-        <span className="text-3xl font-semibold">{buddyName}</span>
+      <div className="flex items-center gap-2 pl-10">
+        <span className="text-3xl font-semibold">{buddy.name}</span>
         <button
           type="button"
           onClick={handleToggleTts}
@@ -192,7 +205,7 @@ export function BuddyAssistant({
               setChatInput('');
             }
           }}
-          placeholder={chatPlaceholder ?? `Ask ${buddyName} a question…`}
+          placeholder={chatPlaceholder ?? `Ask ${buddy.name} a question…`}
           disabled={isLoading}
           className="w-full bg-gray-800/50 border border-gray-700 rounded-lg px-3 py-2 pr-16 text-sm text-gray-200 placeholder:text-gray-500 focus:outline-none focus:ring-1 focus:ring-blue-500 disabled:opacity-60"
         />

package/src/components/audio/Playbutton.tsx

@@ -14,6 +14,10 @@ type AudioPlayerProps = {
   enableSpeedAdjustment?: boolean;
   playListenerEvent?: string;
   size?: string;
+  /** Explicit TTS instruction string. If provided, overrides auto-dialect. */
+  ttsInstructions?: string;
+  /** Set to true to disable automatic dialect from userInfo. Default: false (dialect enabled). */
+  disableDialect?: boolean;
 };
 
 export const AudioPlayOptions = [0.8, 0.9, 1.0, 1.1, 1.2, 1.5];
@@ -32,12 +36,14 @@ export const AudioPlayer: React.FC<AudioPlayerProps> = ({
   enableSpeedAdjustment = false,
   cache = true,
   size = '25px',
+  ttsInstructions,
+  disableDialect = false,
 }) => {
   const [audioUrl, setAudioUrl] = useState<string | null>(null);
   const [speed, setSpeed] = useState(initialSpeed);
   const [isPlaying, setIsPlaying] = useState(false);
   const [isLoading, setIsLoading] = useState(false);
-  const { ai } = useRimori();
+  const { ai, userInfo } = useRimori();
   const audioRef = useRef<HTMLAudioElement | null>(null);
   const eventBusListenerRef = useRef<{ off: () => void } | null>(null);
 
@@ -52,7 +58,9 @@ export const AudioPlayer: React.FC<AudioPlayerProps> = ({
   const generateAudio = async () => {
     setIsLoading(true);
 
-    const blob = await ai.getVoice(text, voice || (language ? 'aws_default' : 'openai_alloy'), 1, language, cache);
+    const effectiveInstructions = ttsInstructions
+      ?? (!disableDialect && userInfo?.dialect ? `Speak with a ${userInfo.dialect} accent and pronunciation.` : undefined);
+    const blob = await ai.getVoice(text, voice || (language ? 'aws_default' : 'openai_alloy'), 1, language, cache, effectiveInstructions);
     setAudioUrl(URL.createObjectURL(blob));
     setIsLoading(false);
   };