import { ComponentType } from 'react';
import { default as default_2 } from 'react';
import * as React_2 from 'react';
import { ReactNode } from 'react';

export declare interface AiChatSettings {
    aiAssistantAvatar?: string;
    exampleQuestions?: string[];
    [key: string]: any;
}

/**
 * Main API client class
 */
declare class ApiClient {
    private baseUrl;
    private apiKey;
    constructor(config: ApiClientConfig);
    /**
     * Makes a request to the API
     * Automatically includes Authorization: Bearer {apiKey} header
     */
    private request;
    /**
     * Sandbox content endpoints
     */
    sandboxContent: {
        /**
         * Get public sandbox content by UID
         * @param sandboxContentUid - The UID of the sandbox content
         * @returns The sandbox content data
         */
        getPublic: (sandboxContentUid: string) => Promise<SandboxContent>;
        /**
         * Get all sandbox contents for a specific playground (public access with truncated fields)
         * @param playgroundUid - The UID of the playground
         * @param skip - Number of records to skip (default: 0)
         * @param limit - Maximum number of records to return (default: 100)
         * @returns Array of sandbox content data with only uid and markdown fields
         */
        getByPlayground: (playgroundUid: string, skip?: number, limit?: number) => Promise<SandboxContentPublic[]>;
        /**
         * Get all sandbox contents for a specific use case
         * Used for upfront loading to enable local filtering
         * @param useCaseId - The ID of the use case
         * @param skip - Number of records to skip (default: 0)
         * @param limit - Maximum number of records to return (default: 100)
         * @returns Array of sandbox content data
         */
        getByUseCaseId: (useCaseId: number, skip?: number, limit?: number) => Promise<SandboxContent[]>;
    };
    /**
     * Sandbox use case endpoints
     */
    sandboxUseCase: {
        /**
         * Get a sandbox use case by UID
         * @param uid - The UID of the use case
         * @returns The use case data including tech_stack_config
         */
        getByUid: (uid: string) => Promise<SandboxUseCase>;
        /**
         * Get a sandbox use case by ID
         * @param id - The numeric ID of the use case
         * @returns The use case data including tech_stack_config
         */
        getById: (id: number) => Promise<SandboxUseCase>;
        /**
         * Get all sandbox use cases for a specific playground
         * @param playgroundUid - The UID of the playground
         * @param skip - Number of records to skip (default: 0)
         * @param limit - Maximum number of records to return (default: 100)
         * @returns Array of use case data
         */
        getByPlayground: (playgroundUid: string, skip?: number, limit?: number) => Promise<SandboxUseCase[]>;
        /**
         * Get all template use cases (public access)
         * @param skip - Number of records to skip (default: 0)
         * @param limit - Maximum number of records to return (default: 100)
         * @returns Array of template use case data
         */
        getTemplates: (skip?: number, limit?: number) => Promise<SandboxUseCase[]>;
        /**
         * Get all public use cases
         * @param skip - Number of records to skip (default: 0)
         * @param limit - Maximum number of records to return (default: 100)
         * @returns Array of public use case data
         */
        getPublic: (skip?: number, limit?: number) => Promise<SandboxUseCase[]>;
    };
    /**
     * SDK endpoints
     */
    sdk: {
        /**
         * Start a sandbox
         *
         * Authentication: API key is sent as Bearer token in Authorization header.
         * The apiKey must be set in ApiClientConfig when creating the client.
         *
         * @param request - The start sandbox request (env and chatUid)
         * @returns The sandbox response with container URL
         *
         * @example
         * ```typescript
         * const client = createApiClient({ apiKey: "your-api-key" });
         * const response = await client.sdk.startSandbox({
         *   env: { ENV_VAR: "value" }, // required when published_url is not available
         *   chatUid: "chat-uid-123"
         * });
         * ```
         */
        startSandbox: (request: StartSandboxRequest) => Promise<StartSandboxResponse>;
        /**
         * Download code as zip file from GitHub repository
         *
         * Authentication: API key is sent as Bearer token in Authorization header.
         * The apiKey must be set in ApiClientConfig when creating the client.
         *
         * @param sandboxId - The sandbox content UID
         * @returns Promise that resolves when download is initiated
         */
        downloadCode: (sandboxId: string) => Promise<void>;
        /**
         * Get an authenticated clone URL for a private GitHub repository.
         * Returns an HTTPS URL with a short-lived token (expires in 1 hour)
         * that can be used with vscode://vscode.git/clone or git clone directly.
         *
         * @param sandboxId - The sandbox content UID
         * @returns Clone URL response with authenticated URL
         */
        getCloneUrl: (sandboxId: string) => Promise<CloneUrlResponse>;
        /**
         * Start VM endpoint that starts a desktop sandbox, launches Chrome,
         * navigates to the target URL, and returns a VNC viewer URL
         *
         * Authentication: API key is sent as Bearer token in Authorization header.
         * The apiKey must be set in ApiClientConfig when creating the client.
         *
         * @param request - The start VM request with url, optional mode, and optional resolution
         * @returns The sandbox response with sandboxId and vncUrl (if mode=json)
         *
         * @example
         * ```typescript
         * const client = createApiClient({ apiKey: "your-api-key" });
         * const response = await client.sdk.startVm({
         *   url: "https://example.com",
         *   mode: "json",
         *   resolution: [1920, 1080]
         * });
         * ```
         */
        startVm: (request: StartVmRequest) => Promise<StartVmResponse>;
    };
}

