Release 0.11.20 (#2121)

Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: himself65 <14026360+himself65@users.noreply.github.com>

.github/workflows/lint_on_push_or_pull.yml

@@ -8,6 +8,11 @@ on:
     branches:
       - main
 
+env:
+  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+  TURBO_TEAM: ${{ vars.TURBO_TEAM }}
+  TURBO_REMOTE_ONLY: true
+
 jobs:
   lint:
     runs-on: ubuntu-latest

.github/workflows/preview.yml

@@ -1,6 +1,11 @@
 name: Publish Preview
 on: [pull_request]
 
+env:
+  TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
+  TURBO_TEAM: ${{ vars.TURBO_TEAM }}
+  TURBO_REMOTE_ONLY: true
+
 jobs:
   pre_release:
     name: Pre Release

.github/workflows/test.yml

@@ -23,7 +23,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x, 22.x, 23.x]
+        node-version: [20.x, 22.x, 23.x]
     name: E2E on Node.js ${{ matrix.node-version }}
     runs-on: ubuntu-latest
     steps:
@@ -53,7 +53,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        node-version: [18.x, 20.x, 22.x, 23.x]
+        node-version: [20.x, 22.x, 23.x]
     name: Test on Node.js ${{ matrix.node-version }}
     runs-on: ubuntu-latest
     steps:
@@ -87,6 +87,30 @@ jobs:
         run: pnpm run type-check
       - name: Run Circular Dependency Check
         run: pnpm run circular-check
