@app-studio/web 0.9.16 → 0.9.18

package/dist/components/adk/AgentEval/AgentEval/AgentEval.props.d.ts

@@ -0,0 +1,182 @@
+import { ViewProps } from 'app-studio';
+/**
+ * Core ADK Evaluation Types
+ */
+export interface EvaluationMetric {
+    id: string;
+    name: string;
+    description: string;
+    type: 'accuracy' | 'latency' | 'cost' | 'quality' | 'safety' | 'custom';
+    threshold?: number;
+    weight?: number;
+    config?: Record<string, any>;
+}
+export interface EvaluationTestCase {
+    id: string;
+    name: string;
+    description?: string;
+    input: any;
+    expectedOutput?: any;
+    metadata?: Record<string, any>;
+    tags?: string[];
+}
+export interface EvaluationRun {
+    id: string;
+    name: string;
+    appName: string;
+    userId: string;
+    status: 'pending' | 'running' | 'completed' | 'failed' | 'cancelled';
+    progress: number;
+    startTime: number;
+    endTime?: number;
+    duration?: number;
+    testCases: EvaluationTestCase[];
+    metrics: EvaluationMetric[];
+    results?: EvaluationResult[];
+    summary?: EvaluationSummary;
+    config?: EvaluationConfig;
+    error?: string;
+}
+export interface EvaluationResult {
+    id: string;
+    evaluationId: string;
+    testCaseId: string;
+    status: 'pass' | 'fail' | 'error' | 'skip';
+    score?: number;
+    actualOutput?: any;
+    metrics: Record<string, number>;
+    duration: number;
+    error?: string;
+    details?: Record<string, any>;
+    timestamp: number;
+}
+export interface EvaluationSummary {
+    totalTests: number;
+    passedTests: number;
+    failedTests: number;
+    errorTests: number;
+    skippedTests: number;
+    averageScore: number;
+    totalDuration: number;
+    metricsAverages: Record<string, number>;
+    passRate: number;
+}
+export interface EvaluationConfig {
+    maxConcurrency?: number;
+    timeout?: number;
+    retryCount?: number;
+    stopOnFailure?: boolean;
+    randomizeOrder?: boolean;
+    enableDetailedLogging?: boolean;
+}
+/**
+ * Component View Customization
+ */
+export interface AgentEvalViews {
+    container?: ViewProps;
+    header?: ViewProps;
+    evaluationList?: ViewProps;
+    evaluationItem?: ViewProps;
+    activeEvaluationItem?: ViewProps;
+    createPanel?: ViewProps;
+    resultsPanel?: ViewProps;
+    metricsPanel?: ViewProps;
+    testCaseList?: ViewProps;
+    testCaseItem?: ViewProps;
+    progressBar?: ViewProps;
+    statusIndicator?: ViewProps;
+    actionButtons?: ViewProps;
+    exportButton?: ViewProps;
+    refreshButton?: ViewProps;
+    searchInput?: ViewProps;
+    emptyState?: ViewProps;
+    loadingState?: ViewProps;
+    errorState?: ViewProps;
+}
+/**
+ * Event Handlers
+ */
+export interface AgentEvalEventHandlers {
+    onEvaluationCreate?: (evaluation: EvaluationRun) => void;
+    onEvaluationStart?: (evaluationId: string) => void;
+    onEvaluationComplete?: (result: EvaluationRun) => void;
+    onEvaluationCancel?: (evaluationId: string) => void;
+    onEvaluationDelete?: (evaluationId: string) => void;
+    onTestCaseSelect?: (testCase: EvaluationTestCase) => void;
+    onResultSelect?: (result: EvaluationResult) => void;
+    onExport?: (format: 'json' | 'csv' | 'pdf') => void;
+    onError?: (error: Error) => void;
+    onRefresh?: () => void;
+}
+/**
+ * Evaluation Templates
+ */
+export interface EvaluationTemplate {
+    id: string;
+    name: string;
+    description: string;
+    testCases: EvaluationTestCase[];
+    metrics: EvaluationMetric[];
+    config: EvaluationConfig;
+    tags?: string[];
+}
+/**
+ * Comparison Options
+ */
+export interface EvaluationComparison {
+    baselineId: string;
+    comparisonIds: string[];
+    metrics: string[];
+    showDifferences?: boolean;
+    showTrends?: boolean;
+}
+/**
+ * Main AgentEval Props Interface
+ */
+export interface AgentEvalProps extends ViewProps, AgentEvalEventHandlers {
+    appName: string;
+    userId: string;
+    apiBaseUrl?: string;
+    enableBatchEvaluation?: boolean;
+    enableMetricsComparison?: boolean;
+    enableResultExport?: boolean;
+    enableTemplates?: boolean;
+    enableAutoRefresh?: boolean;
+    maxConcurrentEvals?: number;
+    maxTestCases?: number;
+    refreshInterval?: number;
+    showEvaluationHistory?: boolean;
+    showMetricsPanel?: boolean;
+    showTestCaseDetails?: boolean;
+    showProgressIndicators?: boolean;
+    compactMode?: boolean;
+    views?: AgentEvalViews;
+    initialEvaluations?: EvaluationRun[];
+    selectedEvaluationId?: string;
+    availableTemplates?: EvaluationTemplate[];
+    enableRealTimeUpdates?: boolean;
+    enableResultCaching?: boolean;
+    enableCustomMetrics?: boolean;
+    ariaLabel?: string;
+    ariaDescribedBy?: string;
+}
+/**
+ * Export Options
+ */
+export interface EvaluationExportOptions {
+    format: 'json' | 'csv' | 'pdf';
+    includeTestCases?: boolean;
+    includeResults?: boolean;
+    includeMetrics?: boolean;
+    includeSummary?: boolean;
+    evaluationIds?: string[];
+}
+/**
+ * Real-time Update Types
+ */
+export interface EvaluationUpdate {
+    type: 'progress' | 'result' | 'status' | 'complete' | 'error';
+    evaluationId: string;
+    data: any;
+    timestamp: number;
+}