export declare interface ApiClientConfig {
    /**
     * API key for authentication. Will be sent as Bearer token in Authorization header.
     * Required for all authenticated endpoints.
     */
    apiKey: string;
}

export declare interface BaseSettings {
    apiKey: string;
    primaryBrandColor: string;
    organizationDisplayName: string;
    [key: string]: any;
}

/**
 * Build SandboxConfig from any SandboxContent (for switching between selections)
 */
export declare function buildConfigFromContent(content: SandboxContent): SandboxConfig;

/**
 * Builds a nested GuardianConfig from use cases with nested frameworks.
 * Returns a structure where config[useCaseId].frameworks[frameworkKey] gives you the full config.
 *
 * @example
 * const config = buildGuardianConfig(USE_CASES, options);
 * // Access via: config["full-stack-auth"].frameworks["nextjs"]
 */
export declare function buildGuardianConfig(useCases: GuardianUseCase[], options: BuildGuardianConfigOptions): GuardianNestedConfig;

/**
 * Options for building a Guardian config from use cases.
 */
export declare interface BuildGuardianConfigOptions {
    /** Playground unique identifier */
    playgroundUid: string;
    /** Playground logo component */
    playgroundLogo: ReactNode;
    /**
     * Optional map of framework keys to human-readable labels.
     * If not provided, the shared FrameworkLabel map is used.
     */
    frameworkLabels?: Partial<Record<Framework, string>>;
    /** Optional variant (defaults to undefined) */
    variant?: GuardianComponentProps["variant"];
}

export declare function BuildWizardIllustrated({ apiKey, onNavigate, }: BuildWizardIllustratedProps): default_2.JSX.Element;

export declare interface BuildWizardIllustratedProps {
    apiKey: string;
    /** Called when the wizard wants to navigate (e.g. to a docs page). If not provided, the sandbox step is shown inline instead. */
    onNavigate?: (url: string) => void;
}

export declare const ChatBar: React_2.FC<ChatBarProps>;

export declare interface ChatBarProps {
    playgroundUid: string;
    placeholder?: string;
    onSubmit?: (e: default_2.FormEvent) => void;
    height: string;
    onCancel?: () => void;
    isSubmitting?: boolean;
    typingTexts?: string[];
    shouldFocusOnMount?: boolean;
    showModelSelector?: boolean;
    projectUid?: string | null | undefined;
    theme?: ThemeName;
    deepgramApiKey?: string;
    apiBaseUrl?: string;
}

export declare const ChatButton: default_2.FC<ChatButtonProps>;

declare interface ChatButtonProps {
    settings: SDKSettings;
    onClick?: () => void;
}

declare interface CloneUrlResponse {
    clone_url: string;
}

