@peers-app/peers-ui 0.14.0 → 0.15.0

package/dist/screens/settings/voice-settings.js

@@ -1,4 +1,7 @@
 "use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VoiceSettings = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 /**
  * Voice Settings Component
  *
@@ -6,53 +9,23 @@
  * Settings are stored directly via pvars (auto-synced).
  * Keys are stored as secure pvars (write-only).
  */
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.VoiceSettings = void 0;
-const react_1 = __importStar(require("react"));
 const peers_sdk_1 = require("@peers-app/peers-sdk");
-const voice_settings_types_1 = require("./voice-settings-types");
+const react_1 = require("react");
+const voice_settings_agent_1 = require("./voice-settings-agent");
 const voice_settings_api_keys_1 = require("./voice-settings-api-keys");
-const voice_settings_wake_word_1 = require("./voice-settings-wake-word");
-const voice_settings_providers_1 = require("./voice-settings-providers");
 const voice_settings_output_1 = require("./voice-settings-output");
-const voice_settings_agent_1 = require("./voice-settings-agent");
+const voice_settings_providers_1 = require("./voice-settings-providers");
+const voice_settings_types_1 = require("./voice-settings-types");
+const voice_settings_wake_word_1 = require("./voice-settings-wake-word");
 // Pvars - shared with voice service (writes here trigger service updates)