package/dist/components/adk/AgentEval/AgentEval/AgentEval.state.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+import { AgentEvalProps, EvaluationRun, EvaluationResult, EvaluationTestCase, EvaluationMetric, EvaluationTemplate, EvaluationExportOptions } from './AgentEval.props';
+/**
+ * Custom hook for managing AgentEval state and operations
+ */
+export declare const useAgentEval: (props: AgentEvalProps) => {
+    evaluations: EvaluationRun[];
+    selectedEvaluation: EvaluationRun | null;
+    selectedResult: EvaluationResult | null;
+    isLoading: boolean;
+    isCreating: boolean;
+    error: string | null;
+    searchQuery: string;
+    templates: EvaluationTemplate[];
+    fetchEvaluations: () => Promise<void>;
+    createEvaluation: (name: string, testCases: EvaluationTestCase[], metrics: EvaluationMetric[], config?: any) => Promise<EvaluationRun>;
+    startEvaluation: (evaluationId: string) => Promise<void>;
+    cancelEvaluation: (evaluationId: string) => Promise<void>;
+    deleteEvaluation: (evaluationId: string) => Promise<void>;
+    selectEvaluation: (evaluationId: string) => void;
+    selectResult: (result: EvaluationResult) => void;
+    exportEvaluations: (options: EvaluationExportOptions) => Promise<void>;
+    setSearchQuery: import("react").Dispatch<import("react").SetStateAction<string>>;
+    setError: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    runningEvaluationsCount: number;
+    canStartNewEvaluation: boolean;
+};

package/dist/components/adk/AgentEval/AgentEval/AgentEval.style.d.ts