declare enum CodeLanguage {
    JAVASCRIPT = "javascript",
    TYPESCRIPT = "typescript",
    HTML = "html",
    CSS = "css",
    SCSS = "scss",
    MARKDOWN = "markdown",
    TOML = "toml",
    C = "c",
    DOCKERFILE = "dockerfile",
    PYTHON = "python",
    JAVA = "java",
    CSHARP = "csharp",
    CPP = "cpp",
    RUBY = "ruby",
    GO = "go",
    RUST = "rust",
    SWIFT = "swift",
    KOTLIN = "kotlin",
    PHP = "php",
    BASH = "bash",
    POWERSHELL = "powershell",
    SQL = "sql",
    PLSQL = "plsql",
    XML = "xml",
    YAML = "yaml",
    R = "r",
    SCALA = "scala",
    PERL = "perl",
    HASKELL = "haskell",
    MATLAB = "matlab",
    ASSEMBLY = "assembly",
    DART = "dart",
    ELIXIR = "elixir",
    LUA = "lua",
    OBJECTIVEC = "objectivec",
    TEXT = "text",
    JSON = "json"
}

declare interface CodeOutput {
    response_type: "CodeOutput";
    file_path: string;
    code_file_name: string;
    code_language: CodeLanguage;
    dependencies_to_install: string[];
    framework: string | null;
    full_code: string;
}

/**
 * Create an API client instance
 *
 * @param config - Configuration for the API client
 * @param config.apiKey - API key for authentication (sent as Bearer token in Authorization header)
 * @returns An API client instance
 *
 * @example
 * ```typescript
 * // Create client with API key
 * const client = createApiClient({
 *   apiKey: process.env.NEXT_PUBLIC_SAMPLEAPP_API_KEY
 * });
 *
 * // All requests will automatically include: Authorization: Bearer {apiKey}
 * ```
 */
export declare function createApiClient(config: ApiClientConfig): ApiClient;

/**
 * Create a TreeSelection object from a path
 */
export declare function createSelection(config: TechStackConfig, path: string[]): TreeSelection;

export declare const DEFAULT_THEME: ThemeName;

/**
 * Extract container ID from a browser URL
 * @param browserUrl - URL like "https://nextjs-a3fcd2bb-2a15-4f9b-bd13-aeac52baebd2.sampleapp.love/?_ts=1767897000670"
 * @returns Container ID like "nextjs-a3fcd2bb-2a15-4f9b-bd13-aeac52baebd2" or null if not found
 */
export declare function extractContainerIdFromUrl(browserUrl: string): string | null;

/**
 * Fetches sandbox configuration from the API (legacy method)
 * @param apiKey - API key from SandboxProps
 * @param sandboxId - Sandbox content UID (maps to sandbox_content_uid)
 * @returns Sandbox configuration
 * @deprecated Use fetchSandboxConfigWithContent for tree-based selection
 */
export declare function fetchSandboxConfig(apiKey: string, sandboxId: string): Promise<SandboxConfig>;

/**
 * Fetches sandbox configuration with all content for upfront loading
 * This enables instant switching between tech stack options without API calls
 *
 * @param apiKey - API key from SandboxProps
 * @param sandboxId - Sandbox content UID (maps to sandbox_content_uid)
 * @returns Extended sandbox configuration with all content
 */
export declare function fetchSandboxConfigWithContent(apiKey: string, sandboxId: string): Promise<SandboxConfigWithContent>;

/**
 * Filter content entries by multiple criteria
 *
 * @param allContent - All sandbox content entries
 * @param filters - Object with field names and values to filter by
 * @returns Filtered array of content entries
 */
export declare function filterContent(allContent: SandboxContent[], filters: Partial<Pick<SandboxContent, "product" | "product_version" | "architecture" | "frontend" | "backend" | "framework">>): SandboxContent[];

/**
 * Find sandbox content that matches the current tree selection
 * Matches against flat fields: product, product_version, architecture, frontend, backend, framework
 *
 * @param allContent - All sandbox content entries for the use case
 * @param selection - Current tree selection
 * @returns Matching content or null if not found
 */
export declare function findMatchingContent(allContent: SandboxContent[], selection: TreeSelection): SandboxContent | null;

export declare enum Framework {
    FLASK = "flask",
    EXPRESS = "express",
    NEXTJS_YARN = "nextjsy",
    VITE = "vite",
    NEXTJS = "nextjs",
    FASTAPI = "fastapi",
    FASTMCP = "fastmcp"
}

/**
 * Get the default path through the tree (following isDefault flags or first child)
 * @param root - The root node
 * @returns Array of keys representing the default selection path
 */
export declare function getDefaultPath(root: TreeNode): string[];

