Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/manusapis/Agix/llms.txt

Use this file to discover all available pages before exploring further.

Agix is built as a layered system where a React task pane drives a service layer that in turn talks to Office.js, AI provider APIs, and external data connectors. Each layer has a single responsibility and depends only on the layer below it, making it straightforward to swap providers, add connectors, or extend the UI without touching unrelated code.

​
Source directory layout

The entire application lives under src/, divided into six top-level concerns: 
src/
├── commands/            # Ribbon command entry point
├── config/              # Provider registry and defaults
├── services/
│   ├── ai/              # AI provider layer (interface and implementations)
│   ├── analytics/       # Usage and event analytics
│   ├── audit/           # Audit logging
│   ├── charts/          # Chart generation from a selected range
│   ├── cleaning/        # Data-cleaning utilities
│   ├── connectors/      # External data source connectors (Stripe, SQL, …)
│   ├── data/            # External data fetching and routing
│   ├── excel/           # Office.js Excel wrapper (read/write ranges)
│   ├── formulas/        # Formula generation and evaluation
│   ├── ingestion/       # Data ingestion pipelines
│   ├── reports/         # PowerPoint, PDF, and summary generation
│   ├── scheduler/       # Cron-style recurring task engine
│   ├── templates/       # Spreadsheet and report templates
│   └── voice/           # Voice input processing
├── taskpane/            # React UI (task pane)
│   └── components/      # ProviderSelector, ChatPanel, ChartPanel, …
├── types/               # Shared domain types
└── utils/               # Range, settings, and formatting helpers
All internal imports use the @/ path alias, which maps to src/. This is configured in both tsconfig.json ("paths": { "@/*": ["src/*"] }) and vite.config.ts (resolve.alias). Use @/types/ai.types rather than a relative path like ../../types/ai.types anywhere inside src/.

​
Layers and their responsibilities

​
React UI — src/taskpane/

The task pane is a standard React 18 application. Key components include ProviderSelector (lets the user pick and configure an AI provider), ChatPanel (the conversational interface), and ChartPanel (previews generated charts). The task pane is loaded by taskpane.html, which is one of two HTML entry points declared in vite.config.ts.

​
Service layer — src/services/

The service layer is pure TypeScript with no React dependency. Each subdirectory handles one domain:
DirectoryResponsibility
ai/Normalises requests and responses across AI providers
analytics/Tracks usage events and telemetry
audit/Records audit logs for spreadsheet and AI actions
charts/Generates chart objects from selected spreadsheet ranges
cleaning/Applies data-cleaning rules to ranges
connectors/Manages external data source connectors (Stripe, SQL, and more)
data/Fetches and routes live data from external services
excel/Wraps Office.js range reads, writes, and selections
formulas/Generates and evaluates spreadsheet formulas
ingestion/Runs data ingestion pipelines into the spreadsheet
reports/Produces PowerPoint decks, PDF reports, and text summaries
scheduler/Runs cron-style recurring tasks inside the add-in
templates/Manages spreadsheet and report templates
voice/Handles voice input transcription and routing

​
Config — src/config/

providers.config.ts holds the DEFAULT_PROVIDERS registry — a Record<ProviderId, AIProviderConfig> that maps every known provider ID to its base URL, default model, and an empty apiKey placeholder. API keys are never committed; they are written at runtime via settingsStore in src/utils/settings.ts.

​
Shared types — src/types/

Two type modules are the single source of truth for cross-layer contracts:
  • ai.types.ts — ProviderId, ChatRequest, ChatResponse, AIProviderConfig, and TokenUsage.
  • connector.types.ts — ConnectorType, ConnectorConfig, SyncRequest, SyncResult, and ConnectorStatus.

​
Utils — src/utils/

settings.ts exposes settingsStore, which persists provider configuration in Office.context.document.settings when running inside Excel and falls back to localStorage during browser-only development.

​
Dual entry points

Office Add-ins require two separate HTML files registered in manifest.xml:
FilePurpose
taskpane.htmlBootstraps the React application; opened when the user clicks Open Agix in the ribbon
commands.htmlLoads a minimal JavaScript bundle for ribbon button actions that do not open the task pane
Both files are declared as Rollup inputs in vite.config.ts and their URLs (https://localhost:3000/taskpane.html and https://localhost:3000/commands.html) are referenced in manifest.xml under the Taskpane.Url and Commands.Url resource IDs.

​
Dependency flow

The critical path from a user message to an AI response follows this chain: 
ChatPanel (React)
  └─▶ createProvider(config)         # provider.factory.ts
        └─▶ IAIProvider.chat(request)  # openai.provider.ts / claude.provider.ts
              └─▶ fetch(baseUrl + endpoint)
                    └─▶ AI API (OpenAI, Anthropic, OpenRouter, …)
createProvider() receives an AIProviderConfig — including the provider ID, base URL, API key, and model — and returns a concrete IAIProvider instance. The ChatPanel only ever calls isConfigured() and chat(), so it is completely decoupled from which provider is active.

​
Key design decisions

​
IAIProvider — provider swappability

Every AI integration implements the same two-method contract: 
export interface IAIProvider {
  readonly id: AIProviderConfig["id"];
  readonly name: string;

  isConfigured(): boolean;
  chat(request: ChatRequest): Promise<ChatResponse>;
}
Adding a new AI provider requires implementing this interface and adding one case to the createProvider() switch — nothing else changes at call sites. See Adding Providers for a full walkthrough.

​
Connector registry — extensibility without modification

The connector factory uses a Map<ConnectorType, () => IConnector> registry. Adding a new external data source means appending one entry to that map. getSupportedConnectors() automatically reflects the new type. See Adding Connectors for the step-by-step guide.

​
BaseAIProvider and BaseConnector — shared plumbing

Both BaseAIProvider and BaseConnector are abstract classes that hold common state (config) and provide a default isConfigured() / isConnected() implementation. Concrete classes only need to implement the domain-specific methods (chat() and sync()), keeping each file focused.

Adding Providers

Implement IAIProvider and register a new AI model in the provider factory.

Adding Connectors

Build a custom data source connector by extending BaseConnector and registering it in the connector factory.

Build docs developers (and LLMs) love

Get started for freeTalk to us