osagent 0.1.87 → 0.1.89

package/dist/src/ui/contexts/FocusContext.d.ts

@@ -0,0 +1,114 @@
+/**
+ * @license
+ * Copyright 2025 OSAgent OC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import React from 'react';
+/**
+ * FocusContext provides centralized focus management for the entire UI.
+ *
+ * This solves the problem of multiple conflicting focus mechanisms
+ * (useKeypress, useSelectionList, etc.) by providing
+ * a single source of truth for which component currently has focus.
+ *
+ * Architecture:
+ * - Uses a stack-based model for nested dialogs
+ * - Last item on stack has focus, all others are paused
+ * - Components auto-register on mount, auto-unregister on unmount
+ * - Backward compatible with existing isFocused props
+ */
+export interface FocusContextValue {
+    /**
+     * Stack of focused component IDs. The last item has focus.
+     * When empty, 'main-input' (the InputPrompt) has implicit focus.
+     */
+    focusStack: readonly string[];
+    /**
+     * Push a component onto the focus stack.
+     * Called when a dialog mounts.
+     */
+    pushFocus: (id: string) => void;
+    /**
+     * Remove a component from the focus stack.
+     * Called when a dialog unmounts.
+     * Idempotent - safe to call multiple times.
+     */
+    popFocus: (id: string) => void;
+    /**
+     * Check if a specific component currently has focus.
+     * Returns true only if the id is at the top of the stack.
+     */
+    hasFocus: (id: string) => boolean;
+    /**
+     * The currently focused component ID, or null if stack is empty.
+     * When null, 'main-input' has implicit focus.
+     */
+    currentFocus: string | null;
+}
+/**
+ * Hook to access the FocusContext.
+ * Throws if used outside of FocusProvider.
+ */
+export declare function useFocusContext(): FocusContextValue;
+/**
+ * Optional hook that returns null if not within FocusProvider.
+ * Useful for backward compatibility during migration.
+ */
+export declare function useFocusContextOptional(): FocusContextValue | null;
+interface FocusProviderProps {
+    children: React.ReactNode;
+}
+/**
+ * FocusProvider manages the focus stack for the entire application.
+ *
+ * Usage:
+ * ```tsx
+ * <FocusProvider>
+ *   <App />
+ * </FocusProvider>
+ * ```
+ *
+ * Then in dialogs:
+ * ```tsx
+ * function MyDialog() {
+ *   const { isFocused } = useFocusScope('my-dialog');
+ *   // isFocused is true when this dialog is at top of stack
+ * }
+ * ```
+ */
+export declare function FocusProvider({ children }: FocusProviderProps): import("react/jsx-runtime").JSX.Element;
+/**
+ * Special focus ID for the main input prompt.
+ * This component has focus when the focus stack is empty.
+ */
+export declare const MAIN_INPUT_FOCUS_ID = "main-input";
+/**
+ * Predefined focus IDs for dialogs.
+ * Using constants prevents typos and enables autocomplete.
+ */
+export declare const FocusIds: {
+    readonly MAIN_INPUT: "main-input";
+    readonly AUTH_DIALOG: "auth-dialog";
+    readonly MODEL_DIALOG: "model-dialog";
+    readonly THEME_DIALOG: "theme-dialog";
+    readonly SETTINGS_DIALOG: "settings-dialog";
+    readonly FOLDER_TRUST_DIALOG: "folder-trust-dialog";
+    readonly APPROVAL_MODE_DIALOG: "approval-mode-dialog";
+    readonly EDITOR_SETTINGS_DIALOG: "editor-settings-dialog";
+    readonly PRO_QUOTA_DIALOG: "pro-quota-dialog";
+    readonly QUIT_CONFIRMATION_DIALOG: "quit-confirmation-dialog";
+    readonly SHELL_CONFIRMATION_DIALOG: "shell-confirmation-dialog";
+    readonly WELCOME_BACK_DIALOG: "welcome-back-dialog";
+    readonly WORKSPACE_MIGRATION_DIALOG: "workspace-migration-dialog";
+    readonly PERMISSIONS_DIALOG: "permissions-dialog";
+    readonly MODEL_SWITCH_DIALOG: "model-switch-dialog";
+    readonly LOOP_DETECTION_DIALOG: "loop-detection-dialog";
+    readonly AGENTS_MANAGER_DIALOG: "agents-manager-dialog";
+    readonly AGENT_CREATION_DIALOG: "agent-creation-dialog";
+    readonly IDE_INTEGRATION_NUDGE: "ide-integration-nudge";
+    readonly IDE_TRUST_CHANGE_DIALOG: "ide-trust-change-dialog";
+    readonly OPENAI_KEY_PROMPT: "openai-key-prompt";
+    readonly CONSENT_PROMPT: "consent-prompt";
+};
+export type FocusId = (typeof FocusIds)[keyof typeof FocusIds];
+export {};