/**
 * Navigate the tree to find a node at a specific path
 * @param root - The root node to start from
 * @param path - Array of keys to follow
 * @returns The node at the path, or null if not found
 */
export declare function getNodeAtPath(root: TreeNode, path: string[]): TreeNode | null;

/**
 * Get the display label for a node (falls back to key if no label)
 */
export declare function getNodeLabel(node: TreeNode): string;

/**
 * Get all nodes along a path (including the root)
 * @param root - The root node
 * @param path - Array of keys to follow
 * @returns Array of nodes from root to the final node
 */
export declare function getNodesAlongPath(root: TreeNode, path: string[]): TreeNode[];

/**
 * Get selectable sections based on current selection path
 * This builds the button groups shown in the header
 * @param config - The tech stack configuration
 * @param currentPath - Current selection path
 * @returns Array of sections with their options
 */
export declare function getSelectableSections(config: TechStackConfig, currentPath: string[]): SelectorSection[];

export declare const getTheme: (themeName?: ThemeName) => ThemeColors;

/**
 * Get all unique values for a specific field from content entries
 * Useful for building filter options
 *
 * @param allContent - All sandbox content entries
 * @param field - The field to extract unique values from
 * @returns Array of unique non-null values
 */
export declare function getUniqueFieldValues(allContent: SandboxContent[], field: keyof Pick<SandboxContent, "product" | "product_version" | "architecture" | "frontend" | "backend" | "framework">): string[];

export declare function GuardianComponent({ sections, onSelect, currentFramework, currentUseCase, CustomConsole, GuideView, playgroundLogo, playgroundUid, browserUrl, useVm, sandboxUid, codeZipFile, completeCodeZipFile, variant, themeColor, hasPreview, isFrame, apiKey, env, chatUid, hideHeader, // Hardcoded to true by default, not exposed in Sandbox.tsx
    gitUrl, hasNetworkView, diagram, videoUrl, slidesUrl, }: GuardianComponentProps): default_2.JSX.Element;

export declare interface GuardianComponentProps {
    name: string;
    description: string;
    /** Dynamic sections from useTreeSelector hook */
    sections: SelectorSection[];
    /** Handler when user selects an option */
    onSelect: (nodeType: string, key: string) => void;
    CustomConsole: default_2.ComponentType<{
        onReloadPreview: () => void;
        onStageChange: (stage: "hidden" | "error" | "rebuilding") => void;
        themeColor: string;
    }> | string;
    /** The current framework key for this sandbox */
    currentFramework: string;
    /** The current use case ID (for nested config navigation) */
    currentUseCase?: string;
    GuideView?: default_2.ComponentType | string;
    playgroundLogo: default_2.ReactNode;
    playgroundUid: string;
    browserUrl: string;
    useVm: boolean;
    sandboxUid: string;
    codeZipFile: string | UpdateContainerCodebaseType;
    completeCodeZipFile: string;
    variant?: "panel" | "top-down";
    /**
     * Hex color (e.g. "#3b82f6") used to theme Guardian UI elements.
     */
    themeColor: string;
    /**
     * Whether there is a preview available for the sandbox
     */
    hasPreview?: boolean;
    /**
     * Whether to render in frame mode (just the right view, no console/header)
     */
    isFrame?: boolean;
    /** API key for starting sandbox - required */
    apiKey: string;
    /** Environment variables for sandbox */
    env?: Record<string, string>;
    /** Chat UID for starting sandbox */
    chatUid?: string;
    /* Excluded from this release type: hideHeader */
    /** Optional Git URL for opening the project in VSCode */
    gitUrl?: string;
    /** Whether to show the network requests view tab */
    hasNetworkView?: boolean;
    /** Diagram content: raw SVG string or React component */
    diagram?: string | default_2.ComponentType;
    /** Video URL rendered as iframe */
    videoUrl?: string;
    /** Slides URL rendered as iframe */
    slidesUrl?: string;
}

/**
 * Represents a single framework variant within a use case.
 * Only contains the fields that differ per framework.
 */