-const voiceSettingsPvar = (0, peers_sdk_1.userVar)('voiceSettings', { defaultValue: voice_settings_types_1.DEFAULT_SETTINGS });
-const picovoiceKeyPvar = (0, peers_sdk_1.userVar)('PICOVOICE_ACCESS_KEY', { isSecret: true, defaultValue: '' });
-const openaiKeyPvar = (0, peers_sdk_1.userVar)('OPENAI_API_KEY', { isSecret: true, defaultValue: '' });
+const voiceSettingsPvar = (0, peers_sdk_1.userVar)("voiceSettings", {
+    defaultValue: voice_settings_types_1.DEFAULT_SETTINGS,
+});
+const picovoiceKeyPvar = (0, peers_sdk_1.userVar)("PICOVOICE_ACCESS_KEY", {
+    isSecret: true,
+    defaultValue: "",
+});
+const openaiKeyPvar = (0, peers_sdk_1.userVar)("OPENAI_API_KEY", { isSecret: true, defaultValue: "" });
 const VoiceSettings = () => {
     const [settings, setSettings] = (0, react_1.useState)({ ...voice_settings_types_1.DEFAULT_SETTINGS });
     const [loading, setLoading] = (0, react_1.useState)(true);
@@ -63,10 +36,10 @@ const VoiceSettings = () => {
     const [keyError, setKeyError] = (0, react_1.useState)(null);
     // Local state for unsaved changes
     const [localSettings, setLocalSettings] = (0, react_1.useState)(settings);
-    const [picovoiceKey, setPicovoiceKey] = (0, react_1.useState)('');
-    const [openaiKey, setOpenaiKey] = (0, react_1.useState)('');
+    const [picovoiceKey, setPicovoiceKey] = (0, react_1.useState)("");
+    const [openaiKey, setOpenaiKey] = (0, react_1.useState)("");
     const [hasUnsavedChanges, setHasUnsavedChanges] = (0, react_1.useState)(false);
-    const [testText, setTestText] = (0, react_1.useState)('Hello, this is a test of the text to speech system.');
+    const [testText, setTestText] = (0, react_1.useState)("Hello, this is a test of the text to speech system.");
     // Load initial settings from pvars
     (0, react_1.useEffect)(() => {
         const loadSettings = async () => {
@@ -79,8 +52,8 @@ const VoiceSettings = () => {
                 const openaiKeyValue = openaiKeyPvar();
                 const loadedSettings = {
                     ...savedSettings,
-                    picovoiceAccessKeySet: !!picovoiceKeyValue && picovoiceKeyValue !== '',
-                    openaiApiKeySet: !!openaiKeyValue && openaiKeyValue !== '',
+                    picovoiceAccessKeySet: !!picovoiceKeyValue && picovoiceKeyValue !== "",
+                    openaiApiKeySet: !!openaiKeyValue && openaiKeyValue !== "",
                 };
                 setSettings(loadedSettings);
                 setLocalSettings(loadedSettings);
@@ -100,8 +73,8 @@ const VoiceSettings = () => {
                 }
             }
             catch (err) {
-                console.error('Failed to load voice settings:', err);
-                setError('Failed to load voice settings.');
+                console.error("Failed to load voice settings:", err);
+                setError("Failed to load voice settings.");
             }
             finally {
                 setLoading(false);
@@ -123,13 +96,13 @@ const VoiceSettings = () => {
             if (picovoiceKey) {
                 await picovoiceKeyPvar.loadingPromise;
                 picovoiceKeyPvar(picovoiceKey);
-                setPicovoiceKey('');
+                setPicovoiceKey("");
                 setKeyError(null);
             }
             if (openaiKey) {
                 await openaiKeyPvar.loadingPromise;
                 openaiKeyPvar(openaiKey);
-                setOpenaiKey('');
+                setOpenaiKey("");
             }
             await voiceSettingsPvar.loadingPromise;
             voiceSettingsPvar({
@@ -150,11 +123,11 @@ const VoiceSettings = () => {
             };
             setSettings(updatedSettings);
             setLocalSettings(updatedSettings);
-            setSuccess('Settings saved successfully!');
+            setSuccess("Settings saved successfully!");
             setTimeout(() => setSuccess(null), 3000);
         }
         catch (err) {
-            console.error('Failed to save voice settings:', err);
+            console.error("Failed to save voice settings:", err);
             setError(err.message);
         }
         finally {
@@ -163,10 +136,10 @@ const VoiceSettings = () => {
     }, [localSettings, picovoiceKey, openaiKey]);
     const handleToggleEnabled = (0, react_1.useCallback)(async () => {
         if (!localSettings.picovoiceAccessKeySet && !picovoiceKey && !localSettings.enabled) {
-            setError('Please enter and save a Picovoice Access Key first');
+            setError("Please enter and save a Picovoice Access Key first");
             return;
         }
-        setLocalSettings(prev => ({ ...prev, enabled: !prev.enabled }));
+        setLocalSettings((prev) => ({ ...prev, enabled: !prev.enabled }));
     }, [localSettings.enabled, localSettings.picovoiceAccessKeySet, picovoiceKey]);
     const handleTestTTS = (0, react_1.useCallback)(async () => {
         try {
@@ -174,8 +147,8 @@ const VoiceSettings = () => {
             await peers_sdk_1.rpcServerCalls.voiceTestTTS(testText);
         }
         catch (err) {
-            console.error('TTS test failed:', err);
-            setError('TTS test failed: ' + err.message);
+            console.error("TTS test failed:", err);
+            setError(`TTS test failed: ${err.message}`);
         }
     }, [testText]);
     const handleTestRecording = (0, react_1.useCallback)(async () => {
@@ -184,67 +157,17 @@ const VoiceSettings = () => {
             await peers_sdk_1.rpcServerCalls.voiceStartRecording();
         }
         catch (err) {
-            console.error('Recording test failed:', err);
+            console.error("Recording test failed:", err);
             setError(err.message);
         }
     }, []);
     const handleSettingsChange = (0, react_1.useCallback)((patch) => {
-        setLocalSettings(prev => ({ ...prev, ...patch }));
+        setLocalSettings((prev) => ({ ...prev, ...patch }));
     }, []);
     if (loading) {
-        return (react_1.default.createElement("div", { className: "d-flex justify-content-center p-4" },
-            react_1.default.createElement("div", { className: "spinner-border text-primary", role: "status" },
-                react_1.default.createElement("span", { className: "visually-hidden" }, "Loading..."))));
+        return ((0, jsx_runtime_1.jsx)("div", { className: "d-flex justify-content-center p-4", children: (0, jsx_runtime_1.jsx)("div", { className: "spinner-border text-primary", role: "status", children: (0, jsx_runtime_1.jsx)("span", { className: "visually-hidden", children: "Loading..." }) }) }));
     }
-    return (react_1.default.createElement("div", { className: "voice-settings" },
-        react_1.default.createElement("div", { className: "d-flex align-items-center mb-3" },
-            react_1.default.createElement("h5", { className: "mb-0 me-3" }, "Voice Input"),
-            react_1.default.createElement("div", { className: "form-check form-switch me-auto" },
-                react_1.default.createElement("input", { className: "form-check-input", type: "checkbox", id: "voiceEnabled", checked: localSettings.enabled, onChange: handleToggleEnabled, disabled: saving }),
-                react_1.default.createElement("label", { className: "form-check-label", htmlFor: "voiceEnabled" }, localSettings.enabled ? 'Enabled' : 'Disabled')),
-            react_1.default.createElement("button", { className: "btn btn-primary btn-sm", onClick: handleSaveAll, disabled: saving || !hasUnsavedChanges }, saving ? 'Saving...' : 'Save')),
-        localSettings.enabled && (react_1.default.createElement("div", { className: "d-flex align-items-center mb-3 ms-3" },
-            react_1.default.createElement("h6", { className: "mb-0 me-3 text-muted" }, "Voice Output"),
-            react_1.default.createElement("div", { className: "form-check form-switch" },
-                react_1.default.createElement("input", { className: "form-check-input", type: "checkbox", id: "voiceOutputEnabled", checked: localSettings.voiceOutputEnabled !== false, onChange: (e) => handleSettingsChange({ voiceOutputEnabled: e.target.checked }), disabled: saving }),
-                react_1.default.createElement("label", { className: "form-check-label", htmlFor: "voiceOutputEnabled" }, localSettings.voiceOutputEnabled !== false ? 'On' : 'Off')),
-            react_1.default.createElement("small", { className: "text-muted ms-2" }, "Speak assistant responses aloud"))),
-        error && (react_1.default.createElement("div", { className: "alert alert-danger alert-dismissible fade show", role: "alert" },
-            error,
-            react_1.default.createElement("button", { type: "button", className: "btn-close", onClick: () => setError(null) }))),
-        success && (react_1.default.createElement("div", { className: "alert alert-success alert-dismissible fade show", role: "alert" },
-            success,
-            react_1.default.createElement("button", { type: "button", className: "btn-close", onClick: () => setSuccess(null) }))),
-        react_1.default.createElement(voice_settings_api_keys_1.VoiceSettingsApiKeys, { settings: settings, picovoiceKey: picovoiceKey, openaiKey: openaiKey, keyError: keyError, onPicovoiceKeyChange: setPicovoiceKey, onOpenaiKeyChange: setOpenaiKey, onDismissKeyError: () => setKeyError(null) }),
-        react_1.default.createElement("hr", { className: "my-4" }),
-        react_1.default.createElement(voice_settings_wake_word_1.VoiceSettingsWakeWord, { localSettings: localSettings, saving: saving, onChange: handleSettingsChange }),
-        react_1.default.createElement("hr", { className: "my-4" }),
-        react_1.default.createElement(voice_settings_providers_1.VoiceSettingsProviders, { localSettings: localSettings, saving: saving, onChange: handleSettingsChange }),
-        react_1.default.createElement(voice_settings_output_1.VoiceSettingsOutput, { settings: settings, localSettings: localSettings, saving: saving, testText: testText, hasUnsavedChanges: hasUnsavedChanges, audioDevices: audioDevices, onChange: handleSettingsChange, onTestTextChange: setTestText, onTestTTS: handleTestTTS, onTestRecording: handleTestRecording }),
-        react_1.default.createElement("hr", { className: "my-4" }),
-        react_1.default.createElement(voice_settings_agent_1.VoiceSettingsAgent, null),
-        react_1.default.createElement("div", { className: "alert alert-info" },
-            react_1.default.createElement("h6", { className: "alert-heading" },
-                react_1.default.createElement("i", { className: "bi bi-info-circle me-2" }),
-                "How to use"),
-            react_1.default.createElement("ol", { className: "mb-0 small" },
-                react_1.default.createElement("li", null, "Get a free Picovoice access key from the link above"),
-                react_1.default.createElement("li", null,
-                    "Enter the key and click ",
-                    react_1.default.createElement("strong", null, "Save")),
-                react_1.default.createElement("li", null,
-                    "Enable voice input and click ",
-                    react_1.default.createElement("strong", null, "Save"),
-                    " again"),
-                react_1.default.createElement("li", null,
-                    "Say ",
-                    react_1.default.createElement("strong", null,
-                        "\"",
-                        voice_settings_types_1.BUILTIN_WAKE_WORDS.find(w => w.id === localSettings.wakeWord)?.name || 'Computer',
-                        "\""),
-                    " to activate voice recording"),
-                react_1.default.createElement("li", null, "Speak your message - recording stops automatically when you pause"),
-                react_1.default.createElement("li", null, "Your message will be sent to the assistant and the response will be spoken")))));
+    return ((0, jsx_runtime_1.jsxs)("div", { className: "voice-settings", children: [(0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center mb-3", children: [(0, jsx_runtime_1.jsx)("h5", { className: "mb-0 me-3", children: "Voice Input" }), (0, jsx_runtime_1.jsxs)("div", { className: "form-check form-switch me-auto", children: [(0, jsx_runtime_1.jsx)("input", { className: "form-check-input", type: "checkbox", id: "voiceEnabled", checked: localSettings.enabled, onChange: handleToggleEnabled, disabled: saving }), (0, jsx_runtime_1.jsx)("label", { className: "form-check-label", htmlFor: "voiceEnabled", children: localSettings.enabled ? "Enabled" : "Disabled" })] }), (0, jsx_runtime_1.jsx)("button", { className: "btn btn-primary btn-sm", onClick: handleSaveAll, disabled: saving || !hasUnsavedChanges, children: saving ? "Saving..." : "Save" })] }), localSettings.enabled && ((0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center mb-3 ms-3", children: [(0, jsx_runtime_1.jsx)("h6", { className: "mb-0 me-3 text-muted", children: "Voice Output" }), (0, jsx_runtime_1.jsxs)("div", { className: "form-check form-switch", children: [(0, jsx_runtime_1.jsx)("input", { className: "form-check-input", type: "checkbox", id: "voiceOutputEnabled", checked: localSettings.voiceOutputEnabled !== false, onChange: (e) => handleSettingsChange({ voiceOutputEnabled: e.target.checked }), disabled: saving }), (0, jsx_runtime_1.jsx)("label", { className: "form-check-label", htmlFor: "voiceOutputEnabled", children: localSettings.voiceOutputEnabled !== false ? "On" : "Off" })] }), (0, jsx_runtime_1.jsx)("small", { className: "text-muted ms-2", children: "Speak assistant responses aloud" })] })), error && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-danger alert-dismissible fade show", role: "alert", children: [error, (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn-close", onClick: () => setError(null) })] })), success && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-success alert-dismissible fade show", role: "alert", children: [success, (0, jsx_runtime_1.jsx)("button", { type: "button", className: "btn-close", onClick: () => setSuccess(null) })] })), (0, jsx_runtime_1.jsx)(voice_settings_api_keys_1.VoiceSettingsApiKeys, { settings: settings, picovoiceKey: picovoiceKey, openaiKey: openaiKey, keyError: keyError, onPicovoiceKeyChange: setPicovoiceKey, onOpenaiKeyChange: setOpenaiKey, onDismissKeyError: () => setKeyError(null) }), (0, jsx_runtime_1.jsx)("hr", { className: "my-4" }), (0, jsx_runtime_1.jsx)(voice_settings_wake_word_1.VoiceSettingsWakeWord, { localSettings: localSettings, saving: saving, onChange: handleSettingsChange }), (0, jsx_runtime_1.jsx)("hr", { className: "my-4" }), (0, jsx_runtime_1.jsx)(voice_settings_providers_1.VoiceSettingsProviders, { localSettings: localSettings, saving: saving, onChange: handleSettingsChange }), (0, jsx_runtime_1.jsx)(voice_settings_output_1.VoiceSettingsOutput, { settings: settings, localSettings: localSettings, saving: saving, testText: testText, hasUnsavedChanges: hasUnsavedChanges, audioDevices: audioDevices, onChange: handleSettingsChange, onTestTextChange: setTestText, onTestTTS: handleTestTTS, onTestRecording: handleTestRecording }), (0, jsx_runtime_1.jsx)("hr", { className: "my-4" }), (0, jsx_runtime_1.jsx)(voice_settings_agent_1.VoiceSettingsAgent, {}), (0, jsx_runtime_1.jsxs)("div", { className: "alert alert-info", children: [(0, jsx_runtime_1.jsxs)("h6", { className: "alert-heading", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-info-circle me-2" }), "How to use"] }), (0, jsx_runtime_1.jsxs)("ol", { className: "mb-0 small", children: [(0, jsx_runtime_1.jsx)("li", { children: "Get a free Picovoice access key from the link above" }), (0, jsx_runtime_1.jsxs)("li", { children: ["Enter the key and click ", (0, jsx_runtime_1.jsx)("strong", { children: "Save" })] }), (0, jsx_runtime_1.jsxs)("li", { children: ["Enable voice input and click ", (0, jsx_runtime_1.jsx)("strong", { children: "Save" }), " again"] }), (0, jsx_runtime_1.jsxs)("li", { children: ["Say", " ", (0, jsx_runtime_1.jsxs)("strong", { children: ["\"", voice_settings_types_1.BUILTIN_WAKE_WORDS.find((w) => w.id === localSettings.wakeWord)?.name || "Computer", "\""] }), " ", "to activate voice recording"] }), (0, jsx_runtime_1.jsx)("li", { children: "Speak your message - recording stops automatically when you pause" }), (0, jsx_runtime_1.jsx)("li", { children: "Your message will be sent to the assistant and the response will be spoken" })] })] })] }));
 };
 exports.VoiceSettings = VoiceSettings;
 exports.default = exports.VoiceSettings;