package/dist/src/ui/contexts/FocusContext.js

@@ -0,0 +1,129 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2025 OSAgent OC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import React, { createContext, useContext, useCallback, useMemo, useRef, useState, } from 'react';
+const FocusContext = createContext(null);
+/**
+ * Hook to access the FocusContext.
+ * Throws if used outside of FocusProvider.
+ */
+export function useFocusContext() {
+    const context = useContext(FocusContext);
+    if (!context) {
+        throw new Error('useFocusContext must be used within a FocusProvider');
+    }
+    return context;
+}
+/**
+ * Optional hook that returns null if not within FocusProvider.
+ * Useful for backward compatibility during migration.
+ */
+export function useFocusContextOptional() {
+    return useContext(FocusContext);
+}
+/**
+ * FocusProvider manages the focus stack for the entire application.
+ *
+ * Usage:
+ * ```tsx
+ * <FocusProvider>
+ *   <App />
+ * </FocusProvider>
+ * ```
+ *
+ * Then in dialogs:
+ * ```tsx
+ * function MyDialog() {
+ *   const { isFocused } = useFocusScope('my-dialog');
+ *   // isFocused is true when this dialog is at top of stack
+ * }
+ * ```
+ */
+export function FocusProvider({ children }) {
+    const [focusStack, setFocusStack] = useState([]);
+    // Use ref for immediate access in callbacks (prevents stale closure issues)
+    const focusStackRef = useRef([]);
+    focusStackRef.current = focusStack;
+    const pushFocus = useCallback((id) => {
+        setFocusStack((prev) => {
+            // Don't add duplicates
+            if (prev.includes(id)) {
+                return prev;
+            }
+            const newStack = [...prev, id];
+            focusStackRef.current = newStack;
+            return newStack;
+        });
+    }, []);
+    const popFocus = useCallback((id) => {
+        setFocusStack((prev) => {
+            // Remove the id from anywhere in the stack (handles out-of-order unmounts)
+            const newStack = prev.filter((item) => item !== id);
+            if (newStack.length === prev.length) {
+                // Id wasn't in stack, no change needed
+                return prev;
+            }
+            focusStackRef.current = newStack;
+            return newStack;
+        });
+    }, []);
+    const hasFocus = useCallback((id) => {
+        // Use ref for synchronous access (important for keypress handlers)
+        const stack = focusStackRef.current;
+        if (stack.length === 0) {
+            // When stack is empty, main-input has focus
+            return id === 'main-input';
+        }
+        // Only the top of the stack has focus
+        return stack[stack.length - 1] === id;
+    }, []);
+    const currentFocus = useMemo(() => {
+        return focusStack.length > 0 ? focusStack[focusStack.length - 1] ?? null : null;
+    }, [focusStack]);
+    // Memoize context value to prevent unnecessary re-renders
+    const contextValue = useMemo(() => ({
+        focusStack,
+        pushFocus,
+        popFocus,
+        hasFocus,
+        currentFocus,
+    }), [focusStack, pushFocus, popFocus, hasFocus, currentFocus]);
+    return (_jsx(FocusContext.Provider, { value: contextValue, children: children }));
+}
+/**
+ * Special focus ID for the main input prompt.
+ * This component has focus when the focus stack is empty.
+ */
+export const MAIN_INPUT_FOCUS_ID = 'main-input';
+/**
+ * Predefined focus IDs for dialogs.
+ * Using constants prevents typos and enables autocomplete.
+ */
+export const FocusIds = {
+    MAIN_INPUT: 'main-input',
+    AUTH_DIALOG: 'auth-dialog',
+    MODEL_DIALOG: 'model-dialog',
+    THEME_DIALOG: 'theme-dialog',
+    SETTINGS_DIALOG: 'settings-dialog',
+    FOLDER_TRUST_DIALOG: 'folder-trust-dialog',
+    APPROVAL_MODE_DIALOG: 'approval-mode-dialog',
+    EDITOR_SETTINGS_DIALOG: 'editor-settings-dialog',
+    PRO_QUOTA_DIALOG: 'pro-quota-dialog',
+    QUIT_CONFIRMATION_DIALOG: 'quit-confirmation-dialog',
+    SHELL_CONFIRMATION_DIALOG: 'shell-confirmation-dialog',
+    WELCOME_BACK_DIALOG: 'welcome-back-dialog',
+    WORKSPACE_MIGRATION_DIALOG: 'workspace-migration-dialog',
+    PERMISSIONS_DIALOG: 'permissions-dialog',
+    MODEL_SWITCH_DIALOG: 'model-switch-dialog',
+    LOOP_DETECTION_DIALOG: 'loop-detection-dialog',
+    AGENTS_MANAGER_DIALOG: 'agents-manager-dialog',
+    AGENT_CREATION_DIALOG: 'agent-creation-dialog',
+    IDE_INTEGRATION_NUDGE: 'ide-integration-nudge',
+    IDE_TRUST_CHANGE_DIALOG: 'ide-trust-change-dialog',
+    OPENAI_KEY_PROMPT: 'openai-key-prompt',
+    CONSENT_PROMPT: 'consent-prompt',
+};
+//# sourceMappingURL=FocusContext.js.map