export declare interface GuardianFramework {
    /** Framework identifier key (e.g., "nextjs", "express", "fastapi") */
    key: Framework;
    /** Live browser URL for this framework variant */
    browserUrl: string;
    /** Unique sandbox identifier for this framework variant */
    sandboxUid: string;
    /** Path to the code zip file OR generated_code object (backward compatible) */
    codeZipFile: string | UpdateContainerCodebaseType;
    /** Download endpoint URL for the complete code zip file (e.g., `${baseUrl}/fileshare?container_id=${containerId}`) */
    completeCodeZipFile: string;
    /** Whether to use VM for this framework */
    useVm: boolean;
    /** Custom console component/string for this framework */
    CustomConsole: GuardianComponentProps["CustomConsole"];
    /** Optional custom guide view for this framework */
    GuideView?: GuardianComponentProps["GuideView"];
    /** Optional theme color override for this framework */
    themeColor?: string;
    /** Optional Git URL for opening the project in VSCode */
    gitUrl?: string;
    /** Diagram content: raw SVG string (from DB) or a React component */
    diagram?: string | ComponentType;
    /** Video URL rendered as iframe */
    videoUrl?: string;
    /** Slides URL rendered as iframe */
    slidesUrl?: string;
}

/**
 * Individual framework configuration within a use case
 * Note: apiKey is optional here as it's passed separately at runtime to GuardianPlayground
 */
declare interface GuardianFrameworkConfig extends Omit<GuardianComponentProps, 'apiKey'> {
    frameworkKey: Framework;
    apiKey?: string;
}

/**
 * Nested config structure: use case → framework → config
 * This is the new recommended structure for Guardian playgrounds
 */
export declare type GuardianNestedConfig = Record<string, GuardianUseCaseConfig>;

/**
 * Guardian Playground component with tree-based tech stack selection.
 * Uses sections from useTreeSelector for dynamic header rendering.
 *
 * Note: Frame param overrides for node types (architecture, frontend, backend, etc.)
 * are now handled in Sandbox.tsx via the tree selector sync mechanism.
 * This component receives the already-resolved framework from the tree selector.
 */
export declare function GuardianPlayground({ sandboxConfig, sections, onSelect, useCase, framework, isFrame, apiKey, env, chatUid, theme, hasNetworkView }: GuardianPlaygroundProps): default_2.JSX.Element;

declare interface GuardianPlaygroundProps {
    /** Sandbox configuration */
    sandboxConfig: SandboxConfig;
    /** Dynamic sections from useTreeSelector hook */
    sections: SelectorSection[];
    /** Handler when user selects an option */
    onSelect: (nodeType: string, key: string) => void;
    /** Current use case ID */
    useCase: string;
    /** Current framework key (from tree selector) */
    framework: string;
    /** Whether to render in frame mode (just the right view) */
    isFrame?: boolean;
    /** API key for starting sandbox - required */
    apiKey: string;
    /** Environment variables for sandbox */
    env?: Record<string, string>;
    /** Chat UID for starting sandbox */
    chatUid?: string;
    /** Theme mode - "light", "dark", or "system". Defaults to "dark" */
    theme?: ThemeMode;
    /** Whether to show the network requests view tab */
    hasNetworkView?: boolean;
}

export declare function GuardianProvider({ children }: {
    children: ReactNode;
}): default_2.JSX.Element;

/**
 * Represents a use case with multiple framework implementations.
 * Contains shared fields across all frameworks.
 */
export declare interface GuardianUseCase {
    /** Unique identifier for this use case (e.g., "scalekit-fsa") */
    id: string;
    /** Display name for this use case */
    name: string;
    /** Description of what this use case demonstrates */
    description: string;
    /** Default theme color for all frameworks */
    themeColor: string;
    /** Whether to show the preview for this use case */
    hasPreview?: boolean;
    /** List of framework implementations for this use case */
    frameworks: GuardianFramework[];
}

/**
 * A single use case with its framework implementations
 */
export declare interface GuardianUseCaseConfig {
    /** Unique identifier for this use case (e.g., "full-stack-auth") */
    id: string;
    /** Display name for this use case */
    name: string;
    /** Description of what this use case demonstrates */
    description: string;
    /** Default theme color for all frameworks */
    themeColor: string;
    /** Whether to show the preview for this use case */
    hasPreview?: boolean;
    /** Map of framework key to its complete configuration */
    frameworks: Record<string, GuardianFrameworkConfig>;
}

