@peers-app/peers-ui 0.11.2 → 0.12.1

package/dist/components/chat-overlay.js

@@ -65,6 +65,7 @@ function getChatOverlayThreadPvar() {
     }
     return chatOverlayThreadPvar;
 }
+const voiceHubActive = (0, peers_sdk_1.deviceVar)('voiceHub:active', { defaultValue: false });
 // Voice settings pvar (shared with voice-settings.tsx and voice-service.ts)
 const voiceSettingsPvar = (0, peers_sdk_1.userVar)('voiceSettings', { defaultValue: DEFAULT_VOICE_SETTINGS });
 const DEFAULT_POSITION = { x: 20, y: 20 };
@@ -190,7 +191,7 @@ const ChatOverlay = ({ position = 'bottom-right', }) => {
                     setTranscription('');
                     setError(null);
                 }
-                if (event.data.state === 'recording') {
+                if (event.data.state === 'recording' && !voiceHubActive()) {
                     setIsExpanded(true);
                 }
             }),

package/dist/components/inverse-lazy-list.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+interface IInverseLazyListProps<T> {
+    /** Unique id for the scroll container — required to avoid id collisions */
+    scrollableId: string;
+    /** Called to fetch the next older batch. Receives the current newest-first items array. */
+    loadMore: (existingItems: T[]) => Promise<T[]>;
+    /** Render all loaded items. Receives the newest-first array. */
+    renderItems: (items: T[]) => React.ReactNode;
+    /** Optional ref that will be set to a function to prepend a single live item */
+    prependRef?: React.MutableRefObject<((item: T) => void) | null>;
+    /** Custom loading indicator */
+    loadingIndicator?: React.ReactNode;
+    /** Change this value to reset the list and reload from scratch */
+    resetTrigger?: any;
+    /** Style for the outer scroll container */
+    style?: React.CSSProperties;
+}
+/**
+ * Infinite scroll list for chat-style history (newest at bottom, load older on scroll up).
+ * Uses react-infinite-scroll-component with inverse=true and column-reverse layout.
+ *
+ * Items state is managed internally. Use prependRef to push live inserts from outside.
+ */
+export declare function InverseLazyList<T>(props: IInverseLazyListProps<T>): React.JSX.Element;
+export {};

package/dist/components/inverse-lazy-list.js

@@ -0,0 +1,103 @@
+"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;
+    };
+})();
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.InverseLazyList = InverseLazyList;
+const react_1 = __importStar(require("react"));
+const react_infinite_scroll_component_1 = __importDefault(require("react-infinite-scroll-component"));
+const PRELOAD_THRESHOLD = 20;
+/**
+ * Infinite scroll list for chat-style history (newest at bottom, load older on scroll up).
+ * Uses react-infinite-scroll-component with inverse=true and column-reverse layout.
+ *
+ * Items state is managed internally. Use prependRef to push live inserts from outside.
+ */
+function InverseLazyList(props) {
+    const [items, setItems] = (0, react_1.useState)([]);
+    const [allLoaded, setAllLoaded] = (0, react_1.useState)(false);
+    const isLoadingRef = (0, react_1.useRef)(false);
+    const itemsRef = (0, react_1.useRef)([]);
+    // Keep ref in sync so loadMore always sees the latest items
+    itemsRef.current = items;
+    // Expose prepend function via ref so callers can push live updates
+    (0, react_1.useEffect)(() => {
+        if (props.prependRef) {
+            props.prependRef.current = (item) => setItems(prev => [item, ...prev]);
+        }
+        return () => {
+            if (props.prependRef)
+                props.prependRef.current = null;
+        };
+    }, [props.prependRef]);
+    async function loadMore() {
+        if (isLoadingRef.current || allLoaded)
+            return;
+        isLoadingRef.current = true;
+        try {
+            const moreItems = await props.loadMore(itemsRef.current);
+            if (!moreItems.length) {
+                setAllLoaded(true);
+            }
+            else {
+                setItems(prev => [...prev, ...moreItems]);
+            }
+        }
+        finally {
+            isLoadingRef.current = false;
+        }
+    }
+    // Auto-preload when items are sparse
+    (0, react_1.useEffect)(() => {
+        if (items.length < PRELOAD_THRESHOLD && !allLoaded && !isLoadingRef.current) {
+            loadMore();
+        }
+    }, [items.length, allLoaded]);
+    // Reset when resetTrigger changes
+    (0, react_1.useEffect)(() => {
+        setItems([]);
+        setAllLoaded(false);
+        isLoadingRef.current = false;
+    }, [props.resetTrigger]);
+    return (react_1.default.createElement("div", { id: props.scrollableId, style: {
+            overflow: 'auto',
+            display: 'flex',
+            flexDirection: 'column-reverse',
+            ...props.style,
+        } },
+        react_1.default.createElement(react_infinite_scroll_component_1.default, { dataLength: items.length, next: loadMore, style: { display: 'flex', flexDirection: 'column-reverse', overflow: 'hidden' }, inverse: true, hasMore: !allLoaded, loader: props.loadingIndicator ?? (react_1.default.createElement("div", { className: "d-flex justify-content-center py-2" },
+                react_1.default.createElement("div", { className: "spinner-border spinner-border-sm text-secondary", role: "status" }))), scrollableTarget: props.scrollableId }, props.renderItems(items))));
+}

