@rimori/react-client 0.4.11-next.3 → 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

@@ -15,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({ systemPrompt, autoStartConversation, circleSize, chatPlaceholder, bottomAction, className, voiceSpeed, tools, }: BuddyAssistantProps): 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,11 +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({ systemPrompt, autoStartConversation, circleSize = '160px', chatPlaceholder, bottomAction, className, voiceSpeed = 1, tools, }) {
+export function BuddyAssistant({ systemPrompt, autoStartConversation, circleSize = '160px', chatPlaceholder, bottomAction, className, voiceSpeed = 1, tools, disableDialect = false, }) {
     var _a;
-    const { ai, event, plugin } = useRimori();
+    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([]);
@@ -24,6 +29,9 @@ export function BuddyAssistant({ systemPrompt, autoStartConversation, circleSize
         ttsEnabledRef.current = ttsEnabled;
     }, [ttsEnabled]);
     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);
@@ -31,9 +39,9 @@ export function BuddyAssistant({ systemPrompt, autoStartConversation, circleSize
         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) => {

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.3",
+  "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

@@ -25,6 +25,8 @@ 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;
@@ -39,10 +41,16 @@ export function BuddyAssistant({
   className,
   voiceSpeed = 1,
   tools,
+  disableDialect = false,
 }: BuddyAssistantProps): JSX.Element {
-  const { ai, event, plugin } = useRimori();
+  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,6 +68,10 @@ export function BuddyAssistant({
     [buddy?.voiceId, ai],
   );
 
+  useEffect(() => {
+    sender.setInstructions(dialectTtsInstruction);
+  }, [sender, dialectTtsInstruction]);
+
   // Setup sender callbacks and cleanup
   useEffect(() => {
     sender.setVoiceSpeed(voiceSpeed);
@@ -68,9 +80,9 @@ export function BuddyAssistant({
     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 })),
   ];
 

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);
   };