/**
 * Check if content exists for a potential selection
 * Used to disable/gray out options that have no content
 *
 * @param allContent - All sandbox content entries for the use case
 * @param partialSelection - Partial selection to check (only specified fields are matched)
 * @returns True if at least one content entry matches
 */
export declare function hasContentForSelection(allContent: SandboxContent[], partialSelection: Partial<TreeSelection["byType"]>): boolean;

/**
 * Header component for dynamic tech stack selection
 *
 * Uses sections from useTreeSelector to render selector buttons
 * based on the tech_stack_config tree structure.
 */
export declare function Header({ sections, onSelect, playgroundLogo, themecolor, }: HeaderProps): default_2.JSX.Element;

export declare interface HeaderProps {
    /** Dynamic sections from useTreeSelector hook */
    sections: SelectorSection[];
    /** Handler when user selects an option */
    onSelect: (nodeType: string, key: string) => void;
    /** Optional playground logo */
    playgroundLogo?: default_2.ReactNode;
    /** Theme color for selected state */
    themecolor?: string;
}

/**
 * Check if a path is complete (reaches a leaf node)
 */
export declare function isPathComplete(config: TechStackConfig, path: string[]): boolean;

export declare const ModalSearchAndChat: default_2.FC<ModalSearchAndChatProps>;

declare interface ModalSearchAndChatProps {
    settings: SDKSettings;
    onClose?: () => void;
}

/**
 * Human-readable labels for node types
 */
export declare const NODE_TYPE_LABELS: Record<string, string>;

/**
 * All supported node types for tech stack selection
 */
export declare const NODE_TYPES: readonly ["root", "product", "version", "architecture", "frontend", "backend", "framework", "integration", "platform"];

/**
 * Type for node types
 */
export declare type NodeType = (typeof NODE_TYPES)[number];

/**
 * Convert a path to a byType map
 * @param root - The root node
 * @param path - Array of keys
 * @returns Map of nodeType to selected key
 */
export declare function pathToByType(root: TreeNode, path: string[]): Record<string, string>;

declare class SampleAppSDK {
    ModalSearchAndChat: (settings: SDKSettings, container?: HTMLElement) => {
        unmount: () => void;
        show: () => void;
        hide: () => void;
    };
    ChatButton: (settings: SDKSettings, container?: HTMLElement) => {
        unmount: () => void;
    };
    private createButtonContainer;
}

export declare const Sandbox: React_2.FC<SandboxProps>;

/**
 * Configuration fetched from the API for a sandbox
 */
declare interface SandboxConfig {
    /** Sandbox identifier */
    id: string;
    /** Display name */
    name: string;
    /** Description */
    description: string;
    /** Theme color */
    themeColor: string;
    /** Whether preview is available */
    hasPreview: boolean;
    /** Optional playground logo */
    playgroundLogo?: React.ReactNode;
    /**
     * Chat UID for starting the sandbox via API.
     * NOTE: This is only used as a fallback when published_url is not available.
     * If published_url exists in the framework config, it takes precedence and chatUid is not needed.
     */
    chatUid?: string;
    /** List of use cases with frameworks */
    useCases: GuardianUseCase[];
}

/**
 * Configuration options for the Sandbox component
 */
declare interface SandboxConfigOptions {
    /** Whether to render in frame mode (just the right view) */
    isFrame?: boolean;
    /** Whether to show the network requests view tab. Defaults to false */
    hasNetworkView?: boolean;
}

/**
 * Extended sandbox configuration with tree-based tech stack selection
 */
export declare interface SandboxConfigWithContent {
    /** The use case containing the tech stack config */
    useCase: SandboxUseCase;
    /** Parsed tech stack configuration tree */
    techStackConfig: TechStackConfig;
    /** ALL sandbox content entries for this use case (for local filtering) */
    allContent: SandboxContent[];
    /** The initially requested sandbox content */
    initialContent: SandboxContent;
    /** Initial selection path from the content */
    initialSelectionPath: string[];
    /** Legacy config for backward compatibility */
    legacyConfig: SandboxConfig;
}