package/dist/components/left-bar.d.ts

@@ -1,3 +1,5 @@
 import React from 'react';
 export declare const LeftBar: () => React.JSX.Element;
-export declare const LeftBarContent: () => React.JSX.Element;
+export declare const LeftBarContent: ({ width }?: {
+    width?: number;
+}) => React.JSX.Element;

package/dist/components/left-bar.js

@@ -1,32 +1,120 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
+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.LeftBarContent = exports.LeftBar = void 0;
 const peers_sdk_1 = require("@peers-app/peers-sdk");
-const react_1 = __importDefault(require("react"));
+const react_1 = __importStar(require("react"));
 const globals_1 = require("../globals");
 const hooks_1 = require("../hooks");
 const off_canvas_1 = require("./off-canvas");
 // import { useObservable } from 'peers-ui';
 const offCanvasEffects = { hide: () => { } };
+const LEFT_BAR_WIDTH_KEY = 'leftBarWidth';
+const DEFAULT_LEFT_BAR_WIDTH = 300;
+function getStoredLeftBarWidth() {
+    const stored = localStorage.getItem(LEFT_BAR_WIDTH_KEY);
+    return stored ? parseInt(stored, 10) : DEFAULT_LEFT_BAR_WIDTH;
+}
+function setStoredLeftBarWidth(width) {
+    localStorage.setItem(LEFT_BAR_WIDTH_KEY, String(width));
+    document.documentElement.style.setProperty('--left-bar-width', `${width}px`);
+}
+// Set initial CSS variable on load
+setStoredLeftBarWidth(getStoredLeftBarWidth());
 const LeftBar = () => {
     const [_isDesktop] = (0, hooks_1.useObservable)(globals_1.isDesktop);
+    const [width, setWidth] = (0, react_1.useState)(() => getStoredLeftBarWidth());
+    const isDragging = (0, react_1.useRef)(false);
+    const startX = (0, react_1.useRef)(0);
+    const startWidth = (0, react_1.useRef)(0);
+    const onMouseMove = (0, react_1.useCallback)((e) => {
+        if (!isDragging.current)
+            return;
+        const delta = e.clientX - startX.current;
+        const newWidth = Math.max(150, Math.min(600, startWidth.current + delta));
+        setWidth(newWidth);
+        setStoredLeftBarWidth(newWidth);
+    }, []);
+    const onMouseUp = (0, react_1.useCallback)(() => {
+        isDragging.current = false;
+        document.removeEventListener('mousemove', onMouseMove);
+        document.removeEventListener('mouseup', onMouseUp);
+        document.body.style.cursor = '';
+        document.body.style.userSelect = '';
+    }, [onMouseMove]);
+    const onMouseDown = (0, react_1.useCallback)((e) => {
+        e.preventDefault();
+        isDragging.current = true;
+        startX.current = e.clientX;
+        startWidth.current = width;
+        document.addEventListener('mousemove', onMouseMove);
+        document.addEventListener('mouseup', onMouseUp);
+        document.body.style.cursor = 'col-resize';
+        document.body.style.userSelect = 'none';
+    }, [width, onMouseMove, onMouseUp]);
+    (0, react_1.useEffect)(() => {
+        return () => {
+            document.removeEventListener('mousemove', onMouseMove);
+            document.removeEventListener('mouseup', onMouseUp);
+        };
+    }, [onMouseMove, onMouseUp]);
     // const [usersAndGroups, setUsersAndGroups] = useState<(IUser | IGroup)[]>([]);
     if (_isDesktop) {
-        return (react_1.default.createElement("div", { className: 'left-bar-desktop', style: { position: 'fixed', top: 0, left: 0 } },
-            react_1.default.createElement(exports.LeftBarContent, null)));
+        return (react_1.default.createElement("div", { className: 'left-bar-desktop', style: { position: 'fixed', top: 0, left: 0, width, display: 'flex', flexDirection: 'row' } },
+            react_1.default.createElement(exports.LeftBarContent, { width: width }),
+            react_1.default.createElement("div", { onMouseDown: onMouseDown, title: "Drag to resize", style: {
+                    position: 'absolute',
+                    top: 0,
+                    right: '-3px',
+                    width: '6px',
+                    height: '100%',
+                    cursor: 'col-resize',
+                    zIndex: 200,
+                    backgroundColor: 'transparent',
+                }, onMouseEnter: e => { e.target.style.backgroundColor = 'rgba(128,128,128,0.4)'; }, onMouseLeave: e => { e.target.style.backgroundColor = 'transparent'; } })));
     }
     else {
         return (react_1.default.createElement(off_canvas_1.OffCanvas, { id: "leftBar", position: "left", keepOpen: _isDesktop, effects: offCanvasEffects },
-            react_1.default.createElement(exports.LeftBarContent, null)));
+            react_1.default.createElement(exports.LeftBarContent, { width: DEFAULT_LEFT_BAR_WIDTH })));
     }
 };
 exports.LeftBar = LeftBar;