package/dist/src/ui/contexts/FocusContext.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FocusContext.js","sourceRoot":"","sources":["../../../../src/ui/contexts/FocusContext.tsx"],"names":[],"mappings":"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"}

package/dist/src/ui/contexts/KeypressContext.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright 2025 OSAgent OC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import type { Config } from 'osagent-core';
+import type React from 'react';
+export declare const PASTE_MODE_PREFIX = "\u001B[200~";
+export declare const PASTE_MODE_SUFFIX = "\u001B[201~";
+export declare const DRAG_COMPLETION_TIMEOUT_MS = 100;
+export declare const SINGLE_QUOTE = "'";
+export declare const DOUBLE_QUOTE = "\"";
+export interface Key {
+    name: string;
+    ctrl: boolean;
+    meta: boolean;
+    shift: boolean;
+    paste: boolean;
+    sequence: string;
+    kittyProtocol?: boolean;
+}
+export type KeypressHandler = (key: Key) => void;
+interface KeypressContextValue {
+    subscribe: (handler: KeypressHandler) => void;
+    unsubscribe: (handler: KeypressHandler) => void;
+}
+export declare function useKeypressContext(): KeypressContextValue;
+export declare function KeypressProvider({ children, kittyProtocolEnabled, pasteWorkaround, config, debugKeystrokeLogging, }: {
+    children?: React.ReactNode;
+    kittyProtocolEnabled: boolean;
+    pasteWorkaround?: boolean;
+    config?: Config;
+    debugKeystrokeLogging?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export {};