export declare interface SandboxContent {
    id: number;
    uid: string;
    use_case_id: number;
    product: string | null;
    product_version: string | null;
    architecture: string | null;
    frontend: string | null;
    backend: string | null;
    framework: string | null;
    selection_path: string[] | null;
    markdown: string | null;
    github_url: string | null;
    published_url: string | null;
    is_vm_enabled: boolean;
    generated_code_id: number | null;
    generated_code?: UpdateContainerCodebaseType | null;
    chat_uid: string | null;
    playground_uid: string | null;
    user_id: string | null;
    has_preview: boolean;
    diagram: string | null;
    video_url: string | null;
    slides_url: string | null;
    created_at: string;
    updated_at: string;
}

export declare interface SandboxContentPublic {
    uid: string;
    markdown: string | null;
}

export declare const SandboxHome: React_2.FC<SandboxHomeProps>;

export declare interface SandboxHomeProps {
    apiKey: string;
    orgid: string;
    sandboxes?: SandboxItem[];
    basePath?: string;
    theme?: ThemeMode;
}

export declare interface SandboxItem {
    id: string;
    title: string;
    description: string;
    sandboxId?: string;
}

/**
 * Props for the Sandbox component
 */
export declare interface SandboxProps {
    /** API key for container technology - required */
    apiKey: string;
    /** Sandbox ID to fetch configuration - required */
    sandboxId: string;
    /**
     * Environment variables to pass to the sandbox.
     * Optional - only required when published_url is not available (when starting a new sandbox).
     * If published_url exists, env is not needed.
     */
    env?: Record<string, string>;
    /** Optional theme color override */
    themeColor?: string;
    /** Theme mode - "light", "dark", or "system". Defaults to "dark" */
    theme?: ThemeMode;
    /** Configuration options for the sandbox */
    config?: SandboxConfigOptions;
}

export declare interface SandboxUseCase {
    id: number;
    uid: string;
    name: string;
    description: string | null;
    tech_stack_config: Record<string, any>;
    playground_uid: string | null;
    is_public: boolean;
    is_template: boolean;
    created_at: string;
    updated_at: string;
}

declare const sdk: SampleAppSDK;
export default sdk;

export declare interface SDKSettings {
    baseSettings: BaseSettings;
    aiChatSettings?: AiChatSettings;
}

/**
 * Selectable node types (excludes "root" which is not user-selectable)
 */
export declare const SELECTABLE_NODE_TYPES: Exclude<NodeType, "root">[];

/**
 * A single option within a selector section
 */
export declare interface SelectorOption {
    /** Unique key for this option */
    key: string;
    /** Display label */
    label: string;
    /** Whether this option is currently selected */
    isSelected: boolean;
    /** Whether this option has content available (for disabling unavailable options) */
    hasContent?: boolean;
    /** Whether this option is a leaf node (has no children) */
    isLeaf?: boolean;
}

/**
 * A section of the selector (e.g., "Architecture:", "Frontend:", "Backend:")
 */
export declare interface SelectorSection {
    /** The nodeType this section represents */
    nodeType: string;
    /** Display label for this section (e.g., "Architecture:") */
    label: string;
    /** Available options in this section */
    options: SelectorOption[];
}

declare interface StartSandboxRequest {
    /**
     * Environment variables to pass to the sandbox.
     * Required when published_url is not available (when starting a new sandbox).
     * Optional when published_url exists (sandbox already exists).
     */
    env?: Record<string, any>;
    /** Chat UID for starting the sandbox */
    chatUid: string;
}

declare interface StartSandboxResponse {
    container_url: string;
}

declare interface StartVmRequest {
    /** Target URL to navigate to in Chrome */
    url: string;
    /** Response mode: 'redirect' or 'json' (default: 'json') */
    mode?: "redirect" | "json";
    /** Desktop resolution [width, height] in pixels */
    resolution?: [number, number];
}

declare interface StartVmResponse {
    sandboxId: string;
    vncUrl: string;
}

export declare const TailwindExample: React_2.FC<TailwindExampleProps>;

export declare interface TailwindExampleProps {
    title?: string;
    description?: string;
}

/**
 * Root structure of the tech stack configuration
 */
export declare interface TechStackConfig {
    root: TreeNode;
}

export declare interface ThemeColors {
    primary: string;
    shadow: {
        light: string;
        dark: string;
    };
    gradient: string;
    placeholderText: {
        light: string;
        dark: string;
    };
    tabHint: {
        text: {
            light: string;
            dark: string;
        };
        bg: {
            light: string;
            dark: string;
        };
        border: {
            light: string;
            dark: string;
        };
    };
}