@@ -0,0 +1,144 @@
+import { ViewProps } from 'app-studio';
+/**
+ * Default styles for AgentEval component
+ * Following the app-studio design system with 4px grid, Inter/Geist fonts, and neutral palette
+ */
+export declare const DefaultAgentEvalStyles: {
+    container: ViewProps;
+    header: ViewProps;
+    evaluationList: ViewProps;
+    evaluationItem: ViewProps;
+    activeEvaluationItem: ViewProps;
+    evaluationHeader: ViewProps;
+    evaluationTitle: ViewProps;
+    evaluationMeta: ViewProps;
+    statusBadge: ViewProps;
+    statusPending: ViewProps;
+    statusRunning: ViewProps;
+    statusCompleted: ViewProps;
+    statusFailed: ViewProps;
+    statusCancelled: ViewProps;
+    progressBar: ViewProps;
+    progressFill: ViewProps;
+    evaluationActions: ViewProps;
+    actionButton: ViewProps;
+    startButton: ViewProps;
+    cancelButton: ViewProps;
+    deleteButton: ViewProps;
+    createPanel: ViewProps;
+    formGroup: ViewProps;
+    formLabel: ViewProps;
+    formInput: ViewProps;
+    formTextarea: ViewProps;
+    resultsPanel: ViewProps;
+    resultsSummary: ViewProps;
+    summaryGrid: ViewProps;
+    summaryCard: ViewProps;
+    summaryValue: ViewProps;
+    summaryLabel: ViewProps;
+    testCaseList: ViewProps;
+    testCaseItem: ViewProps;
+    testCaseHeader: ViewProps;
+    testCaseName: ViewProps;
+    testCaseStatus: ViewProps;
+    testCasePass: ViewProps;
+    testCaseFail: ViewProps;
+    testCaseError: ViewProps;
+    testCaseSkip: ViewProps;
+    metricsPanel: ViewProps;
+    metricsGrid: ViewProps;
+    metricCard: ViewProps;
+    metricTitle: ViewProps;
+    metricValue: ViewProps;
+    metricChange: ViewProps;
+    metricIncrease: ViewProps;
+    metricDecrease: ViewProps;
+    emptyState: ViewProps;
+    loadingState: ViewProps;
+    errorState: ViewProps;
+    searchInput: ViewProps;
+    exportButton: ViewProps;
+    refreshButton: ViewProps;
+};
+/**
+ * Size variants for AgentEval
+ */
+export declare const AgentEvalSizes: {
+    sm: {
+        container: {
+            height: string;
+        };
+        evaluationList: {
+            minHeight: string;
+        };
+    };
+    md: {
+        container: {
+            height: string;
+        };
+        evaluationList: {
+            minHeight: string;
+        };
+    };
+    lg: {
+        container: {
+            height: string;
+        };
+        evaluationList: {
+            minHeight: string;
+        };
+    };
+    xl: {
+        container: {
+            height: string;
+        };
+        evaluationList: {
+            minHeight: string;
+        };
+    };
+};
+/**
+ * Theme variants for AgentEval
+ */
+export declare const AgentEvalThemes: {
+    light: {
+        container: {
+            backgroundColor: string;
+        };
+        header: {
+            backgroundColor: string;
+        };
+        evaluationList: {
+            backgroundColor: string;
+        };
+        createPanel: {
+            backgroundColor: string;
+        };
+        resultsPanel: {
+            backgroundColor: string;
+        };
+        metricsPanel: {
+            backgroundColor: string;
+        };
+    };
+    dark: {
+        container: {
+            backgroundColor: string;
+        };
+        header: {
+            backgroundColor: string;
+        };
+        evaluationList: {
+            backgroundColor: string;
+        };
+        createPanel: {
+            backgroundColor: string;
+        };
+        resultsPanel: {
+            backgroundColor: string;
+        };
+        metricsPanel: {
+            backgroundColor: string;
+        };
+    };
+};