package/dist/screens/setup-user.d.ts

@@ -1,2 +1 @@
-import React from "react";
-export declare const SetupUser: () => React.JSX.Element | null;
+export declare const SetupUser: () => import("react/jsx-runtime").JSX.Element | null;

package/dist/screens/setup-user.js

@@ -1,55 +1,23 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SetupUser = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
-const react_1 = __importStar(require("react"));
+const react_1 = require("react");
 const hooks_1 = require("../hooks");
 const color_mode_dropdown_1 = require("./settings/color-mode-dropdown");
 const SetupUser = () => {
     const [_colorMode] = (0, hooks_1.useObservable)(color_mode_dropdown_1.colorMode);
-    const [step, setStep] = (0, react_1.useState)('select-user-type');
+    const [step, _setStep] = (0, react_1.useState)("select-user-type");
     const [isExistingUser, setIsExistingUser] = (0, react_1.useState)(null);
-    const [userId, setUserId] = (0, react_1.useState)('');
-    const [secretKey, setSecretKey] = (0, react_1.useState)('');
-    const [error, setError] = (0, react_1.useState)('');
+    const [userId, setUserId] = (0, react_1.useState)("");
+    const [secretKey, setSecretKey] = (0, react_1.useState)("");
+    const [error, setError] = (0, react_1.useState)("");
     const [isValidating, setIsValidating] = (0, react_1.useState)(false);
-    document.getElementById('appLoadingDiv')?.remove();
-    const isDark = _colorMode === 'dark';
+    document.getElementById("appLoadingDiv")?.remove();
+    const isDark = _colorMode === "dark";
     const handleNewUser = async () => {
-        setError('');
+        setError("");
         setIsValidating(true);
         try {
             // Generate new user credentials
@@ -58,26 +26,28 @@ const SetupUser = () => {
             // Call setUserIdAndSecretKey
             await peers_sdk_1.rpcServerCalls.setUserIdAndSecretKey(_userId, keys.secretKey);
             // Auto-install peers-core for the new user
-            await peers_sdk_1.rpcServerCalls.addOrUpdatePackage(peers_sdk_1.peersCorePackageId, { dataContextId: _userId }).catch((err) => {
-                console.error('Error auto-installing peers-core:', err);
+            await peers_sdk_1.rpcServerCalls
+                .addOrUpdatePackage(peers_sdk_1.peersCorePackageId, { dataContextId: _userId })
+                .catch((err) => {
+                console.error("Error auto-installing peers-core:", err);
             });
             // Success - reload the app
             window.location.reload();
         }
         catch (err) {
-            setError('Error creating new user: ' + String(err).replaceAll('\n', ' '));
+            setError(`Error creating new user: ${String(err).replaceAll("\n", " ")}`);
             setIsValidating(false);
         }
     };
     const handleExistingUser = async () => {
-        setError('');
+        setError("");
         // Validate inputs
         if (!userId.trim() || !secretKey.trim()) {
-            setError('Please enter both User ID and Secret Key');
+            setError("Please enter both User ID and Secret Key");
             return;
         }
         if ((0, peers_sdk_1.isid)(userId) !== true) {
-            setError('Invalid User ID format');
+            setError("Invalid User ID format");
             return;
         }
         setIsValidating(true);
@@ -88,7 +58,7 @@ const SetupUser = () => {
             const msgSigned = (0, peers_sdk_1.signMessageWithSecretKey)(msg, keys.secretKey);
             const msgOpened = (0, peers_sdk_1.openMessageWithPublicKey)(msgSigned, keys.publicKey);
             if (msg !== msgOpened) {
-                throw new Error('Secret key validation failed');
+                throw new Error("Secret key validation failed");
             }
             // Call setUserIdAndSecretKey
             await peers_sdk_1.rpcServerCalls.setUserIdAndSecretKey(userId, keys.secretKey);
@@ -96,84 +66,36 @@ const SetupUser = () => {
             window.location.reload();
         }
         catch (err) {
-            setError('Invalid credentials: ' + String(err).replaceAll('\n', ' '));
+            setError(`Invalid credentials: ${String(err).replaceAll("\n", " ")}`);
             setIsValidating(false);
         }
     };
     // Step 1: Select User Type
-    if (step === 'select-user-type' && isExistingUser === null) {
-        return (react_1.default.createElement("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: '20px', backgroundColor: isDark ? '#212529' : '#f8f9fa' } },
-            react_1.default.createElement("div", { className: "card shadow", style: { maxWidth: '500px', width: '100%', backgroundColor: isDark ? '#2d3238' : '#ffffff' } },
-                react_1.default.createElement("div", { className: "card-body p-4 p-md-5" },
-                    react_1.default.createElement("div", { className: "text-center mb-4" },
-                        react_1.default.createElement("h2", { className: `fw-bold mb-2 ${isDark ? 'text-light' : ''}` }, "Welcome to Peers"),
-                        react_1.default.createElement("p", { className: isDark ? 'text-light opacity-75' : 'text-muted' }, "Let's get you set up")),
-                    react_1.default.createElement("div", { className: "d-grid gap-3" },
-                        react_1.default.createElement("button", { className: "btn btn-lg btn-primary py-3", onClick: () => setIsExistingUser(false) },
-                            react_1.default.createElement("div", { className: "d-flex align-items-center justify-content-center" },
-                                react_1.default.createElement("i", { className: "bi bi-person-plus fs-4 me-2" }),
-                                react_1.default.createElement("div", { className: "text-start" },
-                                    react_1.default.createElement("div", { className: "fw-semibold" }, "I'm a New User"),
-                                    react_1.default.createElement("small", { className: "opacity-75" }, "Create a new account")))),
-                        react_1.default.createElement("button", { className: `btn btn-lg py-3 ${isDark ? 'btn-outline-light' : 'btn-outline-primary'}`, onClick: () => setIsExistingUser(true) },
-                            react_1.default.createElement("div", { className: "d-flex align-items-center justify-content-center" },
-                                react_1.default.createElement("i", { className: "bi bi-box-arrow-in-right fs-4 me-2" }),
-                                react_1.default.createElement("div", { className: "text-start" },
-                                    react_1.default.createElement("div", { className: "fw-semibold" }, "I'm an Existing User"),
-                                    react_1.default.createElement("small", { className: "opacity-75" }, "Sign in with your credentials")))))))));
+    if (step === "select-user-type" && isExistingUser === null) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: "20px", backgroundColor: isDark ? "#212529" : "#f8f9fa" }, children: (0, jsx_runtime_1.jsx)("div", { className: "card shadow", style: {
+                    maxWidth: "500px",
+                    width: "100%",
+                    backgroundColor: isDark ? "#2d3238" : "#ffffff",
+                }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body p-4 p-md-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center mb-4", children: [(0, jsx_runtime_1.jsx)("h2", { className: `fw-bold mb-2 ${isDark ? "text-light" : ""}`, children: "Welcome to Peers" }), (0, jsx_runtime_1.jsx)("p", { className: isDark ? "text-light opacity-75" : "text-muted", children: "Let's get you set up" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "d-grid gap-3", children: [(0, jsx_runtime_1.jsx)("button", { className: "btn btn-lg btn-primary py-3", onClick: () => setIsExistingUser(false), children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center justify-content-center", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-plus fs-4 me-2" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-start", children: [(0, jsx_runtime_1.jsx)("div", { className: "fw-semibold", children: "I'm a New User" }), (0, jsx_runtime_1.jsx)("small", { className: "opacity-75", children: "Create a new account" })] })] }) }), (0, jsx_runtime_1.jsx)("button", { className: `btn btn-lg py-3 ${isDark ? "btn-outline-light" : "btn-outline-primary"}`, onClick: () => setIsExistingUser(true), children: (0, jsx_runtime_1.jsxs)("div", { className: "d-flex align-items-center justify-content-center", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-box-arrow-in-right fs-4 me-2" }), (0, jsx_runtime_1.jsxs)("div", { className: "text-start", children: [(0, jsx_runtime_1.jsx)("div", { className: "fw-semibold", children: "I'm an Existing User" }), (0, jsx_runtime_1.jsx)("small", { className: "opacity-75", children: "Sign in with your credentials" })] })] }) })] })] }) }) }));
     }
     // Step 2: New User Confirmation
     if (isExistingUser === false) {
-        return (react_1.default.createElement("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: '20px', backgroundColor: isDark ? '#212529' : '#f8f9fa' } },
-            react_1.default.createElement("div", { className: "card shadow", style: { maxWidth: '500px', width: '100%', backgroundColor: isDark ? '#2d3238' : '#ffffff' } },
-                react_1.default.createElement("div", { className: "card-body p-4 p-md-5" },
-                    react_1.default.createElement("div", { className: "text-center mb-4" },
-                        react_1.default.createElement("i", { className: "bi bi-person-plus-fill text-primary fs-1 mb-3 d-block" }),
-                        react_1.default.createElement("h3", { className: `fw-bold mb-2 ${isDark ? 'text-light' : ''}` }, "Create New Account"),
-                        react_1.default.createElement("p", { className: isDark ? 'text-light opacity-75' : 'text-muted' }, "We'll generate secure credentials for you")),
-                    error && (react_1.default.createElement("div", { className: "alert alert-danger", role: "alert" },
-                        react_1.default.createElement("i", { className: "bi bi-exclamation-triangle me-2" }),
-                        error)),
-                    react_1.default.createElement("div", { className: "d-grid gap-2" },
-                        react_1.default.createElement("button", { className: "btn btn-lg btn-primary", onClick: handleNewUser, disabled: isValidating }, isValidating ? (react_1.default.createElement(react_1.default.Fragment, null,
-                            react_1.default.createElement("span", { className: "spinner-border spinner-border-sm me-2" }),
-                            "Creating Account...")) : (react_1.default.createElement(react_1.default.Fragment, null,
-                            react_1.default.createElement("i", { className: "bi bi-check-circle me-2" }),
-                            "Create Account"))),
-                        react_1.default.createElement("button", { className: "btn btn-outline-secondary", onClick: () => setIsExistingUser(null), disabled: isValidating },
-                            react_1.default.createElement("i", { className: "bi bi-arrow-left me-2" }),
-                            "Back"))))));
+        return ((0, jsx_runtime_1.jsx)("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: "20px", backgroundColor: isDark ? "#212529" : "#f8f9fa" }, children: (0, jsx_runtime_1.jsx)("div", { className: "card shadow", style: {
+                    maxWidth: "500px",
+                    width: "100%",
+                    backgroundColor: isDark ? "#2d3238" : "#ffffff",
+                }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body p-4 p-md-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center mb-4", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-person-plus-fill text-primary fs-1 mb-3 d-block" }), (0, jsx_runtime_1.jsx)("h3", { className: `fw-bold mb-2 ${isDark ? "text-light" : ""}`, children: "Create New Account" }), (0, jsx_runtime_1.jsx)("p", { className: isDark ? "text-light opacity-75" : "text-muted", children: "We'll generate secure credentials for you" })] }), error && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-danger", role: "alert", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-exclamation-triangle me-2" }), error] })), (0, jsx_runtime_1.jsxs)("div", { className: "d-grid gap-2", children: [(0, jsx_runtime_1.jsx)("button", { className: "btn btn-lg btn-primary", onClick: handleNewUser, disabled: isValidating, children: isValidating ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "spinner-border spinner-border-sm me-2" }), "Creating Account..."] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-check-circle me-2" }), "Create Account"] })) }), (0, jsx_runtime_1.jsxs)("button", { className: "btn btn-outline-secondary", onClick: () => setIsExistingUser(null), disabled: isValidating, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-arrow-left me-2" }), "Back"] })] })] }) }) }));
     }
     // Step 3: Existing User Sign In
     if (isExistingUser === true) {
-        return (react_1.default.createElement("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: '20px', backgroundColor: isDark ? '#212529' : '#f8f9fa' } },
-            react_1.default.createElement("div", { className: "card shadow", style: { maxWidth: '500px', width: '100%', backgroundColor: isDark ? '#2d3238' : '#ffffff' } },
-                react_1.default.createElement("div", { className: "card-body p-4 p-md-5" },
-                    react_1.default.createElement("div", { className: "text-center mb-2" },
-                        react_1.default.createElement("h3", { className: `fw-bold mb-2 ${isDark ? 'text-light' : ''}` },
-                            react_1.default.createElement("span", null, "Sign In"),
-                            "\u00A0\u00A0",
-                            react_1.default.createElement("i", { className: "bi bi-box-arrow-in-right text-primary" })),
-                        react_1.default.createElement("p", { className: isDark ? 'text-light opacity-75' : 'text-muted' }, "Enter your existing credentials")),
-                    error && (react_1.default.createElement("div", { className: "alert alert-danger", role: "alert" },
-                        react_1.default.createElement("i", { className: "bi bi-exclamation-triangle me-2" }),
-                        error)),
-                    react_1.default.createElement("form", { onSubmit: (e) => { e.preventDefault(); handleExistingUser(); } },
-                        react_1.default.createElement("div", { className: "mb-3" },
-                            react_1.default.createElement("label", { htmlFor: "userId", className: "form-label fw-semibold" }, "User ID"),
-                            react_1.default.createElement("input", { id: "userId", type: "text", className: "form-control form-control-lg", placeholder: "Enter your user ID", value: userId, onChange: (e) => setUserId(e.target.value), disabled: isValidating, autoFocus: true })),
-                        react_1.default.createElement("div", { className: "mb-4" },
-                            react_1.default.createElement("label", { htmlFor: "secretKey", className: "form-label fw-semibold" }, "Secret Key"),
-                            react_1.default.createElement("input", { id: "secretKey", type: "password", className: "form-control form-control-lg", placeholder: "Enter your secret key", value: secretKey, onChange: (e) => setSecretKey(e.target.value), disabled: isValidating })),
-                        react_1.default.createElement("div", { className: "d-grid gap-2" },
-                            react_1.default.createElement("button", { type: "submit", className: "btn btn-lg btn-primary", disabled: isValidating }, isValidating ? (react_1.default.createElement(react_1.default.Fragment, null,
-                                react_1.default.createElement("span", { className: "spinner-border spinner-border-sm me-2" }),
-                                "Signing In...")) : (react_1.default.createElement(react_1.default.Fragment, null,
-                                react_1.default.createElement("i", { className: "bi bi-check-circle me-2" }),
-                                "Sign In"))),
-                            react_1.default.createElement("button", { type: "button", className: "btn btn-outline-secondary", onClick: () => setIsExistingUser(null), disabled: isValidating },
-                                react_1.default.createElement("i", { className: "bi bi-arrow-left me-2" }),
-                                "Back")))))));
+        return ((0, jsx_runtime_1.jsx)("div", { className: "container-fluid d-flex align-items-start justify-content-center", style: { paddingTop: "20px", backgroundColor: isDark ? "#212529" : "#f8f9fa" }, children: (0, jsx_runtime_1.jsx)("div", { className: "card shadow", style: {
+                    maxWidth: "500px",
+                    width: "100%",
+                    backgroundColor: isDark ? "#2d3238" : "#ffffff",
+                }, children: (0, jsx_runtime_1.jsxs)("div", { className: "card-body p-4 p-md-5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "text-center mb-2", children: [(0, jsx_runtime_1.jsxs)("h3", { className: `fw-bold mb-2 ${isDark ? "text-light" : ""}`, children: [(0, jsx_runtime_1.jsx)("span", { children: "Sign In" }), "\u00A0\u00A0", (0, jsx_runtime_1.jsx)("i", { className: "bi bi-box-arrow-in-right text-primary" })] }), (0, jsx_runtime_1.jsx)("p", { className: isDark ? "text-light opacity-75" : "text-muted", children: "Enter your existing credentials" })] }), error && ((0, jsx_runtime_1.jsxs)("div", { className: "alert alert-danger", role: "alert", children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-exclamation-triangle me-2" }), error] })), (0, jsx_runtime_1.jsxs)("form", { onSubmit: (e) => {
+                                e.preventDefault();
+                                handleExistingUser();
+                            }, children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-3", children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "userId", className: "form-label fw-semibold", children: "User ID" }), (0, jsx_runtime_1.jsx)("input", { id: "userId", type: "text", className: "form-control form-control-lg", placeholder: "Enter your user ID", value: userId, onChange: (e) => setUserId(e.target.value), disabled: isValidating })] }), (0, jsx_runtime_1.jsxs)("div", { className: "mb-4", children: [(0, jsx_runtime_1.jsx)("label", { htmlFor: "secretKey", className: "form-label fw-semibold", children: "Secret Key" }), (0, jsx_runtime_1.jsx)("input", { id: "secretKey", type: "password", className: "form-control form-control-lg", placeholder: "Enter your secret key", value: secretKey, onChange: (e) => setSecretKey(e.target.value), disabled: isValidating })] }), (0, jsx_runtime_1.jsxs)("div", { className: "d-grid gap-2", children: [(0, jsx_runtime_1.jsx)("button", { type: "submit", className: "btn btn-lg btn-primary", disabled: isValidating, children: isValidating ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "spinner-border spinner-border-sm me-2" }), "Signing In..."] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-check-circle me-2" }), "Sign In"] })) }), (0, jsx_runtime_1.jsxs)("button", { type: "button", className: "btn btn-outline-secondary", onClick: () => setIsExistingUser(null), disabled: isValidating, children: [(0, jsx_runtime_1.jsx)("i", { className: "bi bi-arrow-left me-2" }), "Back"] })] })] })] }) }) }));
     }
     return null;
 };

