Release 0.11.9 (#2023)

Co-authored-by: marcusschiesser <17126+marcusschiesser@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

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,252 @@
 # @llamaindex/doc
 
+## 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

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 `@llama-flow/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/fallback.js

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

apps/next/next.config.mjs

@@ -1,5 +1,4 @@
 import { createMDX } from "fumadocs-mdx/next";
-import MonacoWebpackPlugin from "monaco-editor-webpack-plugin";
 const withMDX = createMDX();
 
 /** @type {import('next').NextConfig} */
@@ -16,7 +15,26 @@ 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/llamaflow/:path*.mdx",
+        destination: "/docs/llamaflow/:path*",
+        permanent: true,
+      },
+    ];
+  },
+  turbopack: {
+    resolveAlias: {
+      fs: { browser: "./fallback.js" },
+    },
+  },
+  webpack: (config) => {
     if (Array.isArray(config.target) && config.target.includes("web")) {
       config.target = ["web", "es2020"];
     }
@@ -28,14 +46,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,20 +1,22 @@
 {
   "name": "@llamaindex/doc",
-  "version": "0.2.5",
+  "version": "0.2.28",
   "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",
+    "@llama-flow/docs": "0.0.8",
+    "@llamaindex/chat-ui-docs": "^0.0.5",
     "@llamaindex/cloud": "workspace:*",
     "@llamaindex/core": "workspace:*",
     "@llamaindex/node-parser": "workspace:*",
@@ -22,6 +24,7 @@
     "@llamaindex/readers": "workspace:*",
     "@llamaindex/workflow": "workspace:*",
     "@mdx-js/mdx": "^3.1.0",
+    "@monaco-editor/react": "^4.7.0",
     "@number-flow/react": "^0.3.4",
     "@radix-ui/react-dialog": "^1.1.2",
     "@radix-ui/react-icons": "^1.3.2",
@@ -36,22 +39,21 @@
     "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.4",
+    "next": "^15.3.0",
     "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,12 +65,14 @@
     "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"
   },
   "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",
@@ -78,7 +82,6 @@
     "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",
     "raw-loader": "^4.0.2",
     "remark": "^15.0.1",
@@ -87,9 +90,9 @@
     "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",
+    "typedoc": "0.28.3",
+    "typedoc-plugin-markdown": "^4.6.2",
+    "typedoc-plugin-merge-modules": " ^7.0.0",
     "typescript": "^5.7.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/llamaflow", "/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/@llama-flow/docs",
+    "./node_modules/@llamaindex/chat-ui-docs",
+    // NOTE: When adding external docs (like chat-ui or llama-flow 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 "@/lib/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/search/route.ts

@@ -1,4 +1,12 @@
 import { source } from "@/lib/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 * as demos from "@/components/demo/lazy";
 import { createMetadata, metadataImage } from "@/lib/metadata";
 import { openapi, source } from "@/lib/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 "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 "@/lib/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/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/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/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 { 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/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,4 @@ 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)

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

@@ -11,7 +11,7 @@ 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.:

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/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/cloudflare.mdx

@@ -3,18 +3,11 @@ 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"
+  href="/docs/llamaindex/getting_started/installation/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>.
@@ -69,7 +62,7 @@ export default {
 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.
+- You are recommend to design your code using network request, such as use `fetch` API to communicate with database, instead of 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/installation/index.mdx

@@ -0,0 +1,69 @@
+---
+title: Installation
+description: How to install llamaindex packages.
+---
+
+To install llamaindex, run the following command:
+
+```package-install
+npm i llamaindex
+```
+
+In most cases, you'll also need an LLM package and the Workflow package to use LlamaIndex. For example, to use the OpenAI LLM with agents, you would install the following:
+
+```package-install
+npm i @llamaindex/openai @llamaindex/workflow
+```
+
+Go to [LLM APIs](/docs/llamaindex/modules/models/llms) to find out how to use other LLMs.
+
+
+## Frameworks
+
+LlamaIndex supports a wide range of frameworks and runtimes. Click on the card below to learn more.
+
+<Cards>
+	<Card title={
+		<>
+			<SiNodedotjs className="inline" color="#5FA04E" /> Node.js
+		</>
+	} href="/docs/llamaindex/getting_started/installation/node" />
+	<Card title={
+		<>
+			<SiTypescript className="inline" color="#3178C6" /> TypeScript
+		</>
+	} href="/docs/llamaindex/getting_started/installation/typescript" />
+	<Card title={
+		<>
+			<SiVite className='inline' color='#646CFF' /> Vite
+		</>
+	} href="/docs/llamaindex/getting_started/installation/vite" />
+	<Card
+		title={
+			<>
+				<SiNextdotjs className='inline' /> Next.js (React Server Component)
+			</>
+		}
+		href="/docs/llamaindex/getting_started/installation/next"
+	/>
+	<Card title={
+		<>
+			<SiCloudflareworkers className='inline' color='#F38020' /> Cloudflare Workers
+		</>
+	} href="/docs/llamaindex/getting_started/installation/cloudflare" />
+</Cards>
+
+## 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/meta.json

@@ -0,0 +1,4 @@
+{
+  "title": "Installation",
+  "pages": ["node", "typescript", "next", "vite", "cloudflare"]
+}

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

@@ -7,7 +7,7 @@ Before you start, make sure you have try LlamaIndex.TS in Node.js to make sure y
 
 <Card
   title="Getting Started with LlamaIndex.TS in Node.js"
-  href="/docs/llamaindex/getting_started/frameworks/node"
+  href="/docs/llamaindex/getting_started/installation/node"
 />
 
 ## Differences between Node.js and Next.js
@@ -17,9 +17,9 @@ 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.
+Where as the `llamaindex` package is working with Next.js, some provider packages like `@llamaindex/huggingface` are not working well with Next.js. This is due to the upstream dependencies used by the provider package. 
 
-You might need to use `withNext` to make sure that LlamaIndex.TS works well with Next.js.
+Make sure to use `withLlamaIndex` to make sure that LlamaIndex.TS works well with Next.js.
 
 ```js
 // next.config.mjs / next.config.ts
@@ -35,7 +35,7 @@ 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),
+[Vercel Edge Runtime](https://edge-runtime.vercel.app/) is a subset of Node.js APIs. Similar to [Cloudflare Workers](/docs/llamaindex/getting_started/installation/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/installation/node.mdx

@@ -3,8 +3,6 @@ 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.
@@ -28,19 +26,9 @@ For more information, see the [How to read environment variables from Node.js](h
 
 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>
+```package-install
+npm i gpt-tokenizer
+```
 
 **Note**: This only works for Node.js
 
@@ -48,5 +36,5 @@ By the default, we are using `js-tiktoken` for tokenization. You can install `gp
 
 <Card
 	title="Getting Started with LlamaIndex.TS in TypeScript"
-	href="/docs/llamaindex/getting_started/frameworks/typescript"
+	href="/docs/llamaindex/getting_started/installation/typescript"
 />

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

@@ -2,11 +2,10 @@
 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.
+We put a lot of work on strong typing to make sure you have a great typing experience with code completion such as:
 
 ```ts twoslash
 import { PromptTemplate } from 'llamaindex'
@@ -28,70 +27,20 @@ promptTemplate.format({
 })
 ```
 
-```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
 
+Make sure to set [moduleResolution](https://www.typescriptlang.org/docs/handbook/modules/theory.html#module-resolution) in your `tsconfig.json` file:
 
 ```json5
 {
   compilerOptions: {
     // ⬇️ add this line to your tsconfig.json
-    moduleResolution: "bundler", // or "node16"
+    moduleResolution: "bundler", // or "nodenext" | "node16" | "node"
   },
 }
 ```
 
-<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>
+We recommend using `bundler` or `nodenext`, but due to popularity of `node`, we still added support for it.
 
 ## Enable AsyncIterable for `Web Stream` API
 
@@ -107,7 +56,8 @@ Some modules uses `Web Stream` API like `ReadableStream` and `WritableStream`, y
 ```
 
 ```typescript
-import { agent, tool } from 'llamaindex'
+import { tool } from 'llamaindex'
+import { agent } from "@llamaindex/workflow";
 import { openai } from "@llamaindex/openai";
 
 Settings.llm = openai({

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

@@ -7,7 +7,7 @@ Before you start, make sure you have try LlamaIndex.TS in Node.js to make sure y
 
 <Card
   title="Getting Started with LlamaIndex.TS in Node.js"
-  href="/docs/llamaindex/getting_started/frameworks/node"
+  href="/docs/llamaindex/getting_started/installation/node"
 />
 
 Also, make sure you have a basic understanding of [Vite](https://vitejs.dev/).

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

@@ -3,13 +3,6 @@ title: What is LlamaIndex.TS
 description: LlamaIndex is the leading data framework for building LLM applications
 ---
 
-import {
-  SiNodedotjs,
-  SiDeno,
-  SiBun,
-  SiCloudflareworkers,
-} from "@icons-pack/react-simple-icons";
-
 LlamaIndex is a framework for building context-augmented generative AI applications with LLMs including agents and workflows.
 
 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.

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,7 @@ 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
 ```
 
 ### Event Streaming
@@ -40,17 +41,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 +69,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 +112,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

@@ -17,7 +17,8 @@ The `parameters` field in the tool configuration is defined using `zod`, a TypeS
 
 Example:
 ```ts
-import { agent, tool } from "llamaindex";
+import { tool } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
 import { z } from "zod";
 
 // first arg is LLM input, second is bound arg
@@ -46,7 +47,7 @@ In this example, `z.object` is used to define a schema for the `parameters` wher
 You can import built-in tools from the `@llamaindex/tools` package.
 
 ```ts
-import { agent } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
 import { wiki } from "@llamaindex/tools";
 
 const researchAgent = agent({
@@ -57,6 +58,41 @@ const researchAgent = agent({
 });
 ```
 
+## 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 SSE
+const server = mcp({
+  url: "http://localhost:8000/mcp",
+  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.
@@ -79,7 +115,8 @@ Note: calling the `bind` method will return a new `FunctionTool` instance, witho
 
 Example to pass a `userToken` as additional argument:
 ```ts
-import { agent, tool } from "llamaindex";
+import { tool } from "llamaindex";
+import { agent } from "@llamaindex/workflow";
 
 // first arg is LLM input, second is bound arg
 const queryKnowledgeBase = async ({ question }, { userToken }) => {

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

@@ -0,0 +1,18 @@
+---
+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
+```
+
+This package is a stable, production-ready version of our [llama-flow](/docs/llamaflow) project. 
+
+While you can still reference the llama-flow documentation for detailed information about the underlying concepts, we recommend using the `@llamaindex/workflow` package for all new projects to ensure stability and long-term availability.
+

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 three 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
 

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

@@ -1,5 +1,5 @@
 ---
-title: Metadata Extraction Usage Pattern
+title: Metadata Extraction 
 ---
 
 You can use LLMs to automate metadata extraction with our `Metadata Extractor` modules.

apps/next/src/content/docs/llamaindex/modules/data/ingestion_pipeline/transformations/node-parser.mdx

@@ -2,17 +2,15 @@
 title: Node Parsers / Text Splitters
 description: Learn how to use Node Parsers and Text Splitters to extract data from documents.
 ---
-import { CodeNodeParserDemo } from '../../../../../components/demo/code-node-parser.tsx';
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 
-Node parsers are a simple abstraction that take a list of documents, and chunk them into `Node` objects, such that each node is a specific chunk of the parent document. When a document is broken into nodes, all of it's attributes are inherited to the children nodes (i.e. `metadata`, text and metadata templates, etc.). You can read more about `Node` and `Document` properties [here](/docs/llamaindex/modules/loading).
-
-## NodeParser
-
-The `NodeParser` in LlamaIndex is responsible for splitting `Document` objects into more manageable `Node` objects.
+Node parsers are a simple abstraction that take a list of `Document` objects, and chunk them into `Node` objects, such that each node is a specific chunk of the parent document. When a document is broken into nodes, all of it's attributes are inherited to the children nodes (i.e. `metadata`, text and metadata templates, etc.). You can read more about `Node` and `Document` properties [here](/docs/llamaindex/modules/data).
 
 By default, we will use `Settings.nodeParser` to split the document into nodes. You can also assign a custom `NodeParser` to the `Settings` object.
 
+## SentenceSplitter
+
+The `SentenceSplitter` is the default `NodeParser` in LlamaIndex. It will split the text from a `Document` into sentences.
+
 ```ts twoslash
 import { TextFileReader } from '@llamaindex/readers/text'
 import { SentenceSplitter } from 'llamaindex';
@@ -23,8 +21,6 @@ Settings.nodeParser = nodeParser;
 //		     ^?
 ```
 
-## TextSplitter
-
 The underlying text splitter will split text by sentences. It can also be used as a standalone module for splitting raw text.
 
 ```ts twoslash
@@ -68,6 +64,46 @@ The `MarkdownNodeParser` is a more advanced `NodeParser` that can handle markdow
 	```
 </Tabs>
 
+The output metadata will be something like:
+
+```bash
+[
+  TextNode {
+    id_: '008e41a8-b097-487c-bee8-bd88b9455844',
+    metadata: { 'Header 1': 'Main Header' },
+    excludedEmbedMetadataKeys: [],
+    excludedLlmMetadataKeys: [],
+    relationships: { PARENT: [Array] },
+    hash: 'KJ5e/um/RkHaNR6bonj9ormtZY7I8i4XBPVYHXv1A5M=',
+    text: 'Main Header\nMain content',
+    textTemplate: '',
+    metadataSeparator: '\n'
+  },
+  TextNode {
+    id_: '0f5679b3-ba63-4aff-aedc-830c4208d0b5',
+    metadata: { 'Header 1': 'Header 2' },
+    excludedEmbedMetadataKeys: [],
+    excludedLlmMetadataKeys: [],
+    relationships: { PARENT: [Array] },
+    hash: 'IP/g/dIld3DcbK+uHzDpyeZ9IdOXY4brxhOIe7wc488=',
+    text: 'Header 2\nHeader 2 content',
+    textTemplate: '',
+    metadataSeparator: '\n'
+  },
+  TextNode {
+    id_: 'e81e9bd0-121c-4ead-8ca7-1639d65fdf90',
+    metadata: { 'Header 1': 'Header 2', 'Header 2': 'Sub-header' },
+    excludedEmbedMetadataKeys: [],
+    excludedLlmMetadataKeys: [],
+    relationships: { PARENT: [Array] },
+    hash: 'B3kYNnxaYi9ghtAgwza0ZEVKF4MozobkNUlcekDL7JQ=',
+    text: 'Sub-header\nSub-header content',
+    textTemplate: '',
+    metadataSeparator: '\n'
+  }
+]
+```
+
 ## CodeSplitter
 
 The `CodeSplitter` is a more advanced `NodeParser` that can handle code documents.
@@ -113,8 +149,6 @@ Try it out ⬇️
 
 <CodeNodeParserDemo/>
 
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
 <Accordions>
 	<Accordion title="Use it in browser">
 		You might setup WASM files for `web-tree-sitter` and use it in the browser.
@@ -155,3 +189,9 @@ import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
 		```
 	</Accordion>
 </Accordions>
+
+## API Reference
+
+- [SentenceSplitter](/docs/api/classes/SentenceSplitter)
+- [MarkdownNodeParser](/docs/api/classes/MarkdownNodeParser)
+- [CodeSplitter](/docs/api/classes/CodeSplitter)

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

@@ -0,0 +1,4 @@
+{
+  "title": "Data",
+  "pages": ["index", "readers", "data_index", "ingestion_pipeline", "stores"]
+}

apps/next/src/content/docs/llamaindex/modules/data/readers/discord.mdx

@@ -2,12 +2,15 @@
 title: DiscordReader
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!../../../../../../../../examples/readers/src/discord";
-
 DiscordReader is a simple data loader that reads all messages in a given Discord channel and returns them as Document objects.
 It uses the [@discordjs/rest](https://github.com/discordjs/discord.js/tree/main/packages/rest) library to fetch the messages.
 
+## Installation
+
+```package-install
+npm install @llamaindex/discord
+```
+
 ## Usage
 
 First step is to create a Discord Application and generating a bot token [here](https://discord.com/developers/applications).
@@ -15,7 +18,7 @@ In your Discord Application, go to the `OAuth2` tab and generate an invite URL b
 This will invite the bot with the necessary permissions to read messages.
 Copy the URL in your browser and select the server you want your bot to join.
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/readers/discord/reader.ts</include>
 
 ### Params
 

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

@@ -0,0 +1,118 @@
+---
+title: Loading Data
+description: Loading data using Readers into Documents
+---
+
+Before you can start indexing your documents, you need to load them into memory.
+A reader is a module that loads data from a file into a `Document` object.
+
+To install readers call:
+
+<Accordions>
+	<Accordion title="Install @llamaindex/readers">
+
+		If you want to use the reader module, you need to install `@llamaindex/readers`
+
+    ```package-install
+    npm i @llamaindex/readers
+    ```
+	</Accordion>
+</Accordions>
+
+We offer readers for different file formats.
+
+```ts twoslash
+import { CSVReader } from '@llamaindex/readers/csv';
+import { DocxReader } from '@llamaindex/readers/docx';
+import { HTMLReader } from '@llamaindex/readers/html';
+import { ImageReader } from '@llamaindex/readers/image';
+import { JSONReader } from '@llamaindex/readers/json';
+import { MarkdownReader } from '@llamaindex/readers/markdown';
+import { ObsidianReader } from '@llamaindex/readers/obsidian';
+import { PDFReader } from '@llamaindex/readers/pdf';
+import { TextFileReader } from '@llamaindex/readers/text';
+```
+
+## SimpleDirectoryReader
+
+[Open in StackBlitz](https://stackblitz.com/github/run-llama/LlamaIndexTS/tree/main/examples/readers?file=src/simple-directory-reader.ts&title=Simple%20Directory%20Reader)
+
+LlamaIndex.TS supports easy loading of files from folders using the `SimpleDirectoryReader` class.
+
+It is a simple reader that reads all files from a directory and its subdirectories and delegates the actual reading to the reader specified in the `fileExtToReader` map.
+
+<include cwd>../../examples/readers/src/simple-directory-reader.ts</include>
+
+Currently, the following readers are mapped to specific file types:
+
+- [TextFileReader](/docs/api/classes/TextFileReader): `.txt`
+- [PDFReader](/docs/api/classes/PDFReader): `.pdf`
+- [CSVReader](/docs/api/classes/CSVReader): `.csv`
+- [MarkdownReader](/docs/api/classes/MarkdownReader): `.md`
+- [DocxReader](/docs/api/classes/DocxReader): `.docx`
+- [HTMLReader](/docs/api/classes/HTMLReader): `.htm`, `.html`
+- [ImageReader](/docs/api/classes/ImageReader): `.jpg`, `.jpeg`, `.png`, `.gif`
+
+You can modify the reader three different ways:
+
+- `overrideReader` overrides the reader for all file types, including unsupported ones.
+- `fileExtToReader` maps a reader to a specific file type. Can override reader for existing file types or add support for new file types.
+- `defaultReader` sets a fallback reader for files with unsupported extensions. By default it is `TextFileReader`.
+
+SimpleDirectoryReader supports up to 9 concurrent requests. Use the `numWorkers` option to set the number of concurrent requests. By default it runs in sequential mode, i.e. set to 1.
+
+### Example
+
+<include cwd>../../examples/readers/src/custom-simple-directory-reader.ts</include>
+
+## Tips when using in non-Node.js environments
+
+When using `@llamaindex/readers` in a non-Node.js environment (such as Vercel Edge, Cloudflare Workers, etc.)
+Some classes are not exported from top-level entry file.
+
+The reason is that some classes are only compatible with Node.js runtime, (e.g. `PDFReader`) which uses Node.js specific APIs (like `fs`, `child_process`, `crypto`).
+
+If you need any of those classes, you have to import them instead directly through their file path in the package.
+
+As the `PDFReader` is not working with the Edge runtime, here's how to use the `SimpleDirectoryReader` with the `LlamaParseReader` to load PDFs:
+
+```typescript
+import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
+import { LlamaParseReader } from "@llamaindex/cloud";
+
+export const DATA_DIR = "./data";
+
+export async function getDocuments() {
+  const reader = new SimpleDirectoryReader();
+  // Load PDFs using LlamaParseReader
+  return await reader.loadData({
+    directoryPath: DATA_DIR,
+    fileExtToReader: {
+      pdf: new LlamaParseReader({ resultType: "markdown" }),
+    },
+  });
+}
+```
+
+> _Note_: Reader classes have to be added explicitly to the `fileExtToReader` map in the Edge version of the `SimpleDirectoryReader`.
+
+You'll find a complete example with LlamaIndexTS here: https://github.com/run-llama/create_llama_projects/tree/main/nextjs-edge-llamaparse
+
+
+## Load file natively using Node.js Customization Hooks
+
+We have a helper utility to allow you to import a file in Node.js script.
+
+```shell 
+node --import @llamaindex/readers/node ./script.js
+```
+
+```ts
+import csv from './path/to/data.csv';
+
+const text = csv.getText()
+```
+
+## API Reference
+
+- [SimpleDirectoryReader](/docs/api/classes/SimpleDirectoryReader)

apps/next/src/content/docs/llamaindex/modules/data/readers/json.mdx

@@ -8,21 +8,9 @@ Supports streaming of large JSON data using [@discoveryjs/json-ext](https://gith
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/readers
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/readers
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/readers
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/readers
+```
 
 ## Usage
 

apps/next/src/content/docs/llamaindex/modules/data/readers/llama_parse/images.mdx

@@ -6,21 +6,9 @@ LlamaParse `json` mode supports extracting any images found in a page object by
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/cloud @llamaindex/openai
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/cloud @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/cloud @llamaindex/openai
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/cloud @llamaindex/openai
+```
 
 ## Usage
 
@@ -124,6 +112,3 @@ The returned `imageDocs` have the alt text assigned as text and the image path a
 
 You can see the full example file [here](https://github.com/run-llama/LlamaIndexTS/blob/main/examples/readers/src/llamaparse-json.ts).
 
-## API Reference
-
-- [LlamaParseReader](/docs/api/classes/LlamaParseReader)

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

@@ -2,10 +2,6 @@
 title: LlamaParse
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!../../../../../../../../../examples/readers/src/llamaparse";
-import CodeSource2 from "!raw-loader!../../../../../../../../../examples/readers/src/simple-directory-reader-with-llamaparse.ts";
-
 LlamaParse is an API created by LlamaIndex to efficiently parse files, e.g. it's great at converting PDF tables into markdown.
 
 To use it, first login and get an API key from https://cloud.llamaindex.ai. Make sure to store the key as `apiKey` parameter or in the environment variable `LLAMA_CLOUD_API_KEY`.
@@ -17,7 +13,7 @@ Official documentation for LlamaParse can be found [here](https://docs.cloud.lla
 You can then use the `LlamaParseReader` class to load local files and convert them into a parsed document that can be used by LlamaIndex.
 See [reader.ts](https://github.com/run-llama/LlamaIndexTS/blob/main/packages/cloud/src/reader.ts) for a list of supported file types:
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/readers/src/llamaparse.ts</include>
 
 ### Params
 
@@ -36,7 +32,7 @@ They can be divided into two groups.
 #### Advanced params:
 
 - `resultType` can be set to `markdown`, `text` or `json`. Defaults to `text`. More information about `json` mode on the next pages.
-- `language` primarily helps with OCR recognition. Defaults to `en`. Click [here](/docs/api/type-aliases/Language) for a list of supported languages.
+- `language` primarily helps with OCR recognition. Defaults to `en`.
 - `parsingInstructions?` Optional. Can help with complicated document structures. See this [LlamaIndex Blog Post](https://www.llamaindex.ai/blog/launching-the-first-genai-native-document-parsing-platform) for an example.
 - `skipDiagonalText?` Optional. Set to true to ignore diagonal text. (Text that is not rotated 0, 90, 180 or 270 degrees)
 - `invalidateCache?` Optional. Set to true to ignore the LlamaCloud cache. All document are kept in cache for 48hours after the job was completed to avoid processing the same document twice. Can be useful for testing when trying to re-parse the same document with, e.g. different `parsingInstructions`.
@@ -60,9 +56,8 @@ They can be divided into two groups.
 
 Below a full example of `LlamaParse` integrated in `SimpleDirectoryReader` with additional options.
 
-<DynamicCodeBlock lang="ts" code={CodeSource2} />
+<include cwd>../../examples/readers/src/simple-directory-reader-with-llamaparse.ts</include>
 
 ## API Reference
 
 - [SimpleDirectoryReader](/docs/api/classes/SimpleDirectoryReader)
-- [LlamaParseReader](/docs/api/classes/LlamaParseReader)

apps/next/src/content/docs/llamaindex/modules/data/readers/llama_parse/json_mode.mdx

@@ -6,21 +6,9 @@ In JSON mode, LlamaParse will return a data structure representing the parsed ob
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/cloud
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/cloud
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/cloud
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/cloud
+```
 
 ## Usage
 
@@ -110,5 +98,4 @@ You can assign any other values of the JSON response to the Document as needed.
 
 ## API Reference
 
-- [LlamaParseReader](/docs/api/classes/LlamaParseReader)
 - [SimpleDirectoryReader](/docs/api/classes/SimpleDirectoryReader)

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

@@ -6,7 +6,7 @@ Chat stores manage chat history by storing sequences of messages in a structured
 
 ## Available Chat Stores
 
-- [SimpleChatStore](/docs/api/classes/SimpleChatStore): A simple in-memory chat store with support for [persisting](/docs/llamaindex/modules/data_stores#local-storage) data to disk.
+- [SimpleChatStore](/docs/api/classes/SimpleChatStore): A simple in-memory chat store with support for [persisting](/docs/llamaindex/modules/data/stores#local-storage) data to disk.
 
 Check the [LlamaIndexTS Github](https://github.com/run-llama/LlamaIndexTS) for the most up to date overview of integrations.
 

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

@@ -2,32 +2,20 @@
 title: Document Stores
 ---
 
-Document stores contain ingested document chunks, i.e. [Node](/docs/llamaindex/modules/documents_and_nodes)s.
+Document stores contain ingested document chunks, i.e. [Node](/docs/llamaindex/modules/data)s.
 
 ## Available Document Stores
 
-- [SimpleDocumentStore](/docs/api/classes/SimpleDocumentStore): A simple in-memory document store with support for [persisting](/docs/llamaindex/modules/data_stores#local-storage) data to disk.
-- [PostgresDocumentStore](/docs/api/classes/PostgresDocumentStore): A PostgreSQL document store, see [PostgreSQL Storage](/docs/llamaindex/modules/data_stores#postgresql-storage).
+- [SimpleDocumentStore](/docs/api/classes/SimpleDocumentStore): A simple in-memory document store with support for [persisting](/docs/llamaindex/modules/data/stores#local-storage) data to disk.
+- [PostgresDocumentStore](/docs/api/classes/PostgresDocumentStore): A PostgreSQL document store, see [PostgreSQL Storage](/docs/llamaindex/modules/data/stores#postgresql-storage).
 
 Check the [LlamaIndexTS Github](https://github.com/run-llama/LlamaIndexTS) for the most up to date overview of integrations.
 
 ## Using PostgreSQL as Document Store
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/postgres
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/postgres
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/postgres
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/postgres
+```
 
 You can configure the `schemaName`, `tableName`, `namespace`, and
 `connectionString`. If a `connectionString` is not

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

@@ -2,32 +2,20 @@
 title: Index Stores
 ---
 
-Index stores are underlying storage components that contain metadata(i.e. information created when indexing) about the [index](/docs/llamaindex/modules/data_index) itself.
+Index stores are underlying storage components that contain metadata(i.e. information created when indexing) about the [index](/docs/llamaindex/modules/data/data_index) itself.
 
 ## Available Index Stores
 
-- [SimpleIndexStore](/docs/api/classes/SimpleIndexStore): A simple in-memory index store with support for [persisting](/docs/llamaindex/modules/data_stores#local-storage) data to disk.
-- [PostgresIndexStore](/docs/api/classes/PostgresIndexStore): A PostgreSQL index store, , see [PostgreSQL Storage](/docs/llamaindex/modules/data_stores#postgresql-storage).
+- [SimpleIndexStore](/docs/api/classes/SimpleIndexStore): A simple in-memory index store with support for [persisting](/docs/llamaindex/modules/data/stores#local-storage) data to disk.
+- [PostgresIndexStore](/docs/api/classes/PostgresIndexStore): A PostgreSQL index store, , see [PostgreSQL Storage](/docs/llamaindex/modules/data/stores#postgresql-storage).
 
 Check the [LlamaIndexTS Github](https://github.com/run-llama/LlamaIndexTS) for the most up to date overview of integrations.
 
 ## Using PostgreSQL as Index Store
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/postgres
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/postgres
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/postgres
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/postgres
+```
 
 You can configure the `schemaName`, `tableName`, `namespace`, and
 `connectionString`. If a `connectionString` is not

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

@@ -2,12 +2,12 @@
 title: Key-Value Stores
 ---
 
-Key-Value Stores represent underlying storage components used in [Document Stores](/docs/llamaindex/modules/data_stores/doc_stores) and [Index Stores](/docs/llamaindex/modules/data_stores/index_stores)
+Key-Value Stores represent underlying storage components used in [Document Stores](/docs/llamaindex/modules/data/stores/doc_stores) and [Index Stores](/docs/llamaindex/modules/data/stores/index_stores)
 
 ## Available Key-Value Stores
 
-- [SimpleKVStore](/docs/api/classes/SimpleKVStore): A simple Key-Value store with support of [persisting](/docs/llamaindex/modules/data_stores#local-storage) data to disk.
-- [PostgresKVStore](/docs/api/classes/PostgresKVStore): A PostgreSQL Key-Value store, see [PostgreSQL Storage](/docs/llamaindex/modules/data_stores#postgresql-storage).
+- [SimpleKVStore](/docs/api/classes/SimpleKVStore): A simple Key-Value store with support of [persisting](/docs/llamaindex/modules/data/stores#local-storage) data to disk.
+- [PostgresKVStore](/docs/api/classes/PostgresKVStore): A PostgreSQL Key-Value store, see [PostgreSQL Storage](/docs/llamaindex/modules/data/stores#postgresql-storage).
 
 Check the [LlamaIndexTS Github](https://github.com/run-llama/LlamaIndexTS) for the most up to date overview of integrations.
 

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

@@ -8,7 +8,7 @@ Vector stores save embedding vectors of your ingested document chunks.
 
 Available Vector Stores are shown on the sidebar to the left. Additionally the following integrations exist without separate documentation:
 
-- [SimpleVectorStore](/docs/api/classes/SimpleVectorStore): A simple in-memory vector store with optional [persistance](/docs/llamaindex/modules/data_stores#local-storage) to disk.
+- [SimpleVectorStore](/docs/api/classes/SimpleVectorStore): A simple in-memory vector store with optional [persistance](/docs/llamaindex/modules/data/stores#local-storage) to disk.
 - [AstraDBVectorStore](/docs/api/classes/AstraDBVectorStore): A cloud-native, scalable Database-as-a-Service built on Apache Cassandra, see [datastax.com](https://www.datastax.com/products/datastax-astra)
 - [ChromaVectorStore](/docs/api/classes/ChromaVectorStore): An open-source vector database, focused on ease of use and performance, see [trychroma.com](https://www.trychroma.com/)
 - [MilvusVectorStore](/docs/api/classes/MilvusVectorStore): An open-source, high-performance, highly scalable vector database, see [milvus.io](https://milvus.io/)

apps/next/src/content/docs/llamaindex/modules/data/stores/vector_stores/qdrant.mdx

@@ -13,21 +13,9 @@ docker run -p 6333:6333 qdrant/qdrant
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/qdrant
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/qdrant
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/qdrant
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/qdrant
+```
 
 ## Importing the modules
 
@@ -100,7 +88,7 @@ async function main() {
 
   const response = await queryEngine.query({
     query: "What did the author do in college?",
-  });
+  }); // Additional filters and params can be passed as options
 
   // Output response
   console.log(response.toString());

apps/next/src/content/docs/llamaindex/modules/data/stores/vector_stores/supabase.mdx

@@ -8,21 +8,9 @@ To use this vector store, you need a Supabase project. You can create one at [su
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-  ```shell tab="npm"
-  npm install llamaindex @llamaindex/supabase
-  ```
-
-  ```shell tab="yarn"
-  yarn add llamaindex @llamaindex/supabase
-  ```
-
-  ```shell tab="pnpm"
-  pnpm add llamaindex @llamaindex/supabase
-  ```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/supabase
+```
 
 ## Database Setup
 
@@ -54,6 +42,7 @@ similarity float
 )
 language plpgsql
 as $$
+#variable_conflict use_column
 begin
 return query
 select

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

@@ -1,58 +0,0 @@
----
-title: Loader
----
-
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!../../../../../../../../examples/readers/src/simple-directory-reader";
-import CodeSource2 from "!raw-loader!../../../../../../../../examples/readers/src/custom-simple-directory-reader";
-
-Before you can start indexing your documents, you need to load them into memory.
-
-All "basic" data loaders can be seen below, mapped to their respective filetypes in `SimpleDirectoryReader`. More loaders are shown in the sidebar on the left.
-Additionally the following loaders exist without separate documentation:
-
-- `AssemblyAIReader` transcribes audio using [AssemblyAI](https://www.assemblyai.com/).
-  - [AudioTranscriptReader](/docs/api/classes/AudioTranscriptReader): loads entire transcript as a single document.
-  - [AudioTranscriptParagraphsReader](/docs/api/classes/AudioTranscriptParagraphsReader): creates a document per paragraph.
-  - [AudioTranscriptSentencesReader](/docs/api/classes/AudioTranscriptSentencesReader): creates a document per sentence.
-  - [AudioSubtitlesReader](/docs/api/classes/AudioTranscriptParagraphsReader): creates a document containing the subtitles of a transcript.
-- [NotionReader](/docs/api/classes/NotionReader) loads [Notion](https://www.notion.so/) pages.
-- [SimpleMongoReader](/docs/api/classes/SimpleMongoReader) loads data from a [MongoDB](https://www.mongodb.com/).
-
-Check the [LlamaIndexTS Github](https://github.com/run-llama/LlamaIndexTS) for the most up to date overview of integrations.
-
-## SimpleDirectoryReader
-
-[Open in StackBlitz](https://stackblitz.com/github/run-llama/LlamaIndexTS/tree/main/examples/readers?file=src/simple-directory-reader.ts&title=Simple%20Directory%20Reader)
-
-LlamaIndex.TS supports easy loading of files from folders using the `SimpleDirectoryReader` class.
-
-It is a simple reader that reads all files from a directory and its subdirectories.
-
-<DynamicCodeBlock lang="ts" code={CodeSource} />
-
-Currently, the following readers are mapped to specific file types:
-
-- [TextFileReader](/docs/api/classes/TextFileReader): `.txt`
-- [PDFReader](/docs/api/classes/PDFReader): `.pdf`
-- [CSVReader](/docs/api/classes/CSVReader): `.csv`
-- [MarkdownReader](/docs/api/classes/MarkdownReader): `.md`
-- [DocxReader](/docs/api/classes/DocxReader): `.docx`
-- [HTMLReader](/docs/api/classes/HTMLReader): `.htm`, `.html`
-- [ImageReader](/docs/api/classes/ImageReader): `.jpg`, `.jpeg`, `.png`, `.gif`
-
-You can modify the reader three different ways:
-
-- `overrideReader` overrides the reader for all file types, including unsupported ones.
-- `fileExtToReader` maps a reader to a specific file type. Can override reader for existing file types or add support for new file types.
-- `defaultReader` sets a fallback reader for files with unsupported extensions. By default it is `TextFileReader`.
-
-SimpleDirectoryReader supports up to 9 concurrent requests. Use the `numWorkers` option to set the number of concurrent requests. By default it runs in sequential mode, i.e. set to 1.
-
-### Example
-
-<DynamicCodeBlock lang="ts" code={CodeSource2} />
-
-## API Reference
-
-- [SimpleDirectoryReader](/docs/api/classes/SimpleDirectoryReader)

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

@@ -1,16 +0,0 @@
----
-title: Documents and Nodes
----
-
-`Document`s and `Node`s are the basic building blocks of any index. 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/evaluation/correctness.mdx

@@ -10,21 +10,9 @@ This is useful for measuring if the response was correct. The evaluator returns
 
 Firstly, you need to install the package:
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/openai
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/openai
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/openai
+```
 
 Set the OpenAI API key:
 

apps/next/src/content/docs/llamaindex/modules/evaluation/faithfulness.mdx

@@ -12,22 +12,9 @@ This is useful for measuring if the response was hallucinated. The evaluator ret
 
 Firstly, you need to install the package:
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/openai
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/openai
-	```
-</Tabs>
-
+```package-install
+npm i llamaindex @llamaindex/openai
+```
 
 Set the OpenAI API key:
 

apps/next/src/content/docs/llamaindex/modules/evaluation/relevancy.mdx

@@ -10,22 +10,9 @@ It is useful for measuring if the response was relevant to the query. The evalua
 
 Firstly, you need to install the package:
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/openai
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/openai
-	```
-</Tabs>
-
+```package-install
+npm i llamaindex @llamaindex/openai
+```
 
 Set the OpenAI API key:
 

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

@@ -1,34 +0,0 @@
----
-title: LlamaCloud
----
-
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!../../../../../../../examples/cloud/chat.ts";
-
-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.
-
-Currently, LlamaCloud supports
-
-- Managed Ingestion API, handling parsing and document management
-- Managed Retrieval API, configuring optimal retrieval for your RAG system
-
-## Access
-
-We are opening up a private beta to a limited set of enterprise partners for the managed ingestion and retrieval API. If you’re interested in centralizing your data pipelines and spending more time working on your actual RAG use cases, come [talk to us.](https://www.llamaindex.ai/contact)
-
-If you have access to LlamaCloud, you can visit [LlamaCloud](https://cloud.llamaindex.ai) to sign in and get an API key.
-
-## Create a Managed Index
-
-Currently, you can't create a managed index on LlamaCloud using LlamaIndexTS, but you can use an existing managed index for retrieval that was created by the Python version of LlamaIndex. See [the LlamaCloudIndex documentation](https://docs.llamaindex.ai/en/stable/module_guides/indexing/llama_cloud_index.html#usage) for more information on how to create a managed index.
-
-## Use a Managed Index
-
-Here's an example of how to use a managed index together with a chat engine:
-
-<DynamicCodeBlock lang="ts" code={CodeSource} />
-
-## API Reference
-
-- [LlamaCloudIndex](/docs/api/classes/LlamaCloudIndex)
-- [LlamaCloudRetriever](/docs/api/classes/LlamaCloudRetriever)

apps/next/src/content/docs/llamaindex/modules/llms/azure.mdx

@@ -1,102 +0,0 @@
----
-title: Azure OpenAI
----
-
-To use Azure OpenAI, you only need to set a few environment variables together with the `OpenAI` class.
-
-For example:
-
-## Environment Variables
-
-```
-export AZURE_OPENAI_KEY="<YOUR KEY HERE>"
-export AZURE_OPENAI_ENDPOINT="<YOUR ENDPOINT, see https://learn.microsoft.com/en-us/azure/ai-services/openai/quickstart?tabs=command-line%2Cpython&pivots=rest-api>"
-export AZURE_OPENAI_DEPLOYMENT="gpt-4" # or some other deployment name
-```
-
-## 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
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/openai
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/openai
-	```
-</Tabs>
-
-## Usage
-
-```ts
-import { Settings } from "llamaindex";
-import { OpenAI } from "@llamaindex/openai";
-
-Settings.llm = new OpenAI({ model: "gpt-4", temperature: 0 });
-```
-
-## Load and index documents
-
-For this example, we will use a single document. In a real-world scenario, you would have multiple documents to index.
-
-```ts
-const document = new Document({ text: essay, id_: "essay" });
-
-const index = await VectorStoreIndex.fromDocuments([document]);
-```
-
-## Query
-
-```ts
-const queryEngine = index.asQueryEngine();
-
-const query = "What is the meaning of life?";
-
-const results = await queryEngine.query({
-  query,
-});
-```
-
-## Full Example
-
-```ts
-import { Document, VectorStoreIndex, Settings } from "llamaindex";
-import { OpenAI } from "@llamaindex/openai";
-
-Settings.llm = new OpenAI({ model: "gpt-4", temperature: 0 });
-
-async function main() {
-  const document = new Document({ text: essay, id_: "essay" });
-
-  // Load and index documents
-  const index = await VectorStoreIndex.fromDocuments([document]);
-
-  // get retriever
-  const retriever = index.asRetriever();
-
-  // Create a query engine
-  const queryEngine = index.asQueryEngine({
-    retriever,
-  });
-
-  const query = "What is the meaning of life?";
-
-  // Query
-  const response = await queryEngine.query({
-    query,
-  });
-
-  // Log the response
-  console.log(response.response);
-}
-```
-
-## API Reference
-
-- [OpenAI](/docs/api/classes/OpenAI)

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

@@ -1,106 +0,0 @@
----
-title: Document and Nodes
-description: llamaindex readers is a collection of readers for different file formats.
----
-
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
-<Accordions>
-	<Accordion title="Install @llamaindex/readers">
-
-		If you want to use the reader module, you need to install `@llamaindex/readers`
-
-		<Tabs groupId="install-llamaindex" items={["npm", "yarn", "pnpm"]} persist>
-			```shell tab="npm"
-			npm install @llamaindex/readers
-			```
-
-			```shell tab="yarn"
-			yarn add @llamaindex/readers
-			```
-
-			```shell tab="pnpm"
-			pnpm add @llamaindex/readers
-			```
-
-		</Tabs>
-	</Accordion>
-</Accordions>
-
-We offer readers for different file formats.
-
-```ts twoslash 
-import { CSVReader } from '@llamaindex/readers/csv'
-import { PDFReader } from '@llamaindex/readers/pdf'
-import { JSONReader } from '@llamaindex/readers/json'
-import { MarkdownReader } from '@llamaindex/readers/markdown'
-import { HTMLReader } from '@llamaindex/readers/html'
-// you can find more readers in the documentation
-```
-
-## SimpleDirectoryReader
-
-`SimpleDirectoryReader` is the simplest way to load data from local files into LlamaIndex.
-
-```ts twoslash 
-import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
-
-const reader = new SimpleDirectoryReader()
-const documents = await reader.loadData("./data")
-//    ^?
-
-
-const texts = documents.map(doc => doc.getText())
-//    ^?
-```
-
-
-## Tips when using in non-Node.js environments
-
-When using `@llamaindex/readers` in a non-Node.js environment (such as Vercel Edge, Cloudflare Workers, etc.)
-Some classes are not exported from top-level entry file.
-
-The reason is that some classes are only compatible with Node.js runtime, (e.g. `PDFReader`) which uses Node.js specific APIs (like `fs`, `child_process`, `crypto`).
-
-If you need any of those classes, you have to import them instead directly through their file path in the package.
-
-As the `PDFReader` is not working with the Edge runtime, here's how to use the `SimpleDirectoryReader` with the `LlamaParseReader` to load PDFs:
-
-```typescript
-import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
-import { LlamaParseReader } from "@llamaindex/cloud";
-
-export const DATA_DIR = "./data";
-
-export async function getDocuments() {
-  const reader = new SimpleDirectoryReader();
-  // Load PDFs using LlamaParseReader
-  return await reader.loadData({
-    directoryPath: DATA_DIR,
-    fileExtToReader: {
-      pdf: new LlamaParseReader({ resultType: "markdown" }),
-    },
-  });
-}
-```
-
-> _Note_: Reader classes have to be added explicitly to the `fileExtToReader` map in the Edge version of the `SimpleDirectoryReader`.
-
-You'll find a complete example with LlamaIndexTS here: https://github.com/run-llama/create_llama_projects/tree/main/nextjs-edge-llamaparse
-
-
-## Load file natively using Node.js Customization Hooks
-
-We have a helper utility to allow you to import a file in Node.js script.
-
-```shell 
-node --import @llamaindex/readers/node ./script.js
-```
-
-```ts
-import csv from './path/to/data.csv';
-
-const text = csv.getText()
-```

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

@@ -1,5 +0,0 @@
-{
-  "title": "Loading Data",
-  "description": "Loading Data using LlamaIndex.TS",
-  "pages": ["index", "node-parser"]
-}

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

@@ -0,0 +1,4 @@
+{
+  "title": "Modules",
+  "pages": ["models", "agents", "data", "rag", "ui", "evaluation"]
+}

apps/next/src/content/docs/llamaindex/modules/models/embeddings/deepinfra.mdx

@@ -7,21 +7,9 @@ Check out available embedding models [here](https://deepinfra.com/models/embeddi
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/deepinfra
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/deepinfra
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/deepinfra
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/deepinfra
+```
 
 ```ts
 import { Document, Settings, VectorStoreIndex } from "llamaindex";

apps/next/src/content/docs/llamaindex/modules/models/embeddings/gemini.mdx

@@ -6,21 +6,9 @@ To use Gemini embeddings, you need to import `GeminiEmbedding` from `@llamaindex
 
 ## Installation
 
-import { Tab, Tabs } from "fumadocs-ui/components/tabs";
-
-<Tabs groupId="install" items={["npm", "yarn", "pnpm"]} persist>
-	```shell tab="npm"
-	npm install llamaindex @llamaindex/google
-	```
-
-	```shell tab="yarn"
-	yarn add llamaindex @llamaindex/google
-	```
-
-	```shell tab="pnpm"
-	pnpm add llamaindex @llamaindex/google
-	```
-</Tabs>
+```package-install
+npm i llamaindex @llamaindex/google
+```
 
 ```ts
 import { Document, Settings, VectorStoreIndex } from "llamaindex";