package/dist/components/adk/AgentEval/AgentEval/AgentEval.view.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { AgentEvalProps } from './AgentEval.props';
+import { useAgentEval } from './AgentEval.state';
+export interface AgentEvalViewProps extends AgentEvalProps, ReturnType<typeof useAgentEval> {
+}
+/**
+ * AgentEval View Component
+ *
+ * Renders the complete evaluation interface with creation, monitoring, and results analysis
+ */
+declare const AgentEvalView: React.FC<AgentEvalViewProps>;
+export default AgentEvalView;

package/dist/components/adk/AgentEval/AgentEval/EvaluationCreator.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { EvaluationTemplate, EvaluationTestCase, EvaluationMetric } from './AgentEval.props';
+export interface EvaluationCreatorProps {
+    templates: EvaluationTemplate[];
+    isCreating: boolean;
+    canCreate: boolean;
+    onCreateEvaluation: (name: string, testCases: EvaluationTestCase[], metrics: EvaluationMetric[]) => void;
+    views?: {
+        container?: any;
+    };
+}
+/**
+ * EvaluationCreator Component
+ *
+ * Form for creating new evaluations with test cases and metrics
+ */
+export declare const EvaluationCreator: React.FC<EvaluationCreatorProps>;

package/dist/components/adk/AgentEval/AgentEval/EvaluationList.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { EvaluationRun } from './AgentEval.props';
+export interface EvaluationListProps {
+    evaluations: EvaluationRun[];
+    selectedEvaluation?: EvaluationRun | null;
+    onEvaluationSelect: (evaluationId: string) => void;
+    onEvaluationStart: (evaluationId: string) => void;
+    onEvaluationCancel: (evaluationId: string) => void;
+    onEvaluationDelete: (evaluationId: string) => void;
+    showProgressIndicators?: boolean;
+    compactMode?: boolean;
+    views?: {
+        container?: any;
+        evaluationItem?: any;
+        activeEvaluationItem?: any;
+    };
+}
+/**
+ * EvaluationList Component
+ *
+ * Renders a list of evaluations with status, progress, and actions
+ */
+export declare const EvaluationList: React.FC<EvaluationListProps>;

package/dist/components/adk/AgentEval/AgentEval/EvaluationMetrics.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { EvaluationRun } from './AgentEval.props';
+export interface EvaluationMetricsProps {
+    evaluations: EvaluationRun[];
+    enableComparison?: boolean;
+    views?: {
+        container?: any;
+    };
+}
+/**
+ * EvaluationMetrics Component
+ *
+ * Displays aggregated metrics and comparisons across evaluations
+ */
+export declare const EvaluationMetrics: React.FC<EvaluationMetricsProps>;

package/dist/components/adk/AgentEval/AgentEval/EvaluationResults.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+import { EvaluationRun, EvaluationResult } from './AgentEval.props';
+export interface EvaluationResultsProps {
+    evaluation: EvaluationRun;
+    selectedResult?: EvaluationResult | null;
+    onResultSelect: (result: EvaluationResult) => void;
+    showTestCaseDetails?: boolean;
+    views?: {
+        container?: any;
+        testCaseList?: any;
+        testCaseItem?: any;
+    };
+}
+/**
+ * EvaluationResults Component
+ *
+ * Displays evaluation results with summary and detailed test case results
+ */
+export declare const EvaluationResults: React.FC<EvaluationResultsProps>;

package/dist/components/adk/AgentEval/AgentEval.d.ts

@@ -0,0 +1,41 @@
+import React from 'react';
+import { AgentEvalProps } from './AgentEval/AgentEval.props';
+/**
+ * AgentEval Component
+ *
+ * A comprehensive evaluation component for ADK agents.
+ * Handles evaluation creation, execution, monitoring, and results analysis.
+ *
+ * @example
+ * ```tsx
+ * <AgentEval
+ *   appName="my-agent"
+ *   userId="user123"
+ *   onEvaluationComplete={(result) => console.log('Evaluation complete:', result)}
+ * />
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // With custom evaluation configuration
+ * <AgentEval
+ *   appName="my-agent"
+ *   userId="user123"
+ *   enableBatchEvaluation={true}
+ *   enableMetricsComparison={true}
+ *   enableResultExport={true}
+ *   maxConcurrentEvals={5}
+ *   autoRefresh={true}
+ *   refreshInterval={10000}
+ *   views={{
+ *     container: { backgroundColor: 'color.gray.50' },
+ *     evaluationList: { maxHeight: '400px' },
+ *     resultsPanel: { minHeight: '300px' }
+ *   }}
+ * />
+ * ```
+ */
+declare const AgentEval: React.FC<AgentEvalProps>;
+export default AgentEval;
+export { AgentEval };
+export type { AgentEvalProps };