+  e2e-npm:
+    runs-on: ubuntu-latest
+    name: Test using packages with npm
+    steps:
+      - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version-file: ".nvmrc"
+      - name: Install dependencies
+        run: pnpm install
+      - name: Build packages
+        run: pnpm run build
+      - name: Pack packages
+        run: |
+          pnpm pack --pack-destination ${{ runner.temp }} -C packages/llamaindex
+          pnpm pack --pack-destination ${{ runner.temp }} -C packages/workflow
+      - name: Install packed packages
+        run: npm add ${{ runner.temp }}/*.tgz
+        working-directory: e2e/npm
+      - name: Run tests
+        run: npm test
+        working-directory: e2e/npm
   e2e-llamaindex-examples:
     strategy:
       fail-fast: false

.nvmrc

@@ -1 +1 @@
-20
+22

.prettierignore

@@ -7,3 +7,4 @@ dist/
 .source/
 # prttier doesn't support mdx3 we are using
 *.mdx
+packages/server/server/

CLAUDE.md

@@ -0,0 +1,92 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository.
+
+## Development Commands
+
+This project uses pnpm as the package manager and Turbo for build orchestration:
+
+- `pnpm install` - Install all dependencies
+- `pnpm build` - Build all packages using Turbo
+- `pnpm dev` - Start development mode for all packages
+- `pnpm test` - Run all unit tests
+- `pnpm e2e` - Run end-to-end tests
+- `pnpm lint` - Run ESLint across all packages
+- `pnpm type-check` - Run TypeScript type checking across workspace
+- `pnpm format` - Check code formatting with Prettier
+- `pnpm format:write` - Auto-fix formatting issues
+- `pnpm circular-check` - Check for circular dependencies using madge
+
+For individual package development:
+
+- `turbo run build --filter="@llamaindex/core"` - Build specific package
+- `turbo run test --filter="@llamaindex/core"` - Test specific package
+- Navigate to specific package directory and run `pnpm test` for focused testing
+- `pnpm clean` - Remove all build artifacts and node_modules across workspace
+
+## Architecture Overview
+
+LlamaIndex.TS is a TypeScript data framework for LLM applications organized as a pnpm monorepo with multiple runtime environment support (Node.js, Deno, Bun, Vercel Edge, Cloudflare Workers).
+
+### Package Structure
+
+**Core Packages:**
+
+- `packages/core/` - Abstract base classes and interfaces for all runtime environments
+- `packages/llamaindex/` - Main package that aggregates core functionality
+- `packages/env/` - Environment-specific compatibility layers for different JS runtimes
+
+**Provider Packages (`packages/providers/`):**
+
+- LLM providers: `openai/`, `anthropic/`, `ollama/`, `google/`, `groq/`, etc.
+- Vector stores: `storage/pinecone/`, `storage/chroma/`, `storage/qdrant/`, etc.
+- Embeddings: Various embedding providers integrated within LLM packages
+- Readers: `assemblyai/`, `discord/`, `notion/` for data ingestion
+
+**Specialized Packages:**
+
+- `packages/cloud/` - LlamaCloud integration for managed services
+- `packages/tools/` - Function calling tools and utilities
+- `packages/workflow/` - Agent workflow orchestration
+- `packages/readers/` - File format readers (PDF, DOCX, etc.)
+
+### Key Architectural Patterns
+
+**Runtime Abstraction:** Core functionality is runtime-agnostic, with environment-specific implementations in separate entry points (`index.ts`, `index.edge.ts`, `index.workerd.ts`).
+
+**Provider Pattern:** LLMs, embeddings, and vector stores implement common interfaces from `@llamaindex/core`, allowing easy swapping between providers.
+
+**Modular Design:** Each provider is a separate package to minimize bundle size - users install only what they need.
+
+**Data Flow:** Document → NodeParser → Embedding → VectorStore → Retriever → QueryEngine → Response
+
+### Core Components
+
+- **Agents and Workflows:** Abstractions for building agentic workflows and agents in `packages/workflow`
+- **Chat Engines:** Conversational interfaces in `core/chat-engine/`
+- **Query Engines:** Document querying with retrieval in `core/query-engine/`
+- **Indices:** VectorStoreIndex, SummaryIndex, KeywordTable in `llamaindex/indices/`
+- **Node Parsers:** Text splitting and chunking in `core/node-parser/`
+- **Ingestion Pipeline:** Document processing workflows in `llamaindex/ingestion/`
+- **Storage:** Chat stores, document stores, index stores, and KV stores in `core/storage/`
+
+### Deprecated Components
+
+- **Agents:** ReAct and function calling agents in `core/agent/` and `llamaindex/agent/`
+
+### Testing Structure
+
+- Unit tests in each package's `tests/` directory
+- E2E tests in `e2e/` directory with runtime-specific examples
+- Tests depend on build artifacts, so always run `pnpm build` before testing
+
+### Multi-Runtime Support
+
+The codebase supports multiple JavaScript runtimes through conditional exports and separate entry points. When making changes, consider compatibility across Node.js, Deno, Bun, and edge runtimes.
+
+### Development Notes
+
+- The project uses Husky for git hooks with lint-staged for pre-commit formatting and linting
+- All packages use bunchee for building with dual CJS/ESM support
+- Core package exports are organized as sub-modules (e.g., `@llamaindex/core/llms`, `@llamaindex/core/embeddings`)
+- Always run `pnpm build` before running tests, as tests depend on build artifacts

CONTRIBUTING.md

@@ -25,7 +25,7 @@ Make sure you have Node.js LTS (Long-term Support) installed. You can check your
 
 ```shell
 node -v
-# v20.x.x
+# v22.x.x
 ```
 
 ### Use pnpm
@@ -38,6 +38,7 @@ npm install -g pnpm
 
 ```shell
 pnpm install
+pnpm install -g tsx
 ```
 
 ### Build the packages
@@ -48,6 +49,56 @@ To build all packages, run:
 pnpm build
 ```
 
+### Start Developing
+
+You can launch the package in dev-mode by running:
+
+```shell
+pnpm dev
+```
+
+This will use turbo to run all packages in watch-mode. This means you can make changes and have them automatically built.
+
+If you want to customize what packages are built/watched, you can run turbo directly and adjust the filter:
+
+```shell
+pnpm turbo run dev --filter="./packages/core" --concurrency=100
+```
+
+In another terminal, you can write and run any script needed to quickly test your changes. For example:
+
+```typescript
+import { createMemory, staticBlock } from "@llamaindex/core/memory";
+
+// Create memory with predefined context
+const memory = createMemory({
+  memoryBlocks: [
+    staticBlock({
+      content:
+        "The user is a software engineer who loves TypeScript and LlamaIndex.",
+      messageRole: "system",
+    }),
+  ],
+});
+
+async function main() {
+  const result = await memory.getLLM();
+  console.log(result);
+}
+
+void main().catch(console.error);
+```
+
+And run it with:
+
+```shell
+pnpm exec tsx my_script.ts
+```
+
+This flow allows you to easily test your changes without having to build the entire project.
+
+Once you are happy with your changes, be sure to add tests (and confirm existing tests are passing!).
+
 ### Run tests
 
 #### Unit tests
@@ -92,7 +143,7 @@ Before sending a PR, make sure of the following:
 3. If you have a new feature, add a new example in the `examples` folder.
 4. You have a descriptive changeset for each PR:
 
-### Changesets
+### Bumping the versions of packages you've modified
 
 We use [changesets](https://github.com/changesets/changesets) for managing versions and changelogs. To create a new
 changeset, run in the root folder:
@@ -101,6 +152,8 @@ changeset, run in the root folder:
 pnpm changeset
 ```
 
+You will be prompted to choose what packages need their versions bumped, and what kind of bump (major, minor or patch) is needed. Once you carry out this operation, the bumping will be automatic after the PR is merged.
+
 ## Publishing (maintainers only)
 
 The [Release Github Action](.github/workflows/release.yml) is automatically generating and updating a

README.md

@@ -7,9 +7,10 @@
 </h3>
 
 [![NPM Version](https://img.shields.io/npm/v/llamaindex)](https://www.npmjs.com/package/llamaindex)
-[![NPM License](https://img.shields.io/npm/l/llamaindex)](https://www.npmjs.com/package/llamaindex)
+[![NPM License](https://img.shields.io/npm/l/llamaindex)](https://github.com/run-llama/LlamaIndexTS/blob/main/LICENSE)
 [![NPM Downloads](https://img.shields.io/npm/dm/llamaindex)](https://www.npmjs.com/package/llamaindex)
 [![Discord](https://img.shields.io/discord/1059199217496772688)](https://discord.com/invite/eN6D2HQ4aX)
+[![Twitter](https://img.shields.io/twitter/follow/llama_index)](https://x.com/llama_index)
 
 Use your own data with large language models (LLMs, OpenAI ChatGPT and others) in JS runtime environments with TypeScript support.
 
@@ -63,7 +64,7 @@ yarn add llamaindex
 
 ### Setup in Node.js, Deno, Bun, TypeScript...?
 
-See our official document: <https://ts.llamaindex.ai/docs/llamaindex/getting_started/>
+See our official document: https://ts.llamaindex.ai/docs/llamaindex/getting_started
 
 ### Adding provider packages
 
@@ -83,19 +84,7 @@ Check out our NextJS playground at https://llama-playground.vercel.app/. The sou
 
 ## Core concepts for getting started:
 
-- [Document](/packages/llamaindex/src/Node.ts): A document represents a text file, PDF file or other contiguous piece of data.
-
-- [Node](/packages/llamaindex/src/Node.ts): The basic data building block. Most commonly, these are parts of the document split into manageable pieces that are small enough to be fed into an embedding model and LLM.
-
-- [Embedding](/packages/llamaindex/src/embeddings/OpenAIEmbedding.ts): Embeddings are sets of floating point numbers which represent the data in a Node. By comparing the similarity of embeddings, we can derive an understanding of the similarity of two pieces of data. One use case is to compare the embedding of a question with the embeddings of our Nodes to see which Nodes may contain the data needed to answer that question. Because the default service context is OpenAI, the default embedding is `OpenAIEmbedding`. If using different models, say through Ollama, use this [Embedding](/packages/llamaindex/src/embeddings/OllamaEmbedding.ts) (see all [here](/packages/llamaindex/src/embeddings)).
-
-- [Indices](/packages/llamaindex/src/indices/): Indices store the Nodes and the embeddings of those nodes. QueryEngines retrieve Nodes from these Indices using embedding similarity.
-
-- [QueryEngine](/packages/llamaindex/src/engines/query/RetrieverQueryEngine.ts): Query engines are what generate the query you put in and give you back the result. Query engines generally combine a pre-built prompt with selected Nodes from your Index to give the LLM the context it needs to answer your query. To build a query engine from your Index (recommended), use the [`asQueryEngine`](/packages/llamaindex/src/indices/BaseIndex.ts) method on your Index. See all query engines [here](/packages/llamaindex/src/engines/query).
-
-- [ChatEngine](/packages/llamaindex/src/engines/chat/SimpleChatEngine.ts): A ChatEngine helps you build a chatbot that will interact with your Indices. See all chat engines [here](/packages/llamaindex/src/engines/chat).
-
-- [SimplePrompt](/packages/llamaindex/src/Prompt.ts): A simple standardized function call definition that takes in inputs and formats them in a template literal. SimplePrompts can be specialized using currying and combined using other SimplePrompt functions.
+See our documentation: https://ts.llamaindex.ai/docs/llamaindex/getting_started/concepts
 
 ## Contributing:
 

apps/next/CHANGELOG.md

@@ -1,5 +1,448 @@
 # @llamaindex/doc
 
+## 0.2.42
+
+### Patch Changes
+
+- a8ec08c: fix: ensure correct message content in agent workflow
+- Updated dependencies [a8ec08c]
+- Updated dependencies [2967d57]
+  - @llamaindex/core@0.6.16
+  - @llamaindex/workflow@1.1.16
+  - @llamaindex/cloud@4.0.25
+  - llamaindex@0.11.20
+  - @llamaindex/node-parser@2.0.16
+  - @llamaindex/openai@0.4.11
+  - @llamaindex/readers@3.1.15
+
+## 0.2.41
+
+### Patch Changes
+
+- Updated dependencies [856dd8c]
+  - @llamaindex/openai@0.4.10
+
+## 0.2.40
+
+### Patch Changes
+
+- Updated dependencies [7ad3411]
+- Updated dependencies [5da5b3c]
+- Updated dependencies [a1fdb07]
+  - @llamaindex/core@0.6.15
+  - @llamaindex/workflow@1.1.15
+  - @llamaindex/openai@0.4.9
+  - @llamaindex/cloud@4.0.24
+  - llamaindex@0.11.19
+  - @llamaindex/node-parser@2.0.15
+  - @llamaindex/readers@3.1.14
+
+## 0.2.39
+
+### Patch Changes
+
+- Updated dependencies [a1b1598]
+  - @llamaindex/cloud@4.0.23
+  - llamaindex@0.11.18
+
+## 0.2.38
+
+### Patch Changes
+
+- Updated dependencies [d2be868]
+  - @llamaindex/cloud@4.0.22
+  - llamaindex@0.11.17
+
+## 0.2.37
+
+### Patch Changes
+
+- Updated dependencies [579ca0c]
+  - @llamaindex/cloud@4.0.21
+  - llamaindex@0.11.16
+
+## 0.2.36
+
+### Patch Changes
+
+- Updated dependencies [48b0d88]
+- Updated dependencies [f185772]
+  - @llamaindex/cloud@4.0.20
+  - llamaindex@0.11.15
+
+## 0.2.35
+
+### Patch Changes
+
+- Updated dependencies [5a0ed1f]
+- Updated dependencies [5a0ed1f]
+- Updated dependencies [8eeac33]
+  - @llamaindex/cloud@4.0.19
+  - @llamaindex/core@0.6.14
+  - llamaindex@0.11.14
+  - @llamaindex/node-parser@2.0.14
+  - @llamaindex/openai@0.4.8
+  - @llamaindex/readers@3.1.13
+  - @llamaindex/workflow@1.1.14
+
+## 0.2.34
+
+### Patch Changes
+
+- 39758ab: Add title to homepage header
+
+## 0.2.33
+
+### Patch Changes
+
+- Updated dependencies [47a7555]
+  - @llamaindex/cloud@4.0.18
+  - llamaindex@0.11.13
+
+## 0.2.32
+
+### Patch Changes
+
+- Updated dependencies [d578889]
+- Updated dependencies [0fcc92f]
+- Updated dependencies [515a8b9]
+  - @llamaindex/core@0.6.13
+  - llamaindex@0.11.12
+  - @llamaindex/cloud@4.0.17
+  - @llamaindex/node-parser@2.0.13
+  - @llamaindex/openai@0.4.7
+  - @llamaindex/readers@3.1.12
+  - @llamaindex/workflow@1.1.13
+
+## 0.2.31
+
+### Patch Changes
+
+- Updated dependencies [7039e1a]
+- Updated dependencies [7039e1a]
+  - llamaindex@0.11.11
+  - @llamaindex/core@0.6.12
+  - @llamaindex/cloud@4.0.16
+  - @llamaindex/node-parser@2.0.12
+  - @llamaindex/openai@0.4.6
+  - @llamaindex/readers@3.1.11
+  - @llamaindex/workflow@1.1.12
+
+## 0.2.30
+
+### Patch Changes
+
+- Updated dependencies [f7ec293]
+  - @llamaindex/workflow@1.1.11
+  - llamaindex@0.11.10
+
+## 0.2.29
+
+### Patch Changes
+
+- Updated dependencies [c5846bd]
+  - @llamaindex/readers@3.1.10
+
+## 0.2.28
+
+### Patch Changes
+
+- Updated dependencies [a89e187]
+- Updated dependencies [62699b7]
+- Updated dependencies [c5b2691]
+- Updated dependencies [d8ac8d3]
+  - @llamaindex/core@0.6.11
+  - @llamaindex/openai@0.4.5
+  - @llamaindex/cloud@4.0.15
+  - llamaindex@0.11.9
+  - @llamaindex/node-parser@2.0.11
+  - @llamaindex/readers@3.1.9
+  - @llamaindex/workflow@1.1.10
+
+## 0.2.27
+
+### Patch Changes
+
+- 8a51c16: Add natural language agent page
+- Updated dependencies [8a51c16]
+- Updated dependencies [1b5af14]
+  - @llamaindex/workflow@1.1.9
+  - @llamaindex/core@0.6.10
+  - llamaindex@0.11.8
+  - @llamaindex/cloud@4.0.14
+  - @llamaindex/node-parser@2.0.10
+  - @llamaindex/openai@0.4.4
+  - @llamaindex/readers@3.1.8
+
+## 0.2.26
+
+### Patch Changes
+
+- a4d394f: fix: correct SimpleDirectoryReader import path in documentation example
+- Updated dependencies [dbd857f]
+- Updated dependencies [3c857f4]
+  - @llamaindex/workflow@1.1.8
+  - llamaindex@0.11.7
+
+## 0.2.25
+
+### Patch Changes
+
+- Updated dependencies [40161fe]
+  - @llamaindex/workflow@1.1.7
+  - llamaindex@0.11.6
+
+## 0.2.24
+
+### Patch Changes
+
+- Updated dependencies [766054b]
+- Updated dependencies [71598f8]
+  - @llamaindex/workflow@1.1.6
+  - @llamaindex/core@0.6.9
+  - llamaindex@0.11.5
+  - @llamaindex/cloud@4.0.13
+  - @llamaindex/node-parser@2.0.9
+  - @llamaindex/openai@0.4.3
+  - @llamaindex/readers@3.1.7
+
+## 0.2.23
+
+### Patch Changes
+
+- Updated dependencies [c927457]
+  - @llamaindex/openai@0.4.2
+  - @llamaindex/core@0.6.8
+  - @llamaindex/cloud@4.0.12
+  - llamaindex@0.11.4
+  - @llamaindex/node-parser@2.0.8
+  - @llamaindex/readers@3.1.6
+  - @llamaindex/workflow@1.1.5
+
+## 0.2.22
+
+### Patch Changes
+
+- Updated dependencies [76ff23d]
+  - @llamaindex/cloud@4.0.11
+  - llamaindex@0.11.3
+
+## 0.2.21
+
+### Patch Changes
+
+- Updated dependencies [59601dd]
+  - @llamaindex/openai@0.4.1
+  - @llamaindex/core@0.6.7
+  - @llamaindex/cloud@4.0.10
+  - llamaindex@0.11.2
+  - @llamaindex/node-parser@2.0.7
+  - @llamaindex/readers@3.1.5
+  - @llamaindex/workflow@1.1.4
+
+## 0.2.20
+
+### Patch Changes
+
+- Updated dependencies [3703f90]
+  - @llamaindex/cloud@4.0.9
+  - llamaindex@0.11.1
+
+## 0.2.19
+
+### Patch Changes
+
+- Updated dependencies [680b529]
+- Updated dependencies [b0cd530]
+- Updated dependencies [361a685]
+- Updated dependencies [3e66ddc]
+  - @llamaindex/workflow@1.1.3
+  - @llamaindex/core@0.6.6
+  - llamaindex@0.11.0
+  - @llamaindex/openai@0.4.0
+  - @llamaindex/cloud@4.0.8
+  - @llamaindex/node-parser@2.0.6
+  - @llamaindex/readers@3.1.4
+
+## 0.2.18
+
+### Patch Changes
+
+- d671ed6: Add functionality for search params when querying Qdrant vector store.
+- Updated dependencies [76c9a80]
+- Updated dependencies [168d11f]
+- Updated dependencies [d671ed6]
+- Updated dependencies [40f5f41]
+  - @llamaindex/openai@0.3.7
+  - @llamaindex/workflow@1.1.2
+  - @llamaindex/core@0.6.5
+  - @llamaindex/cloud@4.0.7
+  - llamaindex@0.10.6
+  - @llamaindex/node-parser@2.0.5
+  - @llamaindex/readers@3.1.3
+
+## 0.2.17
+
+### Patch Changes
+
+- Updated dependencies [9b2e25a]
+  - @llamaindex/openai@0.3.6
+  - @llamaindex/core@0.6.4
+  - llamaindex@0.10.5
+  - @llamaindex/cloud@4.0.6
+  - @llamaindex/node-parser@2.0.4
+  - @llamaindex/readers@3.1.2
+  - @llamaindex/workflow@1.1.1
+
+## 0.2.16
+
+### Patch Changes
+
+- Updated dependencies [7e8e454]
+- Updated dependencies [2225ffd]
+- Updated dependencies [6ddf1c1]
+- Updated dependencies [bc53342]
+- Updated dependencies [41953a3]
+  - @llamaindex/workflow@1.1.0
+  - @llamaindex/cloud@4.0.5
+  - llamaindex@0.10.4
+
+## 0.2.15
+
+### Patch Changes
+
+- Updated dependencies [3ee8c83]
+  - @llamaindex/core@0.6.3
+  - llamaindex@0.10.3
+  - @llamaindex/openai@0.3.5
+  - @llamaindex/cloud@4.0.4
+  - @llamaindex/node-parser@2.0.3
+  - @llamaindex/readers@3.1.1
+  - @llamaindex/workflow@1.0.4
+
+## 0.2.14
+
+### Patch Changes
+
+- Updated dependencies [1e59695]
+  - @llamaindex/readers@3.1.0
+
+## 0.2.13
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+  - llamaindex@0.10.2
+
+## 0.2.12
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+  - llamaindex@0.10.1
+
+## 0.2.11
+
+### Patch Changes
+
+- 6cf928f: chore: use bunchee for llamaindex
+- Updated dependencies [6cf928f]
+  - llamaindex@0.10.0
+
+## 0.2.10
+
+### Patch Changes
+
+- 411dcea: Add Nova Premier to AWS Nova models. Add EU endpoints
+
+## 0.2.9
+
+### Patch Changes
+
+- Updated dependencies [d365eb2]
+  - @llamaindex/openai@0.3.2
+  - llamaindex@0.9.19
+
+## 0.2.8
+
+### Patch Changes
+
+- 2ffdb27: docs: correct the CondenseQuestionChatEngine path
+- Updated dependencies [88b7046]
+  - @llamaindex/openai@0.3.1
+  - llamaindex@0.9.18
+
+## 0.2.7
+
+### Patch Changes
+
+- 3ffee26: feat: enhance config params for LlamaIndexServer
+
+## 0.2.6
+
+### Patch Changes
+
+- Updated dependencies [3534c37]
+- Updated dependencies [41191d0]
+  - llamaindex@0.9.17
+  - @llamaindex/workflow@1.0.3
+  - @llamaindex/cloud@4.0.3
+
+## 0.2.5
+
+### Patch Changes
+
+- 4999df1: bump nextjs
+- Updated dependencies [f5e4d09]
+  - llamaindex@0.9.16
+
+## 0.2.4
+
+### Patch Changes
+
+- 9c63f3f: Add support for openai responses api
+- Updated dependencies [9c63f3f]
+- Updated dependencies [c515a32]
+  - @llamaindex/openai@0.3.0
+  - @llamaindex/core@0.6.2
+  - @llamaindex/workflow@1.0.2
+  - llamaindex@0.9.15
+  - @llamaindex/cloud@4.0.2
+  - @llamaindex/node-parser@2.0.2
+  - @llamaindex/readers@3.0.2
+
+## 0.2.3
+
+### Patch Changes
+
+- 648cfb5: Add support for supabase vector store
+  Added doc for the supbase vector store
+- Updated dependencies [1b6f368]
+- Updated dependencies [eaf326e]
+- Updated dependencies [9d951b2]
+  - @llamaindex/core@0.6.1
+  - llamaindex@0.9.14
+  - @llamaindex/cloud@4.0.1
+  - @llamaindex/node-parser@2.0.1
+  - @llamaindex/openai@0.2.1
+  - @llamaindex/readers@3.0.1
+  - @llamaindex/workflow@1.0.1
+
+## 0.2.2
+
+### Patch Changes
+
+- e98033e: docs: correct the number of indexes
+
+## 0.2.1
+
+### Patch Changes
+
+- Updated dependencies [75d6e29]
+  - llamaindex@0.9.13
+
 ## 0.2.0
 
 ### Minor Changes

apps/next/CLAUDE.md

@@ -0,0 +1,143 @@
+# CLAUDE.md
+
+This file provides guidance to Claude Code (claude.ai/code) when working with the LlamaIndex.TS documentation site.
+
+## Application Overview
+
+This is a Next.js documentation site (`@llamaindex/doc`) that serves as the official documentation for LlamaIndex.TS. It's built using Fumadocs, a modern documentation framework, and includes interactive features, API documentation generation, and AI-powered chat functionality.
+
+## Development Commands
+
+From this directory (`apps/next/`):
+
+- `pnpm dev` - Start development server with Turbo
+- `pnpm build` - Build the documentation site (includes `prebuild` step)
+- `pnpm start` - Start production server
+- `pnpm build:docs` - Generate API documentation from TypeScript source
+- `pnpm validate-links` - Validate all internal and external links
+
+Key build process:
+
+1. `prebuild` runs `build:docs` to generate API documentation using TypeDoc
+2. `build` runs Next.js build process
+3. `postbuild` runs post-processing scripts and link validation
+
+## Architecture
+
+### Framework Stack
+
+- **Next.js 15.3** - React framework with App Router
+- **Fumadocs** - Documentation framework with MDX support
+- **React Server Components** - AI chat functionality with server actions
+- **Tailwind CSS** - Styling with custom design system
+- **TypeScript** - Full type safety
+
+### Key Dependencies
+
+- **Fumadocs ecosystem**: `fumadocs-ui`, `fumadocs-mdx`, `fumadocs-core`, `fumadocs-openapi`
+- **AI features**: `ai` package for React Server Components chat
+- **Code features**: Monaco Editor, Shiki syntax highlighting, Twoslash TypeScript integration
+- **UI components**: Radix UI primitives, Framer Motion animations
+- **Content processing**: MDX, remark/rehype plugins, TypeDoc for API generation
+
+### Directory Structure
+
+**Content Management:**
+
+- `src/content/docs/` - MDX documentation files organized by topic
+- `src/content/docs/api/` - Auto-generated API documentation from TypeScript
+- `scripts/` - Build-time documentation generation and validation
+
+**Application Code:**
+
+- `src/app/` - Next.js App Router pages and API routes
+- `src/components/` - Reusable React components including UI library
+- `src/lib/` - Utilities, constants, and configuration
+
+**Configuration:**
+
+- `source.config.ts` - Fumadocs MDX configuration with plugins
+- `next.config.mjs` - Next.js configuration with MDX integration
+- `tailwind.config.mjs` - Tailwind CSS customization
+
+### Key Features
+
+**Documentation Features:**
+
+- MDX-based content with TypeScript code highlighting
+- Auto-generated API documentation from TypeScript source
+- Interactive code examples with Monaco Editor
+- Math equation support with KaTeX
+- Link validation and build-time checks
+
+**Interactive Features:**
+
+- AI-powered chat interface using React Server Components
+- Code demos with live TypeScript execution
+- Interactive UI components and animations
+- Search functionality across all documentation
+
+**Build Process:**
+
+- TypeDoc generates API documentation from workspace packages
+- Custom scripts transform and validate generated content
+- Link checking ensures all internal/external links work
+- Static site generation with 10-minute timeout for large documentation set
+
+### Configuration Files
+
+**source.config.ts**: Defines MDX processing pipeline with:
+
+- Code highlighting themes (Catppuccin)
+- Twoslash TypeScript integration
+- Remark/rehype plugins for enhanced Markdown
+- Content directories including external docs
+
+**next.config.mjs**: Next.js configuration with:
+
+- Extended static generation timeout (10 minutes)
+- Monaco Editor transpilation
+- Server external packages for build optimization
+- Webpack/Turbopack aliases for browser compatibility
+
+### Content Organization
+
+**Documentation Structure:**
+
+- `/docs/llamaindex/` - Core LlamaIndex.TS documentation
+- `/docs/cloud/` - LlamaCloud integration guides
+- `/docs/api/` - Auto-generated TypeScript API reference
+
+**Content Sources:**
+
+- Local MDX files in `src/content/docs/`
+- External docs from `@llamaindex/workflow-docs` package
+- Generated API docs from TypeScript source
+
+### Development Notes
+
+- Documentation content is sourced from multiple locations including external packages
+- API documentation is regenerated on each build from TypeScript source
+- The site uses advanced MDX features including custom transformers and plugins
+- Build process includes comprehensive link validation
+- Large memory allocation needed for TypeDoc generation (`--max-old-space-size=8192`)
+- Chat functionality uses React Server Components with streaming responses
+
+### AI Chat Integration
+
+The documentation includes an AI chat feature that:
+
+- Uses React Server Components for server-side AI processing
+- Integrates with LlamaIndex.TS packages for demonstrations
+- Provides interactive examples and code generation
+- Streams responses for better user experience
+
+### Content Authoring
+
+When adding new documentation:
+
+- Create MDX files in appropriate `src/content/docs/` subdirectories
+- Follow existing content structure and frontmatter conventions
+- Use Fumadocs MDX features like code blocks, callouts, and tabs
+- API documentation is auto-generated - edit TypeScript source comments instead
+- Run `pnpm validate-links` to check all links before publishing

apps/next/README.md

@@ -3,6 +3,8 @@
 This is a Next.js application generated with
 [Create Fumadocs](https://github.com/fuma-nama/fumadocs).
 
+> Note: Before running the development server, make sure to build the whole project first, see [CONTRIBUTING.md](../../CONTRIBUTING.md) for more details.
+
 Run development server:
 
 ```bash

apps/next/components.json

@@ -12,9 +12,9 @@
   },
   "aliases": {
     "components": "@/components",
-    "utils": "@/lib/utils",
+    "utils": "@/libs/utils",
     "ui": "@/components/ui",
-    "lib": "@/lib",
+    "lib": "@/libs",
     "hooks": "@/hooks"
   }
 }

apps/next/fallback.js

@@ -0,0 +1,2 @@
+// fallback for `fs` usage in `web-tree-sitter`
+module.exports = {};

apps/next/next.config.mjs

@@ -1,9 +1,10 @@
 import { createMDX } from "fumadocs-mdx/next";
-import MonacoWebpackPlugin from "monaco-editor-webpack-plugin";
 const withMDX = createMDX();
 
 /** @type {import('next').NextConfig} */
 const config = {
+  // default timeout for static generation is 60s, but we need to increase it to 10 minutes due to the large number of document pages
+  staticPageGenerationTimeout: 600,
   reactStrictMode: true,
   eslint: {
     ignoreDuringBuilds: true,
@@ -14,7 +15,53 @@ const config = {
     "twoslash",
     "typescript",
   ],
-  webpack: (config, { isServer }) => {
+  async redirects() {
+    return [
+      {
+        source: "/docs/chat-ui/:path*.mdx",
+        destination: "/docs/chat-ui/:path*",
+        permanent: true,
+      },
+      {
+        source: "/docs/workflows/:path*.mdx",
+        destination: "/docs/workflows/:path*",
+        permanent: true,
+      },
+      {
+        source: "/docs/llamaindex/getting_started/installation/node.mdx",
+        destination:
+          "/docs/llamaindex/getting_started/installation/server-apis.mdx",
+        permanent: true,
+      },
+      {
+        source: "/docs/llamaindex/getting_started/installation/typescript.mdx",
+        destination: "/docs/llamaindex/getting_started/installation/index.mdx",
+        permanent: true,
+      },
+      {
+        source: "/docs/llamaindex/getting_started/installation/next.mdx",
+        destination: "/docs/llamaindex/getting_started/installation/nextjs.mdx",
+        permanent: true,
+      },
+      {
+        source: "/docs/llamaindex/getting_started/installation/vite.mdx",
+        destination: "/docs/llamaindex/getting_started/installation/index.mdx",
+        permanent: true,
+      },
+      {
+        source: "/docs/llamaindex/getting_started/installation/cloudflare.mdx",
+        destination:
+          "/docs/llamaindex/getting_started/installation/serverless.mdx",
+        permanent: true,
+      },
+    ];
+  },
+  turbopack: {
+    resolveAlias: {
+      fs: { browser: "./fallback.js" },
+    },
+  },
+  webpack: (config) => {
     if (Array.isArray(config.target) && config.target.includes("web")) {
       config.target = ["web", "es2020"];
     }
@@ -26,14 +73,6 @@ const config = {
     };
     config.resolve.fallback ??= {};
     config.resolve.fallback.fs = false;
-    if (!isServer) {
-      config.plugins.push(
-        new MonacoWebpackPlugin({
-          languages: ["typescript"],
-          filename: "static/[name].worker.js",
-        }),
-      );
-    }
     config.resolve.alias["replicate"] = false;
     return config;
   },

apps/next/package.json

@@ -1,27 +1,31 @@
 {
   "name": "@llamaindex/doc",
-  "version": "0.2.0",
+  "version": "0.2.42",
   "private": true,
   "scripts": {
     "postinstall": "fumadocs-mdx",
     "prebuild": "pnpm run build:docs",
     "build": "next build",
-    "dev": "next dev",
+    "dev": "next dev --turbo",
     "start": "next start",
     "postbuild": "tsx scripts/post-build.mts && tsx scripts/validate-links.mts",
     "build:docs": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192\" typedoc && tsx scripts/generate-docs.mts",
     "validate-links": "tsx scripts/validate-links.mts"
   },
   "dependencies": {
+    "@huggingface/transformers": "^3.5.0",
     "@icons-pack/react-simple-icons": "^10.1.0",
-    "@llamaindex/chat-ui": "0.2.0",
+    "@llamaindex/chat-ui-docs": "^0.0.5",
     "@llamaindex/cloud": "workspace:*",
     "@llamaindex/core": "workspace:*",
     "@llamaindex/node-parser": "workspace:*",
     "@llamaindex/openai": "workspace:*",
     "@llamaindex/readers": "workspace:*",
     "@llamaindex/workflow": "workspace:*",
+    "@llamaindex/workflow-docs": "0.1.1",
     "@mdx-js/mdx": "^3.1.0",
+    "@monaco-editor/react": "^4.7.0",
+    "@next/third-parties": "^15.3.4",
     "@number-flow/react": "^0.3.4",
     "@radix-ui/react-dialog": "^1.1.2",
     "@radix-ui/react-icons": "^1.3.2",
@@ -31,27 +35,26 @@
     "@radix-ui/react-tooltip": "^1.1.4",
     "@scalar/api-client-react": "^1.1.25",
     "@vercel/functions": "^1.5.0",
-    "ai": "^3.4.33",
+    "ai": "^4.3.17",
     "class-variance-authority": "^0.7.0",
     "clsx": "2.1.1",
     "foxact": "^0.2.41",
     "framer-motion": "^11.11.17",
-    "fumadocs-core": "^15.0.15",
+    "fumadocs-core": "^15.5.0",
     "fumadocs-docgen": "^2.0.0",
-    "fumadocs-mdx": "^11.5.6",
-    "fumadocs-openapi": "^6.3.0",
-    "fumadocs-twoslash": "^3.1.0",
-    "fumadocs-typescript": "^3.1.0",
-    "fumadocs-ui": "^15.0.15",
+    "fumadocs-mdx": "^11.6.6",
+    "fumadocs-openapi": "^9.0.5",
+    "fumadocs-twoslash": "^3.1.3",
+    "fumadocs-typescript": "^4.0.5",
+    "fumadocs-ui": "^15.5.0",
     "hast-util-to-jsx-runtime": "^2.3.2",
     "llamaindex": "workspace:*",
     "lucide-react": "^0.460.0",
-    "next": "^15.2.1",
+    "next": "^15.3.3",
     "next-themes": "^0.4.3",
-    "react": "^19.0.0",
-    "react-dom": "^19.0.0",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
     "react-icons": "^5.3.0",
-    "react-monaco-editor": "^0.56.2",
     "react-use-measure": "^2.1.1",
     "rehype-katex": "^7.0.1",
     "remark-math": "^6.0.0",
@@ -63,33 +66,34 @@
     "tailwindcss-animate": "^1.0.7",
     "tree-sitter": "^0.22.1",
     "tree-sitter-typescript": "^0.23.2",
+    "ts-morph": "^25.0.1",
+    "twoslash": "^0.3.1",
     "use-stick-to-bottom": "^1.0.42",
     "web-tree-sitter": "^0.24.4",
-    "zod": "^3.23.8"
+    "zod": "^3.25.76"
   },
   "devDependencies": {
-    "@next/env": "^15.2.1",
+    "@next/env": "^15.3.0",
     "@tailwindcss/postcss": "^4.0.9",
     "@types/mdx": "^2.0.13",
-    "@types/node": "22.9.0",
-    "@types/react": "^19.0.10",
-    "@types/react-dom": "^19.0.4",
+    "@types/node": "24.0.13",
+    "@types/react": "^19.1.8",
+    "@types/react-dom": "^19.1.6",
     "autoprefixer": "^10.4.20",
     "cross-env": "^7.0.3",
     "fast-glob": "^3.3.2",
     "gray-matter": "^4.0.3",
-    "monaco-editor-webpack-plugin": "^7.1.0",
-    "postcss": "^8.5.3",
+    "postcss": "^8.5.6",
     "raw-loader": "^4.0.2",
     "remark": "^15.0.1",
     "remark-gfm": "^4.0.0",
     "remark-mdx": "^3.1.0",
     "remark-stringify": "^11.0.0",
-    "tailwindcss": "^4.0.9",
-    "tsx": "^4.19.3",
-    "typedoc": "0.27.4",
-    "typedoc-plugin-markdown": "^4.3.1",
-    "typedoc-plugin-merge-modules": "^6.1.0",
-    "typescript": "^5.7.3"
+    "tailwindcss": "^4.1.11",
+    "tsx": "^4.20.3",
+    "typedoc": "0.28.3",
+    "typedoc-plugin-markdown": "^4.6.2",
+    "typedoc-plugin-merge-modules": " ^7.0.0",
+    "typescript": "^5.8.3"
   }
 }

apps/next/scripts/generate-docs.mts

@@ -1,27 +1,24 @@
-import { generateFiles as openapiGenerateFiles } from "fumadocs-openapi";
-import { generateFiles as typescriptGenerateFiles } from "fumadocs-typescript";
+import {
+  createGenerator,
+  generateFiles as typescriptGenerateFiles,
+} from "fumadocs-typescript";
 import fs from "node:fs";
 import * as path from "node:path";
 import { rimrafSync } from "rimraf";
 
+const generator = createGenerator();
 const out = "./src/content/docs/cloud/api";
 const apiRefOut = "./src/content/docs/api";
 
 // clean generated files
 rimrafSync(out, {
   filter(v) {
-    return !v.endsWith("index.mdx") && !v.endsWith("meta.json");
+    return !v.endsWith("index.md") && !v.endsWith("meta.json");
   },
 });
 
-void openapiGenerateFiles({
-  input: ["../../packages/cloud/openapi.json"],
-  output: "./src/content/docs/cloud/api",
-  groupBy: "tag",
-});
-
-void typescriptGenerateFiles({
-  input: ["./src/content/docs/api/**/*.mdx"],
+void typescriptGenerateFiles(generator, {
+  input: ["./src/content/docs/api/**/*.md"],
   output: (file) => path.resolve(path.dirname(file), path.basename(file)),
   transformOutput,
 });
@@ -30,19 +27,22 @@ function transformOutput(filePath: string, content: string) {
   const fileName = path.basename(filePath);
   let title = fileName.split(".")[0];
   if (title === "index") title = "LlamaIndex API Reference";
-  return `---\ntitle: ${title}\n---\n\n${transformAbsoluteUrl(content, filePath)}`;
+  return `---\ntitle: ${title}\n---\n\n${transformAbsoluteUrl(
+    content.replace(/(?<!\\)\{([^}]+)(?<!\\)}/g, "\\{$1\\}"),
+    filePath,
+  )}`;
 }
 
 /**
- * Transforms the content by converting relative MDX links to absolute docs API links
- * Example: [text](../type-aliases/TaskHandler.mdx) -> [text](/docs/api/type-aliases/TaskHandler)
- * [text](BaseChatEngine.mdx) -> [text](/docs/api/classes/BaseChatEngine)
- * [text](BaseVectorStore.mdx#constructors) -> [text](/docs/api/classes/BaseVectorStore#constructors)
- * [text](TaskStep.mdx) -> [text](/docs/api/type-aliases/TaskStep)
+ * Transforms the content by converting relative MD links to absolute docs API links
+ * Example: [text](../type-aliases/TaskHandler.md) -> [text](/docs/api/type-aliases/TaskHandler)
+ * [text](BaseChatEngine.md) -> [text](/docs/api/classes/BaseChatEngine)
+ * [text](BaseVectorStore.md#constructors) -> [text](/docs/api/classes/BaseVectorStore#constructors)
+ * [text](TaskStep.md) -> [text](/docs/api/type-aliases/TaskStep)
  */
 function transformAbsoluteUrl(content: string, filePath: string) {
   const group = path.dirname(filePath).split(path.sep).pop();
-  return content.replace(/\]\(([^)]+)\.mdx([^)]*)\)/g, (_, slug, anchor) => {
+  return content.replace(/\]\(([^)]+)\.md([^)]*)\)/g, (_, slug, anchor) => {
     const slugParts = slug.split("/");
     const fileName = slugParts[slugParts.length - 1];
     const fileGroup = slugParts[slugParts.length - 2] ?? group;

apps/next/scripts/validate-links.mts

@@ -4,7 +4,6 @@ import matter from "gray-matter";
 import path from "path";
 
 const CONTENT_DIR = path.join(process.cwd(), "src/content/docs");
-const BUILD_DIR = path.join(process.cwd(), ".next");
 
 // Regular expression to find internal links
 // This captures Markdown links [text](/docs/path) and href attributes href="/docs/path"
@@ -14,6 +13,8 @@ const INTERNAL_LINK_REGEX = /(?:(?:\]\(|\bhref=["'])\/docs\/([^")]+))/g;
 // This captures relative links like [text](./path) or ![alt](../images/image.png)
 const RELATIVE_LINK_REGEX = /(?:\]\()(?:\s*)(?:\.\.?)\//g;
 
+const ALLOWED_LINKS = ["/docs/workflows", "/docs/chat-ui"];
+
 interface LinkValidationResult {
   file: string;
   invalidLinks: Array<{ link: string; line: number }>;
@@ -28,14 +29,14 @@ interface RelativeLinkResult {
  * Get all valid documentation routes from the content directory
  */
 async function getValidRoutes(): Promise<Set<string>> {
-  const mdxFiles = await glob("**/*.mdx", { cwd: CONTENT_DIR });
+  const mdxFiles = await glob("**/*.{md,mdx}", { cwd: CONTENT_DIR });
 
   const routes = new Set<string>();
 
   // Add each MDX file as a valid route
   for (const file of mdxFiles) {
     // Remove .mdx extension and normalize to route format
-    let route = file.replace(/\.mdx$/, "");
+    let route = file.replace(/\.mdx?$/, "");
 
     // Handle index files
     if (route.endsWith("/index")) {
@@ -124,9 +125,6 @@ function findRelativeLinksInFile(
   return relativeLinks;
 }
 
-/**
- * Validate internal links in all MDX files
- */
 /**
  * Find relative links in all MDX files
  */
@@ -160,6 +158,11 @@ async function validateLinks(): Promise<LinkValidationResult[]> {
     const links = extractLinksFromFile(filePath);
 
     const invalidLinks = links.filter(({ link }) => {
+      // Check if the link is in the allowed list
+      if (ALLOWED_LINKS.includes(`/docs/${link}`)) {
+        return false;
+      }
+
       // Check if the link exists in valid routes
       // First normalize the link (remove any query string or hash)
       const baseLink = link.split("?")[0].split("#")[0];

apps/next/source.config.ts

@@ -1,13 +1,27 @@
-import { rehypeCodeDefaultOptions } from "fumadocs-core/mdx-plugins";
+import {
+  rehypeCodeDefaultOptions,
+  remarkStructure,
+} from "fumadocs-core/mdx-plugins";
 import { fileGenerator, remarkDocGen, remarkInstall } from "fumadocs-docgen";
 import { defineConfig, defineDocs } from "fumadocs-mdx/config";
 import { transformerTwoslash } from "fumadocs-twoslash";
-import { createFileSystemTypesCache } from "fumadocs-twoslash/cache-fs";
 import rehypeKatex from "rehype-katex";
 import remarkMath from "remark-math";
 
 export const docs = defineDocs({
-  dir: "./src/content/docs",
+  dir: [
+    "./src/content/docs",
+    "./node_modules/@llamaindex/workflow-docs",
+    "./node_modules/@llamaindex/chat-ui-docs",
+    // NOTE: When adding external docs (like chat-ui or workflow-docs above),
+    // make sure to also update:
+    // 1. scripts/validate-links.mts - add to ALLOWED_LINKS array
+    // 2. next.config.mjs - add redirect for .mdx files
+    // 3. src/content/docs/meta.json - add to pages array
+  ],
+  docs: {
+    async: true,
+  },
 });
 
 export default defineConfig({
@@ -21,11 +35,7 @@ export default defineConfig({
       },
       transformers: [
         ...(rehypeCodeDefaultOptions.transformers ?? []),
-        transformerTwoslash({
-          typesCache: createFileSystemTypesCache({
-            dir: ".next/cache/twoslash",
-          }),
-        }),
+        transformerTwoslash(),
         {
           name: "transformers:remove-notation-escape",
           code(hast) {
@@ -46,6 +56,7 @@ export default defineConfig({
       ],
     },
     remarkPlugins: [
+      remarkStructure,
       remarkMath,
       [remarkInstall, { persist: { id: "package-manager" } }],
       [remarkDocGen, { generators: [fileGenerator()] }],

apps/next/src/app/(home)/page.tsx

@@ -10,16 +10,55 @@ import { MagicMove } from "@/components/magic-move";
 import { NpmInstall } from "@/components/npm-install";
 import { Supports } from "@/components/supports";
 import { Button } from "@/components/ui/button";
-import { Skeleton } from "@/components/ui/skeleton";
-import { LEGACY_DOCUMENT_URL } from "@/lib/const";
+import { DOCUMENT_URL } from "@/libs/const";
 import { SiStackblitz } from "@icons-pack/react-simple-icons";
-import {
-  CodeBlock as FumaCodeBlock,
-  Pre,
-} from "fumadocs-ui/components/codeblock";
 import { Blocks, Bot, Footprints, Terminal } from "lucide-react";
 import Link from "next/link";
-import { Suspense } from "react";
+
+const codes = [
+  `import { openai } from "@llamaindex/openai";
+
+const llm = openai();
+const response = await llm.complete({ prompt: "How are you?" });`,
+  `import { openai } from "@llamaindex/openai";
+
+const llm = openai();
+const response = await llm.chat({
+  messages: [{ content: "Tell me a joke.", role: "user" }],
+});`,
+  `import { agent } from "@llamaindex/workflow";
+import { openai } from "@llamaindex/openai";
+
+const analyseAgent = agent({
+  llm: openai({ model: "gpt-4o" }),
+  tools: [analyseTools],
+  systemPrompt,
+});
+const response = await analyseAgent.run(\`Analyse the given data:
+\${data}\`);`,
+  `import { agent, multiAgent } from "@llamaindex/workflow";
+import { openai } from "@llamaindex/openai";
+
+const analyseAgent = agent({
+  name: "AnalyseAgent",
+  llm: openai({ model: "gpt-4o" }),
+  tools: [analyseTools],
+});
+const reporterAgent = agent({
+  name: "ReporterAgent",
+  llm: openai({ model: "gpt-4o" }),
+  tools: [reporterTools],
+  canHandoffTo: [analyseAgent],
+});
+
+const agents = multiAgent({
+  agents: [analyseAgent, reporterAgent],
+  rootAgent: reporterAgent,
+});
+
+const response = await agents.run(\`Analyse the given data:
+\${data}\`);`,
+];
 
 export default function HomePage() {
   return (
@@ -39,7 +78,7 @@ export default function HomePage() {
       </div>
 
       <div className="flex flex-wrap justify-center gap-4">
-        <Link href={LEGACY_DOCUMENT_URL}>
+        <Link href={DOCUMENT_URL}>
           <Button variant="outline">Get Started</Button>
         </Link>
         <NpmInstall />
@@ -62,65 +101,10 @@ export default function HomePage() {
           heading="From the simplest to the most complex"
           description="LlamaIndex.TS is designed to be simple to get started, but powerful enough to build complex, agentic AI applications using multi-agents."
         >
-          <Suspense
-            fallback={
-              <FumaCodeBlock allowCopy={false}>
-                <Pre>
-                  <div className="space-y-2">
-                    <Skeleton className="h-4 w-[250px]" />
-                    <Skeleton className="h-4 w-[200px]" />
-                  </div>
-                </Pre>
-              </FumaCodeBlock>
-            }
-          >
-            <MagicMove
-              code={[
-                `import { openai } from "@llamaindex/openai";
-
-const llm = openai();
-const response = await llm.complete({ prompt: "How are you?" });`,
-                `import { openai } from "@llamaindex/openai";
-
-const llm = openai();
-const response = await llm.chat({
-  messages: [{ content: "Tell me a joke.", role: "user" }],
-});`,
-                `import { agent } from "llamaindex";
-import { openai } from "@llamaindex/openai";
-
-const analyseAgent = agent({
-  llm: openai({ model: "gpt-4o" }),
-  tools: [analyseTools],
-  systemPrompt,
-});
-const response = await analyseAgent.run(\`Analyse the given data:
-\${data}\`);`,
-                `import { agent, multiAgent } from "llamaindex";
-import { openai } from "@llamaindex/openai";
-
-const analyseAgent = agent({
-  name: "AnalyseAgent",
-  llm: openai({ model: "gpt-4o" }),
-  tools: [analyseTools],
-});
-const reporterAgent = agent({
-  name: "ReporterAgent",
-  llm: openai({ model: "gpt-4o" }),
-  tools: [reporterTools],
-  canHandoffTo: [analyseAgent],
-});
-
-const agents = multiAgent({
-  agents: [analyseAgent, reporterAgent],
-  rootAgent: reporterAgent,
-});
-
-const response = await agents.run(\`Analyse the given data:
-\${data}\`);`,
-              ]}
-            />
-          </Suspense>
+          <MagicMove
+            placeholder={<CodeBlock lang="ts" code={codes[0]} />}
+            code={codes}
+          />
         </Feature>
         <Feature
           icon={Bot}
@@ -129,8 +113,10 @@ const response = await agents.run(\`Analyse the given data:
           description="Truly powerful retrieval-augmented generation applications use agentic techniques, and LlamaIndex.TS makes it easy to build them."
         >
           <CodeBlock
-            code={`import { agent, SimpleDirectoryReader, VectorStoreIndex } from "llamaindex";
+            code={`import { VectorStoreIndex } from "llamaindex";
+import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
 import { openai } from "@llamaindex/openai";
+import { agent } from "@llamaindex/workflow";
 
 // load documents from current directoy into an index
 const reader = new SimpleDirectoryReader();

apps/next/src/app/api/chat/route.ts

@@ -1,4 +1,4 @@
-import { MockLLM } from "@llamaindex/core/utils";
+import { MockLLM } from "@llamaindex/core/llms/mock";
 import { LlamaIndexAdapter, type Message } from "ai";
 import { Settings, SimpleChatEngine, type ChatMessage } from "llamaindex";
 import { NextResponse, type NextRequest } from "next/server";

apps/next/src/app/api/search/route.ts

@@ -1,4 +1,12 @@
-import { source } from "@/lib/source";
+import { source } from "@/libs/source";
+import { structure } from "fumadocs-core/mdx-plugins";
 import { createFromSource } from "fumadocs-core/search/server";
 
-export const { GET } = createFromSource(source);
+// TODO: migrate to another search service, I don't think Vercel can handle that many of documents.
+export const { GET } = createFromSource(source, (page) => ({
+  id: page.file.path,
+  title: page.data.title,
+  description: page.data.description,
+  url: page.url,
+  structuredData: structure(page.data.content),
+}));

apps/next/src/app/docs/[[...slug]]/page.tsx

@@ -1,7 +1,13 @@
-import { createMetadata, metadataImage } from "@/lib/metadata";
-import { openapi, source } from "@/lib/source";
+import * as demos from "@/components/demo/lazy";
+import { createMetadata, metadataImage } from "@/libs/metadata";
+import { openapi, source } from "@/libs/source";
+import * as Icons from "@icons-pack/react-simple-icons";
+import { APIPage } from "fumadocs-openapi/ui";
 import { Popup, PopupContent, PopupTrigger } from "fumadocs-twoslash/ui";
-import { createTypeTable } from "fumadocs-typescript/ui";
+import { createGenerator } from "fumadocs-typescript";
+import { AutoTypeTable } from "fumadocs-typescript/ui";
+import { Accordion, Accordions } from "fumadocs-ui/components/accordion";
+import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import defaultMdxComponents from "fumadocs-ui/mdx";
 import {
   DocsBody,
@@ -11,6 +17,8 @@ import {
 } from "fumadocs-ui/page";
 import { notFound } from "next/navigation";
 
+const generator = createGenerator();
+
 export const revalidate = false;
 
 export default async function Page(props: {
@@ -20,17 +28,17 @@ export default async function Page(props: {
   const page = source.getPage(params.slug);
   if (!page) notFound();
 
-  const { AutoTypeTable } = createTypeTable();
-  const MDX = page.data.body;
+  const { body: MDX, toc, lastModified } = await page.data.load();
 
   return (
     <DocsPage
-      toc={page.data.toc}
+      toc={toc}
       full={page.data.full}
-      lastUpdate={page.data.lastModified}
+      lastUpdate={lastModified}
       editOnGithub={{
         owner: "run-llama",
         repo: "LlamaIndexTS",
+        sha: "main",
         path: `apps/next/src/content/docs/${page.file.path}`,
       }}
     >
@@ -39,12 +47,20 @@ export default async function Page(props: {
       <DocsBody>
         <MDX
           components={{
+            ...Icons,
             ...defaultMdxComponents,
-            APIPage: openapi.APIPage,
+            ...demos,
+            Accordion,
+            Accordions,
+            APIPage: (props) => <APIPage {...openapi.getAPIPageProps(props)} />,
+            Tab,
+            Tabs,
             Popup,
             PopupContent,
             PopupTrigger,
-            AutoTypeTable,
+            AutoTypeTable: (props) => (
+              <AutoTypeTable generator={generator} {...props} />
+            ),
           }}
         />
       </DocsBody>

apps/next/src/app/docs/layout.tsx

@@ -1,11 +1,7 @@
 import { baseOptions } from "@/app/layout.config";
-import { AITrigger } from "@/components/ai-chat";
-import { buttonVariants } from "@/components/ui/button";
-import { source } from "@/lib/source";
-import { cn } from "@/lib/utils";
+import { source } from "@/libs/source";
 import "fumadocs-twoslash/twoslash.css";
 import { DocsLayout } from "fumadocs-ui/layouts/docs";
-import { MessageCircle } from "lucide-react";
 import type { ReactNode } from "react";
 
 export default function Layout({ children }: { children: ReactNode }) {
@@ -13,23 +9,9 @@ export default function Layout({ children }: { children: ReactNode }) {
     <DocsLayout
       tree={source.pageTree}
       {...baseOptions}
+      links={[]}
       nav={{
         ...baseOptions.nav,
-        children: (
-          <AITrigger
-            className={cn(
-              buttonVariants({
-                variant: "secondary",
-                size: "xs",
-                className:
-                  "text-fd-muted-foreground ms-2 gap-1.5 rounded-full px-2 md:flex-1",
-              }),
-            )}
-          >
-            <MessageCircle className="size-3" />
-            Ask LlamaCloud
-          </AITrigger>
-        ),
       }}
     >
       {children}

apps/next/src/app/global.css

@@ -1,7 +1,7 @@
 @import "tailwindcss";
 @import "fumadocs-ui/css/neutral.css";
 @import "fumadocs-ui/css/preset.css";
-@import "../../node_modules/fumadocs-twoslash/dist/twoslash.css";
+@import "../../node_modules/fumadocs-twoslash/styles/twoslash.css";
 @plugin "tailwindcss-animate";
 @source '../../node_modules/fumadocs-ui/dist/**/*.js';
 @source "../../node_modules/fumadocs-openapi/dist/**/*.js",

apps/next/src/app/layout.config.tsx

@@ -1,4 +1,4 @@
-import { LEGACY_DOCUMENT_URL } from "@/lib/const";
+import { DOCUMENT_URL } from "@/libs/const";
 import type { BaseLayoutProps } from "fumadocs-ui/layouts/shared";
 import Image from "next/image";
 
@@ -27,9 +27,19 @@ export const baseOptions: BaseLayoutProps = {
   githubUrl: "https://github.com/run-llama/LlamaIndexTS",
   links: [
     {
-      text: "Docs",
-      url: LEGACY_DOCUMENT_URL,
+      text: "TypeScript",
+      url: DOCUMENT_URL,
       active: "nested-url",
     },
+    {
+      text: "Python",
+      url: "https://docs.llamaindex.ai",
+      active: "url",
+    },
+    {
+      text: "LlamaCloud",
+      url: "https://docs.cloud.llamaindex.ai/",
+      active: "url",
+    },
   ],
 };

apps/next/src/app/layout.tsx

@@ -1,5 +1,6 @@
 import { AIProvider } from "@/actions";
 import { TooltipProvider } from "@/components/ui/tooltip";
+import { GoogleAnalytics, GoogleTagManager } from "@next/third-parties/google";
 import { RootProvider } from "fumadocs-ui/provider";
 import { Inter } from "next/font/google";
 import type { ReactNode } from "react";
@@ -31,7 +32,11 @@ export default function Layout({ children }: { children: ReactNode }) {
           sizes="16x16"
           href="/favicon-16x16.png"
         />
+        <title>
+          LlamaIndex.TS - Build LLM-powered document agents and workflows
+        </title>
       </head>
+      <GoogleTagManager gtmId="GTM-WWRFB36R" />
       <body className="flex min-h-screen flex-col">
         <TooltipProvider>
           <AIProvider>
@@ -39,6 +44,7 @@ export default function Layout({ children }: { children: ReactNode }) {
           </AIProvider>
         </TooltipProvider>
       </body>
+      <GoogleAnalytics gaId="G-NB9B8LW9W5" />
     </html>
   );
 }

apps/next/src/app/llms.txt/route.ts

@@ -13,11 +13,7 @@ import remarkStringify from "remark-stringify";
 export const revalidate = false;
 
 export async function GET() {
-  const files = await fg([
-    "./src/content/docs/**/*.mdx",
-    // remove generated openapi files
-    "!./src/content/docs/cloud/api/**/*",
-  ]);
+  const files = await fg(["./src/content/docs/**/*.mdx"]);
 
   const scan = files.map(async (file) => {
     const fileContent = await fs.readFile(file);

apps/next/src/app/og/[...slug]/route.tsx

@@ -1,5 +1,5 @@
 import { generateOGImage } from "@/app/og/[...slug]/og";
-import { metadataImage } from "@/lib/metadata";
+import { metadataImage } from "@/libs/metadata";
 import { type ImageResponse } from "next/og";
 import { readFileSync } from "node:fs";
 

apps/next/src/components/contribution.tsx

@@ -1,6 +1,6 @@
 import ContributorCounter from "@/components/contributor-count";
 import { buttonVariants } from "@/components/ui/button";
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import { Heart } from "lucide-react";
 import { ReactElement } from "react";
 

apps/next/src/components/contributor-count.tsx

@@ -1,5 +1,5 @@
-import { fetchContributors } from "@/lib/get-contributors";
-import { cn } from "@/lib/utils";
+import { fetchContributors } from "@/libs/get-contributors";
+import { cn } from "@/libs/utils";
 import Image from "next/image";
 import type { HTMLAttributes, ReactElement } from "react";
 

apps/next/src/components/create-app-animation.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import { TerminalIcon } from "lucide-react";
 import {
   Fragment,

apps/next/src/components/demo/chat/api/demo.tsx

@@ -1,21 +0,0 @@
-"use client";
-import {
-  ChatHandler,
-  ChatInput,
-  ChatMessages,
-  ChatSection,
-} from "@llamaindex/chat-ui";
-import { useChat } from "ai/react";
-
-export const ChatDemo = () => {
-  const handler = useChat();
-  return (
-    <ChatSection handler={handler as ChatHandler}>
-      <ChatMessages>
-        <ChatMessages.List className="h-auto max-h-[400px]" />
-        <ChatMessages.Actions />
-      </ChatMessages>
-      <ChatInput />
-    </ChatSection>
-  );
-};

apps/next/src/components/demo/chat/rsc/ai-action.tsx

@@ -1,57 +0,0 @@
-import { Markdown } from "@llamaindex/chat-ui/widgets";
-import { MockLLM } from "@llamaindex/core/utils";
-import { generateId, Message } from "ai";
-import { createAI, createStreamableUI, getMutableAIState } from "ai/rsc";
-import { type ChatMessage, Settings, SimpleChatEngine } from "llamaindex";
-import { ReactNode } from "react";
-
-type ServerState = Message[];
-type FrontendState = Array<Message & { display: ReactNode }>;
-type Actions = {
-  chat: (message: Message) => Promise<Message & { display: ReactNode }>;
-};
-
-Settings.llm = new MockLLM(); // config your LLM here
-
-export const AI = createAI<ServerState, FrontendState, Actions>({
-  initialAIState: [],
-  initialUIState: [],
-  actions: {
-    chat: async (message: Message) => {
-      "use server";
-
-      const aiState = getMutableAIState<typeof AI>();
-      aiState.update((prev) => [...prev, message]);
-
-      const uiStream = createStreamableUI();
-      const chatEngine = new SimpleChatEngine();
-      const assistantMessage: Message = {
-        id: generateId(),
-        role: "assistant",
-        content: "",
-      };
-
-      // run the async function without blocking
-      (async () => {
-        const chatResponse = await chatEngine.chat({
-          stream: true,
-          message: message.content,
-          chatHistory: aiState.get() as ChatMessage[],
-        });
-
-        for await (const chunk of chatResponse) {
-          assistantMessage.content += chunk.delta;
-          uiStream.update(<Markdown content={assistantMessage.content} />);
-        }
-
-        aiState.done([...aiState.get(), assistantMessage]);
-        uiStream.done();
-      })();
-
-      return {
-        ...assistantMessage,
-        display: uiStream.value,
-      };
-    },
-  },
-});

apps/next/src/components/demo/chat/rsc/chat-section.tsx

@@ -1,35 +0,0 @@
-"use client";
-
-import {
-  ChatHandler,
-  ChatInput,
-  ChatMessage,
-  ChatMessages,
-  ChatSection as ChatSectionUI,
-  Message,
-} from "@llamaindex/chat-ui";
-import { useChatRSC } from "./use-chat-rsc";
-
-export const ChatSectionRSC = () => {
-  const handler = useChatRSC();
-  return (
-    <ChatSectionUI handler={handler as ChatHandler}>
-      <ChatMessages>
-        <ChatMessages.List className="h-auto max-h-[400px]">
-          {handler.messages.map((message, index) => (
-            <ChatMessage
-              key={index}
-              message={message as Message}
-              isLast={index === handler.messages.length - 1}
-            >
-              <ChatMessage.Avatar />
-              <ChatMessage.Content>{message.display}</ChatMessage.Content>
-            </ChatMessage>
-          ))}
-          <ChatMessages.Loading />
-        </ChatMessages.List>
-      </ChatMessages>
-      <ChatInput />
-    </ChatSectionUI>
-  );
-};

apps/next/src/components/demo/chat/rsc/demo.tsx

@@ -1,8 +0,0 @@
-import { AI } from "./ai-action";
-import { ChatSectionRSC } from "./chat-section";
-
-export const ChatDemoRSC = () => (
-  <AI>
-    <ChatSectionRSC />
-  </AI>
-);

apps/next/src/components/demo/chat/rsc/use-chat-rsc.tsx

@@ -1,41 +0,0 @@
-"use client";
-
-import { useActions } from "ai/rsc";
-
-import { generateId, Message } from "ai";
-import { useUIState } from "ai/rsc";
-import { useState } from "react";
-import { AI } from "./ai-action";
-
-export function useChatRSC() {
-  const [input, setInput] = useState<string>("");
-  const [isLoading, setIsLoading] = useState<boolean>(false);
-  const [messages, setMessages] = useUIState<typeof AI>();
-  const { chat } = useActions<typeof AI>();
-
-  const append = async (message: Omit<Message, "id">) => {
-    const newMsg: Message = { ...message, id: generateId() };
-
-    setIsLoading(true);
-    try {
-      setMessages((prev) => [...prev, { ...newMsg, display: message.content }]);
-      const assistantMsg = await chat(newMsg);
-      setMessages((prev) => [...prev, assistantMsg]);
-    } catch (error) {
-      console.error(error);
-    }
-    setIsLoading(false);
-    setInput("");
-
-    return message.content;
-  };
-
-  return {
-    input,
-    setInput,
-    isLoading,
-    messages,
-    setMessages,
-    append,
-  };
-}

apps/next/src/components/demo/code-node-parser.tsx

@@ -1,24 +1,26 @@
 "use client";
-import { createContextState } from "foxact/context-state";
-import { useIsClient } from "foxact/use-is-client";
-import { useShiki } from "fumadocs-core/utils/use-shiki";
-import { CodeBlock, Pre } from "fumadocs-ui/components/codeblock";
-import { lazy, Suspense, use, useMemo } from "react";
-import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
-import Parser from "web-tree-sitter";
-
 import { Label } from "@/components/ui/label";
 import { Skeleton } from "@/components/ui/skeleton";
 import { Slider } from "@/components/ui/slider";
 import { CodeSplitter } from "@llamaindex/node-parser/code";
+import { Editor } from "@monaco-editor/react";
+import { createContextState } from "foxact/context-state";
+import { useIsClient } from "foxact/use-is-client";
+import { useShiki } from "fumadocs-core/highlight/client";
+import { CodeBlock, Pre } from "fumadocs-ui/components/codeblock";
+import { Suspense, use, useMemo } from "react";
+import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
 
 let promise: Promise<CodeSplitter>;
 if (typeof window !== "undefined") {
-  promise = Parser.init({
-    locateFile(scriptName: string) {
-      return "/" + scriptName;
-    },
-  }).then(async () => {
+  async function run() {
+    const { default: Parser } = await import("web-tree-sitter");
+    await Parser.init({
+      locateFile(scriptName: string) {
+        return "/" + scriptName;
+      },
+    });
+
     const parser = new Parser();
     const Lang = await Parser.Language.load("/tree-sitter-typescript.wasm");
     parser.setLanguage(Lang);
@@ -26,7 +28,9 @@ if (typeof window !== "undefined") {
       getParser: () => parser,
       maxChars: 100,
     });
-  });
+  }
+
+  promise = run();
 }
 
 const [SliderProvider, useSlider, useSetSlider] = createContextState(100);
@@ -48,8 +52,6 @@ const john: Person = {
 
 console.log(greet(john));`);
 
-const Editor = lazy(() => import("react-monaco-editor"));
-
 export const IDE = () => {
   const codeSplitter = use(promise);
   const code = useCode();
@@ -73,21 +75,6 @@ export const IDE = () => {
         />
       </div>
       <Editor
-        editorWillMount={() => {}}
-        editorDidMount={() => {
-          window.MonacoEnvironment!.getWorkerUrl = (
-            _moduleId: string,
-            label: string,
-          ) => {
-            if (label === "json") return "/_next/static/json.worker.js";
-            if (label === "css") return "/_next/static/css.worker.js";
-            if (label === "html") return "/_next/static/html.worker.js";
-            if (label === "typescript" || label === "javascript")
-              return "/_next/static/ts.worker.js";
-            return "/_next/static/editor.worker.js";
-          };
-        }}
-        editorWillUnmount={() => {}}
         options={{
           minimap: {
             enabled: false,
@@ -97,7 +84,9 @@ export const IDE = () => {
         height="100%"
         width="100%"
         language="typescript"
-        onChange={setCode}
+        onChange={(v) => {
+          if (v) setCode(v);
+        }}
         value={code}
       />
     </div>

apps/next/src/components/demo/lazy.ts

@@ -0,0 +1,8 @@
+"use client";
+import dynamic from "next/dynamic";
+
+export const CodeNodeParserDemo = dynamic(() =>
+  import("@/components/demo/code-node-parser").then(
+    (mod) => mod.CodeNodeParserDemo,
+  ),
+);

apps/next/src/components/demo/workflow-streaming-ui.tsx

@@ -1,152 +0,0 @@
-"use client";
-import FlowInput from "@/components/flow-input";
-import { Button } from "@/components/ui/button";
-import {
-  StartEvent,
-  StopEvent,
-  Workflow,
-  WorkflowEvent,
-} from "@llamaindex/workflow";
-import { ReactNode, startTransition, useState } from "react";
-import { StickToBottom, useStickToBottomContext } from "use-stick-to-bottom";
-
-class ComputeEvent extends WorkflowEvent<number> {
-  constructor(data: number) {
-    super(data);
-  }
-}
-
-class ComputeResultEvent extends WorkflowEvent<number> {
-  constructor(data: number) {
-    super(data);
-  }
-}
-
-type ContextData = {
-  sum: number;
-};
-
-const workflow = new Workflow<ContextData, number, number>();
-
-const max = 1000;
-const min = 100;
-
-workflow.addStep(
-  {
-    inputs: [StartEvent<number>],
-    outputs: [StopEvent<number>],
-  },
-  async (context, event) => {
-    const total = event.data;
-    for (let i = 0; i < total; i++) {
-      context.sendEvent(new ComputeEvent(i));
-    }
-    console.log("waiting");
-    const computeResults = await Promise.all(
-      Array.from({ length: total }).map(() =>
-        context.requireEvent(ComputeResultEvent),
-      ),
-    );
-    context.data.sum = computeResults.reduce(
-      (acc, result) => acc + result.data,
-      0,
-    );
-    console.log("stop");
-    return new StopEvent(context.data.sum);
-  },
-);
-
-workflow.addStep(
-  {
-    inputs: [ComputeEvent],
-    outputs: [ComputeResultEvent],
-  },
-  async (context, event) => {
-    await new Promise((resolve) =>
-      setTimeout(resolve, Math.floor(Math.random() * (max - min + 1) + min)),
-    );
-    return new ComputeResultEvent(event.data);
-  },
-);
-
-function ScrollToBottom() {
-  const { isAtBottom, scrollToBottom } = useStickToBottomContext();
-
-  return (
-    !isAtBottom && (
-      <button
-        className="i-ph-arrow-circle-down-fill absolute bottom-0 left-[50%] translate-x-[-50%] rounded-lg text-4xl"
-        onClick={() => scrollToBottom()}
-      />
-    )
-  );
-}
-
-export function WorkflowStreamingDemo() {
-  const [ui, setUI] = useState<ReactNode[]>([
-    <div key={0} className="bg-gray-100 dark:bg-gray-800">
-      Waiting for workflow to start
-    </div>,
-  ]);
-  const [total, setTotal] = useState<number>(10);
-
-  return (
-    <div className="flex w-full flex-col items-start gap-2">
-      <div className="flex flex-row items-center justify-center">
-        <div className="mr-2 text-lg">Compute total</div>{" "}
-        <FlowInput value={total} onChange={(value) => setTotal(value)} />
-      </div>
-      <Button
-        onClick={async () => {
-          startTransition(() => {
-            setUI([]);
-          });
-          const context = workflow.run(total, {
-            sum: 0,
-          });
-          let i = 0;
-          for await (const event of context) {
-            console.log(event);
-            if (event instanceof ComputeEvent) {
-              setUI((ui) => [
-                ...ui,
-                <div key={i++} className="bg-yellow-100 dark:bg-yellow-800">
-                  Computing task id: {event.data}
-                </div>,
-              ]);
-            } else if (event instanceof ComputeResultEvent) {
-              setUI((ui) => [
-                ...ui,
-                <div key={i++} className="bg-green-100 dark:bg-green-800">
-                  Computed task id: {event.data}
-                </div>,
-              ]);
-            } else if (event instanceof StartEvent) {
-              setUI((ui) => [
-                ...ui,
-                <div key={i++} className="bg-blue-100 dark:bg-blue-800">
-                  Started workflow with total {event.data}
-                </div>,
-              ]);
-            } else if (event instanceof StopEvent) {
-              setUI((ui) => [
-                ...ui,
-                <div key={i++} className="bg-red-100 dark:bg-red-800">
-                  Workflow stopped
-                </div>,
-              ]);
-            }
-          }
-        }}
-      >
-        Start Workflow
-      </Button>
-      <StickToBottom className="flex max-h-96 w-full flex-col gap-2 overflow-y-auto rounded-lg border border-gray-200 p-2">
-        <StickToBottom.Content className="flex flex-col gap-2">
-          {ui}
-        </StickToBottom.Content>
-        <ScrollToBottom />
-      </StickToBottom>
-    </div>
-  );
-}

apps/next/src/components/feature.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import { LucideIcon } from "lucide-react";
 import { HTMLAttributes, ReactElement, ReactNode } from "react";
 

apps/next/src/components/magic-move.tsx

@@ -1,25 +1,27 @@
 "use client";
 import { Button } from "@/components/ui/button";
-import { cn } from "@/lib/utils";
-import { CodeBlock, Pre } from "fumadocs-ui/components/codeblock";
+import { cn } from "@/libs/utils";
+import { CodeBlock } from "fumadocs-ui/components/codeblock";
 import { RotateCcw } from "lucide-react";
 import { useTheme } from "next-themes";
-import { use, useCallback, useEffect, useState } from "react";
-import { getSingletonHighlighter } from "shiki";
+import { type ReactNode, use, useCallback, useEffect, useState } from "react";
+import { createJavaScriptRegexEngine, getSingletonHighlighter } from "shiki";
 import { ShikiMagicMove } from "shiki-magic-move/react";
-import { createOnigurumaEngine } from "shiki/engine/oniguruma";
 
+const engine = createJavaScriptRegexEngine();
 const highlighterPromise = getSingletonHighlighter({
-  engine: createOnigurumaEngine(() => import("shiki/wasm")),
+  engine,
   themes: ["vesper", "github-light"],
   langs: ["js", "ts", "tsx"],
 });
 
 export type MagicMoveProps = {
   code: string[];
+  placeholder: ReactNode;
 };
 
 export function MagicMove(props: MagicMoveProps) {
+  const [mounted, setMounted] = useState(false);
   const [move, setMove] = useState<number>(0);
   const currentCode = props.code[move];
   const highlighter = use(highlighterPromise);
@@ -38,24 +40,27 @@ export function MagicMove(props: MagicMoveProps) {
     }
   }, [animate, move, props.code]);
 
+  useEffect(() => {
+    setMounted(true);
+  }, []);
+
+  if (!mounted) return props.placeholder;
+
   return (
     <CodeBlock allowCopy={false}>
-      {highlighter && (
-        <Pre>
-          <ShikiMagicMove
-            lang="ts"
-            theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
-            highlighter={highlighter}
-            code={currentCode}
-            options={{
-              duration: 800,
-              stagger: 0.3,
-              lineNumbers: false,
-              containerStyle: false,
-            }}
-          />
-        </Pre>
-      )}
+      <ShikiMagicMove
+        className="shiki !block p-4 *:!inline"
+        lang="ts"
+        theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
+        highlighter={highlighter}
+        code={currentCode}
+        options={{
+          duration: 800,
+          stagger: 0.3,
+          lineNumbers: false,
+          containerStyle: false,
+        }}
+      />
       <Button
         className={cn(
           "absolute bottom-2 right-2",

apps/next/src/components/message.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import Image from "next/image";
 import { ReactNode } from "react";
 import { IconAI, IconUser } from "./ui/icons";

apps/next/src/components/reactbits/rotating-text.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import {
   AnimatePresence,
   motion,

apps/next/src/components/ui/alert.tsx

@@ -1,7 +1,7 @@
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const alertVariants = cva(
   "relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",

apps/next/src/components/ui/badge.tsx

@@ -1,7 +1,7 @@
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const badgeVariants = cva(
   "inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",

apps/next/src/components/ui/button.tsx

@@ -2,7 +2,7 @@ import { Slot } from "@radix-ui/react-slot";
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const buttonVariants = cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",

apps/next/src/components/ui/dialog.tsx

@@ -4,7 +4,7 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { Cross2Icon } from "@radix-ui/react-icons";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const Dialog = DialogPrimitive.Root;
 

apps/next/src/components/ui/icons.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 export function IconAI({ className, ...props }: React.ComponentProps<"svg">) {
   return (

apps/next/src/components/ui/infinite-slider.tsx

@@ -1,5 +1,5 @@
 "use client";
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 import { animate, motion, useMotionValue } from "framer-motion";
 import { useEffect, useState } from "react";
 import useMeasure from "react-use-measure";

apps/next/src/components/ui/input.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
 

apps/next/src/components/ui/label.tsx

@@ -4,7 +4,7 @@ import * as LabelPrimitive from "@radix-ui/react-label";
 import { cva, type VariantProps } from "class-variance-authority";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const labelVariants = cva(
   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",

apps/next/src/components/ui/skeleton.tsx

@@ -1,4 +1,4 @@
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 function Skeleton({
   className,

apps/next/src/components/ui/slider.tsx

@@ -3,7 +3,7 @@
 import * as SliderPrimitive from "@radix-ui/react-slider";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const Slider = React.forwardRef<
   React.ElementRef<typeof SliderPrimitive.Root>,

apps/next/src/components/ui/textarea.tsx

@@ -1,6 +1,6 @@
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
 

apps/next/src/components/ui/tooltip.tsx

@@ -3,7 +3,7 @@
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import * as React from "react";
 
-import { cn } from "@/lib/utils";
+import { cn } from "@/libs/utils";
 
 const TooltipProvider = TooltipPrimitive.Provider;
 

apps/next/src/content/docs/cloud/index.mdx

@@ -1,8 +0,0 @@
----
-title: LlamaCloud
-description: LlamaCloud is a new generation of managed parsing, ingestion, and retrieval services, designed to bring production-grade context-augmentation to your LLM and RAG applications.
----
-
-This is TypeScript binding for LlamaCloud API. It provides a simple way to interact with LlamaCloud API.
-
-If you are looking for the official documentation, please visit the [Official Document](https://docs.cloud.llamaindex.ai/)

apps/next/src/content/docs/cloud/meta.json

@@ -1,6 +0,0 @@
-{
-  "title": "LlamaCloud",
-  "description": "The Cloud framework for LLM",
-  "root": true,
-  "pages": ["---Guide---", "index", "..."]
-}

apps/next/src/content/docs/llamaindex/getting_started/concepts.mdx

@@ -0,0 +1,60 @@
+---
+title: High-Level Concepts
+---
+
+This is a quick guide to the high-level concepts you'll encounter frequently when building LLM applications.
+
+## Large Language Models (LLMs)
+
+LLMs are the fundamental innovation that launched LlamaIndex. They are an artificial intelligence (AI) computer system that can understand, generate, and manipulate natural language, including answering questions based on their training data or data provided to them at query time. 
+
+## Agentic Applications
+
+When an LLM is used within an application, it is often used to make decisions, take actions, and/or interact with the world. This is the core definition of an **agentic application**.
+
+While the definition of an agentic application is broad, there are several key characteristics that define an agentic application:
+
+- **LLM Augmentation**: The LLM is augmented with tools (i.e. arbitrary callable functions in code), memory, and/or dynamic prompts.
+- **Prompt Chaining**: Several LLM calls are used that build on each other, with the output of one LLM call being used as the input to the next.
+- **Routing**: The LLM is used to route the application to the next appropriate step or state in the application.
+- **Parallelism**: The application can perform multiple steps or actions in parallel.
+- **Orchestration**: A hierarchical structure of LLMs is used to orchestrate lower-level actions and LLMs.
+- **Reflection**: The LLM is used to reflect and validate outputs of previous steps or LLM calls, which can be used to guide the application to the next appropriate step or state.
+
+In LlamaIndex, you can build agentic applications by using the workflows to orchestrate a sequence of steps and LLMs. You can [learn more about workflows](/docs/llamaindex/tutorials/workflows).
+
+## Agents
+
+We define an agent as a specific instance of an "agentic application". An agent is a piece of software that semi-autonomously performs tasks by combining LLMs with other tools and memory, orchestrated in a reasoning loop that decides which tool to use next (if any).
+
+What this means in practice, is something like:
+- An agent receives a user message
+- The agent uses an LLM to determine the next appropriate action to take using the previous chat history, tools, and the latest user message
+- The agent may invoke one or more tools to assist in the users request
+- If tools are used, the agent will then interpret the tool outputs and use them to inform the next action
+- Once the agent stops taking actions, it returns the final output to the user
+
+You can [learn more about agents](/docs/llamaindex/tutorials/basic_agent).
+
+## Retrieval Augmented Generation (RAG)
+
+Retrieval-Augmented Generation (RAG) is a core technique for building data-backed LLM applications with LlamaIndex. It allows LLMs to answer questions about your private data by providing it to the LLM at query time, rather than training the LLM on your data. To avoid sending **all** of your data to the LLM every time, RAG indexes your data and selectively sends only the relevant parts along with your query. You can [learn more about RAG](/docs/llamaindex/tutorials/rag).
+
+## Use cases
+
+There are endless use cases for data-backed LLM applications but they can be roughly grouped into four categories:
+
+[**Agents**](/docs/llamaindex/tutorials/basic_agent):
+An agent is an automated decision-maker powered by an LLM that interacts with the world via a set of [tools](/docs/llamaindex/modules/agents/tool). Agents can take an arbitrary number of steps to complete a given task, dynamically deciding on the best course of action rather than following pre-determined steps. This gives it additional flexibility to tackle more complex tasks.
+
+[**Workflows**](/docs/llamaindex/tutorials/workflows):
+A Workflow in LlamaIndex is a specific event-driven abstraction that allows you to orchestrate a sequence of steps and LLMs calls. Workflows can be used to implement any agentic application, and are a core component of LlamaIndex.
+
+[**Structured Data Extraction**](/docs/llamaindex/tutorials/structured_data_extraction):
+Pydantic extractors allow you to specify a precise data structure to extract from your data and use LLMs to fill in the missing pieces in a type-safe way. This is useful for extracting structured data from unstructured sources like PDFs, websites, and more, and is key to automating workflows.
+
+[**Query Engines**](/docs/llamaindex/modules/rag/query_engines):
+A query engine is an end-to-end flow that allows you to ask questions over your data. It takes in a natural language query, and returns a response, along with reference context retrieved and passed to the LLM.
+
+[**Chat Engines**](/docs/llamaindex/modules/rag/chat_engine):
+A chat engine is an end-to-end flow for having a conversation with your data (multiple back-and-forth instead of a single question-and-answer).

apps/next/src/content/docs/llamaindex/getting_started/create_llama.mdx

@@ -18,4 +18,9 @@ npm run dev
 
 to start the development server. You can then visit [http://localhost:3000](http://localhost:3000) to see your app, which should look something like this:
 
-![create-llama interface](./images/create_llama.png)
+![create-llama interface](/images/create_llama.png)
+
+## Learn more
+
+- [Learn more about `create-llama`](https://github.com/run-llama/create-llama)
+- [Want to use the same UI components? You can use our React components](https://ui.llamaindex.ai/)

apps/next/src/content/docs/llamaindex/getting_started/examples.mdx

@@ -11,13 +11,14 @@ It may be useful to check out all the examples at once so you can try them out l
 ```bash npm2yarn
 npx degit run-llama/LlamaIndexTS/examples my-new-project
 cd my-new-project
-npm install
+npm i
 ```
 
 Then you can run any example in the folder with `tsx`, e.g.:
 
 ```bash npm2yarn
-npx tsx ./vectorIndex.ts
+export OPENAI_API_KEY=your-api-key
+npx tsx ./agents/agent/openai.ts
 ```
 
 ## Try examples online

apps/next/src/content/docs/llamaindex/getting_started/frameworks/cloudflare.mdx

@@ -1,77 +0,0 @@
----
-title: With Cloudflare Worker
-description: In this guide, you'll learn how to use LlamaIndex with CloudFlare Worker
----
-
-import {
-  SiNodedotjs,
-  SiDeno,
-  SiBun,
-  SiCloudflareworkers,
-} from "@icons-pack/react-simple-icons";
-
-Before you start, make sure you have try LlamaIndex.TS in Node.js to make sure you understand the basics.
-
-<Card
-  title="Getting Started with LlamaIndex.TS in Node.js"
-  href="/docs/llamaindex/getting_started/frameworks/node"
-/>
-
-Also, you need have the basic understanding of <a href='https://developers.cloudflare.com/workers/'><SiCloudflareworkers className="inline mr-2" color="#F38020" />Cloudflare Worker</a>.
-
-## Adding environment variables
-
-```ts
-export default {
-  async fetch(request: Request, env: Env): Promise<Response> {
-    const { setEnvs } = await import("@llamaindex/env");
-    setEnvs(env);
-    const { OpenAIAgent } = await import("@llamaindex/openai");
-    // Start your code here
-    return new Response("Hello, world!");
-  },
-};
-```
-
-Then, you need create `.dev.vars` and add LLM api keys for the local development, such as `OPENAI_API_KEY` for OpenAI API key.
-
-<Callout type="warn">Do not commit the api key to git repository.</Callout>
-
-## Integrating with Hono
-
-```ts
-import { Hono } from "hono";
-
-type Bindings = {
-  OPENAI_API_KEY: string;
-};
-
-const app = new Hono<{
-  Bindings: Bindings;
-}>();
-
-app.post("/llm", async (c) => {
-  const { setEnvs } = await import("@llamaindex/env");
-  setEnvs(c.env);
-
-  // ...
-
-  return new Response('Hello, world!');
-})
-
-export default {
-  fetch: app.fetch,
-};
-```
-
-## Difference between Node.js and Cloudflare Worker
-
-In Cloudflare Worker and similar serverless JS environment, you need to be aware of the following differences:
-
-- Some Node.js modules are not available in Cloudflare Worker, such as `node:fs`, `node:child_process`, `node:cluster`...
-- You are recommend to design your code using network request, such as use `fetch` API to communicate with database, insteadof a long-running process in Node.js.
-- Some of LlamaIndex.TS packages are not available in Cloudflare Worker, for example `@llamaindex/readers` and `@llamaindex/huggingface`.
-- The main `llamaindex` is designed to work in all JavaScript environment, including Cloudflare Worker. If you find any issue, please report to us.
-- `@llamaindex/env` is a JS environment binding module, which polyfill some Node.js/Modern Web API (for example, we have a memory based `fs` module, and Crypto API polyfill). It is designed to work in all JavaScript environment, including Cloudflare Worker.
-
-

apps/next/src/content/docs/llamaindex/getting_started/frameworks/index.mdx

@@ -1,42 +0,0 @@
----
-title: Frameworks
-description: We support multiple JS runtime and frameworks, bundlers.
----
-import {
-	SiNodedotjs,
-	SiTypescript,
-	SiNextdotjs,
-	SiCloudflareworkers,
-	SiVite
-} from "@icons-pack/react-simple-icons";
-
-<Cards>
-	<Card title={
-		<>
-			<SiNodedotjs className="inline" color="#5FA04E" /> Node.js
-		</>
-	} href="/docs/llamaindex/getting_started/frameworks/node" />
-	<Card title={
-		<>
-			<SiTypescript className="inline" color="#3178C6" /> TypeScript
-		</>
-	} href="/docs/llamaindex/getting_started/frameworks/typescript" />
-	<Card title={
-		<>
-			<SiVite className='inline' color='#646CFF' /> Vite
-		</>
-	} href="/docs/llamaindex/getting_started/frameworks/vite" />
-	<Card
-		title={
-			<>
-				<SiNextdotjs className='inline' /> Next.js (React Server Component)
-			</>
-		}
-		href="/docs/llamaindex/getting_started/frameworks/next"
-	/>
-	<Card title={
-		<>
-			<SiCloudflareworkers className='inline' color='#F38020' /> Cloudflare Workers
-		</>
-	} href="/docs/llamaindex/getting_started/frameworks/cloudflare" />
-</Cards>

apps/next/src/content/docs/llamaindex/getting_started/frameworks/meta.json

@@ -1,6 +0,0 @@
-{
-  "title": "Framework",
-  "description": "The setup guide",
-  "defaultOpen": true,
-  "pages": ["node", "typescript", "next", "vite", "cloudflare"]
-}

apps/next/src/content/docs/llamaindex/getting_started/frameworks/next.mdx

@@ -1,41 +0,0 @@
----
-title: With Next.js
-description: In this guide, you'll learn how to use LlamaIndex with Next.js.
----
-
-Before you start, make sure you have try LlamaIndex.TS in Node.js to make sure you understand the basics.
-
-<Card
-  title="Getting Started with LlamaIndex.TS in Node.js"
-  href="/docs/llamaindex/getting_started/frameworks/node"
-/>
-
-## Differences between Node.js and Next.js
-
-Next.js is a React framework that has both server side compatibility and client side compatibility.
-This means that you need to be careful when using LlamaIndex.TS in Next.js.
-Don't leak the import data like API keys to the client side.
-
-Also, in Next.js, there is build time and runtime. Some computations can be done at build time like Document embedding could be done at build time for better performance.
-LlamaIndex.TS has lots of upstream dependencies, some of them are not compatible with Next.js.
-
-You might need to use `withNext` to make sure that LlamaIndex.TS works well with Next.js.
-
-```js
-// next.config.mjs / next.config.ts
-import withLlamaIndex from "llamaindex/next";
-
-/** @type {import('next').NextConfig} */
-const nextConfig = {};
-
-export default withLlamaIndex(nextConfig);
-```
-
-If you see any dependency issues, you are welcome to open an issue on the GitHub.
-
-## Edge Runtime
-
-[Vercel Edge Runtime](https://edge-runtime.vercel.app/) is a subset of Node.js APIs. Similar to [Cloudflare Workers](/docs/llamaindex/getting_started/frameworks/cloudflare#difference-between-nodejs-and-cloudflare-worker),
-it is a serverless platform that runs your code on the edge.
-
-Not all features of Node.js are supported in Vercel Edge Runtime, so does LlamaIndex.TS, we are working on more compatibility with all JavaScript runtimes.

apps/next/src/content/docs/llamaindex/getting_started/frameworks/node.mdx

@@ -1,52 +0,0 @@
----
-title: With Node.js/Bun/Deno
-description: In this guide, you'll learn how to use LlamaIndex with Node.js, Bun, and Deno.
----
-
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-## Adding environment variables
-
-By default, LlamaIndex uses OpenAI provider, which requires an API key. You can set the `OPENAI_API_KEY` environment variable to authenticate with OpenAI.
-
-```shell
-export OPENAI_API_KEY=your-api-key
-```
-
-Or you can use a `.env` file:
-
-```shell
-echo "OPENAI_API_KEY=your-api-key" > .env
-node --env-file .env your-script.js
-```
-
-<Callout type="warn">Do not commit the api key to git repository.</Callout>
-
-For more information, see the [How to read environment variables from Node.js](https://nodejs.org/en/learn/command-line/how-to-read-environment-variables-from-nodejs).
-
-## Performance Optimization
-
-By the default, we are using `js-tiktoken` for tokenization. You can install `gpt-tokenizer` which is then automatically used by LlamaIndex to get a 60x speedup for tokenization:
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install gpt-tokenizer
-	```
-
-	```shell tab="yarn"
-	yarn add gpt-tokenizer
-	```
-
-	```shell tab="pnpm"
-	pnpm add gpt-tokenizer
-	```
-</Tabs>
-
-**Note**: This only works for Node.js
-
-## TypeScript support
-
-<Card
-	title="Getting Started with LlamaIndex.TS in TypeScript"
-	href="/docs/llamaindex/getting_started/frameworks/typescript"
-/>

apps/next/src/content/docs/llamaindex/getting_started/frameworks/typescript.mdx

@@ -1,149 +0,0 @@
----
-title: With TypeScript
-description: In this guide, you'll learn how to use LlamaIndex with TypeScript
----
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
-LlamaIndex.TS is written in TypeScript and designed to be used in TypeScript projects.
-
-We do lots of work on strong typing to make sure you have a great typing experience with LlamaIndex.TS.
-
-```ts twoslash
-import { PromptTemplate } from 'llamaindex'
-const promptTemplate = new PromptTemplate({
-  template: `Context information from multiple sources is below.
----------------------
-{context}
----------------------
-Given the information from multiple sources and not prior knowledge.
-Answer the query in the style of a Shakespeare play"
-Query: {query}
-Answer:`,
-	templateVars: ["context", "query"],
-});
-// @noErrors
-promptTemplate.format({
-	c
-//^|
-})
-```
-
-```ts twoslash
-import { FunctionTool } from 'llamaindex'
-import { z } from 'zod'
-
-// ---cut-before---
-const inputSchema = z.object({
-	time: z.string(),
-	city: z.string(),
-})
-
-type Input = z.infer<typeof inputSchema>
-
-FunctionTool.from<Input>((input) => {
-// @noErrors
-	input.t
-//      ^|
-}, {
-	name: 'getWeather',
-	description: 'Get the weather information',
-	parameters: inputSchema,
-})
-```
-
-## Enable TypeScript
-
-
-```json5
-{
-  compilerOptions: {
-    // ⬇️ add this line to your tsconfig.json
-    moduleResolution: "bundler", // or "node16"
-  },
-}
-```
-
-<Accordions>
-	<Accordion
-		title="Why modify tsconfig.json"
-	>
-
-We are shipping both ESM and CJS module, and compatible with Vercel Edge, Cloudflare Workers, and other serverless platforms.
-
-So we are using [conditional exports](https://nodejs.org/api/packages.html#conditional-exports) to support all environments.
-
-This is a kind of modern way of shipping packages, but might cause TypeScript type check to fail because of legacy module resolution.
-
-Imaging you put output file into `/dist/openai.js` but you are importing `llamaindex/openai` in your code, and set `package.json` like this:
-
-```json5
-{
-	"exports": {
-		"./openai": "./dist/openai.js"
-	}
-}
-```
-
-In old module resolution, TypeScript will not be able to find the module because it is not following the file structure, even you run `node index.js` successfully. (on Node.js >=16)
-
-See more about [moduleResolution](https://www.typescriptlang.org/docs/handbook/modules/theory.html#module-resolution) or
-[TypeScript 5.0 blog](https://devblogs.microsoft.com/typescript/announcing-typescript-5-0/#--moduleresolution-bundler7).
-
-
-	</Accordion>
-</Accordions>
-
-## Enable AsyncIterable for `Web Stream` API
-
-Some modules uses `Web Stream` API like `ReadableStream` and `WritableStream`, you need to enable `DOM.AsyncIterable` in your `tsconfig.json`.
-
-```json5
-{
-  compilerOptions: {
-    // ⬇️ add this lib to your tsconfig.json
-    lib: ["DOM.AsyncIterable"],
-  },
-}
-```
-
-```typescript
-import { agent, tool } from 'llamaindex'
-import { openai } from "@llamaindex/openai";
-
-Settings.llm = openai({
-  model: "gpt-4o-mini",
-});
-
-const addTool = tool({
-  name: "add", 
-  description: "Adds two numbers",
-  parameters: z.object({x: z.number(), y: z.number()}),
-  execute: ({ x, y }) => x + y,
-});
-
-const myAgent = agent({
-  tools: [addTool],
-});
-
-// Chat with the agent
-const context = myAgent.run("Hello, how are you?");
-
-for await (const event of context) {
-  if (event instanceof AgentStream) {
-    for (const chunk of event.data.delta) {
-      process.stdout.write(chunk); // stream response
-    }
-  } else {
-    console.log(event); // other events
-  }
-}
-
-```
-
-## Run TypeScript Script in Node.js
-
-We recommend to use [tsx](https://www.npmjs.com/package/tsx) to run TypeScript script in Node.js.
-
-```shell
-node --import tsx ./my-script.ts
-```

apps/next/src/content/docs/llamaindex/getting_started/frameworks/vite.mdx

@@ -1,23 +0,0 @@
----
-title: With Vite
-description: In this guide, you'll learn how to use LlamaIndex with Vite
----
-
-Before you start, make sure you have try LlamaIndex.TS in Node.js to make sure you understand the basics.
-
-<Card
-  title="Getting Started with LlamaIndex.TS in Node.js"
-  href="/docs/llamaindex/getting_started/frameworks/node"
-/>
-
-Also, make sure you have a basic understanding of [Vite](https://vitejs.dev/).
-
-## Why mention Vite?
-
-Vite.js is widely used in building many web applications, like React.js, even for some native app like [Electron](https://www.electronjs.org/).
-
-However, it's not a ready-to-use solution for a Node.js-like application using Vite, as Vite is designed for web applications(run in browser).
-
-There's some plugin/framework based on Vite, like [Waku.gg](https://github.com/dai-shi/waku), or [Electron Vite](https://electron-vite.org/)
-
-For now, we have no clear solution for bundling LlamaIndex.TS with Vite, if you have any idea/solution, please let us know.

apps/next/src/content/docs/llamaindex/getting_started/index.mdx

@@ -1,56 +0,0 @@
----
-title: Installation
-description: How to install llamaindex packages.
----
-
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-To install llamaindex, run the following command:
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex
-	```
-</Tabs>
-
-In most cases, you'll also need an LLM package to use LlamaIndex. For example, to use the OpenAI LLM, you would install the following:
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install @llamaindex/openai
-	```
-
-	```shell tab="yarn"
-	yarn add @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add @llamaindex/openai
-	```
-</Tabs>
-
-Go to [LLM APIs](/docs/llamaindex/modules/llms) to find out how to use other LLMs.
-
-
-## What's next?
-
-<Cards>
-	<Card
-		title="Learn LlamaIndex.TS"
-		description="Learn how to use LlamaIndex.TS by starting with one of our tutorials."
-		href="/docs/llamaindex/tutorials/rag"
-	/>
-	<Card
-		title="Show me code examples"
-		description="Explore code examples using LlamaIndex.TS."
-		href="/docs/llamaindex/getting_started/examples"
-	/>
-</Cards>

apps/next/src/content/docs/llamaindex/getting_started/installation/index.mdx

@@ -0,0 +1,177 @@
+---
+title: Installation
+description: How to install and set up LlamaIndex.TS for your project.
+---
+
+## Quick Start
+
+Install the core package:
+
+```package-install
+npm i llamaindex
+```
+
+In most cases, you'll also need an LLM provider and the Workflow package:
+
+```package-install
+npm i @llamaindex/openai @llamaindex/workflow
+```
+
+## Environment Setup
+
+### API Keys
+
+Most LLM providers require API keys. Set your OpenAI key (or other provider):
+
+```bash
+export OPENAI_API_KEY=your-api-key
+```
+
+Or use a `.env` file:
+
+```bash
+echo "OPENAI_API_KEY=your-api-key" > .env
+```
+
+<Callout type="warn">Never commit API keys to your repository.</Callout>
+
+### Loading Environment Variables
+
+For Node.js applications:
+
+```bash
+node --env-file .env your-script.js
+```
+
+For other environments, see the deployment-specific guides below.
+
+## TypeScript Configuration
+
+LlamaIndex.TS is built with TypeScript and provides excellent type safety. Add these settings to your `tsconfig.json`:
+
+```json5
+{
+  "compilerOptions": {
+    // Essential for module resolution
+    "moduleResolution": "bundler", // or "nodenext" | "node16" | "node"
+    
+    // Required for Web Stream API support
+    "lib": ["DOM.AsyncIterable"],
+    
+    // Recommended for better compatibility
+    "target": "es2020",
+    "module": "esnext"
+  }
+}
+```
+
+## Running your first agent
+
+### Set up
+
+If you don't already have a project, you can create a new one in a new folder:
+
+```package-install
+npm init
+npm i -D typescript @types/node
+npm i @llamaindex/openai @llamaindex/workflow llamaindex zod
+```
+
+### Run the agent
+
+Create the file `example.ts`. This code will:
+
+- Create two tools for use by the agent:
+  - A `sumNumbers` tool that adds two numbers
+  - A `divideNumbers` tool that divides numbers
+- Give an example of the data structure we wish to generate
+- Prompt the LLM with instructions and the example, plus a sample transcript
+
+<include cwd>../../examples/agents/agent/openai.ts</include>
+
+To run the code:
+
+```package-install
+npx tsx example.ts
+```
+
+You should expect output something like:
+
+```
+{
+  result: '5 + 5 is 10. Then, 10 divided by 2 is 5.',
+  state: {
+    memory: Memory {
+      messages: [Array],
+      tokenLimit: 30000,
+      shortTermTokenLimitRatio: 0.7,
+      memoryBlocks: [],
+      memoryCursor: 0,
+      adapters: [Object]
+    },
+    scratchpad: [],
+    currentAgentName: 'Agent',
+    agents: [ 'Agent' ],
+    nextAgentName: null
+  }
+}
+Done
+```
+
+## Performance Optimization
+
+### Tokenization Speed
+
+Install `gpt-tokenizer` for 60x faster tokenization (Node.js environments only):
+
+```package-install
+npm i gpt-tokenizer
+```
+
+LlamaIndex will automatically use this when available.
+
+## Deployment Guides
+
+Choose your deployment target:
+
+<Cards>
+  <Card 
+    title="Server APIs & Backends" 
+    description="Express, Fastify, Koa, standalone Node.js servers"
+    href="/docs/llamaindex/getting_started/installation/server-apis" 
+  />
+  <Card 
+    title="Serverless Functions" 
+    description="Vercel, Netlify, AWS Lambda, Cloudflare Workers"
+    href="/docs/llamaindex/getting_started/installation/serverless" 
+  />
+  <Card 
+    title="Next.js Applications" 
+    description="API routes, server components, edge runtime"
+    href="/docs/llamaindex/getting_started/installation/nextjs" 
+  />
+  <Card 
+    title="Troubleshooting" 
+    description="Common issues, bundle optimization, compatibility"
+    href="/docs/llamaindex/getting_started/installation/troubleshooting" 
+  />
+</Cards>
+
+## LLM/Embedding Providers
+
+Go to [LLM APIs](/docs/llamaindex/modules/models/llms) and [Embedding APIs](/docs/llamaindex/modules/models/embeddings) to find out how to use different LLM and embedding providers beyond OpenAI.
+
+## What's Next?
+
+<Cards>
+  <Card
+    title="Learn LlamaIndex.TS"
+    description="Learn how to use LlamaIndex.TS by starting with one of our tutorials."
+    href="/docs/llamaindex/tutorials/basic_agent"
+  />
+  <Card
+    title="Show me code examples"
+    description="Explore code examples using LlamaIndex.TS."
+    href="/docs/llamaindex/getting_started/examples"
+  />
+</Cards>

apps/next/src/content/docs/llamaindex/getting_started/installation/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "Installation",
+  "pages": ["server-apis", "serverless", "nextjs", "troubleshooting"]
+}

apps/next/src/content/docs/llamaindex/getting_started/installation/nextjs.mdx

@@ -0,0 +1,375 @@
+---
+title: Next.js Applications
+description: Deploy LlamaIndex.TS in Next.js applications with API routes, server components, and edge runtime.
+---
+
+This guide covers integrating LlamaIndex.TS agents with Next.js applications.
+
+## Essential Configuration
+
+### Next.js Config
+
+Use `withLlamaIndex` to ensure compatibility:
+
+```javascript
+// next.config.mjs
+import withLlamaIndex from "llamaindex/next";
+
+/** @type {import('next').NextConfig} */
+const nextConfig = {
+  // Your existing config
+};
+
+export default withLlamaIndex(nextConfig);
+```
+
+## API Routes
+
+### App Router (Recommended)
+
+```typescript
+// app/api/chat/route.ts
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+import { NextRequest, NextResponse } from "next/server";
+
+// Initialize agent once (consider using a singleton pattern)
+let myAgent: any = null;
+
+async function initializeAgent() {
+  if (myAgent) return myAgent;
+  
+  try {
+    const greetTool = tool({
+      name: "greet",
+      description: "Greets a user with their name",
+      parameters: z.object({
+        name: z.string(),
+      }),
+      execute: ({ name }) => `Hello, ${name}! How can I help you today?`,
+    });
+
+    myAgent = agent({
+      tools: [greetTool],
+      llm: openai({ model: "gpt-4o-mini" }),
+    });
+    
+    return myAgent;
+  } catch (error) {
+    console.error("Failed to initialize agent:", error);
+    throw error;
+  }
+}
+
+export async function POST(request: NextRequest) {
+  try {
+    const { message } = await request.json();
+    
+    if (!message || typeof message !== 'string') {
+      return NextResponse.json(
+        { error: "Message is required and must be a string" },
+        { status: 400 }
+      );
+    }
+    
+    const agent = await initializeAgent();
+    const result = await agent.run(message);
+    
+    return NextResponse.json({ response: result.result });
+  } catch (error) {
+    console.error("Chat error:", error);
+    return NextResponse.json(
+      { error: "Internal server error" },
+      { status: 500 }
+    );
+  }
+}
+```
+
+### Pages Router (Legacy)
+
+```typescript
+// pages/api/chat.ts
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+import type { NextApiRequest, NextApiResponse } from "next";
+
+let myAgent: any = null;
+
+async function initializeAgent() {
+  if (myAgent) return myAgent;
+  
+  const timeTool = tool({
+    name: "getCurrentTime",
+    description: "Gets the current time",
+    parameters: z.object({}),
+    execute: () => new Date().toISOString(),
+  });
+
+  myAgent = agent({
+    tools: [timeTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+  
+  return myAgent;
+}
+
+export default async function handler(
+  req: NextApiRequest,
+  res: NextApiResponse
+) {
+  if (req.method !== "POST") {
+    return res.status(405).json({ error: "Method not allowed" });
+  }
+  
+  try {
+    const { message } = req.body;
+    
+    const agent = await initializeAgent();
+    const result = await agent.run(message);
+    
+    res.json({ response: result.result });
+  } catch (error) {
+    console.error("Chat error:", error);
+    res.status(500).json({ error: "Internal server error" });
+  }
+}
+```
+
+## Server Components
+
+Initialize agents in server components:
+
+```typescript
+// app/chat/page.tsx
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+
+async function initializeAgent() {
+  const helpTool = tool({
+    name: "getHelp",
+    description: "Provides help information",
+    parameters: z.object({
+      topic: z.string().optional(),
+    }),
+    execute: ({ topic }) => {
+      if (topic) {
+        return `Here's help for ${topic}: This is a helpful resource about ${topic}.`;
+      }
+      return "Available topics: general, troubleshooting, api, deployment";
+    },
+  });
+
+  return agent({
+    tools: [helpTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+}
+
+export default async function ChatPage() {
+  const chatAgent = await initializeAgent();
+  
+  return (
+    <div>
+      <h1>Chat Interface</h1>
+      <p>Agent initialized and ready to help!</p>
+      {/* Your chat UI components */}
+    </div>
+  );
+}
+```
+
+## Edge Runtime
+
+The Edge Runtime has limited Node.js API access:
+
+```typescript
+// app/api/chat-edge/route.ts
+import { NextRequest, NextResponse } from "next/server";
+
+export const runtime = "edge";
+
+export async function POST(request: NextRequest) {
+  const { setEnvs } = await import("@llamaindex/env");
+  setEnvs(process.env);
+  
+  try {
+    const { message } = await request.json();
+    
+    const { agent } = await import("@llamaindex/workflow");
+    const { tool } = await import("llamaindex");
+    const { openai } = await import("@llamaindex/openai");
+    const { z } = await import("zod");
+
+    const timeTool = tool({
+      name: "time",
+      description: "Gets current time",
+      parameters: z.object({}),
+      execute: () => new Date().toISOString(),
+    });
+
+    const myAgent = agent({
+      tools: [timeTool],
+      llm: openai({ model: "gpt-4o-mini" }),
+    });
+
+    const result = await myAgent.run(message);
+    return NextResponse.json({ response: result.result });
+  } catch (error) {
+    return NextResponse.json({ error: error.message }, { status: 500 });
+  }
+}
+```
+
+## Streaming Responses
+
+Implement streaming for better user experience:
+
+```typescript
+// app/api/chat-stream/route.ts
+import { agentStreamEvent } from "@llamaindex/workflow";
+import { NextRequest } from "next/server";
+
+// Assume myAgent is initialized elsewhere
+declare const myAgent: any;
+
+export async function POST(request: NextRequest) {
+  const { message } = await request.json();
+  
+  const stream = new ReadableStream({
+    async start(controller) {
+      try {
+        const context = myAgent.runStream(message);
+        
+        for await (const event of context) {
+          if (agentStreamEvent.include(event)) {
+            controller.enqueue(new TextEncoder().encode(event.data.delta));
+          }
+        }
+        
+        controller.close();
+      } catch (error) {
+        controller.error(error);
+      }
+    },
+  });
+  
+  return new Response(stream, {
+    headers: {
+      "Content-Type": "text/plain",
+      "Transfer-Encoding": "chunked",
+    },
+  });
+}
+```
+
+## Client-side Integration
+
+### React Hook for API Calls
+
+```typescript
+// hooks/useAgentChat.ts
+import { useState } from "react";
+
+export function useAgentChat() {
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [response, setResponse] = useState<string | null>(null);
+  
+  const chat = async (message: string) => {
+    setLoading(true);
+    setError(null);
+    
+    try {
+      const res = await fetch("/api/chat", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ message }),
+      });
+      
+      if (!res.ok) {
+        throw new Error(`HTTP error! status: ${res.status}`);
+      }
+      
+      const data = await res.json();
+      setResponse(data.response);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "An error occurred");
+    } finally {
+      setLoading(false);
+    }
+  };
+  
+  return { chat, loading, error, response };
+}
+```
+
+### Chat Component
+
+```typescript
+// components/ChatInterface.tsx
+"use client";
+
+import { useState } from "react";
+import { useAgentChat } from "@/hooks/useAgentChat";
+
+export default function ChatInterface() {
+  const [message, setMessage] = useState("");
+  const { chat, loading, error, response } = useAgentChat();
+  
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!message.trim()) return;
+    
+    await chat(message);
+    setMessage("");
+  };
+  
+  return (
+    <div className="max-w-2xl mx-auto p-4">
+      <form onSubmit={handleSubmit} className="mb-4">
+        <input
+          type="text"
+          value={message}
+          onChange={(e) => setMessage(e.target.value)}
+          placeholder="Send a message..."
+          className="w-full p-2 border rounded"
+          disabled={loading}
+        />
+        <button
+          type="submit"
+          disabled={loading || !message.trim()}
+          className="mt-2 px-4 py-2 bg-blue-500 text-white rounded disabled:opacity-50"
+        >
+          {loading ? "Thinking..." : "Send"}
+        </button>
+      </form>
+      
+      {error && (
+        <div className="p-3 mb-4 bg-red-100 border border-red-400 text-red-700 rounded">
+          Error: {error}
+        </div>
+      )}
+      
+      {response && (
+        <div className="p-3 bg-gray-100 border rounded">
+          <strong>Agent:</strong>
+          <p>{response}</p>
+        </div>
+      )}
+    </div>
+  );
+}
+```
+
+## Next Steps
+
+- Learn about [serverless deployment](/docs/llamaindex/getting_started/installation/serverless)
+- Explore [server APIs](/docs/llamaindex/getting_started/installation/server-apis)
+- Check [troubleshooting guide](/docs/llamaindex/getting_started/installation/troubleshooting) for common issues 

apps/next/src/content/docs/llamaindex/getting_started/installation/server-apis.mdx

@@ -0,0 +1,211 @@
+---
+title: Server APIs & Backends
+description: Deploy LlamaIndex.TS in server environments like Express, Fastify, and standalone Node.js applications.
+---
+
+This guide covers adding LlamaIndex.TS agents to traditional server environments where you have full Node.js runtime access.
+
+## Supported Runtimes
+
+LlamaIndex.TS works seamlessly with:
+
+- **Node.js** (v18+)
+- **Bun** (v1.0+)
+- **Deno** (v1.30+)
+
+## Common Server Frameworks
+
+### Express.js
+
+```typescript
+import express from 'express';
+import { agent } from '@llamaindex/workflow';
+import { tool } from 'llamaindex';
+import { openai } from '@llamaindex/openai';
+import { z } from 'zod';
+
+const app = express();
+app.use(express.json());
+
+// Initialize agent once at startup
+let myAgent: any;
+
+async function initializeAgent() {
+  // Create tools for the agent
+  const sumTool = tool({
+    name: "sum",
+    description: "Adds two numbers",
+    parameters: z.object({
+      a: z.number(),
+      b: z.number(),
+    }),
+    execute: ({ a, b }) => a + b,
+  });
+
+  const multiplyTool = tool({
+    name: "multiply",
+    description: "Multiplies two numbers",
+    parameters: z.object({
+      a: z.number(),
+      b: z.number(),
+    }),
+    execute: ({ a, b }) => a * b,
+  });
+
+  // Create the agent
+  myAgent = agent({
+    tools: [sumTool, multiplyTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+}
+
+app.post('/api/chat', async (req, res) => {
+  try {
+    const { message } = req.body;
+    const result = await myAgent.run(message);
+    res.json({ response: result.result });
+  } catch (error) {
+    res.status(500).json({ error: 'Chat failed' });
+  }
+});
+
+// Initialize and start server
+initializeAgent().then(() => {
+  app.listen(3000, () => {
+    console.log('Server running on port 3000');
+  });
+});
+```
+
+### Fastify
+
+```typescript
+import Fastify from 'fastify';
+import { agent } from '@llamaindex/workflow';
+import { tool } from 'llamaindex';
+import { openai } from '@llamaindex/openai';
+import { z } from 'zod';
+
+const fastify = Fastify();
+let myAgent: any;
+
+async function initializeAgent() {
+  const sumTool = tool({
+    name: "sum",
+    description: "Adds two numbers",
+    parameters: z.object({
+      a: z.number(),
+      b: z.number(),
+    }),
+    execute: ({ a, b }) => a + b,
+  });
+
+  myAgent = agent({
+    tools: [sumTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+}
+
+fastify.post('/api/chat', async (request, reply) => {
+  try {
+    const { message } = request.body as { message: string };
+    const result = await myAgent.run(message);
+    return { response: result.result };
+  } catch (error) {
+    reply.status(500).send({ error: 'Chat failed' });
+  }
+});
+
+const start = async () => {
+  await initializeAgent();
+  await fastify.listen({ port: 3000 });
+  console.log('Server running on port 3000');
+};
+
+start();
+```
+
+### Hono
+
+```typescript
+import { Hono } from "hono";
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+
+type Bindings = {
+  OPENAI_API_KEY: string;
+};
+
+const app = new Hono<{ Bindings: Bindings }>();
+
+app.post("/api/chat", async (c) => {
+  const { setEnvs } = await import("@llamaindex/env");
+  setEnvs(c.env);
+  
+  const { message } = await c.req.json();
+  
+  const greetTool = tool({
+    name: "greet",
+    description: "Greets a user",
+    parameters: z.object({
+      name: z.string(),
+    }),
+    execute: ({ name }) => `Hello, ${name}!`,
+  });
+
+  const myAgent = agent({
+    tools: [greetTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+  
+  try {
+    const result = await myAgent.run(message);
+    return c.json({ response: result.result });
+  } catch (error) {
+    return c.json({ error: error.message }, 500);
+  }
+});
+
+export default app;
+```
+
+## Streaming Responses
+
+For real-time agent responses:
+
+```typescript
+import { agentStreamEvent } from "@llamaindex/workflow";
+
+app.post('/api/chat-stream', async (req, res) => {
+  const { message } = req.body;
+  
+  res.writeHead(200, {
+    'Content-Type': 'text/plain',
+    'Transfer-Encoding': 'chunked',
+  });
+  
+  try {
+    const context = myAgent.runStream(message);
+    
+    for await (const event of context) {
+      if (agentStreamEvent.include(event)) {
+        res.write(event.data.delta);
+      }
+    }
+    
+    res.end();
+  } catch (error) {
+    res.write('Error: ' + error.message);
+    res.end();
+  }
+});
+```
+
+
+## Next Steps
+
+- Learn about [serverless deployment](/docs/llamaindex/getting_started/installation/serverless)
+- Explore [Next.js integration](/docs/llamaindex/getting_started/installation/nextjs)
+- Check [troubleshooting guide](/docs/llamaindex/getting_started/installation/troubleshooting) for common issues 

apps/next/src/content/docs/llamaindex/getting_started/installation/serverless.mdx

@@ -0,0 +1,240 @@
+---
+title: Serverless Functions
+description: Deploy LlamaIndex.TS in serverless environments like Vercel, Netlify, AWS Lambda, and Cloudflare Workers.
+---
+
+This guide covers adding LlamaIndex.TS agents to serverless environments where you have execution time and memory constraints.
+
+## Cloudflare Workers
+
+```typescript
+export default {
+  async fetch(request: Request, env: Env): Promise<Response> {
+    const { setEnvs } = await import("@llamaindex/env");
+    setEnvs(env);
+    
+    const { agent } = await import("@llamaindex/workflow");
+    const { openai } = await import("@llamaindex/openai");
+    const { tool } = await import("llamaindex");
+    const { z } = await import("zod");
+
+    const timeTool = tool({
+      name: "getCurrentTime",
+      description: "Gets the current time",
+      parameters: z.object({}),
+      execute: () => new Date().toISOString(),
+    });
+
+    const myAgent = agent({
+      tools: [timeTool],
+      llm: openai({ model: "gpt-4o-mini" }),
+    });
+
+    try {
+      const { message } = await request.json();
+      const result = await myAgent.run(message);
+      
+      return new Response(JSON.stringify({ response: result.result }), {
+        headers: { "Content-Type": "application/json" },
+      });
+    } catch (error) {
+      return new Response(JSON.stringify({ error: error.message }), {
+        status: 500,
+        headers: { "Content-Type": "application/json" },
+      });
+    }
+  },
+};
+```
+
+
+
+## Vercel Functions
+
+### Node.js Runtime
+
+```typescript
+// pages/api/chat.ts or app/api/chat/route.ts
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+
+export default async function handler(req, res) {
+  if (req.method !== 'POST') {
+    return res.status(405).json({ error: 'Method not allowed' });
+  }
+  
+  const { message } = req.body;
+  
+  const weatherTool = tool({
+    name: "getWeather",
+    description: "Get weather information",
+    parameters: z.object({
+      city: z.string(),
+    }),
+    execute: ({ city }) => `Weather in ${city}: 72°F, sunny`,
+  });
+
+  const myAgent = agent({
+    tools: [weatherTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+  
+  try {
+    const result = await myAgent.run(message);
+    res.json({ response: result.result });
+  } catch (error) {
+    res.status(500).json({ error: error.message });
+  }
+}
+```
+
+### Edge Runtime
+
+```typescript
+// app/api/chat/route.ts
+import { NextRequest, NextResponse } from "next/server";
+
+export const runtime = "edge";
+
+export async function POST(request: NextRequest) {
+  const { setEnvs } = await import("@llamaindex/env");
+  setEnvs(process.env);
+  
+  const { message } = await request.json();
+  
+  try {
+    // Use simpler tools for edge runtime
+    const { agent } = await import("@llamaindex/workflow");
+    const { tool } = await import("llamaindex");
+    const { openai } = await import("@llamaindex/openai");
+    const { z } = await import("zod");
+
+    const timeTool = tool({
+      name: "time",
+      description: "Gets current time",
+      parameters: z.object({}),
+      execute: () => new Date().toISOString(),
+    });
+
+    const myAgent = agent({
+      tools: [timeTool],
+      llm: openai({ model: "gpt-4o-mini" }),
+    });
+
+    const result = await myAgent.run(message);
+    return NextResponse.json({ response: result.result });
+  } catch (error) {
+    return NextResponse.json({ error: error.message }, { status: 500 });
+  }
+}
+```
+
+## AWS Lambda
+
+```typescript
+import { APIGatewayProxyHandler } from "aws-lambda";
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+
+export const handler: APIGatewayProxyHandler = async (event, context) => {
+  const { message } = JSON.parse(event.body || "{}");
+  
+  const calculatorTool = tool({
+    name: "calculate",
+    description: "Performs basic math",
+    parameters: z.object({
+      expression: z.string(),
+    }),
+    execute: ({ expression }) => {
+      // Simple calculator implementation
+      try {
+        return `Result: ${eval(expression)}`;
+      } catch {
+        return "Invalid expression";
+      }
+    },
+  });
+
+  const myAgent = agent({
+    tools: [calculatorTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+  
+  try {
+    const result = await myAgent.run(message);
+    
+    return {
+      statusCode: 200,
+      headers: {
+        "Content-Type": "application/json",
+        "Access-Control-Allow-Origin": "*",
+      },
+      body: JSON.stringify({ response: result.result }),
+    };
+  } catch (error) {
+    return {
+      statusCode: 500,
+      body: JSON.stringify({ error: error.message }),
+    };
+  }
+};
+```
+
+## Netlify Functions
+
+```typescript
+// netlify/functions/chat.ts
+import { Handler } from "@netlify/functions";
+import { agent } from "@llamaindex/workflow";
+import { tool } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+import { z } from "zod";
+
+export const handler: Handler = async (event, context) => {
+  if (event.httpMethod !== "POST") {
+    return { statusCode: 405, body: "Method Not Allowed" };
+  }
+  
+  const { message } = JSON.parse(event.body || "{}");
+  
+  const helpTool = tool({
+    name: "help",
+    description: "Provides help information",
+    parameters: z.object({
+      topic: z.string().optional(),
+    }),
+    execute: ({ topic }) => {
+      return topic ? `Help for ${topic}` : "Available help topics";
+    },
+  });
+
+  const myAgent = agent({
+    tools: [helpTool],
+    llm: openai({ model: "gpt-4o-mini" }),
+  });
+  
+  try {
+    const result = await myAgent.run(message);
+    
+    return {
+      statusCode: 200,
+      body: JSON.stringify({ response: result.result }),
+    };
+  } catch (error) {
+    return {
+      statusCode: 500,
+      body: JSON.stringify({ error: error.message }),
+    };
+  }
+};
+```
+
+## Next Steps
+
+- Learn about [Next.js integration](/docs/llamaindex/getting_started/installation/nextjs)
+- Explore [server deployment](/docs/llamaindex/getting_started/installation/server-apis)
+- Check [troubleshooting guide](/docs/llamaindex/getting_started/installation/troubleshooting) for common issues 

apps/next/src/content/docs/llamaindex/getting_started/installation/troubleshooting.mdx

@@ -0,0 +1,501 @@
+---
+title: Troubleshooting
+description: Common issues and solutions when installing and deploying LlamaIndex.TS applications.
+---
+
+This guide addresses common issues you might encounter when installing and deploying LlamaIndex.TS applications across different environments.
+
+## Installation Issues
+
+### Module Resolution Errors
+
+**Problem:** Import errors or module not found errors
+
+**Solution:** Ensure your `tsconfig.json` is properly configured:
+
+```json5
+{
+  "compilerOptions": {
+    "moduleResolution": "bundler", // or "nodenext" | "node16" | "node"
+    "lib": ["DOM.AsyncIterable"],
+    "target": "es2020",
+    "module": "esnext"
+  }
+}
+```
+
+**Alternative solution:** Try different module resolution strategies:
+
+```bash
+# Clear node_modules and reinstall
+rm -rf node_modules package-lock.json
+npm install
+
+# Or try with different package manager
+pnpm install
+# or
+yarn install
+```
+
+### TypeScript Errors
+
+**Problem:** TypeScript compilation errors with LlamaIndex imports
+
+**Solution:** Ensure you have the correct TypeScript configuration:
+
+```json5
+{
+  "compilerOptions": {
+    "strict": true,
+    "skipLibCheck": true, // Skip type checking of node_modules
+    "allowSyntheticDefaultImports": true,
+    "esModuleInterop": true
+  }
+}
+```
+
+### Package Compatibility Issues
+
+**Problem:** Some packages don't work in certain environments
+
+**Common incompatibilities:**
+- `@llamaindex/readers` - May not work in serverless environments
+- `@llamaindex/huggingface` - Limited browser/edge compatibility
+- File system readers - Don't work in browser/edge environments
+
+**Solution:** Use environment-specific alternatives:
+
+```typescript
+// Instead of file system readers in serverless
+// Use remote data sources
+async function loadDocumentsFromAPI() {
+  const response = await fetch('https://api.example.com/documents');
+  const data = await response.json();
+  return data.map(doc => new Document(doc.content));
+}
+```
+
+## Runtime Issues
+
+### Memory Errors
+
+**Problem:** Out of memory errors during index creation or querying
+
+**Solution:** Optimize memory usage:
+
+```typescript
+// Batch process large document sets
+async function batchProcessDocuments(documents: Document[], batchSize = 10) {
+  const results = [];
+  
+  for (let i = 0; i < documents.length; i += batchSize) {
+    const batch = documents.slice(i, i + batchSize);
+    const batchIndex = await VectorStoreIndex.fromDocuments(batch);
+    results.push(batchIndex);
+    
+    // Optional: Add delay between batches
+    await new Promise(resolve => setTimeout(resolve, 100));
+  }
+  
+  return results;
+}
+```
+
+**For serverless environments:**
+
+```typescript
+// Use external vector stores instead of in-memory
+// TODO: Example with Pinecone, Weaviate, etc.
+// const vectorStore = new PineconeVectorStore(/* config */);
+// const index = await VectorStoreIndex.fromVectorStore(vectorStore);
+```
+
+### API Rate Limiting
+
+**Problem:** Rate limiting errors from LLM providers
+
+**Solution:** Implement retry logic with exponential backoff:
+
+```typescript
+async function queryWithRetry(queryEngine: any, question: string, maxRetries = 3) {
+  for (let i = 0; i < maxRetries; i++) {
+    try {
+      return await queryEngine.query(question);
+    } catch (error) {
+      if (error.message.includes('rate limit') && i < maxRetries - 1) {
+        const delay = Math.pow(2, i) * 1000; // Exponential backoff
+        await new Promise(resolve => setTimeout(resolve, delay));
+        continue;
+      }
+      throw error;
+    }
+  }
+}
+```
+
+### Tokenization Performance
+
+**Problem:** Slow tokenization affecting performance
+
+**Solution:** Install faster tokenizer (Node.js only):
+
+```bash
+npm install gpt-tokenizer
+```
+
+LlamaIndex will automatically use this for 60x faster tokenization.
+
+## Bundling Issues
+
+### Bundle Size Too Large
+
+**Problem:** Large bundle sizes affecting performance
+
+**Solution:** Use dynamic imports and code splitting:
+
+```typescript
+// Lazy load LlamaIndex components
+const initializeLlamaIndex = async () => {
+  const { VectorStoreIndex, SimpleDirectoryReader } = await import("llamaindex");
+  return { VectorStoreIndex, SimpleDirectoryReader };
+};
+
+// In your API route
+export async function POST(request: NextRequest) {
+  const { VectorStoreIndex, SimpleDirectoryReader } = await initializeLlamaIndex();
+  // Use the imported modules
+}
+```
+
+### Webpack/Vite Bundling Issues
+
+**Problem:** Bundler compatibility issues
+
+**Solution for Next.js:**
+
+```javascript
+// next.config.mjs
+import withLlamaIndex from "llamaindex/next";
+
+const nextConfig = {
+  webpack: (config, { isServer }) => {
+    // Custom webpack configuration if needed
+    if (!isServer) {
+      config.resolve.fallback = {
+        ...config.resolve.fallback,
+        fs: false,
+        net: false,
+        tls: false,
+      };
+    }
+    return config;
+  },
+};
+
+export default withLlamaIndex(nextConfig);
+```
+
+**Solution for Vite:**
+
+```typescript
+// vite.config.ts
+import { defineConfig } from 'vite';
+
+export default defineConfig({
+  define: {
+    global: 'globalThis',
+  },
+  resolve: {
+    alias: {
+      // Add aliases for problematic modules
+    },
+  },
+  optimizeDeps: {
+    include: ['llamaindex'],
+  },
+});
+```
+
+## Environment-Specific Issues
+
+### Node.js Version Compatibility
+
+**Problem:** Node.js version compatibility issues
+
+**Solution:** Use supported Node.js versions:
+
+```json
+{
+  "engines": {
+    "node": ">=18.0.0"
+  }
+}
+```
+
+**Check your Node.js version:**
+
+```bash
+node --version
+```
+
+### Cloudflare Workers Issues
+
+**Problem:** Module not available in Cloudflare Workers
+
+**Solution:** Use `@llamaindex/env` for environment compatibility:
+
+```typescript
+export default {
+  async fetch(request: Request, env: Env): Promise<Response> {
+    const { setEnvs } = await import("@llamaindex/env");
+    setEnvs(env);
+    
+    // Your LlamaIndex code here
+  },
+};
+```
+
+### Vercel Edge Runtime Issues
+
+**Problem:** Limited Node.js API access in Edge Runtime
+
+**Solution:** Use standard runtime or adapt code:
+
+```typescript
+// Force standard runtime
+export const runtime = "nodejs";
+
+// Or adapt for edge
+export const runtime = "edge";
+
+export async function POST(request: NextRequest) {
+  // Use edge-compatible code only
+  const { setEnvs } = await import("@llamaindex/env");
+  setEnvs(process.env);
+  
+  // Avoid file system operations
+  // Use remote data sources
+}
+```
+
+## Performance Issues
+
+### Slow Query Responses
+
+**Problem:** Slow query performance
+
+**Solution:** Implement caching and optimization:
+
+```typescript
+import { LRUCache } from 'lru-cache';
+
+const queryCache = new LRUCache<string, string>({
+  max: 100,
+  ttl: 1000 * 60 * 10, // 10 minutes
+});
+
+export async function optimizedQuery(question: string, queryEngine: any) {
+  // Check cache first
+  const cached = queryCache.get(question);
+  if (cached) return cached;
+  
+  // Query and cache result
+  const result = await queryEngine.query(question);
+  queryCache.set(question, result);
+  
+  return result;
+}
+```
+
+### Cold Start Issues
+
+**Problem:** Slow cold starts in serverless environments
+
+**Solution:** Pre-warm your functions:
+
+```typescript
+// Pre-initialize outside handler
+let cachedQueryEngine: any = null;
+
+export async function handler(event: any) {
+  if (!cachedQueryEngine) {
+    cachedQueryEngine = await initializeQueryEngine();
+  }
+  
+  // Use cached engine
+  return await cachedQueryEngine.query(question);
+}
+```
+
+## Environment Variable Issues
+
+### Missing API Keys
+
+**Problem:** API key not found or invalid
+
+**Solution:** Verify environment variable setup:
+
+```typescript
+// Check if API key is available
+if (!process.env.OPENAI_API_KEY) {
+  throw new Error('OPENAI_API_KEY environment variable is required');
+}
+
+// For debugging (remove in production)
+console.log('API Key present:', !!process.env.OPENAI_API_KEY);
+```
+
+### Environment Variable Loading
+
+**Problem:** Environment variables not loading correctly
+
+**Solution:** Use proper loading mechanisms:
+
+```typescript
+// For Node.js
+import 'dotenv/config';
+
+// For Next.js - use .env.local
+// Variables are automatically loaded
+
+// For Cloudflare Workers
+export default {
+  async fetch(request: Request, env: Env): Promise<Response> {
+    // Use env parameter, not process.env
+    const apiKey = env.OPENAI_API_KEY;
+    // ...
+  },
+};
+```
+
+## Common Error Messages
+
+### "Cannot find module 'llamaindex'"
+
+**Cause:** Package not installed or module resolution issue
+
+**Solution:**
+```bash
+npm install llamaindex
+```
+
+### "Module not found: Can't resolve 'fs'"
+
+**Cause:** File system modules used in browser/edge environment
+
+**Solution:**
+```typescript
+// Use dynamic imports with fallbacks
+const loadDocuments = async () => {
+  if (typeof window !== 'undefined') {
+    // Browser environment - use alternative
+    return await loadDocumentsFromAPI();
+  } else {
+    // Node.js environment - use file system
+    const { SimpleDirectoryReader } = await import('llamaindex');
+    return await new SimpleDirectoryReader('data').loadData();
+  }
+};
+```
+
+### "ReferenceError: global is not defined"
+
+**Cause:** Global polyfill missing in browser environments
+
+**Solution:**
+```typescript
+// Add to your app entry point
+if (typeof global === 'undefined') {
+  global = globalThis;
+}
+```
+
+### "Cannot read properties of undefined (reading 'query')"
+
+**Cause:** Query engine not properly initialized
+
+**Solution:**
+```typescript
+// Always check initialization
+if (!queryEngine) {
+  throw new Error('Query engine not initialized');
+}
+
+// Or use optional chaining
+const response = await queryEngine?.query(question);
+```
+
+## Debugging Tips
+
+### Enable Debug Logging
+
+```typescript
+// Enable debug logging
+process.env.DEBUG = "llamaindex:*";
+
+// Or specific modules
+process.env.DEBUG = "llamaindex:vector-store";
+```
+
+### Check Package Versions
+
+```bash
+npm list llamaindex
+npm list @llamaindex/openai
+```
+
+### Test in Isolation
+
+```typescript
+// Create minimal test case
+import { VectorStoreIndex } from 'llamaindex';
+
+async function testBasic() {
+  try {
+    console.log('Testing basic import...');
+    const index = new VectorStoreIndex();
+    console.log('Success!');
+  } catch (error) {
+    console.error('Error:', error);
+  }
+}
+
+testBasic();
+```
+
+## Getting Help
+
+### Before Asking for Help
+
+1. **Check this troubleshooting guide**
+2. **Search existing GitHub issues**
+3. **Try minimal reproduction**
+4. **Check your environment configuration**
+
+### When Reporting Issues
+
+Include:
+- Node.js version (`node --version`)
+- Package versions (`npm list llamaindex`)
+- Environment (Node.js, Cloudflare Workers, Vercel, etc.)
+- Minimal code reproduction
+- Full error message and stack trace
+
+### Useful Resources
+
+- [GitHub Issues](https://github.com/run-llama/LlamaIndexTS/issues)
+- [Discord Community](https://discord.gg/dGcwcsnxhU)
+- [Documentation](https://docs.llamaindex.ai/)
+
+## Next Steps
+
+If you're still experiencing issues:
+
+1. **Check specific deployment guides:**
+   - [Server APIs](/docs/llamaindex/getting_started/installation/server-apis)
+   - [Serverless Functions](/docs/llamaindex/getting_started/installation/serverless)
+   - [Next.js Applications](/docs/llamaindex/getting_started/installation/nextjs)
+
+2. **Open an issue** on GitHub with a minimal reproduction
+
+3. **Join our Discord** for community support 

apps/next/src/content/docs/llamaindex/getting_started/meta.json

@@ -1,4 +1,4 @@
 {
   "title": "Getting Started",
-  "pages": ["index", "create_llama", "examples", "frameworks"]
+  "pages": ["concepts", "installation", "create_llama", "examples"]
 }

apps/next/src/content/docs/llamaindex/index.mdx

@@ -1,28 +1,118 @@
 ---
-title: What is LlamaIndex.TS
-description: LlamaIndex is the leading data framework for building LLM applications
+title: Welcome to LlamaIndex.TS
+description: LlamaIndex.TS is the leading framework for utilizing context engineering to build LLM applications in JavaScript and TypeScript.
 ---
 
-import {
-  SiNodedotjs,
-  SiDeno,
-  SiBun,
-  SiCloudflareworkers,
-} from "@icons-pack/react-simple-icons";
+LlamaIndex.TS is a **framework for utilizing context engineering to build generative AI applications** with large language models. From rapid-prototyping RAG chatbots to deploying multi-agent workflows in production, LlamaIndex gives you everything you need — all in idiomatic TypeScript.
 
-LlamaIndex is a framework for building context-augmented generative AI applications with LLMs including agents and workflows.
+Built for modern JavaScript runtimes like <SiNodedotjs className="inline" color="#5FA04E" /> **Node.js**, <SiDeno className="inline" color="#70FFAF" /> **Deno**, <SiBun className="inline" /> **Bun**, <SiCloudflareworkers className="inline" color="#F38020" /> **Cloudflare Workers**, and more.
 
-The TypeScript implementation is designed for JavaScript server side applications using <SiNodedotjs className="inline" color="#5FA04E" /> Node.js, <SiDeno className="inline" color="#70FFAF" /> Deno, <SiBun className="inline" /> Bun, <SiCloudflareworkers className="inline" color="#F38020" /> Cloudflare Workers, and more.
+<div className="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3 my-6">
+  <a href="#introduction" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline">
+    <h3 className="mb-1 text-lg font-semibold underline">Introduction</h3>
+    <p className="text-sm text-gray-400 no-underline">Context engineering, agents &amp; workflows — what do they mean?</p>
+  </a>
 
-LlamaIndex.TS provides tools for beginners, advanced users, and everyone in between.
+  <a href="#use-cases" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline">
+    <h3 className="mb-1 text-lg font-semibold underline">Use cases</h3>
+    <p className="text-sm text-gray-400 no-underline">See what you can build with LlamaIndex.TS.</p>
+  </a>
 
-Try it out with a starter example using StackBlitz:
+  <a href="#getting-started" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline">
+    <h3 className="mb-1 text-lg font-semibold underline">Getting started</h3>
+    <p className="text-sm text-gray-400 no-underline">Your first app in 5 lines of code.</p>
+  </a>
+
+  <a href="https://docs.cloud.llamaindex.ai/" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline" target="_blank" rel="noopener noreferrer">
+    <h3 className="mb-1 text-lg font-semibold underline">LlamaCloud</h3>
+    <p className="text-sm text-gray-400 no-underline">Managed parsing, extraction &amp; retrieval pipelines.</p>
+  </a>
+
+  <a href="#community" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline">
+    <h3 className="mb-1 text-lg font-semibold underline">Community</h3>
+    <p className="text-sm text-gray-400 no-underline">Join thousands of builders on Discord, Twitter, and more.</p>
+  </a>
+
+  <a href="#related-projects" className="block rounded-lg border border-gray-600/40 p-4 hover:border-gray-400 hover:bg-gray-700/20 no-underline">
+    <h3 className="mb-1 text-lg font-semibold underline">Related projects</h3>
+    <p className="text-sm text-gray-400 no-underline">Connectors, demos &amp; starter kits.</p>
+  </a>
+</div>
+
+## Introduction
+
+### What are agents?
+
+[Agents](/docs/llamaindex/tutorials/agents/1_setup) are LLM-powered assistants that can reason, use external tools, and take actions to accomplish tasks such as research, data extraction, and automation. 
+LlamaIndex.TS provides foundational building blocks for creating and orchestrating these agents.
+
+### What are workflows?
+
+[Workflows](/docs/llamaindex/tutorials/workflows) are multi-step, event-driven processes that combine agents, data connectors, and other tools to solve complex problems. 
+With LlamaIndex.TS you can chain together retrieval, generation, and tool-calling steps and then deploy the entire pipeline as a microservice.
+
+### What is context engineering?
+
+LLMs come pre-trained on vast public corpora, but not on **your** private or domain-specific data. 
+Context engineering bridges that gap by injecting the right pieces of your data into the LLM prompt at the right time. 
+The most popular example is [Retrieval-Augmented Generation (RAG)](/docs/llamaindex/getting_started/concepts), but the same idea powers agent memory, evaluation, extraction, summarisation, and more.
+
+LlamaIndex.TS gives you:
+
+- **Data connectors** to ingest from APIs, files, SQL, and dozens more sources.
+- **Indexes & retrievers** to store and retrieve your data for LLM consumption.
+- **Agents and Engines** to query and use chat+reasoning interfaces over your data.
+- **Workflows** for fine-grained orchestration of your data and LLM-powered agents.
+- **Observability** integrations so you can iterate with confidence.
+
+You can learn more about these concepts in our [concepts guide](/docs/llamaindex/getting_started/concepts).
+
+## Use cases
+
+Popular scenarios include:
+
+- [LLM-Powered Agents](/docs/llamaindex/tutorials/agents/1_setup)
+- [Indexing and Retrieval](/docs/llamaindex/tutorials/rag)
+- [Extracting Structured Data](/docs/llamaindex/tutorials/structured_data_extraction)
+- [Custom Orchestration with Workflows](/docs/llamaindex/tutorials/workflows)
+
+## Getting started
+
+The fastest way to get started is in StackBlitz below — no local setup required:
 
 <iframe
   className="w-full h-[440px]"
   aria-label="LlamaIndex.TS Starter"
-  aria-description="This is a starter example for LlamaIndex.TS, it shows the basic usage of the library."
+  aria-description="Interactive starter for LlamaIndex.TS"
   src="https://stackblitz.com/github/run-llama/LlamaIndexTS/tree/main/examples?embed=1&file=starter.ts"
 />
 
-You'll need an OpenAI API key to run this example. You can retrieve it from [OpenAI](https://platform.openai.com/api-keys).
+Want to learn more? We have several tutorials to get you started:
+
+- [Installation + Runtime Guide](/docs/llamaindex/getting_started/installation)
+- [Create your first agent](/docs/llamaindex/tutorials/agents/1_setup)
+- [Learn how to index data and chat with it](/docs/llamaindex/tutorials/rag)
+- [Learn how to write your own workflows and agents](/docs/llamaindex/tutorials/workflows)
+
+---
+
+## LlamaCloud
+
+Need an end-to-end managed pipeline? Check out **[LlamaCloud](https://cloud.llamaindex.ai/)**: best-in-class document parsing (LlamaParse), extraction (LlamaExtract), and indexing services with generous free tiers.
+
+---
+
+## Community
+
+- [Twitter](https://twitter.com/llama_index)
+- [Discord](https://discord.gg/dGcwcsnxhU)
+- [LinkedIn](https://www.linkedin.com/company/llamaindex/)
+
+We 💜 contributors! View our [contributing guide](https://github.com/run-llama/LlamaIndexTS/blob/main/CONTRIBUTING.md) to get started.
+
+## Related projects
+
+- [Python framework GitHub](https://github.com/run-llama/llama_index)
+- [Python docs](https://docs.llamaindex.ai/)
+- [create-llama](https://www.npmjs.com/package/create-llama) — scaffold a new project in seconds!
+- [UI Components](https://ui.llamaindex.ai/) — build chat applications with our Next.js components.

apps/next/src/content/docs/llamaindex/integration/lang-trace.mdx

@@ -2,7 +2,6 @@
 title: Langtrace
 description: Learn how to integrate LlamaIndex.TS with Langtrace.
 ---
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 
 Enhance your observability with Langtrace, a robust open-source tool supports OpenTelemetry and is designed to trace, evaluate, and manage LLM applications seamlessly. Langtrace integrates directly with LlamaIndex, offering detailed, real-time insights into performance metrics such as accuracy, evaluations, and latency.
 
@@ -10,19 +9,9 @@ Enhance your observability with Langtrace, a robust open-source tool supports Op
 
 - Self-host or sign-up and generate an API key using [Langtrace](https://www.langtrace.ai) Cloud
 
-<Tabs groupId="install-langtrase" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install @langtrase/typescript-sdk
-	```
-
-	```shell tab="yarn"
-	yarn add @langtrase/typescript-sdk
-	```
-
-	```shell tab="pnpm"
-	pnpm add @langtrase/typescript-sdk
-	```
-</Tabs>
+```package-install
+npm i @langtrase/typescript-sdk
+```
 
 ## Initialize
 

apps/next/src/content/docs/llamaindex/integration/open-llm-metry.mdx

@@ -2,27 +2,15 @@
 title: OpenLLMetry
 description: Learn how to integrate LlamaIndex.TS with OpenLLMetry.
 ---
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 
 [OpenLLMetry](https://github.com/traceloop/openllmetry-js) is an open-source project based on OpenTelemetry for tracing and monitoring
 LLM applications. It connects to [all major observability platforms](https://www.traceloop.com/docs/openllmetry/integrations/introduction) and installs in minutes.
 
 ### Usage Pattern
 
-
-<Tabs groupId="install-traceloop" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install @traceloop/node-server-sdk
-	```
-
-	```shell tab="yarn"
-	yarn add @traceloop/node-server-sdk
-	```
-
-	```shell tab="pnpm"
-	pnpm add @traceloop/node-server-sdk
-	```
-</Tabs>
+```package-install
+npm i @traceloop/node-server-sdk
+```
 
 ```js
 import * as traceloop from "@traceloop/node-server-sdk";

apps/next/src/content/docs/llamaindex/integration/vercel.mdx

@@ -11,8 +11,8 @@ LlamaIndex provides integration with Vercel's AI SDK, allowing you to create pow
 
 First, install the required dependencies:
 
-```bash
-npm install @llamaindex/vercel ai
+```package-install
+npm i @llamaindex/vercel ai
 ```
 
 ## Using Vercel AI's Model Providers 

apps/next/src/content/docs/llamaindex/migration/0.8-to-0.9.mdx

@@ -2,8 +2,6 @@
 title: Migrating from v0.8 to v0.9
 ---
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
 Version 0.9 of LlamaIndex.TS introduces significant architectural changes to improve package size and runtime compatibility. The main goals of this release are:
 
 1. Reduce the package size of the main `llamaindex` package by moving dependencies into provider packages, making it more suitable for serverless environments
@@ -33,21 +31,11 @@ import { OpenAI } from "@llamaindex/openai";
 
 > Note: This examples requires installing the `@llamaindex/openai` package: 
 
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install @llamaindex/openai
-	```
+```package-install
+npm i @llamaindex/openai
+```
 
-	```shell tab="yarn"
-	yarn add @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add @llamaindex/openai
-	```
-</Tabs>
-
-For more details on available AI model providers and their configuration, see the [LLMs documentation](/docs/llamaindex/modules/llms) and the [Embedding Models documentation](/docs/llamaindex/modules/embeddings).
+For more details on available AI model providers and their configuration, see the [LLMs documentation](/docs/llamaindex/modules/models/llms) and the [Embedding Models documentation](/docs/llamaindex/modules/models/embeddings).
 
 ### 2. Storage Providers
 
@@ -61,7 +49,7 @@ Now:
 import { PineconeVectorStore } from "@llamaindex/pinecone";
 ```
 
-For more information about available storage options, refer to the [Data Stores documentation](/docs/llamaindex/modules/data_stores).
+For more information about available storage options, refer to the [Data Stores documentation](/docs/llamaindex/modules/data/stores).
 
 ### 3. Data Loaders
 
@@ -75,7 +63,7 @@ Now:
 import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
 ```
 
-For more details about available data loaders and their usage, check the [Loading Data](/docs/llamaindex/modules/loading).
+For more details about available data loaders and their usage, check the [Loading Data](/docs/llamaindex/modules/data/readers).
 
 ### 4. Prefer using `llamaindex` instead of `@llamaindex/core`
 

apps/next/src/content/docs/llamaindex/migration/deprecated/agent/index.mdx

@@ -2,7 +2,7 @@
 title: Agents
 ---
 
-**Note**: Agents are deprecated, use [Agent Workflows](/docs/llamaindex/modules/agent_workflow) instead.
+**Note**: Agents are deprecated, use [Agent Workflows](/docs/llamaindex/modules/agents/agent_workflow) instead.
 
 An “agent” is an automated reasoning and decision engine. It takes in a user input/query and can make internal decisions for executing that query in order to return the correct result. The key agent components can include, but are not limited to:
 

apps/next/src/content/docs/llamaindex/modules/agents/agent_workflow.mdx

@@ -3,7 +3,7 @@ title: Agent Workflows
 ---
 
 
-Agent Workflows are a powerful system that enables you to create and orchestrate one or multiple agents with tools to perform specific tasks. It's built on top of the base [`Workflow`](/docs/llamaindex/modules/workflows) system and provides a streamlined interface for agent interactions.
+Agent Workflows are a powerful system that enables you to create and orchestrate one or multiple agents with tools to perform specific tasks. It's built on top of the base [`Workflow`](/docs/llamaindex/modules/agents/workflows) system and provides a streamlined interface for agent interactions.
 
 ## Usage
 
@@ -12,7 +12,8 @@ Agent Workflows are a powerful system that enables you to create and orchestrate
 The simplest use case is creating a single agent with specific tools. Here's an example of creating an assistant that tells jokes:
 
 ```typescript
-import { agent, tool } from "llamaindex";
+import { tool } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
 import { openai } from "@llamaindex/openai";
 
 // Define a joke-telling tool
@@ -32,7 +33,8 @@ const jokeAgent = agent({
 
 // Run the workflow
 const result = await jokeAgent.run("Tell me something funny");
-console.log(result); // Baby Llama is called cria
+console.log(result.data.result); // Baby Llama is called cria
+console.log(result.data.message); // { role: 'assistant', content: 'Baby Llama is called cria' }
 ```
 
 ### Event Streaming
@@ -40,17 +42,17 @@ console.log(result); // Baby Llama is called cria
 Agent Workflows provide a unified interface for event streaming, making it easy to track and respond to different events during execution:
 
 ```typescript
-import { AgentToolCall, AgentStream } from "llamaindex";
+import { agentToolCallEvent, agentStreamEvent } from "@llamaindex/workflow";
 
 // Get the workflow execution context
-const context = workflow.run("Tell me something funny");
+const events = jokeAgent.runStream("Tell me something funny");
 
 // Stream and handle events
-for await (const event of context) {
-  if (event instanceof AgentToolCall) {
+for await (const event of events) {
+  if (agentToolCallEvent.include(event)) {
     console.log(`Tool being called: ${event.data.toolName}`);
   }
-  if (event instanceof AgentStream) {
+  if (agentStreamEvent.include(event)) {
     process.stdout.write(event.data.delta);
   }
 }
@@ -68,7 +70,8 @@ An Agent Workflow can orchestrate multiple agents, enabling complex interactions
 Here's an example of a multi-agent system that combines joke-telling and weather information:
 
 ```typescript
-import { multiAgent, agent, tool } from "llamaindex";
+import { tool } from "llamaindex";
+import { multiAgent, agent } from "@llamaindex/workflow";
 import { openai } from "@llamaindex/openai";
 import { z } from "zod";
 
@@ -110,6 +113,7 @@ const agents = multiAgent({
 const result = await agents.run(
   "Give me a morning greeting with a joke and the weather in San Francisco"
 );
+console.log(result.data.result);
 ```
 
 The workflow will coordinate between agents, allowing them to handle different aspects of the request and hand off tasks when appropriate.

apps/next/src/content/docs/llamaindex/modules/agents/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "Agents",
+  "pages": ["tool", "agent_workflow", "workflows", "natural_language_workflow"]
+}

apps/next/src/content/docs/llamaindex/modules/agents/natural_language_workflow.mdx

@@ -0,0 +1,103 @@
+---
+title: Define workflows using natural language  
+---
+
+When working with Workflows, you have to write code to handle an event in the workflow. 
+Often, the logic of the handler is not too complex so that it can be expressed using natural language and executed by an LLM.  
+Besides the instructions, we just need the expected result event of the step, possible tool calls and optionally other events that can be emitted.  
+
+## Usage
+
+Let's take an example of a workflow that generates a joke, gets a critique for it, and then improves it.
+
+### Define the events
+
+First, we define the events for our workflow. We need one for writing the joke, one for critiquing it, and one for the final result:
+
+```typescript
+import { z } from "zod";
+import { zodEvent } from "@llamaindex/workflow";
+
+const writeJokeSchema = z.object({
+  description: z
+    .string()
+    .describe("The topic to write a joke or describe the joke to improve."),
+  writtenJoke: z.optional(z.string()).describe("The written joke."),
+  retriedTimes: z
+    .number()
+    .default(0)
+    .describe(
+      "The retried times for writing the joke. Always increase this from the input retriedTimes.",
+    ),
+});
+
+const critiqueSchema = z.object({
+  joke: z.string().describe("The joke to critique"),
+  retriedTimes: z.number().describe("The retried times for writing the joke."),
+});
+
+const finalResultSchema = z.object({
+  joke: z.string().describe("The joke to critique"),
+  critique: z.string().describe("The critique of the joke"),
+});
+
+const writeJokeEvent = zodEvent(writeJokeSchema, {
+  debugLabel: "writeJokeEvent",
+}); 
+const critiqueEvent = zodEvent(critiqueSchema, {
+  debugLabel: "critiqueEvent",
+}); 
+const finalResultEvent = zodEvent(finalResultSchema, {
+  debugLabel: "finalResultEvent",
+}); 
+```
+
+Note that your natural language workflows the events need to be created by the `zodEvent` function passing the zod schema as an argument. The agent needs the schema of the event data to correctly generate events.  
+Also, we need a `debugLabel` so the LLM can identify the event to emit in the workflow.
+
+### Define the workflow
+
+As usual you first create the workflow:
+
+```typescript
+import { agentHandler, createWorkflow } from "@llamaindex/workflow";
+
+const jokeFlow = createWorkflow();
+```
+
+Then you need to handle the events. For the handlers, instead of code, you're now going to use natural language by calling the `agentHandler` function.
+
+It only requires two parameters:
+- `instructions`: A prompt to guide the agent how to handle the steps.
+- `results`: The output events that the agent should return after handling the step.
+
+Then you will have a simple code to handle the step:
+
+```typescript
+jokeFlow.handle(
+  [writeJokeEvent],
+  agentHandler({
+    instructions: `You are a joke writer. You are given a topic and you need to write a joke about it.`,
+    results: [critiqueEvent],
+  }),
+);
+
+jokeFlow.handle(
+  [critiqueEvent],
+  agentHandler({
+    instructions: `
+You are given a joke and you need to critique it. Follow the following guidelines:
+1. You have maximum 3 times to improve the joke.
+2. If the joke is not good, increase the retriedTimes, describe how to improve the joke and send a writeJokeEvent.
+3. If the joke is good, trigger the finalResultEvent event.
+`,
+    results: [writeJokeEvent, finalResultEvent],
+  }),
+);
+```
+
+For advanced usage, you can add more functionality to `agentHandler` by using these parameters:
+- `events`: A list of additional events that the agent can emit to the workflow. E.g., your agent can emit a `uiEvent` to update the UI during the execution.
+- `tools`: A list of tools that the agent can use to handle the step. E.g., your agent can use a `search` tool to search the web.
+
+You can find more code examples in the [examples](https://github.com/run-llama/LlamaIndexTS/tree/main/examples/agents/natural) folder.

apps/next/src/content/docs/llamaindex/modules/agents/tool/index.mdx

@@ -0,0 +1,153 @@
+---
+title: Tools
+---
+
+A "tool" is a utility that can be called by an agent on behalf of an LLM.
+A tool can be called to perform custom actions, or retrieve extra information based on the LLM-generated input.
+A result from a tool call can be used by subsequent steps in a workflow, or to compute a final answer.
+For example, a "weather tool" could fetch some live weather information from a geographical location.
+
+## Tool Function
+
+The `tool` function is a utility provided to define a tool that can be used by an agent. It takes a function and a configuration object as arguments. The configuration object includes the tool's name, description, and parameters.
+
+### Parameters with Zod
+
+The `parameters` field in the tool configuration is defined using `zod`, a TypeScript-first schema declaration and validation library. `zod` allows you to specify the expected structure and types of the input parameters, ensuring that the data passed to the tool is valid.
+
+Example:
+```ts
+import { tool } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
+import { z } from "zod";
+
+// first arg is LLM input, second is bound arg
+const queryKnowledgeBase = async ({ question }, { userToken }) => {
+  const response = await fetch(`https://knowledge-base.com?token=${userToken}&query=${question}`);
+  // ...
+};
+
+// define tool with zod validation
+const kbTool = tool(queryKnowledgeBase, {
+  name: 'queryKnowledgeBase',
+  description: 'Query knowledge base',
+  parameters: z.object({
+    question: z.string({
+      description: 'The user question',
+    }),
+  }),
+});
+
+```
+In this example, `z.object` is used to define a schema for the `parameters` where `question` is expected to be a string. This ensures that any input to the tool adheres to the specified structure, providing a layer of type safety and validation.
+
+
+## Built-in tools
+
+You can import built-in tools from the `@llamaindex/tools` package.
+
+```ts
+import { agent } from "@llamaindex/workflow";
+import { wiki } from "@llamaindex/tools";
+
+const researchAgent = agent({
+  name: "WikiAgent",
+  description: "Gathering information from the internet",
+  systemPrompt: `You are a research agent. Your role is to gather information from the internet using the provided tools.`,
+  tools: [wiki()],
+});
+```
+
+## MCP tools
+
+If you have a MCP server running, you can fetch tools from the server and use them in your agents.
+
+```ts
+// 1. Import MCP tools adapter
+import { mcp } from "@llamaindex/tools";
+import { agent } from "@llamaindex/workflow";
+
+// 2. Initialize a MCP client
+// by npx
+const server = mcp({
+  command: "npx",
+  args: ["-y", "@modelcontextprotocol/server-filesystem", "."],
+  verbose: true,
+});
+// or by StreamableHTTP transport
+const server = mcp({
+  url: "http://localhost:8000/mcp",
+  verbose: true,
+});
+
+// if your MCP server is not using StreamableHTTP transport, you can also use SSE transport
+// by setting useSSETransport to true.
+// See: https://modelcontextprotocol.io/docs/concepts/transports#server-sent-events-sse-deprecated
+const server = mcp({
+  url: "http://localhost:8000/mcp",
+  useSSETransport: true,
+  verbose: true,
+});
+
+// 3. Get tools from MCP server
+const tools = await server.tools();
+
+// Now you can create an agent with the tools
+const agent = agent({
+  name: "My Agent",
+  systemPrompt: "You are a helpful assistant that can use the provided tools to answer questions.",
+  llm: openai({ model: "gpt-4o" }),
+  tools: tools,
+});
+```
+
+
+## Function tool
+
+You can still use the `FunctionTool` class to define a tool.
+A `FunctionTool` is constructed from a function with signature
+```ts
+(input: T, additionalArg?: AdditionalToolArgument) => R
+```
+where
+- `input` is generated by the LLM, `T` is the type defined by the tool `parameters`
+- `additionalArg` is an optional extra argument, see "Binding" below
+- `R` is the return type
+
+### Binding
+
+An additional argument can be bound to a tool, each tool call will be passed
+- the input provided by the LLM
+- the additional argument (extends object)
+
+Note: calling the `bind` method will return a new `FunctionTool` instance, without modifying the tool which `bind` is called on.
+
+Example to pass a `userToken` as additional argument:
+```ts
+import { tool } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
+
+// first arg is LLM input, second is bound arg
+const queryKnowledgeBase = async ({ question }, { userToken }) => {
+  const response = await fetch(`https://knowledge-base.com?token=${userToken}&query=${question}`);
+  // ...
+};
+
+// define tool as usual
+const kbTool = tool(queryKnowledgeBase, {
+  name: 'queryKnowledgeBase',
+  description: 'Query knowledge base',
+  parameters: z.object({
+    question: z.string({
+      description: 'The user question',
+    }),
+  }),
+});
+
+// create an agent
+const additionalArg = { userToken: 'abcd1234' };
+const workflow = agent({
+  tools: [kbTool.bind(additionalArg)],
+  // llm, systemPrompt etc
+})
+```

apps/next/src/content/docs/llamaindex/modules/agents/workflows.mdx

@@ -0,0 +1,21 @@
+---
+title: Workflows
+---
+
+A `Workflow` in LlamaIndex is a lightweight, event-driven abstraction used to chain together several events. Workflows are made up of `handlers`, with each one responsible for processing specific event types and emitting new events.
+
+Workflows are designed to be flexible and can be used to build agents, RAG flows, extraction flows, or anything else you want to implement.
+
+To use workflows install this package:
+
+```package-install
+npm i @llamaindex/workflow-core
+```
+
+This contains the core functionality for the workflow system. You can read more about the core concepts in the [workflow-core](/docs/workflows) section.
+
+In contrast, the `@llamaindex/workflow` package contains more utiltities, such as prebuilt agents.
+
+```package-install
+npm i @llamaindex/workflow
+```

apps/next/src/content/docs/llamaindex/modules/chat/chat.mdx

@@ -1,45 +0,0 @@
----
-title: Using API Route
-description: Chat interface for your LlamaIndexTS application using API Route
----
-import { ChatDemo } from '../../../../../components/demo/chat/api/demo';
-
-Using [chat-ui](https://github.com/run-llama/chat-ui), it's easy to add a chat interface to your LlamaIndexTS application.
-You just need to create an API route that provides an `api/chat` endpoint and a chat component to consume the API.
-
-## API route
-
-As an example, this is an API route for the Next.js App Router. Copy the following code into your `app/api/chat/route.ts` file to get started:
-
-```json doc-gen:file
-{
-  "file": "./src/app/api/chat/route.ts",
-	"codeblock": true
-}
-```
-
-## Chat UI
-
-This is the simplest way to add a chat interface to your application. Copy the following code into your application to consume the API:
-
-```json doc-gen:file
-{
-  "file": "./src/components/demo/chat/api/demo.tsx",
-	"codeblock": true
-}
-```
-
-## Try it out ⬇️
-
-Combining both, you're getting a fully functional chat interface:
-
-<ChatDemo />
-
-
-## Next Steps
-
-The steps above are the bare minimum to get a chat interface working. From here, you can go two ways:
-
-1. Use [create-llama](https://github.com/run-llama/create-llama) to scaffold a new LlamaIndexTS project including complex API routes and chat interfaces or
-2. Learn more about [chat-ui](https://github.com/run-llama/chat-ui) and [LlamaIndexTS](https://github.com/run-llama/llamaindex-ts) to customize the chat interface and API routes to your needs.
-

apps/next/src/content/docs/llamaindex/modules/chat/install.mdx

@@ -1,22 +0,0 @@
----
-title: Install @llamaindex/chat
-description: Chat interface for your LlamaIndexTS application
----
-
-## Quick Start
-
-You can quickly add a chatbot to your project by using Shadcn CLI command:
-
-```sh
-npx shadcn@latest add https://ui.llamaindex.ai/r/chat.json
-```
-
-## Manual Installation
-
-To install the package, run the following command in your project directory:
-
-```sh
-npm install @llamaindex/chat-ui
-```
-
-For more information, check out the [github.comrun-llama/chat-ui](https://github.com/run-llama/chat-ui)

apps/next/src/content/docs/llamaindex/modules/chat/rsc.mdx

@@ -1,66 +0,0 @@
----
-title: Using Next.js RSC
-description: Chat interface for your LlamaIndexTS application using Next.js RSC
----
-import { ChatDemoRSC } from '../../../../../components/demo/chat/rsc/demo';
-
-Using [chat-ui](https://github.com/run-llama/chat-ui), it's easy to add a chat interface to your LlamaIndexTS application using [Next.js RSC](https://nextjs.org/docs/app/building-your-application/rendering/server-components) and [Vercel AI RSC](https://sdk.vercel.ai/docs/ai-sdk-rsc/overview).
-
-With RSC, the chat messages are not returned as JSON from the server (like when using an [API route](/docs/llamaindex/modules/chat/chat)), instead the chat message components are rendered on the server side.
-This is for example useful for rendering a whole chat history on the server before sending it to the client. [Check here](https://sdk.vercel.ai/docs/getting-started/navigating-the-library#when-to-use-ai-sdk-rsc), for a discussion of when to use use RSC.
-
-For implementing a chat interface with RSC, you need to create an AI action and then connect the chat interface to use it.
-
-## Create an AI action
-
-First, define an [AI context provider](https://sdk.vercel.ai/examples/rsc/state-management/ai-ui-states) with a chat server action:
-
-```json doc-gen:file
-{
-  "file": "./src/components/demo/chat/rsc/ai-action.tsx",
-	"codeblock": true
-}
-```
-
-The chat server action is using LlamaIndexTS to generate a response based on the chat history and the user input.
-
-## Create the chat UI
-
-The entrypoint of our application initializes the AI provider for the application and adds a `ChatSection` component:
-
-```json doc-gen:file
-{
-  "file": "./src/components/demo/chat/rsc/demo.tsx",
-	"codeblock": true
-}
-```
-
-The `ChatSection` component is created by using chat components from @llamaindex/chat-ui:
-
-```json doc-gen:file
-{
-  "file": "./src/components/demo/chat/rsc/chat-section.tsx",
-	"codeblock": true
-}
-```
-
-It is using a `useChatRSC` hook to conntect the chat interface to the `chat` AI action that we defined earlier:
-
-```json doc-gen:file
-{
-  "file": "./src/components/demo/chat/rsc/use-chat-rsc.tsx",
-	"codeblock": true
-}
-```
-
-## Try RSC Chat ⬇️
-
-<ChatDemoRSC />
-
-## Next Steps
-
-The steps above are the bare minimum to get a chat interface working with RSC. From here, you can go two ways:
-
-1. Use our [full-stack RSC example](https://github.com/run-llama/nextjs-rsc) based on [create-llama](https://github.com/run-llama/create-llama) to get started quickly with a fully working chat interface or
-2. Learn more about [AI RSC](https://sdk.vercel.ai/examples/rsc), [chat-ui](https://github.com/run-llama/chat-ui) and [LlamaIndexTS](https://github.com/run-llama/llamaindex-ts) to customize the chat interface and AI actions to your needs.
-

apps/next/src/content/docs/llamaindex/modules/data/data_index/index.mdx

@@ -2,7 +2,8 @@
 title: Index
 ---
 
-An index is the basic container and organization for your data. LlamaIndex.TS supports two indexes:
+An index is the basic container for organizing your data. Besides managed indexes using [LlamaCloud](/docs/llamaindex/modules/data/data_index/managed), LlamaIndex.TS supports three indexes:
+
 
 - `VectorStoreIndex` - will send the top-k `Node`s to the LLM when generating a response. The default top-k is 2.
 - `SummaryIndex` - will send every `Node` in the index to the LLM in order to generate a response

apps/next/src/content/docs/llamaindex/modules/data/data_index/managed.mdx

@@ -0,0 +1,32 @@
+---
+title: Managed Index
+description: Managed index using LlamaCloud
+---
+
+LlamaCloud is a new generation of managed parsing, ingestion, and retrieval services, designed to bring production-grade context-augmentation to your LLM and RAG applications.
+
+LlamaCloud supports
+
+- Managed Ingestion API, handling parsing and document management
+- Managed Retrieval API, configuring optimal retrieval for your RAG system
+
+## Access
+
+Visit [LlamaCloud](https://cloud.llamaindex.ai) to sign in and get an API key.
+
+## Create a Managed Index
+
+Here's an example of how to create a managed index by ingesting a couple of documents:
+
+<include cwd>../../examples/cloud/chat.ts</include>
+
+## Use a Managed Index
+
+Here's an example of how to use a managed index together with a chat engine:
+
+<include cwd>../../examples/cloud/from-documents.ts</include>
+
+## API Reference
+
+- [LlamaCloudIndex](/docs/api/classes/LlamaCloudIndex)
+- [LlamaCloudRetriever](/docs/api/classes/LlamaCloudRetriever)

apps/next/src/content/docs/llamaindex/modules/data/index.mdx

@@ -0,0 +1,17 @@
+---
+title: Documents and Nodes
+description: Data structure for storing data in LlamaIndex
+---
+
+`Document`s and `Node`s are the basic building blocks of data in LlamaIndexTS. While the API for these objects is similar, `Document` objects represent entire files, while `Node`s are smaller pieces of that original document, that are suitable for an LLM and Q&A.
+
+```typescript
+import { Document } from "llamaindex";
+
+document = new Document({ text: "text", metadata: { key: "val" } });
+```
+
+## API Reference
+
+- [Document](/docs/api/classes/Document)
+- [TextNode](/docs/api/classes/TextNode)

apps/next/src/content/docs/llamaindex/modules/data/ingestion_pipeline/index.mdx

@@ -7,21 +7,9 @@ These `Transformations` are applied to your input data, and the resulting nodes
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/openai @llamaindex/qdrant
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/openai @llamaindex/qdrant
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/openai @llamaindex/qdrant
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/openai @llamaindex/qdrant
+```
 
 ## Usage Pattern
 

apps/next/src/content/docs/llamaindex/modules/data/ingestion_pipeline/transformations/index.mdx

@@ -6,9 +6,9 @@ A transformation is something that takes a list of nodes as an input, and return
 
 Currently, the following components are Transformation objects:
 
-- [SentenceSplitter](/docs/api/classes/SentenceSplitter)
-- [MetadataExtractor](/docs/llamaindex/modules/documents_and_nodes/metadata_extraction)
-- [Embeddings](/docs/llamaindex/modules/embeddings)
+- [SentenceSplitter](/docs/llamaindex/modules/data/ingestion_pipeline/transformations/node-parser)
+- [MetadataExtractor](/docs/llamaindex/modules/data/ingestion_pipeline/transformations/metadata_extraction)
+- [Embeddings](/docs/llamaindex/modules/models/embeddings)
 
 ## Usage Pattern