package/dist/screens/tools/tool-code.d.ts

@@ -1,5 +1,4 @@
-import { IDoc, ITool } from "@peers-app/peers-sdk";
-import React from "react";
+import { type IDoc, type ITool } from "@peers-app/peers-sdk";
 export declare const ToolCode: (props: {
     tool: IDoc<ITool>;
-}) => React.JSX.Element;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/screens/tools/tool-code.js

@@ -1,32 +1,28 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ToolCode = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
-const react_1 = __importDefault(require("react"));
 const editor_inline_1 = require("../../components/markdown-editor/editor-inline");
 const ToolCode = (props) => {
     const { tool } = props;
-    let code = tool.qs.code() ?? '';
+    let code = tool.qs.code() ?? "";
     const toolCodeObs = (0, peers_sdk_1.computed)({
         read: () => {
-            if (!code.startsWith('```')) {
-                code = '```javascript\n' + code + '\n```';
+            if (!code.startsWith("```")) {
+                code = `\`\`\`javascript\n${code}\n\`\`\``;
             }
             return code;
         },
         write: (newCode) => {
             code = newCode;
-            if (code.startsWith('```javascript\n')) {
-                code = code.replace('```javascript\n', '');
-                code = code.replace('\n```', '');
+            if (code.startsWith("```javascript\n")) {
+                code = code.replace("```javascript\n", "");
+                code = code.replace("\n```", "");
             }
             tool.qs.code(code);
-        }
+        },
     });
-    return (react_1.default.createElement("div", null,
-        react_1.default.createElement(editor_inline_1.MarkdownEditorInline, { value: toolCodeObs, hideToolbar: true })));
+    return ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(editor_inline_1.MarkdownEditorInline, { value: toolCodeObs, hideToolbar: true }) }));
 };
 exports.ToolCode = ToolCode;

package/dist/screens/tools/tool-details.d.ts

@@ -1,6 +1,5 @@
-import React from "react";
 interface IToolDetailsProps {
     toolId: string;
 }
-export declare const ToolDetails: (props: IToolDetailsProps) => React.JSX.Element;
+export declare const ToolDetails: (props: IToolDetailsProps) => import("react/jsx-runtime").JSX.Element;
 export {};