/**
 * Theme mode for the SDK
 * - "light": Light mode
 * - "dark": Dark mode
 * - "system": Follows system preference
 */
export declare type ThemeMode = "light" | "dark" | "system";

export declare type ThemeName = "ocean" | "autumn" | "mint" | "sunset" | "lavender" | "forest" | "coral";

export declare const themes: Record<ThemeName, ThemeColors>;

/**
 * Tree configuration types for dynamic tech stack selection
 * Matches the tech_stack_config structure from SandboxUseCase
 */
/**
 * A node in the tech stack tree
 */
export declare interface TreeNode {
    /** Unique key for this node (e.g., "javascript-sdk", "react", "node.js") */
    key: string;
    /** Human-readable label (defaults to key if not provided) */
    label?: string;
    /** Type of this node - determines which selector group it belongs to */
    nodeType: string;
    /** Child nodes (next level of selection) */
    children?: TreeNode[];
    /** Whether this is the default selection at this level */
    isDefault?: boolean;
    /** Optional metadata for this node */
    metadata?: Record<string, unknown>;
}

/**
 * Current selection state in the tree
 */
export declare interface TreeSelection {
    /** Array of selected keys from root to leaf (e.g., ["javascript-sdk", "react", "node.js"]) */
    path: string[];
    /** Map of nodeType to selected key (e.g., { architecture: "javascript-sdk", frontend: "react", backend: "node.js" }) */
    byType: Record<string, string>;
}

declare type UpdateContainerCodebaseType = Record<string, CodeOutput>;

/**
 * Update the selection path when a user selects an option
 * @param config - The tech stack configuration
 * @param currentPath - Current selection path
 * @param nodeType - The nodeType of the selection being changed
 * @param selectedKey - The key of the newly selected option
 * @returns New selection path
 */
export declare function updateSelectionPath(config: TechStackConfig, currentPath: string[], nodeType: string, selectedKey: string): string[];

/**
 * Hook for managing tree-based tech stack selection
 *
 * @example
 * ```tsx
 * const { selection, sections, currentContent, selectOption } = useTreeSelector({
 *   config: techStackConfig,
 *   allContent: sandboxContents,
 *   initialPath: ["javascript-sdk", "react", "node.js"],
 * });
 *
 * // Render sections
 * {sections.map(section => (
 *   <div key={section.nodeType}>
 *     <span>{section.label}</span>
 *     {section.options.map(opt => (
 *       <button
 *         key={opt.key}
 *         onClick={() => selectOption(section.nodeType, opt.key)}
 *         className={opt.isSelected ? "selected" : ""}
 *       >
 *         {opt.label}
 *       </button>
 *     ))}
 *   </div>
 * ))}
 * ```
 */
export declare function useTreeSelector({ config, allContent, initialPath, onSelectionChange }: UseTreeSelectorOptions): UseTreeSelectorReturn;

export declare interface UseTreeSelectorOptions {
    /** The tech stack configuration tree */
    config: TechStackConfig;
    /** All sandbox content entries for this use case (for local filtering) */
    allContent: SandboxContent[];
    /** Initial selection path (from URL or saved state) */
    initialPath?: string[];
    /** Callback when selection changes */
    onSelectionChange?: (selection: TreeSelection, content: SandboxContent | null) => void;
}

export declare interface UseTreeSelectorReturn {
    /** Current selection state */
    selection: TreeSelection;
    /** Sections to render in the UI (button groups) */
    sections: SelectorSection[];
    /** Currently matched content based on selection */
    currentContent: SandboxContent | null;
    /** Handler for when user selects an option */
    selectOption: (nodeType: string, key: string) => void;
    /** Reset to default selection */
    resetToDefault: () => void;
    /** Set selection from a path */
    setSelectionPath: (path: string[]) => void;
}

/**
 * View mode for the top panel area.
 * - "preview": Browser preview (iframe)
 * - "diagram": Diagram view (SVG string or React component)
 * - "video": Video view (iframe from URL)
 * - "slides": Slides view (iframe from URL)
 */
export declare type ViewMode = "preview" | "diagram" | "video" | "slides";

export declare const VmProvider: ({ children }: {
    children: ReactNode;
}) => default_2.JSX.Element;

export { }