-const LeftBarContent = () => {
+const LeftBarContent = ({ width } = {}) => {
     const [contentPath] = (0, hooks_1.useObservable)(globals_1.mainContentPath);
     const [_isDesktop] = (0, hooks_1.useObservable)(globals_1.isDesktop);
+    const barWidth = width ?? DEFAULT_LEFT_BAR_WIDTH;
     const packagesWithNavItems = (0, hooks_1.usePromise)(async () => {
         const packages = await (0, peers_sdk_1.Packages)().list();
         return packages.filter(pkg => pkg.appNavs?.length);
@@ -38,7 +126,7 @@ const LeftBarContent = () => {
     ];
     const knowledgeSublinkActive = contentPath.startsWith('knowledge-') || knowledgeSublinks.find(ks => contentPath.startsWith(ks.path || ks.text.toLowerCase()));
     const containerClassName = `d-flex flex-column flex-shrink-0 p-2 text-white ` + (_isDesktop ? 'bg-dark-subtle' : 'bg-dark');
-    const content = (react_1.default.createElement("div", { className: containerClassName, style: { width: "300px", height: "calc(100vh - 25px)" } },
+    const content = (react_1.default.createElement("div", { className: containerClassName, style: { width: barWidth, height: "calc(100vh - 25px)" } },
         react_1.default.createElement("div", { className: "clearfix" },
             react_1.default.createElement("div", { className: "dropdown", style: { display: 'inline-block', width: '200px' } },
                 react_1.default.createElement("a", { id: "dropdownUser1", "data-bs-toggle": "dropdown", "aria-expanded": "false", className: "d-flex align-items-center text-white text-decoration-none", href: "#", tabIndex: -1 },

package/dist/components/main-content-container.js

@@ -43,6 +43,8 @@ const globals_1 = require("../globals");
 const thread_view_1 = require("./messages/thread-view");
 const router_1 = require("./router");
 const hooks_1 = require("../hooks");
+const LEFT_BAR_WIDTH_KEY = 'leftBarWidth';
+const DEFAULT_LEFT_BAR_WIDTH = 300;
 const MainContentContainer = () => {
     const splitPositionGlobalName = 'mainContentContainerSplitPos';
     let [splitPos, setSplitPos] = (0, react_1.useState)(localStorage.getItem(splitPositionGlobalName) || '800');
@@ -83,7 +85,7 @@ const MainContentContainer = () => {
         react_1.default.createElement("div", { className: 'thread-view', style: {
                 height: `calc(100vh - 25px)`,
                 overflowY: 'scroll',
-                width: `calc(100vw - ${splitPos}px - 300px)`,
+                width: `calc(100vw - ${splitPos}px - ${parseInt(localStorage.getItem(LEFT_BAR_WIDTH_KEY) || String(DEFAULT_LEFT_BAR_WIDTH), 10)}px)`,
             } },
             react_1.default.createElement(thread_view_1.ThreadContainer, null))));
 };

package/dist/components/markdown-editor/markdown-plugin.d.ts

@@ -1,6 +1,4 @@
-import { ElementTransformer } from "@lexical/markdown";
 import { Observable } from "@peers-app/peers-sdk";
-export declare const PRESERVE_NEWLINES: ElementTransformer;
 export declare const customMarkdownTransformers: import("@lexical/markdown").Transformer[];
 interface IProps {
     markdownObs: Observable<string>;

package/dist/components/markdown-editor/markdown-plugin.js

@@ -1,12 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.customMarkdownTransformers = exports.PRESERVE_NEWLINES = void 0;
+exports.customMarkdownTransformers = void 0;
 exports.MarkdownPlugin = MarkdownPlugin;
 const list_1 = require("@lexical/list");
 const markdown_1 = require("@lexical/markdown");
 const LexicalComposerContext_1 = require("@lexical/react/LexicalComposerContext");
 const peers_sdk_1 = require("@peers-app/peers-sdk");
-const lexical_1 = require("lexical");
 const react_1 = require("react");
 const mention_node_1 = require("./mention-node");
 // Amount of spaces that define indentation level
@@ -118,27 +117,7 @@ const MENTION_TRANSFORMER = {
         textNode.replace(node);
     },
 };
-exports.PRESERVE_NEWLINES = {
-    type: 'element',
-    dependencies: [lexical_1.ParagraphNode],
-    export: (node) => {
-        if ((0, lexical_1.$isParagraphNode)(node)) {
-            const content = node.getTextContent();
-            if (!content.trim()) {
-                return '\n \n';
-            }
-        }
-        return null;
-    },
-    regExp: /^ $/, // a line with only a space
-    replace: (textNode, nodes, _, isImport) => {
-        if (isImport && nodes.length === 1) {
-            textNode.append((0, lexical_1.$createTextNode)(''));
-        }
-    },
-};
 exports.customMarkdownTransformers = [
-    exports.PRESERVE_NEWLINES,
     MENTION_TRANSFORMER,
     CHECK_LIST_TRANSFORMER, // This needs to be first or checklists will be treated as unordered lists
     ...markdown_1.TRANSFORMERS.filter(transformer => {
@@ -162,9 +141,7 @@ function MarkdownPlugin(props) {
             }
             markdown = newMarkdown;
             editor.update(() => {
-                const shouldPreserveNewLines = false;
-                const shouldMergeAdjacentLines = false;
-                (0, markdown_1.$convertFromMarkdownString)(markdown, exports.customMarkdownTransformers, undefined, shouldPreserveNewLines, shouldMergeAdjacentLines);
+                (0, markdown_1.$convertFromMarkdownString)(markdown, exports.customMarkdownTransformers, undefined, true, false);
             });
         }
         setMarkdown();
@@ -172,13 +149,8 @@ function MarkdownPlugin(props) {
             setMarkdown();
         });
         const sub2Dispose = editor.registerUpdateListener(({ editorState }) => {
-            editor.update(() => {
-                const shouldPreserveNewLines = false;
-                let newMarkdown = (0, markdown_1.$convertToMarkdownString)(exports.customMarkdownTransformers, undefined, shouldPreserveNewLines);
-                newMarkdown = newMarkdown.replace(/\n\n\n \n\n\n/gm, '\n\n \n\n');
-                if (newMarkdown === "\n \n") {
-                    newMarkdown = '';
-                }
+            editorState.read(() => {
+                const newMarkdown = (0, markdown_1.$convertToMarkdownString)(exports.customMarkdownTransformers, undefined, true);
                 if (newMarkdown !== markdown) {
                     markdown = newMarkdown;
                     markdownObs(markdown);

package/dist/components/tabs.d.ts

@@ -6,6 +6,7 @@ interface ITabsProps {
         active?: true;
     }[];
     contentClassName?: string;
+    activeTabName?: string;
 }
 export declare const Tabs: (props: ITabsProps) => React.JSX.Element;
 export declare const ScreenTabBody: (props: React.PropsWithChildren) => React.JSX.Element;

package/dist/components/tabs.js

@@ -44,22 +44,23 @@ const Tabs = (props) => {
         activeTabName = activeTabName.toLowerCase();
         const _activeTab = tabs.find(tab => tab.name.toLowerCase() === activeTabName) || tabs[0];
         lastActive = _activeTab.name;
-        // TODO setup query persistence on tabs
-        // setTimeout(() => queryParam('tab', lastActive.toLowerCase()));
         return _activeTab;
     });
+    // Allow parent to control the active tab imperatively
+    const resolvedActiveTab = props.activeTabName
+        ? (tabs.find(tab => tab.name.toLowerCase() === props.activeTabName.toLowerCase()) ?? activeTab)
+        : activeTab;
     function setActiveTab(tab) {
         _setActiveTab(tab);
-        // queryParam('tab', tab.name.toLowerCase());
         lastActive = tab.name;
     }
     return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("ul", { className: "nav nav-tabs" }, tabs.map((tab, iTab) => {
             return (react_1.default.createElement("li", { key: tab.name + iTab, className: "nav-item" },
-                react_1.default.createElement("a", { href: "#", className: "nav-link " + (activeTab.name === tab.name ? 'active' : ''), onClick: evt => (evt.preventDefault(), setActiveTab(tab)) }, tab.name)));
+                react_1.default.createElement("a", { href: "#", className: "nav-link " + (resolvedActiveTab.name === tab.name ? 'active' : ''), onClick: evt => (evt.preventDefault(), setActiveTab(tab)) }, tab.name)));
         })),
         react_1.default.createElement("div", { className: "tab-content " + (props.contentClassName ?? 'mt-3') }, tabs.map((tab, iTab) => {
-            return (react_1.default.createElement("div", { key: tab.name + iTab, hidden: activeTab.name !== tab.name }, tab.content));
+            return (react_1.default.createElement("div", { key: tab.name + iTab, hidden: resolvedActiveTab.name !== tab.name }, tab.content));
         }))));
 };
 exports.Tabs = Tabs;

package/dist/index.d.ts

@@ -1,7 +1,10 @@
 export * from "./screens/events/cron";
 export * from "./tabs-layout/tabs-layout";
+export { activeTabId, activeTabs, TabState } from "./tabs-layout/tabs-state";
 export * from "./components/voice-indicator";
 export * from "./components/chat-overlay";
 export * from "./components/sortable-list";
 export * from "./components/tabs";
+export * from "./components/inverse-lazy-list";
 export * from "./components/markdown-editor/editor-inline";
+export * from "./components/markdown-editor/editor";

package/dist/index.js

@@ -14,10 +14,16 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.activeTabs = exports.activeTabId = void 0;
 __exportStar(require("./screens/events/cron"), exports);
 __exportStar(require("./tabs-layout/tabs-layout"), exports);
+var tabs_state_1 = require("./tabs-layout/tabs-state");
+Object.defineProperty(exports, "activeTabId", { enumerable: true, get: function () { return tabs_state_1.activeTabId; } });
+Object.defineProperty(exports, "activeTabs", { enumerable: true, get: function () { return tabs_state_1.activeTabs; } });
 __exportStar(require("./components/voice-indicator"), exports);
 __exportStar(require("./components/chat-overlay"), exports);
 __exportStar(require("./components/sortable-list"), exports);
 __exportStar(require("./components/tabs"), exports);
+__exportStar(require("./components/inverse-lazy-list"), exports);
 __exportStar(require("./components/markdown-editor/editor-inline"), exports);
+__exportStar(require("./components/markdown-editor/editor"), exports);

package/dist/screens/settings/voice-settings-agent.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const VoiceSettingsAgent: React.FC;

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

@@ -0,0 +1,76 @@
+"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.VoiceSettingsAgent = void 0;
+const react_1 = __importStar(require("react"));
+const peers_sdk_1 = require("@peers-app/peers-sdk");
+const VOICE_HUB_AGENT_ASSISTANT_ID = '00mh0wlipkdbeaw8vhagent01';
+// Must match the pvar names in peers-core/src/data/voice-agent-config.ts and
+// peers-electron/src/server/voice/voice-agent-config.ts — pvar instances are
+// singletons keyed by name+scope so all three share the same underlying value.
+const voiceAgentAssistantIdPvar = (0, peers_sdk_1.userVar)('voice:agentAssistantId', { defaultValue: VOICE_HUB_AGENT_ASSISTANT_ID });
+const VoiceSettingsAgent = () => {
+    const [assistants, setAssistants] = (0, react_1.useState)([]);
+    const [selectedId, setSelectedId] = (0, react_1.useState)(VOICE_HUB_AGENT_ASSISTANT_ID);
+    const [saving, setSaving] = (0, react_1.useState)(false);
+    const [saved, setSaved] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        const load = async () => {
+            await voiceAgentAssistantIdPvar.loadingPromise;
+            setSelectedId(voiceAgentAssistantIdPvar() ?? VOICE_HUB_AGENT_ASSISTANT_ID);
+            const all = await (0, peers_sdk_1.Assistants)().list({});
+            setAssistants(all);
+        };
+        load();
+    }, []);
+    const handleSave = (0, react_1.useCallback)(async () => {
+        setSaving(true);
+        setSaved(false);
+        await voiceAgentAssistantIdPvar.loadingPromise;
+        voiceAgentAssistantIdPvar(selectedId || undefined);
+        setSaving(false);
+        setSaved(true);
+        setTimeout(() => setSaved(false), 2000);
+    }, [selectedId]);
+    return (react_1.default.createElement("div", null,
+        react_1.default.createElement("h6", null, "Voice Agent"),
+        react_1.default.createElement("p", { className: "text-muted small mb-2" }, "When you give a voice command that requires action (e.g. \"add milk to the shopping list\"), it is dispatched to this assistant as a background task."),
+        react_1.default.createElement("div", { className: "d-flex align-items-center gap-2" },
+            react_1.default.createElement("select", { className: "form-select form-select-sm", value: selectedId, onChange: e => setSelectedId(e.target.value), disabled: saving }, assistants.map(a => (react_1.default.createElement("option", { key: a.assistantId, value: a.assistantId },
+                a.name,
+                a.assistantId === VOICE_HUB_AGENT_ASSISTANT_ID ? ' (default)' : '')))),
+            react_1.default.createElement("button", { className: "btn btn-sm btn-primary", onClick: handleSave, disabled: saving, style: { whiteSpace: 'nowrap' } }, saving ? 'Saving…' : saved ? 'Saved!' : 'Save'))));
+};
+exports.VoiceSettingsAgent = VoiceSettingsAgent;

package/dist/screens/settings/voice-settings-api-keys.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+import { VoiceSettings, PicovoiceKeyError } from './voice-settings-types';
+interface ApiKeysProps {
+    settings: VoiceSettings;
+    picovoiceKey: string;
+    openaiKey: string;
+    keyError: PicovoiceKeyError | null;
+    onPicovoiceKeyChange: (value: string) => void;
+    onOpenaiKeyChange: (value: string) => void;
+    onDismissKeyError: () => void;
+}
+export declare const VoiceSettingsApiKeys: React.FC<ApiKeysProps>;
+export {};

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

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.VoiceSettingsApiKeys = void 0;
+const react_1 = __importDefault(require("react"));
+const tooltip_1 = require("../../components/tooltip");
+const voice_settings_types_1 = require("./voice-settings-types");
+const VoiceSettingsApiKeys = ({ settings, picovoiceKey, openaiKey, keyError, onPicovoiceKeyChange, onOpenaiKeyChange, onDismissKeyError, }) => (react_1.default.createElement(react_1.default.Fragment, null,
+    react_1.default.createElement("div", { className: "mb-4" },
+        react_1.default.createElement("label", { className: "form-label" },
+            "Picovoice Access Key",
+            react_1.default.createElement(tooltip_1.Tooltip, { markdownContent: "Required for wake word detection. Get a free key at [console.picovoice.ai](https://console.picovoice.ai)" }),
+            settings.picovoiceAccessKeySet && (react_1.default.createElement("span", { className: "badge bg-success ms-2" }, "Set"))),
+        react_1.default.createElement("input", { type: "password", className: "form-control", value: picovoiceKey, onChange: (e) => onPicovoiceKeyChange(e.target.value), placeholder: settings.picovoiceAccessKeySet ? '••••••••••••••••' : 'Enter your Picovoice access key' }),
+        react_1.default.createElement("small", { className: "text-muted" },
+            react_1.default.createElement("a", { href: "https://console.picovoice.ai", target: "_blank", rel: "noopener noreferrer" }, "Get a free access key"),
+            settings.picovoiceAccessKeySet && ' (leave blank to keep existing key)')),
+    keyError && (react_1.default.createElement("div", { className: "alert alert-warning alert-dismissible mb-4", role: "alert" },
+        react_1.default.createElement("div", { className: "d-flex align-items-start gap-2" },
+            react_1.default.createElement("i", { className: "bi bi-exclamation-triangle-fill flex-shrink-0 mt-1" }),
+            react_1.default.createElement("div", null,
+                react_1.default.createElement("strong", null, voice_settings_types_1.PICOVOICE_KEY_ERROR_MESSAGES[keyError].heading),
+                react_1.default.createElement("div", { className: "mt-1" }, voice_settings_types_1.PICOVOICE_KEY_ERROR_MESSAGES[keyError].body),
+                react_1.default.createElement("a", { href: "https://console.picovoice.ai", target: "_blank", rel: "noopener noreferrer", className: "alert-link mt-1 d-inline-block" }, "Open console.picovoice.ai"))),
+        react_1.default.createElement("button", { type: "button", className: "btn-close", onClick: onDismissKeyError }))),
+    react_1.default.createElement("div", { className: "mb-3" },
+        react_1.default.createElement("label", { className: "form-label" },
+            "OpenAI API Key",
+            react_1.default.createElement(tooltip_1.Tooltip, { markdownContent: "Required for cloud STT (Whisper) and cloud TTS. Leave empty to use local/browser alternatives." }),
+            settings.openaiApiKeySet && (react_1.default.createElement("span", { className: "badge bg-success ms-2" }, "Set"))),
+        react_1.default.createElement("input", { type: "password", className: "form-control", value: openaiKey, onChange: (e) => onOpenaiKeyChange(e.target.value), placeholder: settings.openaiApiKeySet ? '••••••••••••••••' : 'sk-...' }),
+        settings.openaiApiKeySet && (react_1.default.createElement("small", { className: "text-muted" }, "Leave blank to keep existing key")))));
+exports.VoiceSettingsApiKeys = VoiceSettingsApiKeys;

package/dist/screens/settings/voice-settings-output.d.ts

@@ -0,0 +1,16 @@
+import React from 'react';
+import { VoiceSettings } from './voice-settings-types';
+interface OutputProps {
+    settings: VoiceSettings;
+    localSettings: VoiceSettings;
+    saving: boolean;
+    testText: string;
+    hasUnsavedChanges: boolean;
+    audioDevices: string[];
+    onChange: (patch: Partial<VoiceSettings>) => void;
+    onTestTextChange: (text: string) => void;
+    onTestTTS: () => void;
+    onTestRecording: () => void;
+}
+export declare const VoiceSettingsOutput: React.FC<OutputProps>;
+export {};