package/dist/components/adk/AgentEval/examples/default.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+/**
+ * Default AgentEval Example
+ *
+ * Demonstrates basic usage of the AgentEval component
+ */
+export declare const DefaultDemo: () => React.JSX.Element;
+/**
+ * AgentEval with Mock Data Example
+ *
+ * Shows the component with sample evaluation data
+ */
+export declare const MockDataDemo: () => React.JSX.Element;
+/**
+ * Compact AgentEval Example
+ *
+ * Shows the component in compact mode
+ */
+export declare const CompactDemo: () => React.JSX.Element;
+/**
+ * Customized AgentEval Example
+ *
+ * Shows advanced customization options
+ */
+export declare const CustomizedDemo: () => React.JSX.Element;
+/**
+ * Real-time AgentEval Example
+ *
+ * Demonstrates real-time updates and monitoring
+ */
+export declare const RealTimeDemo: () => React.JSX.Element;

package/dist/components/adk/AgentSession/AgentSession/AgentSession.props.d.ts

@@ -0,0 +1,148 @@
+import { ViewProps } from 'app-studio';
+/**
+ * Core ADK Session Types
+ */
+export interface AgentSession {
+    id: string;
+    userId: string;
+    appName: string;
+    state: any;
+    events: AgentEvent[];
+    createdAt: number;
+    updatedAt: number;
+    metadata?: {
+        title?: string;
+        description?: string;
+        tags?: string[];
+        messageCount?: number;
+        lastActivity?: number;
+    };
+}
+export interface AgentEvent {
+    id: string;
+    sessionId: string;
+    type: string;
+    data: any;
+    timestamp: number;
+    title?: string;
+    author?: 'user' | 'bot' | 'system';
+    content?: {
+        parts?: any[];
+    };
+}
+export interface SessionSummary {
+    id: string;
+    title: string;
+    lastMessage: string;
+    messageCount: number;
+    createdAt: number;
+    updatedAt: number;
+    isActive: boolean;
+}
+/**
+ * Component View Customization
+ */
+export interface AgentSessionViews {
+    container?: ViewProps;
+    header?: ViewProps;
+    sessionList?: ViewProps;
+    sessionItem?: ViewProps;
+    activeSessionItem?: ViewProps;
+    sessionInfo?: ViewProps;
+    sessionActions?: ViewProps;
+    createButton?: ViewProps;
+    deleteButton?: ViewProps;
+    exportButton?: ViewProps;
+    importButton?: ViewProps;
+    refreshButton?: ViewProps;
+    searchInput?: ViewProps;
+    emptyState?: ViewProps;
+    loadingState?: ViewProps;
+    errorState?: ViewProps;
+}
+/**
+ * Event Handlers
+ */
+export interface AgentSessionEventHandlers {
+    onSessionSelect?: (session: AgentSession) => void;
+    onSessionCreate?: (session: AgentSession) => void;
+    onSessionUpdate?: (session: AgentSession) => void;
+    onSessionDelete?: (sessionId: string) => void;
+    onSessionImport?: (session: AgentSession) => void;
+    onSessionExport?: (session: AgentSession) => void;
+    onError?: (error: Error) => void;
+    onRefresh?: () => void;
+}
+/**
+ * Session Filter and Sort Options
+ */
+export interface SessionFilters {
+    searchQuery?: string;
+    dateRange?: {
+        start: Date;
+        end: Date;
+    };
+    tags?: string[];
+    messageCountRange?: {
+        min: number;
+        max: number;
+    };
+    isActive?: boolean;
+}
+export interface SessionSortOptions {
+    field: 'createdAt' | 'updatedAt' | 'messageCount' | 'title';
+    direction: 'asc' | 'desc';
+}
+/**
+ * Main AgentSession Props Interface
+ */
+export interface AgentSessionProps extends ViewProps, AgentSessionEventHandlers {
+    appName: string;
+    userId: string;
+    apiBaseUrl?: string;
+    showSessionHistory?: boolean;
+    enableSessionImport?: boolean;
+    enableSessionExport?: boolean;
+    enableSessionDelete?: boolean;
+    enableSessionSearch?: boolean;
+    enableAutoRefresh?: boolean;
+    maxSessions?: number;
+    refreshInterval?: number;
+    showSessionInfo?: boolean;
+    showSessionActions?: boolean;
+    showCreateButton?: boolean;
+    showRefreshButton?: boolean;
+    compactMode?: boolean;
+    views?: AgentSessionViews;
+    initialSessions?: AgentSession[];
+    selectedSessionId?: string;
+    defaultFilters?: SessionFilters;
+    defaultSort?: SessionSortOptions;
+    enableSessionTags?: boolean;
+    enableSessionMetadata?: boolean;
+    enableBulkOperations?: boolean;
+    ariaLabel?: string;
+    ariaDescribedBy?: string;
+}
+/**
+ * Session Action Types
+ */
+export declare type SessionAction = 'create' | 'select' | 'delete' | 'export' | 'import' | 'refresh' | 'search' | 'filter' | 'sort';
+/**
+ * Session Status Types
+ */
+export declare type SessionStatus = 'active' | 'inactive' | 'archived' | 'error';
+/**
+ * Session Import/Export Format
+ */
+export interface SessionExportData {
+    session: AgentSession;
+    exportedAt: number;
+    exportedBy: string;
+    version: string;
+}
+export interface SessionImportOptions {
+    overwriteExisting?: boolean;
+    preserveIds?: boolean;
+    updateTimestamps?: boolean;
+}

