@rimori/react-client 0.4.0-next.0 → 0.4.0-next.2

package/dist/components/audio/Playbutton.js

@@ -125,7 +125,7 @@ export const AudioPlayer = ({ text, voice, language, hide, playListenerEvent, in
         // console.log("playOnMount", playOnMount);
         togglePlayback();
     }, [playOnMount]);
-    return (_jsx("div", { className: "group relative", children: _jsxs("div", { className: "flex flex-row items-end", children: [!hide && (_jsx("button", { className: "text-gray-500", onClick: togglePlayback, disabled: isLoading, children: isLoading ? _jsx(Spinner, {}) : isPlaying ? _jsx(FaStopCircle, { size: '25px' }) : _jsx(FaPlayCircle, { size: '25px' }) })), enableSpeedAdjustment && (_jsxs("div", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-row text-sm text-gray-500", children: [_jsx("span", { className: "pr-1", children: "Speed: " }), _jsx("select", { value: speed, className: "appearance-none cursor-pointer pr-0 p-0 rounded shadow leading-tight focus:outline-none focus:bg-gray-800 focus:ring bg-transparent border-0", onChange: (e) => setSpeed(parseFloat(e.target.value)), disabled: isLoading, children: AudioPlayOptions.map((s) => (_jsx("option", { value: s, children: s }, s))) })] }))] }) }));
+    return (_jsx("div", { className: "group relative", children: _jsxs("div", { className: "flex flex-row items-end", children: [!hide && (_jsx("button", { className: "text-gray-400", onClick: togglePlayback, disabled: isLoading, children: isLoading ? (_jsx(Spinner, { size: "25px" })) : isPlaying ? (_jsx(FaStopCircle, { size: "25px" })) : (_jsx(FaPlayCircle, { size: "25px" })) })), enableSpeedAdjustment && (_jsxs("div", { className: "ml-1 opacity-0 group-hover:opacity-100 transition-opacity duration-300 flex flex-row text-sm text-gray-500", children: [_jsx("span", { className: "pr-1", children: "Speed: " }), _jsx("select", { value: speed, className: "appearance-none cursor-pointer pr-0 p-0 rounded shadow leading-tight focus:outline-none focus:bg-gray-800 focus:ring bg-transparent border-0", onChange: (e) => setSpeed(parseFloat(e.target.value)), disabled: isLoading, children: AudioPlayOptions.map((s) => (_jsx("option", { value: s, children: s }, s))) })] }))] }) }));
 };
 const Spinner = ({ text, className, size = '30px' }) => {
     return (_jsxs("div", { className: 'flex items-center space-x-2 ' + className, children: [_jsxs("svg", { style: { width: size, height: size }, className: "animate-spin -ml-1 mr-3 h-5 w-5 text-white", xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", children: [_jsx("circle", { className: "opacity-25", cx: "12", cy: "12", r: "10", stroke: "currentColor", strokeWidth: "4" }), _jsx("path", { className: "opacity-75", fill: "currentColor", d: "M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" })] }), text && _jsx("span", { className: "", children: text })] }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rimori/react-client",
-  "version": "0.4.0-next.0",
+  "version": "0.4.0-next.2",
   "license": "Apache-2.0",
   "repository": {
     "type": "git",
@@ -23,7 +23,7 @@
     "format": "prettier --write ."
   },
   "peerDependencies": {
-    "@rimori/client": "^2.4.0",
+    "@rimori/client": "2.4.0-next.3",
     "react": "^18.1.0",
     "react-dom": "^18.1.0"
   },
@@ -34,7 +34,7 @@
   },
   "devDependencies": {
     "@eslint/js": "^9.37.0",
-    "@rimori/client": "^2.4.0",
+    "@rimori/client": "2.4.0-next.3",
     "@types/react": "^18.3.21",
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",

package/src/components/audio/Playbutton.tsx

@@ -152,8 +152,14 @@ export const AudioPlayer: React.FC<AudioPlayerProps> = ({
     <div className="group relative">
       <div className="flex flex-row items-end">
         {!hide && (
-          <button className="text-gray-500" onClick={togglePlayback} disabled={isLoading}>
-            {isLoading ? <Spinner /> : isPlaying ? <FaStopCircle size={'25px'} /> : <FaPlayCircle size={'25px'} />}
+          <button className="text-gray-400" onClick={togglePlayback} disabled={isLoading}>
+            {isLoading ? (
+              <Spinner size="25px" />
+            ) : isPlaying ? (
+              <FaStopCircle size="25px" />
+            ) : (
+              <FaPlayCircle size="25px" />
+            )}
           </button>
         )}
         {enableSpeedAdjustment && (

package/dist/components/MarkdownEditor.d.ts

@@ -1,8 +0,0 @@
-interface Props {
-    content?: string;
-    editable: boolean;
-    className?: string;
-    onUpdate?: (content: string) => void;
-}
-export declare const MarkdownEditor: (props: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/MarkdownEditor.js

@@ -1,48 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Markdown } from 'tiptap-markdown';
-import StarterKit from '@tiptap/starter-kit';
-import { PiCodeBlock } from 'react-icons/pi';
-import { TbBlockquote } from 'react-icons/tb';
-import { GoListOrdered } from 'react-icons/go';
-import { AiOutlineUnorderedList } from 'react-icons/ai';
-import { EditorProvider, useCurrentEditor } from '@tiptap/react';
-import { LuHeading1, LuHeading2, LuHeading3 } from 'react-icons/lu';
-import { FaBold, FaCode, FaItalic, FaParagraph, FaStrikethrough } from 'react-icons/fa';
-const EditorButton = ({ action, isActive, label, disabled }) => {
-    const { editor } = useCurrentEditor();
-    if (!editor) {
-        return null;
-    }
-    if (action.includes('heading')) {
-        const level = parseInt(action[action.length - 1]);
-        return (_jsx("button", { onClick: () => editor.chain().focus().toggleHeading({ level: level }).run(), className: `pl-2 ${isActive ? 'is-active' : ''}`, children: label }));
-    }
-    return (_jsx("button", { onClick: () => editor.chain().focus()[action]().run(), disabled: disabled ? !editor.can().chain().focus()[action]().run() : false, className: `pl-2 ${isActive ? 'is-active' : ''}`, children: label }));
-};
-const MenuBar = () => {
-    const { editor } = useCurrentEditor();
-    if (!editor) {
-        return null;
-    }
-    return (_jsxs("div", { className: "bg-gray-400 dark:bg-gray-800 dark:text-white text-lg flex flex-row flex-wrap items-center p-1", children: [_jsx(EditorButton, { action: "toggleBold", isActive: editor.isActive('bold'), label: _jsx(FaBold, {}), disabled: true }), _jsx(EditorButton, { action: "toggleItalic", isActive: editor.isActive('italic'), label: _jsx(FaItalic, {}), disabled: true }), _jsx(EditorButton, { action: "toggleStrike", isActive: editor.isActive('strike'), label: _jsx(FaStrikethrough, {}), disabled: true }), _jsx(EditorButton, { action: "toggleCode", isActive: editor.isActive('code'), label: _jsx(FaCode, {}), disabled: true }), _jsx(EditorButton, { action: "setParagraph", isActive: editor.isActive('paragraph'), label: _jsx(FaParagraph, {}) }), _jsx(EditorButton, { action: "setHeading1", isActive: editor.isActive('heading', { level: 1 }), label: _jsx(LuHeading1, { size: '24px' }) }), _jsx(EditorButton, { action: "setHeading2", isActive: editor.isActive('heading', { level: 2 }), label: _jsx(LuHeading2, { size: '24px' }) }), _jsx(EditorButton, { action: "setHeading3", isActive: editor.isActive('heading', { level: 3 }), label: _jsx(LuHeading3, { size: '24px' }) }), _jsx(EditorButton, { action: "toggleBulletList", isActive: editor.isActive('bulletList'), label: _jsx(AiOutlineUnorderedList, { size: '24px' }) }), _jsx(EditorButton, { action: "toggleOrderedList", isActive: editor.isActive('orderedList'), label: _jsx(GoListOrdered, { size: '24px' }) }), _jsx(EditorButton, { action: "toggleCodeBlock", isActive: editor.isActive('codeBlock'), label: _jsx(PiCodeBlock, { size: '24px' }) }), _jsx(EditorButton, { action: "toggleBlockquote", isActive: editor.isActive('blockquote'), label: _jsx(TbBlockquote, { size: '24px' }) })] }));
-};
-const extensions = [
-    StarterKit.configure({
-        bulletList: {
-            HTMLAttributes: {
-                class: 'list-disc list-inside dark:text-white p-1 mt-1 [&_li]:mb-1 [&_p]:inline m-0',
-            },
-        },
-        orderedList: {
-            HTMLAttributes: {
-                className: 'list-decimal list-inside dark:text-white p-1 mt-1 [&_li]:mb-1 [&_p]:inline m-0',
-            },
-        },
-    }),
-    Markdown,
-];
-export const MarkdownEditor = (props) => {
-    return (_jsx("div", { className: 'text-md border border-gray-800 overflow-hidden ' + props.className, style: { borderWidth: props.editable ? 1 : 0 }, children: _jsx(EditorProvider, { slotBefore: props.editable ? _jsx(MenuBar, {}) : null, extensions: extensions, content: props.content, editable: props.editable, onUpdate: (e) => {
-                props.onUpdate && props.onUpdate(e.editor.storage.markdown.getMarkdown());
-            } }, (props.editable ? 'editable' : 'readonly') + props.content) }));
-};

package/dist/components/Spinner.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/components/Spinner.js

@@ -1 +0,0 @@
-export {};

package/dist/components/ai/EmbeddedAssistent/VoiceRecoder.d.ts

@@ -1,11 +0,0 @@
-interface Props {
-    iconSize?: string;
-    className?: string;
-    disabled?: boolean;
-    loading?: boolean;
-    enablePushToTalk?: boolean;
-    onRecordingStatusChange: (running: boolean) => void;
-    onVoiceRecorded: (message: string) => void;
-}
-export declare const VoiceRecorder: import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<unknown>>;
-export {};

package/dist/components/ai/EmbeddedAssistent/VoiceRecoder.js

@@ -1,95 +0,0 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useRimori } from '../../../providers/PluginProvider';
-import { FaMicrophone, FaSpinner } from 'react-icons/fa6';
-import { AudioController } from '@rimori/client';
-import { useState, useRef, forwardRef, useImperativeHandle, useEffect } from 'react';
-export const VoiceRecorder = forwardRef(({ onVoiceRecorded, iconSize, className, disabled, loading, onRecordingStatusChange, enablePushToTalk = false, }, ref) => {
-    const [isRecording, setIsRecording] = useState(false);
-    const [internalIsProcessing, setInternalIsProcessing] = useState(false);
-    const audioControllerRef = useRef(null);
-    const { ai, plugin } = useRimori();
-    // Ref for latest onVoiceRecorded callback
-    const onVoiceRecordedRef = useRef(onVoiceRecorded);
-    useEffect(() => {
-        onVoiceRecordedRef.current = onVoiceRecorded;
-    }, [onVoiceRecorded]);
-    const startRecording = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            if (!audioControllerRef.current) {
-                audioControllerRef.current = new AudioController(plugin.pluginId);
-            }
-            yield audioControllerRef.current.startRecording();
-            setIsRecording(true);
-            onRecordingStatusChange(true);
-        }
-        catch (error) {
-            console.error('Failed to start recording:', error);
-            // Handle permission denied or other errors
-        }
-    });
-    const stopRecording = () => __awaiter(void 0, void 0, void 0, function* () {
-        try {
-            if (audioControllerRef.current && isRecording) {
-                const audioResult = yield audioControllerRef.current.stopRecording();
-                // console.log("audioResult: ", audioResult);
-                setInternalIsProcessing(true);
-                // Play the recorded audio from the Blob
-                // const blobUrl = URL.createObjectURL(audioResult.recording);
-                // const audioRef = new Audio(blobUrl);
-                // audioRef.onended = () => URL.revokeObjectURL(blobUrl);
-                // audioRef.play().catch((e) => console.error('Playback error:', e));
-                // console.log("audioBlob: ", audioResult.recording);
-                const text = yield ai.getTextFromVoice(audioResult.recording);
-                // console.log("stt result", text);
-                // throw new Error("test");
-                setInternalIsProcessing(false);
-                onVoiceRecordedRef.current(text);
-            }
-        }
-        catch (error) {
-            console.error('Failed to stop recording:', error);
-        }
-        finally {
-            setIsRecording(false);
-            onRecordingStatusChange(false);
-        }
-    });
-    useImperativeHandle(ref, () => ({
-        startRecording,
-        stopRecording,
-    }));
-    // push to talk feature
-    const spacePressedRef = useRef(false);
-    useEffect(() => {
-        if (!enablePushToTalk)
-            return;
-        const handleKeyDown = (event) => __awaiter(void 0, void 0, void 0, function* () {
-            if (event.code === 'Space' && !spacePressedRef.current) {
-                spacePressedRef.current = true;
-                yield startRecording();
-            }
-        });
-        const handleKeyUp = (event) => {
-            if (event.code === 'Space' && spacePressedRef.current) {
-                spacePressedRef.current = false;
-                stopRecording();
-            }
-        };
-        window.addEventListener('keydown', handleKeyDown);
-        window.addEventListener('keyup', handleKeyUp);
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-            window.removeEventListener('keyup', handleKeyUp);
-        };
-    }, [enablePushToTalk]);
-    return (_jsx("button", { className: 'flex flex-row justify-center items-center rounded-full mx-auto disabled:opacity-50 ' + className, onClick: isRecording ? stopRecording : startRecording, disabled: disabled || loading || internalIsProcessing, children: loading || internalIsProcessing ? (_jsx(FaSpinner, { className: "animate-spin" })) : (_jsx(FaMicrophone, { size: iconSize, className: isRecording ? 'text-red-600' : '' })) }));
-});

package/dist/plugin/ThemeSetter.d.ts

@@ -1,2 +0,0 @@
-export declare function useTheme(theme?: string | null): boolean;
-export declare function isDarkTheme(theme?: string | null): boolean;

package/dist/plugin/ThemeSetter.js

@@ -1,31 +0,0 @@
-import { useEffect, useState } from 'react';
-export function useTheme(theme) {
-    const [isDark, setIsDark] = useState(false);
-    useEffect(() => {
-        const root = document.documentElement;
-        const nextIsDark = isDarkTheme(theme);
-        setIsDark(nextIsDark);
-        root.classList.add('dark:text-gray-200');
-        if (nextIsDark) {
-            root.setAttribute('data-theme', 'dark');
-            root.classList.add('dark', 'dark:bg-gray-950');
-            root.style.background = 'hsl(var(--background))';
-            return;
-        }
-        root.removeAttribute('data-theme');
-        root.classList.remove('dark', 'dark:bg-gray-950');
-        root.style.background = '';
-    }, [theme]);
-    return isDark;
-}
-export function isDarkTheme(theme) {
-    // If no theme provided, try to get from URL as fallback (for standalone mode)
-    if (!theme) {
-        const urlParams = new URLSearchParams(window.location.search);
-        theme = urlParams.get('theme');
-    }
-    if (!theme || theme === 'system') {
-        return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
-    }
-    return theme === 'dark';
-}

package/dist/utils/FullscreenUtils.d.ts

@@ -1,2 +0,0 @@
-export declare function isFullscreen(): boolean;
-export declare function triggerFullscreen(onStateChange: (isFullscreen: boolean) => void, selector?: string): void;

package/dist/utils/FullscreenUtils.js

@@ -1,23 +0,0 @@
-export function isFullscreen() {
-    return !!document.fullscreenElement;
-}
-export function triggerFullscreen(onStateChange, selector) {
-    document.addEventListener('fullscreenchange', () => {
-        onStateChange(isFullscreen());
-    });
-    try {
-        const ref = document.querySelector(selector || '#root');
-        if (!isFullscreen()) {
-            // @ts-ignore
-            void (ref.requestFullscreen() || ref.webkitRequestFullscreen());
-        }
-        else {
-            // @ts-ignore
-            void (document.exitFullscreen() || document.webkitExitFullscreen());
-        }
-    }
-    catch (error) {
-        console.error('Failed to enter fullscreen', error.message);
-    }
-    onStateChange(isFullscreen());
-}