package/dist/components/adk/AgentSession/AgentSession/AgentSession.state.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+import { AgentSessionProps, AgentSession, SessionFilters, SessionSortOptions, SessionImportOptions } from './AgentSession.props';
+/**
+ * Custom hook for managing AgentSession state and operations
+ */
+export declare const useAgentSession: (props: AgentSessionProps) => {
+    sessions: AgentSession[];
+    selectedSession: AgentSession | null;
+    isLoading: boolean;
+    isCreating: boolean;
+    error: string | null;
+    searchQuery: string;
+    filters: SessionFilters;
+    sortOptions: SessionSortOptions;
+    fetchSessions: () => Promise<void>;
+    createSession: (metadata?: {
+        title?: string | undefined;
+        description?: string | undefined;
+        tags?: string[] | undefined;
+    } | undefined) => Promise<AgentSession>;
+    selectSession: (sessionId: string) => Promise<void>;
+    deleteSession: (sessionId: string) => Promise<void>;
+    exportSession: (session: AgentSession) => void;
+    importSession: (file: File, options?: SessionImportOptions) => Promise<void>;
+    handleFileImport: () => void;
+    setSearchQuery: import("react").Dispatch<import("react").SetStateAction<string>>;
+    setFilters: import("react").Dispatch<import("react").SetStateAction<SessionFilters>>;
+    setSortOptions: import("react").Dispatch<import("react").SetStateAction<SessionSortOptions>>;
+    setError: import("react").Dispatch<import("react").SetStateAction<string | null>>;
+    fileInputRef: import("react").MutableRefObject<HTMLInputElement | null>;
+    handleFileSelect: (event: React.ChangeEvent<HTMLInputElement>) => void;
+};