Compare commits
375 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| c1c58feed2 | |||
| 7ad3411766 | |||
| a1fdb07b96 | |||
| 5da5b3c89c | |||
| ddc0eafbaa | |||
| 1782554488 | |||
| a1b1598bc6 | |||
| b02847ae91 | |||
| 50acb4821e | |||
| 47a5b94b0c | |||
| d2be868b93 | |||
| 50d42c4129 | |||
| 848b97d4d0 | |||
| c5796b8d2d | |||
| 579ca0cf60 | |||
| f7e670c8d9 | |||
| 9ff971435c | |||
| 7c9d0e24c4 | |||
| af3f86694b | |||
| 5cce681f62 | |||
| 48b0d88941 | |||
| f18577263a | |||
| 214e133e92 | |||
| ae58862669 | |||
| 5a0ed1f990 | |||
| 36773a82b6 | |||
| 891562d598 | |||
| 93852e15fd | |||
| e1320b08a8 | |||
| 8eeac3310f | |||
| 984a573068 | |||
| f0160d9646 | |||
| 39758ab018 | |||
| f631d4f7d6 | |||
| d68c2a4be8 | |||
| 47a7555c07 | |||
| 363bfa778e | |||
| 229cdeb0ff | |||
| 7a2485cca2 | |||
| 1329186a23 | |||
| 5d6e7384f5 | |||
| f2dfd305fb | |||
| 3cd8a573df | |||
| 09c6077f6e | |||
| 14cc65b4e3 | |||
| c544d8f67c | |||
| d578889e21 | |||
| 9f745d1941 | |||
| f292e94dcd | |||
| 0fcc92f632 | |||
| 515a8b9111 | |||
| 7e8efc6284 | |||
| 0fcf65126d | |||
| a50acf634c | |||
| 7039e1a214 | |||
| 785d010cd3 | |||
| b878032131 | |||
| f7ec293a0f | |||
| 49a5e0a8cf | |||
| 118924799a | |||
| ec8f673dae | |||
| 85039a5360 | |||
| d7305edb53 | |||
| 096bf2bda1 | |||
| c5846bd7dc | |||
| 97bbce6e13 | |||
| 62699b7497 | |||
| a89e187796 | |||
| d8ac8d385d | |||
| a6cef9c6be | |||
| c5b2691302 | |||
| 8122c7245e | |||
| 8a51c167f8 | |||
| 1b5af1402d | |||
| fffe93fac8 | |||
| dbd857f6b5 | |||
| a4d394f727 | |||
| 3c857f4132 | |||
| 36cfb93eb2 | |||
| ab4762f026 | |||
| 56763dc57d | |||
| 5375fdd704 | |||
| e7484efca5 | |||
| c958a1645a | |||
| 0140a257c4 | |||
| 40161fe8d2 | |||
| d883fe7351 | |||
| 2bc6914784 | |||
| 78fbec17a6 | |||
| 8b10a2e880 | |||
| 534662368f | |||
| b370bd59f1 | |||
| 766054ba67 | |||
| 71598f86d7 | |||
| 677abe46d2 | |||
| 1cc271ccae | |||
| c927457e2e | |||
| 17ae23560e | |||
| 0d9169e42d | |||
| 3864c77ac3 | |||
| a86f66cd2d | |||
| e5b25acc3d | |||
| ba35240b4c | |||
| 7384e4d273 | |||
| ae75966721 | |||
| 5cdab12791 | |||
| eaf2cb11a5 | |||
| 3ae01a227e | |||
| 76ff23dc48 | |||
| ed497727b1 | |||
| 59601dd3ab | |||
| 8474ca970e | |||
| 3703f907d9 | |||
| f63b702bec | |||
| ccde88fe0b | |||
| b0cd5301bb | |||
| 3e66ddc10d | |||
| c719b968f3 | |||
| c73c659c6d | |||
| 361a685012 | |||
| 680b529e94 | |||
| 389acbd307 | |||
| 2e181be160 | |||
| 7a7ca604c5 | |||
| c2fd4f9fc1 | |||
| 40f5f410c0 | |||
| d671ed6d25 | |||
| 76c9a80057 | |||
| 46a416517c | |||
| 168d11fe51 | |||
| 3dfa5eb9ff | |||
| 9b20859dc5 | |||
| 93691793c5 | |||
| 3b231cf11c | |||
| 7073fca171 | |||
| 9145577bf5 | |||
| 4a18a2eb3d | |||
| 206b491724 | |||
| 9b2e25a184 | |||
| b29521bf6c | |||
| 73e25787e7 | |||
| 3ce80540fe | |||
| dbc1ee3089 | |||
| 3b45191228 | |||
| aaf2f8b2db | |||
| 6ddf1c1b1f | |||
| a8717d5ece | |||
| 7e8e4549f2 | |||
| cc3fe92a22 | |||
| 63ab0dba4e | |||
| 2225ffd1d4 | |||
| bc5334249b | |||
| 41953a3ef9 | |||
| fa66c9ca8e | |||
| 3ee8c83200 | |||
| e919bab568 | |||
| d28b6b7c4f | |||
| 1c7a262ff7 | |||
| 5a1838cc91 | |||
| b9805f4899 | |||
| 109ec63779 | |||
| 82d4b46fe4 | |||
| f8c2d0b8ad | |||
| 6d7bc4ccbb | |||
| 294f502441 | |||
| 056594452c | |||
| 1e59695cef | |||
| f463efd8a5 | |||
| cf95af40d9 | |||
| ddc910dc73 | |||
| f12af27760 | |||
| ffdbc8f5e8 | |||
| ea8817f7e4 | |||
| 359698d04b | |||
| b49fb24948 | |||
| 78841495aa | |||
| c81dd21472 | |||
| 52868ea0f9 | |||
| e0a730e44e | |||
| eda486bb52 | |||
| 10d9c708db | |||
| 556027705e | |||
| 588cd0f0b9 | |||
| 7ca9ddff86 | |||
| 3310eaae29 | |||
| 96dac4ddfd | |||
| f9ee683593 | |||
| e5c3f95c6e | |||
| b155c8cf2c | |||
| be6fead71a | |||
| 96dd79853a | |||
| f49366c9af | |||
| cde403be58 | |||
| e9bf4424e2 | |||
| edb8b87d86 | |||
| 6cf928f390 | |||
| 8e27fd2009 | |||
| c84036bbdd | |||
| f43406fc9b | |||
| 411dceaa41 | |||
| 2447384f31 | |||
| 5f3eb457e6 | |||
| d365eb2e54 | |||
| bb34ade6d4 | |||
| c540df5069 | |||
| 400b3b54bf | |||
| 88b7046c68 | |||
| 2ffdb274f2 | |||
| 139eb050f9 | |||
| 3ffee26b77 | |||
| dc6e774d78 | |||
| 6716188e10 | |||
| 0b75bd6d92 | |||
| 045b267d1b | |||
| 41191d074a | |||
| 8b2914c8b7 | |||
| 4c24dfcbce | |||
| 0dfa371fc9 | |||
| 0d852d6fdc | |||
| 2410527e64 | |||
| 7d2be8c640 | |||
| 3534c373f2 | |||
| 2cbdf71669 | |||
| ead657aedd | |||
| f5e4d098b0 | |||
| 4d97226e50 | |||
| 4999df18cc | |||
| 9a27b6d94a | |||
| 8c02684f0f | |||
| 9c63f3f94e | |||
| c515a324f6 | |||
| c70d7b9930 | |||
| 1b6f368a3f | |||
| 9d951b288f | |||
| 5fe16697a2 | |||
| 189d8a83ac | |||
| 648cfb5cb5 | |||
| eaf326ee90 | |||
| fc1bedf438 | |||
| 164cf7a6df | |||
| e98033e2cc | |||
| c0ffc7b434 | |||
| 9cf88e9f3f | |||
| 75d6e29187 | |||
| 132517877e | |||
| 299008b34f | |||
| 482ed67690 | |||
| 9aeec9089b | |||
| f1db9b3d48 | |||
| 25093531cf | |||
| f8a86e4eff | |||
| 04f8c96caa | |||
| 43053f9e16 | |||
| 93bc0ffd21 | |||
| 58a9446220 | |||
| da06e4550b | |||
| 3fd4cc383e | |||
| 2b39ceffa6 | |||
| 77e24cec65 | |||
| 2a0a899d66 | |||
| 050cd53450 | |||
| 5189b446f4 | |||
| c7ff3233fe | |||
| 21bebfcaa6 | |||
| 91a18e7057 | |||
| d1c1f99e06 | |||
| 8be84aeb5e | |||
| 5b7b314b25 | |||
| 4a51c9b48e | |||
| bf56fc08ad | |||
| fa40b36516 | |||
| da8068e9e0 | |||
| 37dcf37625 | |||
| a8c0637d11 | |||
| 387a19284d | |||
| a654f580cf | |||
| 68ea7ec6a5 | |||
| 2d11ffbaea | |||
| 1587e48a14 | |||
| bd239aaf2d | |||
| 98eebf7277 | |||
| 5478ba88b1 | |||
| aea550aff4 | |||
| e66c6e25fb | |||
| 40ee7610b2 | |||
| c14a21bc0b | |||
| 33f98565ab | |||
| b5cb35a732 | |||
| c1b5be5182 | |||
| 6f8b68ac5f | |||
| e075643b50 | |||
| f71b143ceb | |||
| ead4a80a3a | |||
| da78689e24 | |||
| f24a9dfe00 | |||
| e31d6ba472 | |||
| d212240d64 | |||
| cb73f77bb8 | |||
| 8bf1ca1701 | |||
| 58b3ee52e0 | |||
| 4bac71d6a2 | |||
| a3cbcb31a2 | |||
| bbc8c8787d | |||
| 4b49428f57 | |||
| 7ee4968b06 | |||
| 0111f5c8b0 | |||
| beb922b743 | |||
| e28c29d1f5 | |||
| 008cccd9f1 | |||
| 081698d68c | |||
| ab5fe5d7a0 | |||
| 56689707d3 | |||
| fd74ba4bf1 | |||
| b2634e47ca | |||
| ad3c7f1ec1 | |||
| 335f2df626 | |||
| ee963644bf | |||
| cb256f24ae | |||
| 1ccc04ecb5 | |||
| 034639153b | |||
| 1914b52708 | |||
| cb021e7196 | |||
| c2aa836b35 | |||
| 3b0f55f1ea | |||
| a9c6144eec | |||
| 3564244ced | |||
| d952e68ec4 | |||
| 5c026e839f | |||
| 9c1c5b4d50 | |||
| c902fcbc33 | |||
| 88d776f392 | |||
| 6fcc6bcb84 | |||
| be74207945 | |||
| 6be223dfad | |||
| 4cbfdb5f5c | |||
| 9767d1c004 | |||
| e831b28627 | |||
| cc50c9c2d4 | |||
| 954140776e | |||
| 6d37d440a6 | |||
| e724f7e9f2 | |||
| 1b029ae525 | |||
| d1db2189c9 | |||
| 2c5b4030c9 | |||
| 96eb597059 | |||
| 04098d55ff | |||
| 335a6b9e88 | |||
| c2a345ebb1 | |||
| d3fa729a30 | |||
| c7c08005ec | |||
| bb0ae5e321 | |||
| f4588bc770 | |||
| b49037612d | |||
| a87efb91a4 | |||
| 6a4a73760b | |||
| 1564831158 | |||
| 4d94f6e50d | |||
| 7bd5d9340c | |||
| d924c63162 | |||
| 83cff1277c | |||
| 1c908fd852 | |||
| 56f367f08d | |||
| cb608b5d01 | |||
| bd55bcffff | |||
| 6d4d96f8fe | |||
| b6ea2bf964 | |||
| 15563a0f70 | |||
| bd940d1d43 | |||
| 9f8ad37b79 | |||
| 7265f74c24 | |||
| e3f1b85846 | |||
| e38e474f86 | |||
| 2019a041f7 | |||
| 067a4894fe | |||
| 21769c8ad9 |
@@ -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
|
||||
|
||||
@@ -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
|
||||
@@ -25,4 +30,4 @@ jobs:
|
||||
run: pnpm run build
|
||||
|
||||
- name: Pre Release
|
||||
run: pnpx pkg-pr-new publish ./packages/* ./packages/providers/*
|
||||
run: pnpx pkg-pr-new publish --pnpm ./packages/* ./packages/providers/* ./packages/providers/storage/*
|
||||
|
||||
@@ -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:
|
||||
@@ -83,15 +83,34 @@ jobs:
|
||||
run: pnpm install
|
||||
- name: Build
|
||||
run: pnpm run build
|
||||
- name: Use Build For Examples
|
||||
run: |
|
||||
pnpm link ../packages/llamaindex/
|
||||
cd readers && pnpm link ../../packages/llamaindex/
|
||||
working-directory: ./examples
|
||||
- name: Run Type Check
|
||||
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
|
||||
@@ -103,6 +122,7 @@ jobs:
|
||||
- nextjs-node-runtime
|
||||
- waku-query-engine
|
||||
- llama-parse-browser
|
||||
- vite-import-llamaindex
|
||||
runs-on: ubuntu-latest
|
||||
name: Build LlamaIndex Example (${{ matrix.packages }})
|
||||
steps:
|
||||
@@ -121,6 +141,30 @@ jobs:
|
||||
run: pnpm run build
|
||||
working-directory: e2e/examples/${{ matrix.packages }}
|
||||
|
||||
size-limit:
|
||||
runs-on: ubuntu-latest
|
||||
if: github.event_name == 'pull_request'
|
||||
name: Size Limit
|
||||
steps:
|
||||
- uses: actions/checkout@v4
|
||||
- uses: pnpm/action-setup@v4
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v4
|
||||
with:
|
||||
node-version-file: ".nvmrc"
|
||||
cache: "pnpm"
|
||||
- name: Install dependencies
|
||||
run: pnpm install
|
||||
- name: Build llamaindex
|
||||
run: pnpm run build
|
||||
- uses: andresz1/size-limit-action@94bc357df29c36c8f8d50ea497c3e225c3c95d1d
|
||||
with:
|
||||
github_token: ${{ secrets.GITHUB_TOKEN }}
|
||||
directory: e2e/examples/vite-import-llamaindex
|
||||
skip_step: "install"
|
||||
build_script: build
|
||||
package_manager: pnpm
|
||||
|
||||
typecheck-examples:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
|
||||
@@ -1,3 +1 @@
|
||||
pnpm format
|
||||
pnpm lint
|
||||
npx lint-staged
|
||||
pnpm run lint-staged
|
||||
|
||||
@@ -7,3 +7,4 @@ dist/
|
||||
.source/
|
||||
# prttier doesn't support mdx3 we are using
|
||||
*.mdx
|
||||
packages/server/server/
|
||||
@@ -0,0 +1 @@
|
||||
LlamaIndexTS
|
||||
@@ -14,5 +14,6 @@
|
||||
"[json]": {
|
||||
"editor.defaultFormatter": "esbenp.prettier-vscode"
|
||||
},
|
||||
"prettier.prettierPath": "./node_modules/prettier"
|
||||
"prettier.prettierPath": "./node_modules/prettier",
|
||||
"prettier.configPath": "prettier.config.mjs"
|
||||
}
|
||||
|
||||
@@ -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
|
||||
@@ -14,52 +14,145 @@ There are some important folders in the repository:
|
||||
all JS runtime environments.
|
||||
- `env`: The environment package of LlamaIndex.TS, which contains the environment-specific classes and interfaces. It
|
||||
includes compatibility layers for Node.js, Deno, Vercel Edge Runtime, Cloudflare Workers...
|
||||
- `providers/*`: The providers package of LlamaIndex.TS, which contains the providers for LLM and other services.
|
||||
- `apps/*`: The applications based on LlamaIndex.TS.
|
||||
- `next`: Our documentation website based on Next.js.
|
||||
- `examples`: The code examples of LlamaIndex.TS using Node.js.
|
||||
|
||||
## Getting Started
|
||||
|
||||
Make sure you have Node.js LIS (Long-term Support) installed. You can check your Node.js version by running:
|
||||
Make sure you have Node.js LTS (Long-term Support) installed. You can check your Node.js version by running:
|
||||
|
||||
```shell
|
||||
node -v
|
||||
# v20.x.x
|
||||
# v22.x.x
|
||||
```
|
||||
|
||||
### Use pnpm
|
||||
|
||||
```shell
|
||||
corepack enable
|
||||
npm install -g pnpm
|
||||
```
|
||||
|
||||
### Install dependencies
|
||||
|
||||
```shell
|
||||
pnpm install
|
||||
pnpm install -g tsx
|
||||
```
|
||||
|
||||
### Build the packages
|
||||
|
||||
To build all packages, run:
|
||||
|
||||
```shell
|
||||
# Build all packages
|
||||
turbo build --filter "./packages/*"
|
||||
pnpm build
|
||||
```
|
||||
|
||||
### Start Developing
|
||||
|
||||
You can launch the package in dev-mode by running:
|
||||
|
||||
```shell
|
||||
pnpm dev
|
||||
```
|
||||
|
||||
This will use turbo to run all packages in watch-mode. This means you can make changes and have them automatically built.
|
||||
|
||||
If you want to customize what packages are built/watched, you can run turbo directly and adjust the filter:
|
||||
|
||||
```shell
|
||||
pnpm turbo run dev --filter="./packages/core" --concurrency=100
|
||||
```
|
||||
|
||||
In another terminal, you can write and run any script needed to quickly test your changes. For example:
|
||||
|
||||
```typescript
|
||||
import { createMemory, staticBlock } from "@llamaindex/core/memory";
|
||||
|
||||
// Create memory with predefined context
|
||||
const memory = createMemory({
|
||||
memoryBlocks: [
|
||||
staticBlock({
|
||||
content:
|
||||
"The user is a software engineer who loves TypeScript and LlamaIndex.",
|
||||
messageRole: "system",
|
||||
}),
|
||||
],
|
||||
});
|
||||
|
||||
async function main() {
|
||||
const result = await memory.getLLM();
|
||||
console.log(result);
|
||||
}
|
||||
|
||||
void main().catch(console.error);
|
||||
```
|
||||
|
||||
And run it with:
|
||||
|
||||
```shell
|
||||
pnpm exec tsx my_script.ts
|
||||
```
|
||||
|
||||
This flow allows you to easily test your changes without having to build the entire project.
|
||||
|
||||
Once you are happy with your changes, be sure to add tests (and confirm existing tests are passing!).
|
||||
|
||||
### Run tests
|
||||
|
||||
#### Unit tests
|
||||
|
||||
After build, to run all unit tests, call:
|
||||
|
||||
```shell
|
||||
pnpm test
|
||||
```
|
||||
|
||||
Unit tests are located in the `tests` folder of each package. They are using their own package (e.g. `@llamaindex/core-tests` for `@llamaindex/core`). The tests are importing the package under test and the test package is not published.
|
||||
|
||||
#### E2E tests
|
||||
|
||||
To run all E2E tests, call:
|
||||
|
||||
```shell
|
||||
pnpm e2e
|
||||
```
|
||||
|
||||
All E2E tests are in the `e2e` folder.
|
||||
|
||||
### Docs
|
||||
|
||||
See the [docs](./apps/next/README.md) for more information.
|
||||
|
||||
## Changeset
|
||||
## Adding a new package
|
||||
|
||||
Please follow these steps to add a new package:
|
||||
|
||||
1. Only add new packages to the `packages/providers` folder.
|
||||
2. Use the `package.json` and `tsconfig.json` of an existing packages as template.
|
||||
3. Reference your new package in the root `tsconfig.json` file
|
||||
4. Add your package to the `examples/package.json` file if you add a new example.
|
||||
|
||||
## Before sending a PR
|
||||
|
||||
Before sending a PR, make sure of the following:
|
||||
|
||||
1. Tests are all running and you added meaningful tests for your change.
|
||||
2. If you have a new feature, document it in the `apps/next` docs folder.
|
||||
3. If you have a new feature, add a new example in the `examples` folder.
|
||||
4. You have a descriptive changeset for each PR:
|
||||
|
||||
### Bumping the versions of packages you've modified
|
||||
|
||||
We use [changesets](https://github.com/changesets/changesets) for managing versions and changelogs. To create a new
|
||||
changeset, run in the root folder:
|
||||
|
||||
```
|
||||
```shell
|
||||
pnpm changeset
|
||||
```
|
||||
|
||||
Please send a descriptive changeset for each PR.
|
||||
You will be prompted to choose what packages need their versions bumped, and what kind of bump (major, minor or patch) is needed. Once you carry out this operation, the bumping will be automatic after the PR is merged.
|
||||
|
||||
## Publishing (maintainers only)
|
||||
|
||||
|
||||
@@ -7,9 +7,10 @@
|
||||
</h3>
|
||||
|
||||
[](https://www.npmjs.com/package/llamaindex)
|
||||
[](https://www.npmjs.com/package/llamaindex)
|
||||
[](https://github.com/run-llama/LlamaIndexTS/blob/main/LICENSE)
|
||||
[](https://www.npmjs.com/package/llamaindex)
|
||||
[](https://discord.com/invite/eN6D2HQ4aX)
|
||||
[](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,65 +64,27 @@ 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
|
||||
|
||||
### Tips when using in non-Node.js environments
|
||||
### Adding provider packages
|
||||
|
||||
When you are importing `llamaindex` in a non-Node.js environment(such as Vercel Edge, Cloudflare Workers, etc.)
|
||||
Some classes are not exported from top-level entry file.
|
||||
In most cases, you'll also need to install provider packages to use LlamaIndexTS. These are for adding AI models, file readers for ingestion or storing documents, e.g. in vector databases.
|
||||
|
||||
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`).
|
||||
For example, to use the OpenAI LLM, you would install the following package:
|
||||
|
||||
If you need any of those classes, you have to import them instead directly though their file path in the package.
|
||||
Here's an example for importing the `PineconeVectorStore` class:
|
||||
|
||||
```typescript
|
||||
import { PineconeVectorStore } from "llamaindex/vector-store/PineconeVectorStore";
|
||||
```shell
|
||||
npm install @llamaindex/openai
|
||||
pnpm install @llamaindex/openai
|
||||
yarn add @llamaindex/openai
|
||||
```
|
||||
|
||||
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/SimpleDirectoryReader";
|
||||
import { LlamaParseReader } from "llamaindex/readers/LlamaParseReader";
|
||||
|
||||
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 explictly 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
|
||||
|
||||
## Playground
|
||||
|
||||
Check out our NextJS playground at https://llama-playground.vercel.app/. The source is available at https://github.com/run-llama/ts-playground
|
||||
|
||||
## 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:
|
||||
|
||||
|
||||
@@ -1,5 +1,662 @@
|
||||
# @llamaindex/doc
|
||||
|
||||
## 0.2.40
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [7ad3411]
|
||||
- Updated dependencies [5da5b3c]
|
||||
- Updated dependencies [a1fdb07]
|
||||
- @llamaindex/core@0.6.15
|
||||
- @llamaindex/workflow@1.1.15
|
||||
- @llamaindex/openai@0.4.9
|
||||
- @llamaindex/cloud@4.0.24
|
||||
- llamaindex@0.11.19
|
||||
- @llamaindex/node-parser@2.0.15
|
||||
- @llamaindex/readers@3.1.14
|
||||
|
||||
## 0.2.39
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [a1b1598]
|
||||
- @llamaindex/cloud@4.0.23
|
||||
- llamaindex@0.11.18
|
||||
|
||||
## 0.2.38
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [d2be868]
|
||||
- @llamaindex/cloud@4.0.22
|
||||
- llamaindex@0.11.17
|
||||
|
||||
## 0.2.37
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [579ca0c]
|
||||
- @llamaindex/cloud@4.0.21
|
||||
- llamaindex@0.11.16
|
||||
|
||||
## 0.2.36
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [48b0d88]
|
||||
- Updated dependencies [f185772]
|
||||
- @llamaindex/cloud@4.0.20
|
||||
- llamaindex@0.11.15
|
||||
|
||||
## 0.2.35
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [5a0ed1f]
|
||||
- Updated dependencies [5a0ed1f]
|
||||
- Updated dependencies [8eeac33]
|
||||
- @llamaindex/cloud@4.0.19
|
||||
- @llamaindex/core@0.6.14
|
||||
- llamaindex@0.11.14
|
||||
- @llamaindex/node-parser@2.0.14
|
||||
- @llamaindex/openai@0.4.8
|
||||
- @llamaindex/readers@3.1.13
|
||||
- @llamaindex/workflow@1.1.14
|
||||
|
||||
## 0.2.34
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 39758ab: Add title to homepage header
|
||||
|
||||
## 0.2.33
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [47a7555]
|
||||
- @llamaindex/cloud@4.0.18
|
||||
- llamaindex@0.11.13
|
||||
|
||||
## 0.2.32
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [d578889]
|
||||
- Updated dependencies [0fcc92f]
|
||||
- Updated dependencies [515a8b9]
|
||||
- @llamaindex/core@0.6.13
|
||||
- llamaindex@0.11.12
|
||||
- @llamaindex/cloud@4.0.17
|
||||
- @llamaindex/node-parser@2.0.13
|
||||
- @llamaindex/openai@0.4.7
|
||||
- @llamaindex/readers@3.1.12
|
||||
- @llamaindex/workflow@1.1.13
|
||||
|
||||
## 0.2.31
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [7039e1a]
|
||||
- Updated dependencies [7039e1a]
|
||||
- llamaindex@0.11.11
|
||||
- @llamaindex/core@0.6.12
|
||||
- @llamaindex/cloud@4.0.16
|
||||
- @llamaindex/node-parser@2.0.12
|
||||
- @llamaindex/openai@0.4.6
|
||||
- @llamaindex/readers@3.1.11
|
||||
- @llamaindex/workflow@1.1.12
|
||||
|
||||
## 0.2.30
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [f7ec293]
|
||||
- @llamaindex/workflow@1.1.11
|
||||
- llamaindex@0.11.10
|
||||
|
||||
## 0.2.29
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [c5846bd]
|
||||
- @llamaindex/readers@3.1.10
|
||||
|
||||
## 0.2.28
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [a89e187]
|
||||
- Updated dependencies [62699b7]
|
||||
- Updated dependencies [c5b2691]
|
||||
- Updated dependencies [d8ac8d3]
|
||||
- @llamaindex/core@0.6.11
|
||||
- @llamaindex/openai@0.4.5
|
||||
- @llamaindex/cloud@4.0.15
|
||||
- llamaindex@0.11.9
|
||||
- @llamaindex/node-parser@2.0.11
|
||||
- @llamaindex/readers@3.1.9
|
||||
- @llamaindex/workflow@1.1.10
|
||||
|
||||
## 0.2.27
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 8a51c16: Add natural language agent page
|
||||
- Updated dependencies [8a51c16]
|
||||
- Updated dependencies [1b5af14]
|
||||
- @llamaindex/workflow@1.1.9
|
||||
- @llamaindex/core@0.6.10
|
||||
- llamaindex@0.11.8
|
||||
- @llamaindex/cloud@4.0.14
|
||||
- @llamaindex/node-parser@2.0.10
|
||||
- @llamaindex/openai@0.4.4
|
||||
- @llamaindex/readers@3.1.8
|
||||
|
||||
## 0.2.26
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- a4d394f: fix: correct SimpleDirectoryReader import path in documentation example
|
||||
- Updated dependencies [dbd857f]
|
||||
- Updated dependencies [3c857f4]
|
||||
- @llamaindex/workflow@1.1.8
|
||||
- llamaindex@0.11.7
|
||||
|
||||
## 0.2.25
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [40161fe]
|
||||
- @llamaindex/workflow@1.1.7
|
||||
- llamaindex@0.11.6
|
||||
|
||||
## 0.2.24
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [766054b]
|
||||
- Updated dependencies [71598f8]
|
||||
- @llamaindex/workflow@1.1.6
|
||||
- @llamaindex/core@0.6.9
|
||||
- llamaindex@0.11.5
|
||||
- @llamaindex/cloud@4.0.13
|
||||
- @llamaindex/node-parser@2.0.9
|
||||
- @llamaindex/openai@0.4.3
|
||||
- @llamaindex/readers@3.1.7
|
||||
|
||||
## 0.2.23
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [c927457]
|
||||
- @llamaindex/openai@0.4.2
|
||||
- @llamaindex/core@0.6.8
|
||||
- @llamaindex/cloud@4.0.12
|
||||
- llamaindex@0.11.4
|
||||
- @llamaindex/node-parser@2.0.8
|
||||
- @llamaindex/readers@3.1.6
|
||||
- @llamaindex/workflow@1.1.5
|
||||
|
||||
## 0.2.22
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [76ff23d]
|
||||
- @llamaindex/cloud@4.0.11
|
||||
- llamaindex@0.11.3
|
||||
|
||||
## 0.2.21
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [59601dd]
|
||||
- @llamaindex/openai@0.4.1
|
||||
- @llamaindex/core@0.6.7
|
||||
- @llamaindex/cloud@4.0.10
|
||||
- llamaindex@0.11.2
|
||||
- @llamaindex/node-parser@2.0.7
|
||||
- @llamaindex/readers@3.1.5
|
||||
- @llamaindex/workflow@1.1.4
|
||||
|
||||
## 0.2.20
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [3703f90]
|
||||
- @llamaindex/cloud@4.0.9
|
||||
- llamaindex@0.11.1
|
||||
|
||||
## 0.2.19
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [680b529]
|
||||
- Updated dependencies [b0cd530]
|
||||
- Updated dependencies [361a685]
|
||||
- Updated dependencies [3e66ddc]
|
||||
- @llamaindex/workflow@1.1.3
|
||||
- @llamaindex/core@0.6.6
|
||||
- llamaindex@0.11.0
|
||||
- @llamaindex/openai@0.4.0
|
||||
- @llamaindex/cloud@4.0.8
|
||||
- @llamaindex/node-parser@2.0.6
|
||||
- @llamaindex/readers@3.1.4
|
||||
|
||||
## 0.2.18
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- d671ed6: Add functionality for search params when querying Qdrant vector store.
|
||||
- Updated dependencies [76c9a80]
|
||||
- Updated dependencies [168d11f]
|
||||
- Updated dependencies [d671ed6]
|
||||
- Updated dependencies [40f5f41]
|
||||
- @llamaindex/openai@0.3.7
|
||||
- @llamaindex/workflow@1.1.2
|
||||
- @llamaindex/core@0.6.5
|
||||
- @llamaindex/cloud@4.0.7
|
||||
- llamaindex@0.10.6
|
||||
- @llamaindex/node-parser@2.0.5
|
||||
- @llamaindex/readers@3.1.3
|
||||
|
||||
## 0.2.17
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [9b2e25a]
|
||||
- @llamaindex/openai@0.3.6
|
||||
- @llamaindex/core@0.6.4
|
||||
- llamaindex@0.10.5
|
||||
- @llamaindex/cloud@4.0.6
|
||||
- @llamaindex/node-parser@2.0.4
|
||||
- @llamaindex/readers@3.1.2
|
||||
- @llamaindex/workflow@1.1.1
|
||||
|
||||
## 0.2.16
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [7e8e454]
|
||||
- Updated dependencies [2225ffd]
|
||||
- Updated dependencies [6ddf1c1]
|
||||
- Updated dependencies [bc53342]
|
||||
- Updated dependencies [41953a3]
|
||||
- @llamaindex/workflow@1.1.0
|
||||
- @llamaindex/cloud@4.0.5
|
||||
- llamaindex@0.10.4
|
||||
|
||||
## 0.2.15
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [3ee8c83]
|
||||
- @llamaindex/core@0.6.3
|
||||
- llamaindex@0.10.3
|
||||
- @llamaindex/openai@0.3.5
|
||||
- @llamaindex/cloud@4.0.4
|
||||
- @llamaindex/node-parser@2.0.3
|
||||
- @llamaindex/readers@3.1.1
|
||||
- @llamaindex/workflow@1.0.4
|
||||
|
||||
## 0.2.14
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [1e59695]
|
||||
- @llamaindex/readers@3.1.0
|
||||
|
||||
## 0.2.13
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [e5c3f95]
|
||||
- @llamaindex/openai@0.3.4
|
||||
- llamaindex@0.10.2
|
||||
|
||||
## 0.2.12
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [96dd798]
|
||||
- @llamaindex/openai@0.3.3
|
||||
- llamaindex@0.10.1
|
||||
|
||||
## 0.2.11
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 6cf928f: chore: use bunchee for llamaindex
|
||||
- Updated dependencies [6cf928f]
|
||||
- llamaindex@0.10.0
|
||||
|
||||
## 0.2.10
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 411dcea: Add Nova Premier to AWS Nova models. Add EU endpoints
|
||||
|
||||
## 0.2.9
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [d365eb2]
|
||||
- @llamaindex/openai@0.3.2
|
||||
- llamaindex@0.9.19
|
||||
|
||||
## 0.2.8
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 2ffdb27: docs: correct the CondenseQuestionChatEngine path
|
||||
- Updated dependencies [88b7046]
|
||||
- @llamaindex/openai@0.3.1
|
||||
- llamaindex@0.9.18
|
||||
|
||||
## 0.2.7
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 3ffee26: feat: enhance config params for LlamaIndexServer
|
||||
|
||||
## 0.2.6
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [3534c37]
|
||||
- Updated dependencies [41191d0]
|
||||
- llamaindex@0.9.17
|
||||
- @llamaindex/workflow@1.0.3
|
||||
- @llamaindex/cloud@4.0.3
|
||||
|
||||
## 0.2.5
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 4999df1: bump nextjs
|
||||
- Updated dependencies [f5e4d09]
|
||||
- llamaindex@0.9.16
|
||||
|
||||
## 0.2.4
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 9c63f3f: Add support for openai responses api
|
||||
- Updated dependencies [9c63f3f]
|
||||
- Updated dependencies [c515a32]
|
||||
- @llamaindex/openai@0.3.0
|
||||
- @llamaindex/core@0.6.2
|
||||
- @llamaindex/workflow@1.0.2
|
||||
- llamaindex@0.9.15
|
||||
- @llamaindex/cloud@4.0.2
|
||||
- @llamaindex/node-parser@2.0.2
|
||||
- @llamaindex/readers@3.0.2
|
||||
|
||||
## 0.2.3
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 648cfb5: Add support for supabase vector store
|
||||
Added doc for the supbase vector store
|
||||
- Updated dependencies [1b6f368]
|
||||
- Updated dependencies [eaf326e]
|
||||
- Updated dependencies [9d951b2]
|
||||
- @llamaindex/core@0.6.1
|
||||
- llamaindex@0.9.14
|
||||
- @llamaindex/cloud@4.0.1
|
||||
- @llamaindex/node-parser@2.0.1
|
||||
- @llamaindex/openai@0.2.1
|
||||
- @llamaindex/readers@3.0.1
|
||||
- @llamaindex/workflow@1.0.1
|
||||
|
||||
## 0.2.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- e98033e: docs: correct the number of indexes
|
||||
|
||||
## 0.2.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [75d6e29]
|
||||
- llamaindex@0.9.13
|
||||
|
||||
## 0.2.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- f1db9b3: Adding an options parameter to vercel tool to tailor responses
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 21bebfc: Expose more content to fix the issue with unavailable documentation links, and adjust the documentation based on the latest code.
|
||||
- 2b39cef: Added documentation for structured output in openai and ollama
|
||||
- Updated dependencies [21bebfc]
|
||||
- Updated dependencies [93bc0ff]
|
||||
- Updated dependencies [91a18e7]
|
||||
- Updated dependencies [bf56fc0]
|
||||
- Updated dependencies [f8a86e4]
|
||||
- Updated dependencies [5189b44]
|
||||
- Updated dependencies [58a9446]
|
||||
- @llamaindex/readers@3.0.0
|
||||
- @llamaindex/core@0.6.0
|
||||
- @llamaindex/openai@0.2.0
|
||||
- @llamaindex/cloud@4.0.0
|
||||
- @llamaindex/workflow@1.0.0
|
||||
- llamaindex@0.9.12
|
||||
- @llamaindex/node-parser@2.0.0
|
||||
|
||||
## 0.1.11
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- a8c0637: feat: simplify to provide base URL to OpenAI
|
||||
- a654f58: Added docs for using perplexity
|
||||
- 98eebf7: Add RequestOptions parameter passing to support Gemini proxy calls.
|
||||
Add a usage example for the RequestOptions parameter.
|
||||
- Updated dependencies [a8c0637]
|
||||
- @llamaindex/openai@0.1.61
|
||||
- llamaindex@0.9.11
|
||||
|
||||
## 0.1.10
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [aea550a]
|
||||
- Updated dependencies [c1b5be5]
|
||||
- Updated dependencies [40ee761]
|
||||
- Updated dependencies [40ee761]
|
||||
- @llamaindex/openai@0.1.60
|
||||
- llamaindex@0.9.10
|
||||
- @llamaindex/workflow@0.0.16
|
||||
- @llamaindex/core@0.5.8
|
||||
- @llamaindex/cloud@3.0.9
|
||||
- @llamaindex/node-parser@1.0.8
|
||||
- @llamaindex/readers@2.0.8
|
||||
|
||||
## 0.1.9
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 4bac71d: Support binding additional argument to function tool
|
||||
- Updated dependencies [4bac71d]
|
||||
- @llamaindex/core@0.5.7
|
||||
- @llamaindex/cloud@3.0.8
|
||||
- llamaindex@0.9.9
|
||||
- @llamaindex/node-parser@1.0.7
|
||||
- @llamaindex/openai@0.1.59
|
||||
- @llamaindex/readers@2.0.7
|
||||
- @llamaindex/workflow@0.0.15
|
||||
|
||||
## 0.1.8
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [4b49428]
|
||||
- Updated dependencies [bbc8c87]
|
||||
- @llamaindex/workflow@0.0.14
|
||||
- llamaindex@0.9.8
|
||||
|
||||
## 0.1.7
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [beb922b]
|
||||
- @llamaindex/core@0.5.6
|
||||
- llamaindex@0.9.7
|
||||
- @llamaindex/cloud@3.0.7
|
||||
- @llamaindex/node-parser@1.0.6
|
||||
- @llamaindex/openai@0.1.58
|
||||
- @llamaindex/readers@2.0.6
|
||||
- @llamaindex/workflow@0.0.13
|
||||
|
||||
## 0.1.6
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [5668970]
|
||||
- @llamaindex/core@0.5.5
|
||||
- @llamaindex/workflow@0.0.12
|
||||
- @llamaindex/cloud@3.0.6
|
||||
- llamaindex@0.9.6
|
||||
- @llamaindex/node-parser@1.0.5
|
||||
- @llamaindex/openai@0.1.57
|
||||
- @llamaindex/readers@2.0.5
|
||||
|
||||
## 0.1.5
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [ad3c7f1]
|
||||
- @llamaindex/core@0.5.4
|
||||
- @llamaindex/cloud@3.0.5
|
||||
- llamaindex@0.9.5
|
||||
- @llamaindex/node-parser@1.0.4
|
||||
- @llamaindex/openai@0.1.56
|
||||
- @llamaindex/readers@2.0.4
|
||||
|
||||
## 0.1.4
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [cb256f2]
|
||||
- Updated dependencies [cb021e7]
|
||||
- @llamaindex/openai@0.1.55
|
||||
- @llamaindex/core@0.5.3
|
||||
- llamaindex@0.9.4
|
||||
- @llamaindex/cloud@3.0.4
|
||||
- @llamaindex/node-parser@1.0.3
|
||||
- @llamaindex/readers@2.0.3
|
||||
|
||||
## 0.1.3
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [d952e68]
|
||||
- @llamaindex/core@0.5.2
|
||||
- @llamaindex/cloud@3.0.3
|
||||
- llamaindex@0.9.3
|
||||
- @llamaindex/node-parser@1.0.2
|
||||
- @llamaindex/openai@0.1.54
|
||||
- @llamaindex/readers@2.0.2
|
||||
|
||||
## 0.1.2
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [c902fcb]
|
||||
- Updated dependencies [88d776f]
|
||||
- @llamaindex/cloud@3.0.2
|
||||
- llamaindex@0.9.2
|
||||
|
||||
## 0.1.1
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [6d37d44]
|
||||
- llamaindex@0.9.1
|
||||
- @llamaindex/cloud@3.0.1
|
||||
- @llamaindex/core@0.5.1
|
||||
- @llamaindex/node-parser@1.0.1
|
||||
- @llamaindex/openai@0.1.53
|
||||
- @llamaindex/readers@2.0.1
|
||||
- @llamaindex/workflow@0.0.11
|
||||
|
||||
## 0.1.0
|
||||
|
||||
### Minor Changes
|
||||
|
||||
- 6a4a737: Remove re-exports from llamaindex main package
|
||||
- f4588bc: Remove readers package from llamaindex
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- c7c0800: fix: fumadoc build fail
|
||||
- a87efb9: docs: update chat engine docs
|
||||
- 7bd5d93: docs: update workflow doc
|
||||
- Updated dependencies [6a4a737]
|
||||
- Updated dependencies [d924c63]
|
||||
- Updated dependencies [b490376]
|
||||
- Updated dependencies [f4588bc]
|
||||
- llamaindex@0.9.0
|
||||
- @llamaindex/core@0.5.0
|
||||
- @llamaindex/cloud@3.0.0
|
||||
- @llamaindex/node-parser@1.0.0
|
||||
- @llamaindex/openai@0.1.52
|
||||
- @llamaindex/readers@2.0.0
|
||||
|
||||
## 0.0.41
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [1c908fd]
|
||||
- @llamaindex/openai@0.1.51
|
||||
- @llamaindex/node-parser@0.0.24
|
||||
- @llamaindex/workflow@0.0.10
|
||||
- @llamaindex/readers@1.0.25
|
||||
- @llamaindex/cloud@2.0.24
|
||||
- @llamaindex/core@0.4.23
|
||||
- llamaindex@0.8.37
|
||||
|
||||
## 0.0.40
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [cb608b5]
|
||||
- @llamaindex/openai@0.1.50
|
||||
- @llamaindex/node-parser@0.0.23
|
||||
- @llamaindex/workflow@0.0.9
|
||||
- @llamaindex/readers@1.0.24
|
||||
- @llamaindex/cloud@2.0.23
|
||||
- @llamaindex/core@0.4.22
|
||||
- llamaindex@0.8.36
|
||||
|
||||
## 0.0.39
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- 6d4d96f: chore: update examples and docs to use unified imports
|
||||
- Updated dependencies [15563a0]
|
||||
- @llamaindex/openai@0.1.49
|
||||
- llamaindex@0.8.35
|
||||
|
||||
## 0.0.38
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [9f8ad37]
|
||||
- Updated dependencies [7265f74]
|
||||
- llamaindex@0.8.34
|
||||
- @llamaindex/openai@0.1.48
|
||||
|
||||
## 0.0.37
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- Updated dependencies [2019a04]
|
||||
- @llamaindex/openai@0.1.47
|
||||
- llamaindex@0.8.33
|
||||
|
||||
## 0.0.36
|
||||
|
||||
### Patch Changes
|
||||
|
||||
@@ -0,0 +1,143 @@
|
||||
# CLAUDE.md
|
||||
|
||||
This file provides guidance to Claude Code (claude.ai/code) when working with the LlamaIndex.TS documentation site.
|
||||
|
||||
## Application Overview
|
||||
|
||||
This is a Next.js documentation site (`@llamaindex/doc`) that serves as the official documentation for LlamaIndex.TS. It's built using Fumadocs, a modern documentation framework, and includes interactive features, API documentation generation, and AI-powered chat functionality.
|
||||
|
||||
## Development Commands
|
||||
|
||||
From this directory (`apps/next/`):
|
||||
|
||||
- `pnpm dev` - Start development server with Turbo
|
||||
- `pnpm build` - Build the documentation site (includes `prebuild` step)
|
||||
- `pnpm start` - Start production server
|
||||
- `pnpm build:docs` - Generate API documentation from TypeScript source
|
||||
- `pnpm validate-links` - Validate all internal and external links
|
||||
|
||||
Key build process:
|
||||
|
||||
1. `prebuild` runs `build:docs` to generate API documentation using TypeDoc
|
||||
2. `build` runs Next.js build process
|
||||
3. `postbuild` runs post-processing scripts and link validation
|
||||
|
||||
## Architecture
|
||||
|
||||
### Framework Stack
|
||||
|
||||
- **Next.js 15.3** - React framework with App Router
|
||||
- **Fumadocs** - Documentation framework with MDX support
|
||||
- **React Server Components** - AI chat functionality with server actions
|
||||
- **Tailwind CSS** - Styling with custom design system
|
||||
- **TypeScript** - Full type safety
|
||||
|
||||
### Key Dependencies
|
||||
|
||||
- **Fumadocs ecosystem**: `fumadocs-ui`, `fumadocs-mdx`, `fumadocs-core`, `fumadocs-openapi`
|
||||
- **AI features**: `ai` package for React Server Components chat
|
||||
- **Code features**: Monaco Editor, Shiki syntax highlighting, Twoslash TypeScript integration
|
||||
- **UI components**: Radix UI primitives, Framer Motion animations
|
||||
- **Content processing**: MDX, remark/rehype plugins, TypeDoc for API generation
|
||||
|
||||
### Directory Structure
|
||||
|
||||
**Content Management:**
|
||||
|
||||
- `src/content/docs/` - MDX documentation files organized by topic
|
||||
- `src/content/docs/api/` - Auto-generated API documentation from TypeScript
|
||||
- `scripts/` - Build-time documentation generation and validation
|
||||
|
||||
**Application Code:**
|
||||
|
||||
- `src/app/` - Next.js App Router pages and API routes
|
||||
- `src/components/` - Reusable React components including UI library
|
||||
- `src/lib/` - Utilities, constants, and configuration
|
||||
|
||||
**Configuration:**
|
||||
|
||||
- `source.config.ts` - Fumadocs MDX configuration with plugins
|
||||
- `next.config.mjs` - Next.js configuration with MDX integration
|
||||
- `tailwind.config.mjs` - Tailwind CSS customization
|
||||
|
||||
### Key Features
|
||||
|
||||
**Documentation Features:**
|
||||
|
||||
- MDX-based content with TypeScript code highlighting
|
||||
- Auto-generated API documentation from TypeScript source
|
||||
- Interactive code examples with Monaco Editor
|
||||
- Math equation support with KaTeX
|
||||
- Link validation and build-time checks
|
||||
|
||||
**Interactive Features:**
|
||||
|
||||
- AI-powered chat interface using React Server Components
|
||||
- Code demos with live TypeScript execution
|
||||
- Interactive UI components and animations
|
||||
- Search functionality across all documentation
|
||||
|
||||
**Build Process:**
|
||||
|
||||
- TypeDoc generates API documentation from workspace packages
|
||||
- Custom scripts transform and validate generated content
|
||||
- Link checking ensures all internal/external links work
|
||||
- Static site generation with 10-minute timeout for large documentation set
|
||||
|
||||
### Configuration Files
|
||||
|
||||
**source.config.ts**: Defines MDX processing pipeline with:
|
||||
|
||||
- Code highlighting themes (Catppuccin)
|
||||
- Twoslash TypeScript integration
|
||||
- Remark/rehype plugins for enhanced Markdown
|
||||
- Content directories including external docs
|
||||
|
||||
**next.config.mjs**: Next.js configuration with:
|
||||
|
||||
- Extended static generation timeout (10 minutes)
|
||||
- Monaco Editor transpilation
|
||||
- Server external packages for build optimization
|
||||
- Webpack/Turbopack aliases for browser compatibility
|
||||
|
||||
### Content Organization
|
||||
|
||||
**Documentation Structure:**
|
||||
|
||||
- `/docs/llamaindex/` - Core LlamaIndex.TS documentation
|
||||
- `/docs/cloud/` - LlamaCloud integration guides
|
||||
- `/docs/api/` - Auto-generated TypeScript API reference
|
||||
|
||||
**Content Sources:**
|
||||
|
||||
- Local MDX files in `src/content/docs/`
|
||||
- External docs from `@llamaindex/workflow-docs` package
|
||||
- Generated API docs from TypeScript source
|
||||
|
||||
### Development Notes
|
||||
|
||||
- Documentation content is sourced from multiple locations including external packages
|
||||
- API documentation is regenerated on each build from TypeScript source
|
||||
- The site uses advanced MDX features including custom transformers and plugins
|
||||
- Build process includes comprehensive link validation
|
||||
- Large memory allocation needed for TypeDoc generation (`--max-old-space-size=8192`)
|
||||
- Chat functionality uses React Server Components with streaming responses
|
||||
|
||||
### AI Chat Integration
|
||||
|
||||
The documentation includes an AI chat feature that:
|
||||
|
||||
- Uses React Server Components for server-side AI processing
|
||||
- Integrates with LlamaIndex.TS packages for demonstrations
|
||||
- Provides interactive examples and code generation
|
||||
- Streams responses for better user experience
|
||||
|
||||
### Content Authoring
|
||||
|
||||
When adding new documentation:
|
||||
|
||||
- Create MDX files in appropriate `src/content/docs/` subdirectories
|
||||
- Follow existing content structure and frontmatter conventions
|
||||
- Use Fumadocs MDX features like code blocks, callouts, and tabs
|
||||
- API documentation is auto-generated - edit TypeScript source comments instead
|
||||
- Run `pnpm validate-links` to check all links before publishing
|
||||
@@ -3,11 +3,12 @@
|
||||
This is a Next.js application generated with
|
||||
[Create Fumadocs](https://github.com/fuma-nama/fumadocs).
|
||||
|
||||
> Note: Before running the development server, make sure to build the whole project first, see [CONTRIBUTING.md](../../CONTRIBUTING.md) for more details.
|
||||
|
||||
Run development server:
|
||||
|
||||
```bash
|
||||
turbo run dev
|
||||
# turbo will build all required packages before running the dev server
|
||||
pnpm run dev
|
||||
```
|
||||
|
||||
## Learn More
|
||||
|
||||
@@ -12,9 +12,9 @@
|
||||
},
|
||||
"aliases": {
|
||||
"components": "@/components",
|
||||
"utils": "@/lib/utils",
|
||||
"utils": "@/libs/utils",
|
||||
"ui": "@/components/ui",
|
||||
"lib": "@/lib",
|
||||
"lib": "@/libs",
|
||||
"hooks": "@/hooks"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -0,0 +1,2 @@
|
||||
// fallback for `fs` usage in `web-tree-sitter`
|
||||
module.exports = {};
|
||||
@@ -1,13 +1,40 @@
|
||||
import { createMDX } from "fumadocs-mdx/next";
|
||||
import MonacoWebpackPlugin from "monaco-editor-webpack-plugin";
|
||||
const withMDX = createMDX();
|
||||
|
||||
/** @type {import('next').NextConfig} */
|
||||
const config = {
|
||||
// default timeout for static generation is 60s, but we need to increase it to 10 minutes due to the large number of document pages
|
||||
staticPageGenerationTimeout: 600,
|
||||
reactStrictMode: true,
|
||||
eslint: {
|
||||
ignoreDuringBuilds: true,
|
||||
},
|
||||
transpilePackages: ["monaco-editor"],
|
||||
serverExternalPackages: ["@huggingface/transformers"],
|
||||
webpack: (config, { isServer }) => {
|
||||
serverExternalPackages: [
|
||||
"@huggingface/transformers",
|
||||
"twoslash",
|
||||
"typescript",
|
||||
],
|
||||
async redirects() {
|
||||
return [
|
||||
{
|
||||
source: "/docs/chat-ui/:path*.mdx",
|
||||
destination: "/docs/chat-ui/:path*",
|
||||
permanent: true,
|
||||
},
|
||||
{
|
||||
source: "/docs/workflows/:path*.mdx",
|
||||
destination: "/docs/workflows/:path*",
|
||||
permanent: true,
|
||||
},
|
||||
];
|
||||
},
|
||||
turbopack: {
|
||||
resolveAlias: {
|
||||
fs: { browser: "./fallback.js" },
|
||||
},
|
||||
},
|
||||
webpack: (config) => {
|
||||
if (Array.isArray(config.target) && config.target.includes("web")) {
|
||||
config.target = ["web", "es2020"];
|
||||
}
|
||||
@@ -19,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;
|
||||
},
|
||||
|
||||
@@ -1,25 +1,31 @@
|
||||
{
|
||||
"name": "@llamaindex/doc",
|
||||
"version": "0.0.36",
|
||||
"version": "0.2.40",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"build": "pnpm run build:docs && next build",
|
||||
"dev": "next dev",
|
||||
"postinstall": "fumadocs-mdx",
|
||||
"prebuild": "pnpm run build:docs",
|
||||
"build": "next build",
|
||||
"dev": "next dev --turbo",
|
||||
"start": "next start",
|
||||
"postdev": "fumadocs-mdx",
|
||||
"postbuild": "fumadocs-mdx && tsx scripts/post-build.mts",
|
||||
"build:docs": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192\" typedoc && node ./scripts/generate-docs.mjs"
|
||||
"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.0.9",
|
||||
"@llamaindex/chat-ui-docs": "^0.0.5",
|
||||
"@llamaindex/cloud": "workspace:*",
|
||||
"@llamaindex/core": "workspace:*",
|
||||
"@llamaindex/node-parser": "workspace:*",
|
||||
"@llamaindex/openai": "workspace:*",
|
||||
"@llamaindex/readers": "workspace:*",
|
||||
"@llamaindex/workflow": "workspace:*",
|
||||
"@llamaindex/workflow-docs": "0.1.1",
|
||||
"@mdx-js/mdx": "^3.1.0",
|
||||
"@monaco-editor/react": "^4.7.0",
|
||||
"@next/third-parties": "^15.3.4",
|
||||
"@number-flow/react": "^0.3.4",
|
||||
"@radix-ui/react-dialog": "^1.1.2",
|
||||
"@radix-ui/react-icons": "^1.3.2",
|
||||
@@ -27,66 +33,67 @@
|
||||
"@radix-ui/react-slider": "^1.2.1",
|
||||
"@radix-ui/react-slot": "^1.1.0",
|
||||
"@radix-ui/react-tooltip": "^1.1.4",
|
||||
"@scalar/api-client-react": "^1.1.25",
|
||||
"@vercel/functions": "^1.5.0",
|
||||
"ai": "^3.4.33",
|
||||
"ai": "^4.3.17",
|
||||
"class-variance-authority": "^0.7.0",
|
||||
"clsx": "2.1.1",
|
||||
"foxact": "^0.2.41",
|
||||
"framer-motion": "^11.11.17",
|
||||
"fumadocs-core": "14.6.0",
|
||||
"fumadocs-docgen": "1.3.2",
|
||||
"fumadocs-mdx": "^11.1.2",
|
||||
"fumadocs-openapi": "^5.8.2",
|
||||
"fumadocs-twoslash": "^2.0.2",
|
||||
"fumadocs-typescript": "^3.0.2",
|
||||
"fumadocs-ui": "14.6.0",
|
||||
"fumadocs-core": "^15.5.0",
|
||||
"fumadocs-docgen": "^2.0.0",
|
||||
"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.0.3",
|
||||
"next": "^15.3.3",
|
||||
"next-themes": "^0.4.3",
|
||||
"react": "^18.3.1",
|
||||
"react-dom": "^18.3.1",
|
||||
"react": "^19.1.0",
|
||||
"react-dom": "^19.1.0",
|
||||
"react-icons": "^5.3.0",
|
||||
"react-monaco-editor": "^0.56.2",
|
||||
"react-text-transition": "^3.1.0",
|
||||
"react-use-measure": "^2.1.1",
|
||||
"rehype-katex": "^7.0.1",
|
||||
"remark-math": "^6.0.0",
|
||||
"rimraf": "^6.0.1",
|
||||
"shiki": "1.23.1",
|
||||
"shiki-magic-move": "^0.5.0",
|
||||
"shiki": "^3.1.0",
|
||||
"shiki-magic-move": "^1.0.1",
|
||||
"swr": "^2.2.5",
|
||||
"tailwind-merge": "^2.5.2",
|
||||
"tailwindcss-animate": "^1.0.7",
|
||||
"tree-sitter": "^0.22.1",
|
||||
"tree-sitter-typescript": "^0.23.2",
|
||||
"ts-morph": "^25.0.1",
|
||||
"twoslash": "^0.3.1",
|
||||
"use-stick-to-bottom": "^1.0.42",
|
||||
"web-tree-sitter": "^0.24.4",
|
||||
"zod": "^3.23.8"
|
||||
"zod": "^3.25.76"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@next/env": "^15.0.3",
|
||||
"@next/env": "^15.3.0",
|
||||
"@tailwindcss/postcss": "^4.0.9",
|
||||
"@types/mdx": "^2.0.13",
|
||||
"@types/node": "22.9.0",
|
||||
"@types/react": "^18.3.12",
|
||||
"@types/react-dom": "^18.3.1",
|
||||
"@types/node": "24.0.13",
|
||||
"@types/react": "^19.1.8",
|
||||
"@types/react-dom": "^19.1.6",
|
||||
"autoprefixer": "^10.4.20",
|
||||
"cross-env": "^7.0.3",
|
||||
"fast-glob": "^3.3.2",
|
||||
"gray-matter": "^4.0.3",
|
||||
"monaco-editor-webpack-plugin": "^7.1.0",
|
||||
"postcss": "^8.4.49",
|
||||
"postcss": "^8.5.6",
|
||||
"raw-loader": "^4.0.2",
|
||||
"remark": "^15.0.1",
|
||||
"remark-gfm": "^4.0.0",
|
||||
"remark-mdx": "^3.1.0",
|
||||
"remark-stringify": "^11.0.0",
|
||||
"tailwindcss": "^3.4.15",
|
||||
"tsx": "^4.19.2",
|
||||
"typedoc": "0.27.4",
|
||||
"typedoc-plugin-markdown": "^4.3.1",
|
||||
"typedoc-plugin-merge-modules": "^6.1.0",
|
||||
"typescript": "^5.7.2"
|
||||
"tailwindcss": "^4.1.11",
|
||||
"tsx": "^4.20.3",
|
||||
"typedoc": "0.28.3",
|
||||
"typedoc-plugin-markdown": "^4.6.2",
|
||||
"typedoc-plugin-merge-modules": " ^7.0.0",
|
||||
"typescript": "^5.8.3"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,6 +0,0 @@
|
||||
module.exports = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
autoprefixer: {},
|
||||
},
|
||||
};
|
||||
@@ -0,0 +1,5 @@
|
||||
export default {
|
||||
plugins: {
|
||||
"@tailwindcss/postcss": {},
|
||||
},
|
||||
};
|
||||
|
Before Width: | Height: | Size: 27 KiB After Width: | Height: | Size: 27 KiB |
|
Before Width: | Height: | Size: 49 KiB After Width: | Height: | Size: 49 KiB |
|
Before Width: | Height: | Size: 36 KiB After Width: | Height: | Size: 36 KiB |
|
Before Width: | Height: | Size: 236 KiB After Width: | Height: | Size: 236 KiB |
|
Before Width: | Height: | Size: 540 KiB After Width: | Height: | Size: 540 KiB |
@@ -1,86 +0,0 @@
|
||||
import * as OpenAPI from "fumadocs-openapi";
|
||||
import { generateFiles } from "fumadocs-typescript";
|
||||
import fs from "node:fs";
|
||||
import * as path from "node:path";
|
||||
import { fileURLToPath } from "node:url";
|
||||
import { rimrafSync } from "rimraf";
|
||||
|
||||
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");
|
||||
},
|
||||
});
|
||||
|
||||
void OpenAPI.generateFiles({
|
||||
input: [
|
||||
fileURLToPath(
|
||||
new URL("../../../packages/cloud/openapi.json", import.meta.url),
|
||||
),
|
||||
],
|
||||
output: out,
|
||||
groupBy: "tag",
|
||||
});
|
||||
|
||||
void generateFiles({
|
||||
input: ["./src/content/docs/api/**/*.mdx"],
|
||||
output: (file) => path.resolve(path.dirname(file), path.basename(file)),
|
||||
transformOutput,
|
||||
});
|
||||
|
||||
function transformOutput(filePath, content) {
|
||||
const fileName = path.basename(filePath);
|
||||
let title = fileName.split(".")[0];
|
||||
let pageContent = content;
|
||||
if (title === "index") title = "LlamaIndex API Reference";
|
||||
return `---\ntitle: ${title}\n---\n\n${transformAbsoluteUrl(pageContent, 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)
|
||||
*/
|
||||
function transformAbsoluteUrl(content, filePath) {
|
||||
const group = path.dirname(filePath).split(path.sep).pop();
|
||||
return content.replace(
|
||||
/\]\(([^)]+)\.mdx([^)]*)\)/g,
|
||||
(match, slug, anchor) => {
|
||||
const slugParts = slug.split("/");
|
||||
const fileName = slugParts[slugParts.length - 1];
|
||||
const fileGroup = slugParts[slugParts.length - 2] ?? group;
|
||||
const result = ["/docs/api", fileGroup, fileName, anchor]
|
||||
.filter(Boolean)
|
||||
.join("/");
|
||||
return `](${result})`;
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
// append meta.json for API page
|
||||
fs.writeFileSync(
|
||||
path.resolve(apiRefOut, "meta.json"),
|
||||
JSON.stringify(
|
||||
{
|
||||
title: "API Reference",
|
||||
description: "LlamaIndex API Reference",
|
||||
root: true,
|
||||
pages: [
|
||||
"index",
|
||||
"classes",
|
||||
"enumerations",
|
||||
"functions",
|
||||
"interfaces",
|
||||
"type-aliases",
|
||||
"variables",
|
||||
],
|
||||
},
|
||||
null,
|
||||
2,
|
||||
),
|
||||
);
|
||||
@@ -0,0 +1,77 @@
|
||||
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.md") && !v.endsWith("meta.json");
|
||||
},
|
||||
});
|
||||
|
||||
void typescriptGenerateFiles(generator, {
|
||||
input: ["./src/content/docs/api/**/*.md"],
|
||||
output: (file) => path.resolve(path.dirname(file), path.basename(file)),
|
||||
transformOutput,
|
||||
});
|
||||
|
||||
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.replace(/(?<!\\)\{([^}]+)(?<!\\)}/g, "\\{$1\\}"),
|
||||
filePath,
|
||||
)}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 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(/\]\(([^)]+)\.md([^)]*)\)/g, (_, slug, anchor) => {
|
||||
const slugParts = slug.split("/");
|
||||
const fileName = slugParts[slugParts.length - 1];
|
||||
const fileGroup = slugParts[slugParts.length - 2] ?? group;
|
||||
const result = ["/docs/api", fileGroup, fileName, anchor]
|
||||
.filter(Boolean)
|
||||
.join("/");
|
||||
return `](${result})`;
|
||||
});
|
||||
}
|
||||
|
||||
// append meta.json for API page
|
||||
fs.writeFileSync(
|
||||
path.resolve(apiRefOut, "meta.json"),
|
||||
JSON.stringify(
|
||||
{
|
||||
title: "API Reference",
|
||||
description: "LlamaIndex API Reference",
|
||||
root: true,
|
||||
pages: [
|
||||
"index",
|
||||
"classes",
|
||||
"enumerations",
|
||||
"functions",
|
||||
"interfaces",
|
||||
"type-aliases",
|
||||
"variables",
|
||||
],
|
||||
},
|
||||
null,
|
||||
2,
|
||||
),
|
||||
);
|
||||
@@ -4,4 +4,8 @@ import { updateLlamaCloud } from "./update-llamacloud.mjs";
|
||||
|
||||
env.loadEnvConfig(process.cwd());
|
||||
|
||||
await updateLlamaCloud();
|
||||
if (process.env.VERCEL_ENV === "production") {
|
||||
updateLlamaCloud().catch((error) => {
|
||||
console.error(error);
|
||||
});
|
||||
}
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
import { upsertBatchPipelineDocumentsApiV1PipelinesPipelineIdDocumentsPut } from "@llamaindex/cloud/api";
|
||||
import fg from "fast-glob";
|
||||
import {
|
||||
fileGenerator,
|
||||
remarkDocGen,
|
||||
remarkInstall,
|
||||
typescriptGenerator,
|
||||
} from "fumadocs-docgen";
|
||||
import { fileGenerator, remarkDocGen, remarkInstall } from "fumadocs-docgen";
|
||||
import { remarkAutoTypeTable } from "fumadocs-typescript";
|
||||
import matter from "gray-matter";
|
||||
import * as fs from "node:fs/promises";
|
||||
import path, { relative } from "node:path";
|
||||
@@ -21,7 +17,8 @@ async function processContent(content: string): Promise<string> {
|
||||
const file = await remark()
|
||||
.use(remarkMdx)
|
||||
.use(remarkGfm)
|
||||
.use(remarkDocGen, { generators: [typescriptGenerator(), fileGenerator()] })
|
||||
.use(remarkAutoTypeTable)
|
||||
.use(remarkDocGen, { generators: [fileGenerator()] })
|
||||
.use(remarkInstall, { persist: { id: "package-manager" } })
|
||||
.use(remarkStringify)
|
||||
.process(content);
|
||||
|
||||
@@ -0,0 +1,252 @@
|
||||
import glob from "fast-glob";
|
||||
import fs from "fs";
|
||||
import matter from "gray-matter";
|
||||
import path from "path";
|
||||
|
||||
const CONTENT_DIR = path.join(process.cwd(), "src/content/docs");
|
||||
|
||||
// Regular expression to find internal links
|
||||
// This captures Markdown links [text](/docs/path) and href attributes href="/docs/path"
|
||||
const INTERNAL_LINK_REGEX = /(?:(?:\]\(|\bhref=["'])\/docs\/([^")]+))/g;
|
||||
|
||||
// Regular expression to find relative links
|
||||
// This captures relative links like [text](./path) or 
|
||||
const RELATIVE_LINK_REGEX = /(?:\]\()(?:\s*)(?:\.\.?)\//g;
|
||||
|
||||
const ALLOWED_LINKS = ["/docs/workflows", "/docs/chat-ui"];
|
||||
|
||||
interface LinkValidationResult {
|
||||
file: string;
|
||||
invalidLinks: Array<{ link: string; line: number }>;
|
||||
}
|
||||
|
||||
interface RelativeLinkResult {
|
||||
file: string;
|
||||
relativeLinks: Array<{ line: number; lineContent: string }>;
|
||||
}
|
||||
|
||||
/**
|
||||
* Get all valid documentation routes from the content directory
|
||||
*/
|
||||
async function getValidRoutes(): Promise<Set<string>> {
|
||||
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?$/, "");
|
||||
|
||||
// Handle index files
|
||||
if (route.endsWith("/index")) {
|
||||
route = route.replace(/\/index$/, "");
|
||||
} else if (route === "index") {
|
||||
route = "";
|
||||
}
|
||||
|
||||
routes.add(route);
|
||||
}
|
||||
|
||||
return routes;
|
||||
}
|
||||
|
||||
/**
|
||||
* Extract internal links from a MDX file
|
||||
*/
|
||||
function extractLinksFromFile(
|
||||
filePath: string,
|
||||
): Array<{ link: string; line: number }> {
|
||||
const content = fs.readFileSync(filePath, "utf-8");
|
||||
const { content: mdxContent } = matter(content);
|
||||
|
||||
const lines = mdxContent.split("\n");
|
||||
const links: Array<{ link: string; line: number }> = [];
|
||||
|
||||
lines.forEach((line, lineNumber) => {
|
||||
let match;
|
||||
while ((match = INTERNAL_LINK_REGEX.exec(line)) !== null) {
|
||||
if (match[1]) {
|
||||
links.push({
|
||||
link: match[1],
|
||||
line: lineNumber + 1, // 1-based line numbers
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return links;
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if a link is an image link
|
||||
*/
|
||||
function isImageLink(link: string): boolean {
|
||||
// Check for image extensions
|
||||
const imageExtensions = [".png", ".jpg", ".jpeg", ".gif", ".svg", ".webp"];
|
||||
const hasImageExtension = imageExtensions.some((ext) =>
|
||||
link.toLowerCase().endsWith(ext),
|
||||
);
|
||||
|
||||
// Check for markdown image syntax: 
|
||||
const isMarkdownImage = link.trim().startsWith("!");
|
||||
|
||||
return hasImageExtension || isMarkdownImage;
|
||||
}
|
||||
|
||||
/**
|
||||
* Extract relative links from a MDX file
|
||||
*/
|
||||
function findRelativeLinksInFile(
|
||||
filePath: string,
|
||||
): Array<{ line: number; lineContent: string }> {
|
||||
const content = fs.readFileSync(filePath, "utf-8");
|
||||
const { content: mdxContent } = matter(content);
|
||||
|
||||
const lines = mdxContent.split("\n");
|
||||
const relativeLinks: Array<{ line: number; lineContent: string }> = [];
|
||||
|
||||
lines.forEach((line, lineNumber) => {
|
||||
// Check for relative links
|
||||
if (RELATIVE_LINK_REGEX.test(line)) {
|
||||
// Reset the regex lastIndex to start from the beginning of the line
|
||||
RELATIVE_LINK_REGEX.lastIndex = 0;
|
||||
|
||||
// Skip image links
|
||||
if (!isImageLink(line)) {
|
||||
relativeLinks.push({
|
||||
line: lineNumber + 1, // 1-based line numbers
|
||||
lineContent: line.trim(),
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
return relativeLinks;
|
||||
}
|
||||
|
||||
/**
|
||||
* Find relative links in all MDX files
|
||||
*/
|
||||
async function findRelativeLinks(): Promise<RelativeLinkResult[]> {
|
||||
const mdxFiles = await glob("**/*.mdx", { cwd: CONTENT_DIR });
|
||||
const results: RelativeLinkResult[] = [];
|
||||
|
||||
for (const file of mdxFiles) {
|
||||
const filePath = path.join(CONTENT_DIR, file);
|
||||
const relativeLinks = findRelativeLinksInFile(filePath);
|
||||
|
||||
if (relativeLinks.length > 0) {
|
||||
results.push({
|
||||
file,
|
||||
relativeLinks,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}
|
||||
|
||||
async function validateLinks(): Promise<LinkValidationResult[]> {
|
||||
const mdxFiles = await glob("**/*.mdx", { cwd: CONTENT_DIR });
|
||||
const validRoutes = await getValidRoutes();
|
||||
|
||||
const results: LinkValidationResult[] = [];
|
||||
|
||||
for (const file of mdxFiles) {
|
||||
const filePath = path.join(CONTENT_DIR, file);
|
||||
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];
|
||||
// Remove the trailing slash if present.
|
||||
// This works with links like "api/interfaces/MetadataFilter#operator" and "api/interfaces/MetadataFilter/#operator".
|
||||
const normalizedLink = baseLink.endsWith("/")
|
||||
? baseLink.slice(0, -1)
|
||||
: baseLink;
|
||||
|
||||
// Remove llamaindex/ prefix if it exists as it's the root of the docs
|
||||
let routePath = normalizedLink;
|
||||
if (routePath.startsWith("llamaindex/")) {
|
||||
routePath = routePath.substring("llamaindex/".length);
|
||||
}
|
||||
|
||||
return !validRoutes.has(normalizedLink) && !validRoutes.has(routePath);
|
||||
});
|
||||
|
||||
if (invalidLinks.length > 0) {
|
||||
results.push({
|
||||
file,
|
||||
invalidLinks,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return results;
|
||||
}
|
||||
|
||||
/**
|
||||
* Main function to validate links and report errors
|
||||
*/
|
||||
async function main() {
|
||||
console.log("🔍 Validating links in documentation...");
|
||||
|
||||
try {
|
||||
// Check for invalid internal links
|
||||
const validationResults: LinkValidationResult[] = await validateLinks();
|
||||
// Check for relative links
|
||||
const relativeLinksResults = await findRelativeLinks();
|
||||
|
||||
let hasErrors = false;
|
||||
|
||||
// Report invalid internal links
|
||||
if (validationResults.length > 0) {
|
||||
console.error("❌ Found invalid internal links:");
|
||||
hasErrors = true;
|
||||
|
||||
for (const result of validationResults) {
|
||||
console.error(`\nFile: ${result.file}`);
|
||||
|
||||
for (const { link, line } of result.invalidLinks) {
|
||||
console.error(` - Line ${line}: /docs/${link}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Report relative links
|
||||
if (relativeLinksResults.length > 0) {
|
||||
console.error("\n❌ Found relative links (use absolute paths instead):");
|
||||
hasErrors = true;
|
||||
|
||||
for (const result of relativeLinksResults) {
|
||||
console.error(`\nFile: ${result.file}`);
|
||||
|
||||
for (const { line, lineContent } of result.relativeLinks) {
|
||||
console.error(` - Line ${line}: ${lineContent}`);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (hasErrors) {
|
||||
// Exit with error code to fail the build
|
||||
process.exit(1);
|
||||
} else {
|
||||
console.log("✅ All links are valid!");
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("Error validating links:", error);
|
||||
process.exit(1);
|
||||
}
|
||||
}
|
||||
|
||||
main().catch((error) => {
|
||||
console.error("Unhandled error:", error);
|
||||
process.exit(1);
|
||||
});
|
||||
@@ -1,12 +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 rehypeKatex from "rehype-katex";
|
||||
import remarkMath from "remark-math";
|
||||
|
||||
export const { docs, meta } = defineDocs({
|
||||
dir: "./src/content/docs",
|
||||
export const docs = defineDocs({
|
||||
dir: [
|
||||
"./src/content/docs",
|
||||
"./node_modules/@llamaindex/workflow-docs",
|
||||
"./node_modules/@llamaindex/chat-ui-docs",
|
||||
// NOTE: When adding external docs (like chat-ui or workflow-docs above),
|
||||
// make sure to also update:
|
||||
// 1. scripts/validate-links.mts - add to ALLOWED_LINKS array
|
||||
// 2. next.config.mjs - add redirect for .mdx files
|
||||
// 3. src/content/docs/meta.json - add to pages array
|
||||
],
|
||||
docs: {
|
||||
async: true,
|
||||
},
|
||||
});
|
||||
|
||||
export default defineConfig({
|
||||
@@ -41,6 +56,7 @@ export default defineConfig({
|
||||
],
|
||||
},
|
||||
remarkPlugins: [
|
||||
remarkStructure,
|
||||
remarkMath,
|
||||
[remarkInstall, { persist: { id: "package-manager" } }],
|
||||
[remarkDocGen, { generators: [fileGenerator()] }],
|
||||
|
||||
@@ -8,38 +8,77 @@ import {
|
||||
} from "@/components/infinite-providers";
|
||||
import { MagicMove } from "@/components/magic-move";
|
||||
import { NpmInstall } from "@/components/npm-install";
|
||||
import { TextEffect } from "@/components/text-effect";
|
||||
import { Supports } from "@/components/supports";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { Skeleton } from "@/components/ui/skeleton";
|
||||
import { LEGACY_DOCUMENT_URL } from "@/lib/const";
|
||||
import { DOCUMENT_URL } from "@/libs/const";
|
||||
import { SiStackblitz } from "@icons-pack/react-simple-icons";
|
||||
import {
|
||||
CodeBlock as FumaCodeBlock,
|
||||
Pre,
|
||||
} from "fumadocs-ui/components/codeblock";
|
||||
import { Blocks, Bot, Footprints, Terminal } from "lucide-react";
|
||||
import Link from "next/link";
|
||||
import { Suspense } from "react";
|
||||
|
||||
const codes = [
|
||||
`import { openai } from "@llamaindex/openai";
|
||||
|
||||
const llm = openai();
|
||||
const response = await llm.complete({ prompt: "How are you?" });`,
|
||||
`import { openai } from "@llamaindex/openai";
|
||||
|
||||
const llm = openai();
|
||||
const response = await llm.chat({
|
||||
messages: [{ content: "Tell me a joke.", role: "user" }],
|
||||
});`,
|
||||
`import { agent } from "@llamaindex/workflow";
|
||||
import { openai } from "@llamaindex/openai";
|
||||
|
||||
const analyseAgent = agent({
|
||||
llm: openai({ model: "gpt-4o" }),
|
||||
tools: [analyseTools],
|
||||
systemPrompt,
|
||||
});
|
||||
const response = await analyseAgent.run(\`Analyse the given data:
|
||||
\${data}\`);`,
|
||||
`import { agent, multiAgent } from "@llamaindex/workflow";
|
||||
import { openai } from "@llamaindex/openai";
|
||||
|
||||
const analyseAgent = agent({
|
||||
name: "AnalyseAgent",
|
||||
llm: openai({ model: "gpt-4o" }),
|
||||
tools: [analyseTools],
|
||||
});
|
||||
const reporterAgent = agent({
|
||||
name: "ReporterAgent",
|
||||
llm: openai({ model: "gpt-4o" }),
|
||||
tools: [reporterTools],
|
||||
canHandoffTo: [analyseAgent],
|
||||
});
|
||||
|
||||
const agents = multiAgent({
|
||||
agents: [analyseAgent, reporterAgent],
|
||||
rootAgent: reporterAgent,
|
||||
});
|
||||
|
||||
const response = await agents.run(\`Analyse the given data:
|
||||
\${data}\`);`,
|
||||
];
|
||||
|
||||
export default function HomePage() {
|
||||
return (
|
||||
<main className="container mx-auto px-4 py-12">
|
||||
<h1 className="text-4xl md:text-6xl font-bold text-center mb-4">
|
||||
<h1 className="mb-4 text-center text-4xl font-bold md:text-6xl">
|
||||
Build context-augmented web apps using
|
||||
<br /> <span className="text-blue-500">LlamaIndex.TS</span>
|
||||
</h1>
|
||||
<p className="text-xl text-center text-fd-muted-foreground mb-12 ">
|
||||
<p className="text-fd-muted-foreground mb-12 text-center text-xl">
|
||||
LlamaIndex.TS is the JS/TS version of{" "}
|
||||
<a href="https://llamaindex.ai">LlamaIndex</a>, the framework for
|
||||
building agentic generative AI applications connected to your data.
|
||||
</p>
|
||||
<div className="text-center text-lg text-fd-muted-foreground mb-12">
|
||||
<div className="text-fd-muted-foreground mb-12 text-center text-lg">
|
||||
<span>Designed for building web applications in </span>
|
||||
<TextEffect />
|
||||
<Supports />
|
||||
</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 />
|
||||
@@ -60,57 +99,12 @@ export default function HomePage() {
|
||||
icon={Footprints}
|
||||
subheading="Progressive"
|
||||
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."
|
||||
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";
|
||||
const llm = new OpenAI();
|
||||
const response = await llm.complete({ prompt: "How are you?" });`,
|
||||
`import { OpenAI } from "llamaindex";
|
||||
const llm = new OpenAI();
|
||||
const response = await llm.chat({
|
||||
messages: [{ content: "Tell me a joke.", role: "user" }],
|
||||
});`,
|
||||
`import { OpenAI, ChatMemoryBuffer } from "llamaindex";
|
||||
const llm = new OpenAI({ model: 'gpt4o-turbo' });
|
||||
const buffer = new ChatMemoryBuffer({
|
||||
tokenLimit: 128_000,
|
||||
})
|
||||
buffer.put({ content: "Tell me a joke.", role: "user" })
|
||||
const response = await llm.chat({
|
||||
messages: buffer.getMessages(),
|
||||
stream: true
|
||||
});`,
|
||||
`import { OpenAIAgent, ChatMemoryBuffer } from "llamaindex";
|
||||
const agent = new OpenAIAgent({
|
||||
llm,
|
||||
tools: [...myTools]
|
||||
systemPrompt,
|
||||
});
|
||||
const buffer = new ChatMemoryBuffer({
|
||||
tokenLimit: 128_000,
|
||||
})
|
||||
buffer.put({ content: "Analysis the data based on the given data.", role: "user" })
|
||||
buffer.put({ content: \`\${data}\`, role: "user" })
|
||||
const response = await agent.chat({
|
||||
message: buffer.getMessages(),
|
||||
});`,
|
||||
]}
|
||||
/>
|
||||
</Suspense>
|
||||
<MagicMove
|
||||
placeholder={<CodeBlock lang="ts" code={codes[0]} />}
|
||||
code={codes}
|
||||
/>
|
||||
</Feature>
|
||||
<Feature
|
||||
icon={Bot}
|
||||
@@ -119,19 +113,22 @@ const response = await agent.chat({
|
||||
description="Truly powerful retrieval-augmented generation applications use agentic techniques, and LlamaIndex.TS makes it easy to build them."
|
||||
>
|
||||
<CodeBlock
|
||||
code={`import { FunctionTool } from "llamaindex";
|
||||
import { OpenAIAgent } from "@llamaindex/openai";
|
||||
code={`import { VectorStoreIndex } from "llamaindex";
|
||||
import { SimpleDirectoryReader } from "@llamaindex/readers/directory";
|
||||
import { openai } from "@llamaindex/openai";
|
||||
import { agent } from "@llamaindex/workflow";
|
||||
|
||||
const interpreterTool = FunctionTool.from(...);
|
||||
const systemPrompt = \`...\`;
|
||||
// load documents from current directoy into an index
|
||||
const reader = new SimpleDirectoryReader();
|
||||
const documents = await reader.loadData(currentDir);
|
||||
const index = await VectorStoreIndex.fromDocuments(documents);
|
||||
|
||||
const agent = new OpenAIAgent({
|
||||
llm,
|
||||
tools: [interpreterTool],
|
||||
systemPrompt,
|
||||
const myAgent = agent({
|
||||
llm: openai({ model: "gpt-4o" }),
|
||||
tools: [index.queryTool()],
|
||||
});
|
||||
|
||||
await agent.chat('...');`}
|
||||
await myAgent.run('...');`}
|
||||
lang="ts"
|
||||
/>
|
||||
</Feature>
|
||||
@@ -143,13 +140,13 @@ await agent.chat('...');`}
|
||||
>
|
||||
<div className="mt-8 flex flex-col gap-8">
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-fd-muted-foreground mb-2">
|
||||
<h3 className="text-fd-muted-foreground mb-2 text-lg font-semibold">
|
||||
LLMs
|
||||
</h3>
|
||||
<InfiniteLLMProviders />
|
||||
</div>
|
||||
<div>
|
||||
<h3 className="text-lg font-semibold text-fd-muted-foreground mb-2">
|
||||
<h3 className="text-fd-muted-foreground mb-2 text-lg font-semibold">
|
||||
Vector Stores
|
||||
</h3>
|
||||
<InfiniteVectorStoreProviders />
|
||||
|
||||
@@ -1,11 +0,0 @@
|
||||
import { LEGACY_DOCUMENT_URL } from "@/lib/const";
|
||||
import { redirect } from "next/navigation";
|
||||
|
||||
export default async function Page(props: {
|
||||
params: Promise<{
|
||||
any: string[];
|
||||
}>;
|
||||
}) {
|
||||
const path = await props.params.then(({ any }) => any.join("/"));
|
||||
return redirect(new URL(path, LEGACY_DOCUMENT_URL).toString());
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import { MockLLM } from "@llamaindex/core/utils";
|
||||
import { MockLLM } from "@llamaindex/core/llms/mock";
|
||||
import { LlamaIndexAdapter, type Message } from "ai";
|
||||
import { Settings, SimpleChatEngine, type ChatMessage } from "llamaindex";
|
||||
import { NextResponse, type NextRequest } from "next/server";
|
||||
|
||||
@@ -1,4 +1,12 @@
|
||||
import { source } from "@/lib/source";
|
||||
import { source } from "@/libs/source";
|
||||
import { structure } from "fumadocs-core/mdx-plugins";
|
||||
import { createFromSource } from "fumadocs-core/search/server";
|
||||
|
||||
export const { GET } = createFromSource(source);
|
||||
// TODO: migrate to another search service, I don't think Vercel can handle that many of documents.
|
||||
export const { GET } = createFromSource(source, (page) => ({
|
||||
id: page.file.path,
|
||||
title: page.data.title,
|
||||
description: page.data.description,
|
||||
url: page.url,
|
||||
structuredData: structure(page.data.content),
|
||||
}));
|
||||
|
||||
@@ -1,7 +1,13 @@
|
||||
import { createMetadata, metadataImage } from "@/lib/metadata";
|
||||
import { openapi, source } from "@/lib/source";
|
||||
import * as demos from "@/components/demo/lazy";
|
||||
import { createMetadata, metadataImage } from "@/libs/metadata";
|
||||
import { openapi, source } from "@/libs/source";
|
||||
import * as Icons from "@icons-pack/react-simple-icons";
|
||||
import { APIPage } from "fumadocs-openapi/ui";
|
||||
import { Popup, PopupContent, PopupTrigger } from "fumadocs-twoslash/ui";
|
||||
import { createTypeTable } from "fumadocs-typescript/ui";
|
||||
import { createGenerator } from "fumadocs-typescript";
|
||||
import { AutoTypeTable } from "fumadocs-typescript/ui";
|
||||
import { Accordion, Accordions } from "fumadocs-ui/components/accordion";
|
||||
import { Tab, Tabs } from "fumadocs-ui/components/tabs";
|
||||
import defaultMdxComponents from "fumadocs-ui/mdx";
|
||||
import {
|
||||
DocsBody,
|
||||
@@ -11,7 +17,9 @@ import {
|
||||
} from "fumadocs-ui/page";
|
||||
import { notFound } from "next/navigation";
|
||||
|
||||
const { AutoTypeTable } = createTypeTable();
|
||||
const generator = createGenerator();
|
||||
|
||||
export const revalidate = false;
|
||||
|
||||
export default async function Page(props: {
|
||||
params: Promise<{ slug?: string[] }>;
|
||||
@@ -20,12 +28,13 @@ export default async function Page(props: {
|
||||
const page = source.getPage(params.slug);
|
||||
if (!page) notFound();
|
||||
|
||||
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={lastModified}
|
||||
editOnGithub={{
|
||||
owner: "run-llama",
|
||||
repo: "LlamaIndexTS",
|
||||
@@ -38,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>
|
||||
@@ -64,6 +81,7 @@ export async function generateMetadata(props: {
|
||||
|
||||
return createMetadata(
|
||||
metadataImage.withImage(page.slugs, {
|
||||
metadataBase: new URL("https://ts.llamaindex.ai"),
|
||||
title: page.data.title,
|
||||
description: page.data.description,
|
||||
openGraph: {
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
import { baseOptions } from "@/app/layout.config";
|
||||
import { AITrigger } from "@/components/ai-chat";
|
||||
import { buttonVariants } from "@/components/ui/button";
|
||||
import { source } from "@/lib/source";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { source } from "@/libs/source";
|
||||
import "fumadocs-twoslash/twoslash.css";
|
||||
import { DocsLayout } from "fumadocs-ui/layouts/docs";
|
||||
import { MessageCircle } from "lucide-react";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
export default function Layout({ children }: { children: ReactNode }) {
|
||||
@@ -13,23 +9,9 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||
<DocsLayout
|
||||
tree={source.pageTree}
|
||||
{...baseOptions}
|
||||
links={[]}
|
||||
nav={{
|
||||
...baseOptions.nav,
|
||||
children: (
|
||||
<AITrigger
|
||||
className={cn(
|
||||
buttonVariants({
|
||||
variant: "secondary",
|
||||
size: "xs",
|
||||
className:
|
||||
"md:flex-1 px-2 ms-2 gap-1.5 text-fd-muted-foreground rounded-full",
|
||||
}),
|
||||
)}
|
||||
>
|
||||
<MessageCircle className="size-3" />
|
||||
Ask LlamaCloud
|
||||
</AITrigger>
|
||||
),
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
|
||||
@@ -1,6 +1,13 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
@import "tailwindcss";
|
||||
@import "fumadocs-ui/css/neutral.css";
|
||||
@import "fumadocs-ui/css/preset.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",
|
||||
@source '../../node_modules/@llamaindex/chat-ui/dist/**/*.js';
|
||||
@config "../../tailwind.config.mjs";
|
||||
|
||||
@layer base {
|
||||
:root {
|
||||
--page-max-width: 1840px;
|
||||
@@ -46,6 +53,7 @@
|
||||
--chart-5: 27 87% 67%;
|
||||
--radius: 0.5rem;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--color-neutral-000: #0e0c15;
|
||||
--color-neutral-100: #252134;
|
||||
@@ -87,40 +95,3 @@
|
||||
--chart-5: 340 75% 55%;
|
||||
}
|
||||
}
|
||||
@layer base {
|
||||
* {
|
||||
@apply border-border;
|
||||
}
|
||||
body {
|
||||
@apply bg-background text-foreground;
|
||||
}
|
||||
|
||||
/*
|
||||
* Override default styles for Markdown
|
||||
*/
|
||||
.prose
|
||||
:where(blockquote):not(
|
||||
:where([class~="not-prose"], [class~="not-prose"] *)
|
||||
) {
|
||||
font-style: normal !important;
|
||||
}
|
||||
|
||||
.prose
|
||||
:where(blockquote p:first-of-type):not(
|
||||
:where([class~="not-prose"], [class~="not-prose"] *)
|
||||
):before {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
.prose
|
||||
:where(blockquote p:first-of-type):not(
|
||||
:where([class~="not-prose"], [class~="not-prose"] *)
|
||||
):after {
|
||||
content: none !important;
|
||||
}
|
||||
|
||||
.prose
|
||||
:where(code):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
|
||||
@apply text-blue-600 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { LEGACY_DOCUMENT_URL } from "@/lib/const";
|
||||
import { DOCUMENT_URL } from "@/libs/const";
|
||||
import type { BaseLayoutProps } from "fumadocs-ui/layouts/shared";
|
||||
import Image from "next/image";
|
||||
|
||||
@@ -27,9 +27,19 @@ export const baseOptions: BaseLayoutProps = {
|
||||
githubUrl: "https://github.com/run-llama/LlamaIndexTS",
|
||||
links: [
|
||||
{
|
||||
text: "Docs",
|
||||
url: LEGACY_DOCUMENT_URL,
|
||||
text: "TypeScript",
|
||||
url: DOCUMENT_URL,
|
||||
active: "nested-url",
|
||||
},
|
||||
{
|
||||
text: "Python",
|
||||
url: "https://docs.llamaindex.ai",
|
||||
active: "url",
|
||||
},
|
||||
{
|
||||
text: "LlamaCloud",
|
||||
url: "https://docs.cloud.llamaindex.ai/",
|
||||
active: "url",
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { AIProvider } from "@/actions";
|
||||
import { TooltipProvider } from "@/components/ui/tooltip";
|
||||
import { GoogleAnalytics } from "@next/third-parties/google";
|
||||
import { RootProvider } from "fumadocs-ui/provider";
|
||||
import { Inter } from "next/font/google";
|
||||
import type { ReactNode } from "react";
|
||||
@@ -31,14 +32,18 @@ export default function Layout({ children }: { children: ReactNode }) {
|
||||
sizes="16x16"
|
||||
href="/favicon-16x16.png"
|
||||
/>
|
||||
<title>
|
||||
LlamaIndex.TS - Build LLM-powered document agents and workflows
|
||||
</title>
|
||||
</head>
|
||||
<body className="flex flex-col min-h-screen">
|
||||
<body className="flex min-h-screen flex-col">
|
||||
<TooltipProvider>
|
||||
<AIProvider>
|
||||
<RootProvider>{children}</RootProvider>
|
||||
</AIProvider>
|
||||
</TooltipProvider>
|
||||
</body>
|
||||
<GoogleAnalytics gaId="G-NB9B8LW9W5" />
|
||||
</html>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
import fg from "fast-glob";
|
||||
import { fileGenerator, remarkDocGen, remarkInstall } from "fumadocs-docgen";
|
||||
import { remarkInclude } from "fumadocs-mdx/config";
|
||||
import { remarkAutoTypeTable } from "fumadocs-typescript";
|
||||
import matter from "gray-matter";
|
||||
import * as fs from "node:fs/promises";
|
||||
import path from "node:path";
|
||||
import { remark } from "remark";
|
||||
import remarkGfm from "remark-gfm";
|
||||
import remarkMdx from "remark-mdx";
|
||||
import remarkStringify from "remark-stringify";
|
||||
|
||||
export const revalidate = false;
|
||||
|
||||
export async function GET() {
|
||||
const files = await fg(["./src/content/docs/**/*.mdx"]);
|
||||
|
||||
const scan = files.map(async (file) => {
|
||||
const fileContent = await fs.readFile(file);
|
||||
const { content, data } = matter(fileContent.toString());
|
||||
|
||||
const dir = path.dirname(file).split(path.sep).at(4);
|
||||
const category = {
|
||||
llamaindex: "LlamaIndexTS Framework",
|
||||
api: "LlamaIndexTS API",
|
||||
cloud: "LlamaCloud Service",
|
||||
}[dir ?? ""];
|
||||
|
||||
const processed = await processContent(file, content);
|
||||
return `file: ${file}
|
||||
# ${category}: ${data.title}
|
||||
|
||||
${data.description}
|
||||
|
||||
${processed}`;
|
||||
});
|
||||
|
||||
const scanned = await Promise.all(scan);
|
||||
|
||||
return new Response(scanned.join("\n\n"));
|
||||
}
|
||||
|
||||
async function processContent(path: string, content: string): Promise<string> {
|
||||
const file = await remark()
|
||||
.use(remarkMdx)
|
||||
.use(remarkInclude)
|
||||
.use(remarkGfm)
|
||||
.use(remarkAutoTypeTable)
|
||||
.use(remarkDocGen, { generators: [fileGenerator()] })
|
||||
.use(remarkInstall, { persist: { id: "package-manager" } })
|
||||
.use(remarkStringify)
|
||||
.process({
|
||||
path,
|
||||
value: content,
|
||||
});
|
||||
|
||||
return String(file);
|
||||
}
|
||||
@@ -1,5 +1,5 @@
|
||||
import { generateOGImage } from "@/app/og/[...slug]/og";
|
||||
import { metadataImage } from "@/lib/metadata";
|
||||
import { metadataImage } from "@/libs/metadata";
|
||||
import { type ImageResponse } from "next/og";
|
||||
import { readFileSync } from "node:fs";
|
||||
|
||||
|
||||
@@ -45,13 +45,13 @@ export const AITrigger = (props: AITriggerProps) => {
|
||||
<Dialog>
|
||||
<DialogTrigger {...props} />
|
||||
<DialogPortal>
|
||||
<DialogOverlay className="fixed inset-0 z-50 bg-fd-background/50 backdrop-blur-sm data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-fade-in" />
|
||||
<DialogOverlay className="bg-fd-background/50 data-[state=closed]:animate-fd-fade-out data-[state=open]:animate-fd-fade-in fixed inset-0 z-50 backdrop-blur-sm" />
|
||||
<DialogContent
|
||||
onOpenAutoFocus={(e) => {
|
||||
document.getElementById("nd-ai-input")?.focus();
|
||||
e.preventDefault();
|
||||
}}
|
||||
className="fixed left-1/2 z-50 my-[5vh] flex max-h-[90dvh] w-[98vw] max-w-[860px] origin-left -translate-x-1/2 flex-col rounded-lg border bg-fd-popover text-fd-popover-foreground shadow-lg focus-visible:outline-none data-[state=closed]:animate-fd-dialog-out data-[state=open]:animate-fd-dialog-in"
|
||||
className="bg-fd-popover text-fd-popover-foreground data-[state=closed]:animate-fd-dialog-out data-[state=open]:animate-fd-dialog-in fixed left-1/2 z-50 my-[5vh] flex max-h-[90dvh] w-[98vw] max-w-[860px] origin-left -translate-x-1/2 flex-col rounded-lg border shadow-lg focus-visible:outline-none"
|
||||
>
|
||||
<DialogHeader>
|
||||
<DialogTitle className="sr-only">Search AI</DialogTitle>
|
||||
@@ -67,11 +67,11 @@ export const AITrigger = (props: AITriggerProps) => {
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
</DialogHeader>
|
||||
<div className="overflow-scroll flex-grow mt-4">
|
||||
<div className="mt-4 flex-grow overflow-scroll">
|
||||
<ChatList messages={messages} />
|
||||
</div>
|
||||
<form
|
||||
className="px-4 py-2 space-y-4"
|
||||
className="space-y-4 px-4 py-2"
|
||||
action={async () => {
|
||||
const value = inputValue.trim();
|
||||
setInputValue("");
|
||||
@@ -102,7 +102,7 @@ export const AITrigger = (props: AITriggerProps) => {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-row w-full items-center gap-2">
|
||||
<div className="flex w-full flex-row items-center gap-2">
|
||||
<Textarea
|
||||
tabIndex={0}
|
||||
placeholder="Ask AI about documentation."
|
||||
|
||||
@@ -1,50 +1,21 @@
|
||||
import { highlight } from "fumadocs-core/highlight";
|
||||
import * as Base from "fumadocs-ui/components/codeblock";
|
||||
import { toJsxRuntime, type Jsx } from "hast-util-to-jsx-runtime";
|
||||
import { Fragment } from "react";
|
||||
import { jsx, jsxs } from "react/jsx-runtime";
|
||||
import { codeToHast } from "shiki";
|
||||
import type { BundledLanguage } from "shiki";
|
||||
|
||||
export interface CodeBlockProps {
|
||||
code: string;
|
||||
wrapper?: Base.CodeBlockProps;
|
||||
lang: "bash" | "ts" | "tsx";
|
||||
lang: BundledLanguage;
|
||||
}
|
||||
|
||||
export async function CodeBlock({
|
||||
code,
|
||||
lang,
|
||||
wrapper,
|
||||
}: CodeBlockProps): Promise<React.ReactElement> {
|
||||
const hast = await codeToHast(code, {
|
||||
export async function CodeBlock({ code, lang, wrapper }: CodeBlockProps) {
|
||||
const rendered = await highlight(code, {
|
||||
lang,
|
||||
defaultColor: false,
|
||||
themes: {
|
||||
light: "github-light",
|
||||
dark: "vesper",
|
||||
},
|
||||
transformers: [
|
||||
{
|
||||
name: "rehype-code:pre-process",
|
||||
line(node) {
|
||||
if (node.children.length === 0) {
|
||||
// Keep the empty lines when using grid layout
|
||||
node.children.push({
|
||||
type: "text",
|
||||
value: " ",
|
||||
});
|
||||
}
|
||||
},
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const rendered = toJsxRuntime(hast, {
|
||||
jsx: jsx as Jsx,
|
||||
jsxs: jsxs as Jsx,
|
||||
Fragment,
|
||||
development: false,
|
||||
components: {
|
||||
// @ts-expect-error -- JSX component
|
||||
pre: Base.Pre,
|
||||
},
|
||||
});
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import ContributorCounter from "@/components/contributor-count";
|
||||
import { buttonVariants } from "@/components/ui/button";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
import { Heart } from "lucide-react";
|
||||
import { ReactElement } from "react";
|
||||
|
||||
@@ -10,7 +10,7 @@ export function Contributing(): ReactElement {
|
||||
<h2 className="mb-4 text-xl font-semibold sm:text-2xl">
|
||||
Made possible by you <Heart className="inline align-middle" />
|
||||
</h2>
|
||||
<p className="mb-4 text-fd-muted-foreground">
|
||||
<p className="text-fd-muted-foreground mb-4">
|
||||
LlamaIndex.TS is powered by the open source community.
|
||||
</p>
|
||||
<div className="mb-8 flex flex-row items-center gap-2">
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import { fetchContributors } from "@/lib/get-contributors";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { fetchContributors } from "@/libs/get-contributors";
|
||||
import { cn } from "@/libs/utils";
|
||||
import Image from "next/image";
|
||||
import type { HTMLAttributes, ReactElement } from "react";
|
||||
|
||||
@@ -33,7 +33,7 @@ export default async function ContributorCounter({
|
||||
href={`https://github.com/${contributor.login}`}
|
||||
rel="noreferrer noopener"
|
||||
target="_blank"
|
||||
className="size-10 overflow-hidden rounded-full border-4 border-fd-background bg-fd-background md:-mr-4 md:size-12"
|
||||
className="border-fd-background bg-fd-background size-10 overflow-hidden rounded-full border-4 md:-mr-4 md:size-12"
|
||||
style={{
|
||||
zIndex: topContributors.length - i,
|
||||
}}
|
||||
@@ -48,7 +48,7 @@ export default async function ContributorCounter({
|
||||
</a>
|
||||
))}
|
||||
{displayCount < contributors.length ? (
|
||||
<div className="size-12 content-center rounded-full bg-fd-secondary text-center">
|
||||
<div className="bg-fd-secondary size-12 content-center rounded-full text-center">
|
||||
+{contributors.length - displayCount}
|
||||
</div>
|
||||
) : null}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
"use client";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
import { TerminalIcon } from "lucide-react";
|
||||
import {
|
||||
Fragment,
|
||||
@@ -83,7 +83,7 @@ export function CreateAppAnimation(): React.ReactElement {
|
||||
}}
|
||||
>
|
||||
{tick > timeWindowOpen && (
|
||||
<LaunchAppWindow className="absolute bottom-5 right-4 z-10 animate-in fade-in slide-in-from-top-10" />
|
||||
<LaunchAppWindow className="animate-in fade-in slide-in-from-top-10 absolute bottom-5 right-4 z-10" />
|
||||
)}
|
||||
<pre className="overflow-hidden rounded-xl border text-xs">
|
||||
<div className="flex flex-row items-center gap-2 border-b px-4 py-2">
|
||||
@@ -92,7 +92,7 @@ export function CreateAppAnimation(): React.ReactElement {
|
||||
<div className="grow" />
|
||||
<div className="size-2 rounded-full bg-red-400" />
|
||||
</div>
|
||||
<div className="min-h-[200px] bg-gradient-to-b from-fd-secondary [mask-image:linear-gradient(to_bottom,white,transparent)]">
|
||||
<div className="from-fd-secondary min-h-[200px] bg-gradient-to-b [mask-image:linear-gradient(to_bottom,white,transparent)]">
|
||||
<code className="grid p-4">{lines}</code>
|
||||
</div>
|
||||
</pre>
|
||||
@@ -103,7 +103,7 @@ export function CreateAppAnimation(): React.ReactElement {
|
||||
function UserMessage({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<div className="group relative flex items-start">
|
||||
<div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-background">
|
||||
<div className="bg-background flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm">
|
||||
<IconUser />
|
||||
</div>
|
||||
<div className="ml-4 flex-1 space-y-2 overflow-hidden px-1">
|
||||
@@ -122,7 +122,7 @@ function BotMessage({
|
||||
}) {
|
||||
return (
|
||||
<div className={cn("group relative flex items-start", className)}>
|
||||
<div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-primary text-primary-foreground">
|
||||
<div className="bg-primary text-primary-foreground flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm">
|
||||
<IconAI />
|
||||
</div>
|
||||
<div className="ml-4 flex-1 space-y-2 overflow-hidden px-1">
|
||||
@@ -164,7 +164,7 @@ export function ChatExample() {
|
||||
|
||||
return (
|
||||
<div className="max-w-64">
|
||||
<div className="flex flex-col px-4 gap-2">
|
||||
<div className="flex flex-col gap-2 px-4">
|
||||
{userMessageLength === userMessageFull.length && (
|
||||
<UserMessage>
|
||||
<span>{userMessageFull}</span>
|
||||
@@ -204,11 +204,11 @@ function LaunchAppWindow(
|
||||
<div
|
||||
{...props}
|
||||
className={cn(
|
||||
"overflow-hidden rounded-md border bg-fd-background shadow-xl",
|
||||
"bg-fd-background overflow-hidden rounded-md border shadow-xl",
|
||||
props.className,
|
||||
)}
|
||||
>
|
||||
<div className="relative flex h-6 flex-row items-center border-b bg-fd-muted px-4 text-xs text-fd-muted-foreground">
|
||||
<div className="bg-fd-muted text-fd-muted-foreground relative flex h-6 flex-row items-center border-b px-4 text-xs">
|
||||
<p className="absolute inset-x-0 text-center">localhost:8080</p>
|
||||
</div>
|
||||
<div className="p-4 text-sm">
|
||||
|
||||
@@ -1,16 +0,0 @@
|
||||
"use client";
|
||||
import { ChatInput, ChatMessages, ChatSection } from "@llamaindex/chat-ui";
|
||||
import { useChat } from "ai/react";
|
||||
|
||||
export const ChatDemo = () => {
|
||||
const handler = useChat();
|
||||
return (
|
||||
<ChatSection handler={handler}>
|
||||
<ChatMessages>
|
||||
<ChatMessages.List className="h-auto max-h-[400px]" />
|
||||
<ChatMessages.Actions />
|
||||
</ChatMessages>
|
||||
<ChatInput />
|
||||
</ChatSection>
|
||||
);
|
||||
};
|
||||
@@ -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,
|
||||
};
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -1,33 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import {
|
||||
ChatInput,
|
||||
ChatMessage,
|
||||
ChatMessages,
|
||||
ChatSection as ChatSectionUI,
|
||||
} from "@llamaindex/chat-ui";
|
||||
import { useChatRSC } from "./use-chat-rsc";
|
||||
|
||||
export const ChatSectionRSC = () => {
|
||||
const handler = useChatRSC();
|
||||
return (
|
||||
<ChatSectionUI handler={handler}>
|
||||
<ChatMessages>
|
||||
<ChatMessages.List className="h-auto max-h-[400px]">
|
||||
{handler.messages.map((message, index) => (
|
||||
<ChatMessage
|
||||
key={index}
|
||||
message={message}
|
||||
isLast={index === handler.messages.length - 1}
|
||||
>
|
||||
<ChatMessage.Avatar />
|
||||
<ChatMessage.Content>{message.display}</ChatMessage.Content>
|
||||
</ChatMessage>
|
||||
))}
|
||||
<ChatMessages.Loading />
|
||||
</ChatMessages.List>
|
||||
</ChatMessages>
|
||||
<ChatInput />
|
||||
</ChatSectionUI>
|
||||
);
|
||||
};
|
||||
@@ -1,8 +0,0 @@
|
||||
import { AI } from "./ai-action";
|
||||
import { ChatSectionRSC } from "./chat-section";
|
||||
|
||||
export const ChatDemoRSC = () => (
|
||||
<AI>
|
||||
<ChatSectionRSC />
|
||||
</AI>
|
||||
);
|
||||
@@ -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,
|
||||
};
|
||||
}
|
||||
@@ -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();
|
||||
@@ -57,7 +59,7 @@ export const IDE = () => {
|
||||
const maxChars = useSlider();
|
||||
const useSetMaxChars = useSetSlider();
|
||||
return (
|
||||
<div className="flex flex-col p-4 border-r max-h-96 overflow-scroll">
|
||||
<div className="flex max-h-96 flex-col overflow-scroll border-r p-4">
|
||||
<div>
|
||||
<Label>Max Chars {maxChars}</Label>
|
||||
<Slider
|
||||
@@ -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>
|
||||
@@ -113,7 +102,7 @@ const Preview = ({ text }: { text: string }) => {
|
||||
},
|
||||
},
|
||||
});
|
||||
return <CodeBlock className="py-0 m-2">{rendered}</CodeBlock>;
|
||||
return <CodeBlock className="m-2 py-0">{rendered}</CodeBlock>;
|
||||
};
|
||||
|
||||
function ScrollToBottom() {
|
||||
@@ -122,7 +111,7 @@ function ScrollToBottom() {
|
||||
return (
|
||||
!isAtBottom && (
|
||||
<button
|
||||
className="absolute i-ph-arrow-circle-down-fill text-4xl rounded-lg left-[50%] translate-x-[-50%] bottom-0"
|
||||
className="i-ph-arrow-circle-down-fill absolute bottom-0 left-[50%] translate-x-[-50%] rounded-lg text-4xl"
|
||||
onClick={() => scrollToBottom()}
|
||||
/>
|
||||
)
|
||||
@@ -136,7 +125,7 @@ export const NodePreview = () => {
|
||||
const textChunks = useMemo(() => parser.splitText(code), [code, maxChars]);
|
||||
return (
|
||||
<StickToBottom
|
||||
className="block relative max-h-96 overflow-scroll"
|
||||
className="relative block max-h-96 overflow-scroll"
|
||||
resize="smooth"
|
||||
initial="smooth"
|
||||
>
|
||||
@@ -154,7 +143,7 @@ export const CodeNodeParserDemo = () => {
|
||||
const isClient = useIsClient();
|
||||
if (!isClient) {
|
||||
return (
|
||||
<div className="my-2 grid grid-cols-1 md:grid-cols-2 gap-2 border rounded-xl w-full max-h-96">
|
||||
<div className="my-2 grid max-h-96 w-full grid-cols-1 gap-2 rounded-xl border md:grid-cols-2">
|
||||
<Skeleton className="h-96" />
|
||||
<Skeleton className="h-96" />
|
||||
</div>
|
||||
@@ -165,13 +154,13 @@ export const CodeNodeParserDemo = () => {
|
||||
<CodeProvider>
|
||||
<Suspense
|
||||
fallback={
|
||||
<div className="my-2 grid grid-cols-1 md:grid-cols-2 gap-2 border rounded-xl w-full max-h-96">
|
||||
<div className="my-2 grid max-h-96 w-full grid-cols-1 gap-2 rounded-xl border md:grid-cols-2">
|
||||
<Skeleton className="h-96" />
|
||||
<Skeleton className="h-96" />
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<div className="my-2 grid grid-cols-1 md:grid-cols-2 gap-2 border rounded-xl w-full max-h-96">
|
||||
<div className="my-2 grid max-h-96 w-full grid-cols-1 gap-2 rounded-xl border md:grid-cols-2">
|
||||
<IDE />
|
||||
<NodePreview />
|
||||
</div>
|
||||
|
||||
@@ -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,
|
||||
),
|
||||
);
|
||||
@@ -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="absolute i-ph-arrow-circle-down-fill text-4xl rounded-lg left-[50%] translate-x-[-50%] bottom-0"
|
||||
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 flex-col items-start w-full gap-2">
|
||||
<div className="flex flex-row justify-center items-center">
|
||||
<div className="text-lg mr-2">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="w-full flex flex-col gap-2 p-2 border border-gray-200 rounded-lg max-h-96 overflow-y-auto">
|
||||
<StickToBottom.Content className="flex flex-col gap-2">
|
||||
{ui}
|
||||
</StickToBottom.Content>
|
||||
<ScrollToBottom />
|
||||
</StickToBottom>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,4 +1,4 @@
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
import { LucideIcon } from "lucide-react";
|
||||
import { HTMLAttributes, ReactElement, ReactNode } from "react";
|
||||
|
||||
@@ -20,7 +20,7 @@ export function Feature({
|
||||
className={cn("border-l border-t px-6 py-12 md:py-16", className)}
|
||||
{...props}
|
||||
>
|
||||
<div className="mb-4 inline-flex items-center gap-2 text-sm font-medium text-fd-muted-foreground">
|
||||
<div className="text-fd-muted-foreground mb-4 inline-flex items-center gap-2 text-sm font-medium">
|
||||
<Icon className="size-4" />
|
||||
<p>{subheading}</p>
|
||||
</div>
|
||||
|
||||
@@ -60,7 +60,7 @@ export default function FlowInput({
|
||||
className={clsx(
|
||||
showCaret ? "caret-primary" : "caret-transparent",
|
||||
"spin-hide w-[1.5em] bg-transparent py-2 text-center font-[inherit] text-transparent outline-none",
|
||||
"[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none",
|
||||
"[appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none",
|
||||
)}
|
||||
// Make sure to disable kerning, to match NumberFlow:
|
||||
style={{ fontKerning: "none" }}
|
||||
|
||||
@@ -1,25 +1,27 @@
|
||||
"use client";
|
||||
import { Button } from "@/components/ui/button";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { CodeBlock, Pre } from "fumadocs-ui/components/codeblock";
|
||||
import { cn } from "@/libs/utils";
|
||||
import { CodeBlock } from "fumadocs-ui/components/codeblock";
|
||||
import { RotateCcw } from "lucide-react";
|
||||
import { useTheme } from "next-themes";
|
||||
import { use, useCallback, useEffect, useState } from "react";
|
||||
import { getSingletonHighlighter } from "shiki";
|
||||
import { type ReactNode, use, useCallback, useEffect, useState } from "react";
|
||||
import { createJavaScriptRegexEngine, getSingletonHighlighter } from "shiki";
|
||||
import { ShikiMagicMove } from "shiki-magic-move/react";
|
||||
import { createOnigurumaEngine } from "shiki/engine/oniguruma";
|
||||
|
||||
const engine = createJavaScriptRegexEngine();
|
||||
const highlighterPromise = getSingletonHighlighter({
|
||||
engine: createOnigurumaEngine(() => import("shiki/wasm")),
|
||||
engine,
|
||||
themes: ["vesper", "github-light"],
|
||||
langs: ["js", "ts", "tsx"],
|
||||
});
|
||||
|
||||
export type MagicMoveProps = {
|
||||
code: string[];
|
||||
placeholder: ReactNode;
|
||||
};
|
||||
|
||||
export function MagicMove(props: MagicMoveProps) {
|
||||
const [mounted, setMounted] = useState(false);
|
||||
const [move, setMove] = useState<number>(0);
|
||||
const currentCode = props.code[move];
|
||||
const highlighter = use(highlighterPromise);
|
||||
@@ -38,24 +40,27 @@ export function MagicMove(props: MagicMoveProps) {
|
||||
}
|
||||
}, [animate, move, props.code]);
|
||||
|
||||
useEffect(() => {
|
||||
setMounted(true);
|
||||
}, []);
|
||||
|
||||
if (!mounted) return props.placeholder;
|
||||
|
||||
return (
|
||||
<CodeBlock allowCopy={false}>
|
||||
{highlighter && (
|
||||
<Pre>
|
||||
<ShikiMagicMove
|
||||
lang="ts"
|
||||
theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
|
||||
highlighter={highlighter}
|
||||
code={currentCode}
|
||||
options={{
|
||||
duration: 800,
|
||||
stagger: 0.3,
|
||||
lineNumbers: false,
|
||||
containerStyle: false,
|
||||
}}
|
||||
/>
|
||||
</Pre>
|
||||
)}
|
||||
<ShikiMagicMove
|
||||
className="shiki !block p-4 *:!inline"
|
||||
lang="ts"
|
||||
theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
|
||||
highlighter={highlighter}
|
||||
code={currentCode}
|
||||
options={{
|
||||
duration: 800,
|
||||
stagger: 0.3,
|
||||
lineNumbers: false,
|
||||
containerStyle: false,
|
||||
}}
|
||||
/>
|
||||
<Button
|
||||
className={cn(
|
||||
"absolute bottom-2 right-2",
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
import Image from "next/image";
|
||||
import { ReactNode } from "react";
|
||||
import { IconAI, IconUser } from "./ui/icons";
|
||||
@@ -8,7 +8,7 @@ import { IconAI, IconUser } from "./ui/icons";
|
||||
export function UserMessage({ children }: { children: ReactNode }) {
|
||||
return (
|
||||
<div className="group relative flex items-start">
|
||||
<div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-background">
|
||||
<div className="bg-background flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm">
|
||||
<IconUser />
|
||||
</div>
|
||||
<div className="ml-4 flex-1 space-y-2 overflow-hidden px-1">
|
||||
@@ -54,7 +54,7 @@ export function BotCard({
|
||||
<div className="group relative flex items-start md:-ml-12">
|
||||
<div
|
||||
className={cn(
|
||||
"flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm bg-primary text-primary-foreground",
|
||||
"bg-primary text-primary-foreground flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm",
|
||||
!showAvatar && "invisible",
|
||||
)}
|
||||
>
|
||||
|
||||
@@ -25,7 +25,7 @@ export const NpmInstall = () => {
|
||||
className="flex flex-row items-center justify-center"
|
||||
>
|
||||
<code className="mr-2">$ npm i llamaindex</code>
|
||||
<div className="relative cursor-pointer bg-transparent w-4 h-4">
|
||||
<div className="relative h-4 w-4 cursor-pointer bg-transparent">
|
||||
<div
|
||||
className={`absolute inset-0 transform transition-all duration-300 ${
|
||||
hasCheckIcon ? "scale-0 opacity-0" : "scale-100 opacity-100"
|
||||
|
||||
@@ -0,0 +1,268 @@
|
||||
import { cn } from "@/libs/utils";
|
||||
import {
|
||||
AnimatePresence,
|
||||
motion,
|
||||
Transition,
|
||||
type AnimationControls,
|
||||
type Target,
|
||||
type TargetAndTransition,
|
||||
type VariantLabels,
|
||||
} from "framer-motion";
|
||||
import React, {
|
||||
forwardRef,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useImperativeHandle,
|
||||
useMemo,
|
||||
useState,
|
||||
} from "react";
|
||||
|
||||
export interface RotatingTextRef {
|
||||
next: () => void;
|
||||
previous: () => void;
|
||||
jumpTo: (index: number) => void;
|
||||
reset: () => void;
|
||||
}
|
||||
|
||||
export interface RotatingTextProps
|
||||
extends Omit<
|
||||
React.ComponentPropsWithoutRef<typeof motion.span>,
|
||||
"children" | "transition" | "initial" | "animate" | "exit"
|
||||
> {
|
||||
texts: string[];
|
||||
transition?: Transition;
|
||||
initial?: boolean | Target | VariantLabels;
|
||||
animate?: boolean | VariantLabels | AnimationControls | TargetAndTransition;
|
||||
exit?: Target | VariantLabels;
|
||||
animatePresenceMode?: "sync" | "wait";
|
||||
animatePresenceInitial?: boolean;
|
||||
rotationInterval?: number;
|
||||
staggerDuration?: number;
|
||||
staggerFrom?: "first" | "last" | "center" | "random" | number;
|
||||
loop?: boolean;
|
||||
auto?: boolean;
|
||||
splitBy?: string;
|
||||
onNext?: (index: number) => void;
|
||||
mainClassName?: string;
|
||||
splitLevelClassName?: string;
|
||||
elementLevelClassName?: string;
|
||||
}
|
||||
|
||||
export const RotatingText = forwardRef<RotatingTextRef, RotatingTextProps>(
|
||||
(
|
||||
{
|
||||
texts,
|
||||
transition = { type: "spring", damping: 25, stiffness: 300 },
|
||||
initial = { y: "100%", opacity: 0 },
|
||||
animate = { y: 0, opacity: 1 },
|
||||
exit = { y: "-120%", opacity: 0 },
|
||||
animatePresenceMode = "wait",
|
||||
animatePresenceInitial = false,
|
||||
rotationInterval = 2000,
|
||||
staggerDuration = 0,
|
||||
staggerFrom = "first",
|
||||
loop = true,
|
||||
auto = true,
|
||||
splitBy = "characters",
|
||||
onNext,
|
||||
mainClassName,
|
||||
splitLevelClassName,
|
||||
elementLevelClassName,
|
||||
...rest
|
||||
},
|
||||
ref,
|
||||
) => {
|
||||
const [currentTextIndex, setCurrentTextIndex] = useState<number>(0);
|
||||
|
||||
const splitIntoCharacters = (text: string): string[] => {
|
||||
if (typeof Intl !== "undefined" && Intl.Segmenter) {
|
||||
const segmenter = new Intl.Segmenter("en", { granularity: "grapheme" });
|
||||
return Array.from(
|
||||
segmenter.segment(text),
|
||||
(segment) => segment.segment,
|
||||
);
|
||||
}
|
||||
return Array.from(text);
|
||||
};
|
||||
|
||||
const elements = useMemo(() => {
|
||||
const currentText: string = texts[currentTextIndex];
|
||||
if (splitBy === "characters") {
|
||||
const words = currentText.split(" ");
|
||||
return words.map((word, i) => ({
|
||||
characters: splitIntoCharacters(word),
|
||||
needsSpace: i !== words.length - 1,
|
||||
}));
|
||||
}
|
||||
if (splitBy === "words") {
|
||||
return currentText.split(" ").map((word, i, arr) => ({
|
||||
characters: [word],
|
||||
needsSpace: i !== arr.length - 1,
|
||||
}));
|
||||
}
|
||||
if (splitBy === "lines") {
|
||||
return currentText.split("\n").map((line, i, arr) => ({
|
||||
characters: [line],
|
||||
needsSpace: i !== arr.length - 1,
|
||||
}));
|
||||
}
|
||||
|
||||
return currentText.split(splitBy).map((part, i, arr) => ({
|
||||
characters: [part],
|
||||
needsSpace: i !== arr.length - 1,
|
||||
}));
|
||||
}, [texts, currentTextIndex, splitBy]);
|
||||
|
||||
const getStaggerDelay = useCallback(
|
||||
(index: number, totalChars: number): number => {
|
||||
const total = totalChars;
|
||||
if (staggerFrom === "first") return index * staggerDuration;
|
||||
if (staggerFrom === "last")
|
||||
return (total - 1 - index) * staggerDuration;
|
||||
if (staggerFrom === "center") {
|
||||
const center = Math.floor(total / 2);
|
||||
return Math.abs(center - index) * staggerDuration;
|
||||
}
|
||||
if (staggerFrom === "random") {
|
||||
const randomIndex = Math.floor(Math.random() * total);
|
||||
return Math.abs(randomIndex - index) * staggerDuration;
|
||||
}
|
||||
return Math.abs((staggerFrom as number) - index) * staggerDuration;
|
||||
},
|
||||
[staggerFrom, staggerDuration],
|
||||
);
|
||||
|
||||
const handleIndexChange = useCallback(
|
||||
(newIndex: number) => {
|
||||
setCurrentTextIndex(newIndex);
|
||||
if (onNext) onNext(newIndex);
|
||||
},
|
||||
[onNext],
|
||||
);
|
||||
|
||||
const next = useCallback(() => {
|
||||
const nextIndex =
|
||||
currentTextIndex === texts.length - 1
|
||||
? loop
|
||||
? 0
|
||||
: currentTextIndex
|
||||
: currentTextIndex + 1;
|
||||
if (nextIndex !== currentTextIndex) {
|
||||
handleIndexChange(nextIndex);
|
||||
}
|
||||
}, [currentTextIndex, texts.length, loop, handleIndexChange]);
|
||||
|
||||
const previous = useCallback(() => {
|
||||
const prevIndex =
|
||||
currentTextIndex === 0
|
||||
? loop
|
||||
? texts.length - 1
|
||||
: currentTextIndex
|
||||
: currentTextIndex - 1;
|
||||
if (prevIndex !== currentTextIndex) {
|
||||
handleIndexChange(prevIndex);
|
||||
}
|
||||
}, [currentTextIndex, texts.length, loop, handleIndexChange]);
|
||||
|
||||
const jumpTo = useCallback(
|
||||
(index: number) => {
|
||||
const validIndex = Math.max(0, Math.min(index, texts.length - 1));
|
||||
if (validIndex !== currentTextIndex) {
|
||||
handleIndexChange(validIndex);
|
||||
}
|
||||
},
|
||||
[texts.length, currentTextIndex, handleIndexChange],
|
||||
);
|
||||
|
||||
const reset = useCallback(() => {
|
||||
if (currentTextIndex !== 0) {
|
||||
handleIndexChange(0);
|
||||
}
|
||||
}, [currentTextIndex, handleIndexChange]);
|
||||
|
||||
useImperativeHandle(
|
||||
ref,
|
||||
() => ({
|
||||
next,
|
||||
previous,
|
||||
jumpTo,
|
||||
reset,
|
||||
}),
|
||||
[next, previous, jumpTo, reset],
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
if (!auto) return;
|
||||
const intervalId = setInterval(next, rotationInterval);
|
||||
return () => clearInterval(intervalId);
|
||||
}, [next, rotationInterval, auto]);
|
||||
|
||||
return (
|
||||
<motion.span
|
||||
className={cn(
|
||||
"relative flex flex-wrap whitespace-pre-wrap",
|
||||
mainClassName,
|
||||
)}
|
||||
{...rest}
|
||||
layout
|
||||
transition={transition}
|
||||
>
|
||||
<span className="sr-only">{texts[currentTextIndex]}</span>
|
||||
<AnimatePresence
|
||||
mode={animatePresenceMode}
|
||||
initial={animatePresenceInitial}
|
||||
>
|
||||
<motion.div
|
||||
key={currentTextIndex}
|
||||
className={cn(
|
||||
splitBy === "lines"
|
||||
? "flex w-full flex-col"
|
||||
: "relative flex flex-wrap whitespace-pre-wrap",
|
||||
)}
|
||||
layout
|
||||
aria-hidden="true"
|
||||
>
|
||||
{elements.map((wordObj, wordIndex, array) => {
|
||||
const previousCharsCount = array
|
||||
.slice(0, wordIndex)
|
||||
.reduce((sum, word) => sum + word.characters.length, 0);
|
||||
return (
|
||||
<span
|
||||
key={wordIndex}
|
||||
className={cn("inline-flex", splitLevelClassName)}
|
||||
>
|
||||
{wordObj.characters.map((char, charIndex) => (
|
||||
<motion.span
|
||||
key={charIndex}
|
||||
initial={initial}
|
||||
animate={animate}
|
||||
exit={exit}
|
||||
transition={{
|
||||
...transition,
|
||||
delay: getStaggerDelay(
|
||||
previousCharsCount + charIndex,
|
||||
array.reduce(
|
||||
(sum, word) => sum + word.characters.length,
|
||||
0,
|
||||
),
|
||||
),
|
||||
}}
|
||||
className={cn("inline-block", elementLevelClassName)}
|
||||
>
|
||||
{char}
|
||||
</motion.span>
|
||||
))}
|
||||
{wordObj.needsSpace && (
|
||||
<span className="whitespace-pre"> </span>
|
||||
)}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</motion.div>
|
||||
</AnimatePresence>
|
||||
</motion.span>
|
||||
);
|
||||
},
|
||||
);
|
||||
|
||||
RotatingText.displayName = "RotatingText";
|
||||
@@ -0,0 +1,27 @@
|
||||
"use client";
|
||||
import { RotatingText } from "@/components/reactbits/rotating-text";
|
||||
|
||||
const supports = [
|
||||
"Next.js",
|
||||
"Node.js",
|
||||
"Hono",
|
||||
"Express.js",
|
||||
"Deno",
|
||||
"Nest.js",
|
||||
"Waku",
|
||||
];
|
||||
|
||||
export const Supports = () => {
|
||||
return (
|
||||
<RotatingText
|
||||
texts={supports}
|
||||
mainClassName="inline-flex bg-transparent overflow-hidden justify-center"
|
||||
initial={{ y: "100%" }}
|
||||
animate={{ y: 0 }}
|
||||
exit={{ y: "-120%" }}
|
||||
staggerDuration={0.025}
|
||||
transition={{ type: "spring", damping: 30, stiffness: 400 }}
|
||||
rotationInterval={2000}
|
||||
/>
|
||||
);
|
||||
};
|
||||
@@ -1,28 +0,0 @@
|
||||
"use client";
|
||||
import { useEffect, useState } from "react";
|
||||
import ReactTextTransition from "react-text-transition";
|
||||
|
||||
const supports = [
|
||||
"Next.js",
|
||||
"Node.js",
|
||||
"Hono",
|
||||
"Express.js",
|
||||
"Deno",
|
||||
"Nest.js",
|
||||
"Waku",
|
||||
];
|
||||
|
||||
export const TextEffect = () => {
|
||||
const [counter, setCounter] = useState(0);
|
||||
useEffect(() => {
|
||||
const id = setInterval(() => {
|
||||
setCounter(
|
||||
(Math.floor(Math.random() * supports.length) + 1) % supports.length,
|
||||
);
|
||||
}, 4000);
|
||||
return () => {
|
||||
clearInterval(id);
|
||||
};
|
||||
}, []);
|
||||
return <ReactTextTransition inline>{supports[counter]}</ReactTextTransition>;
|
||||
};
|
||||
@@ -1,7 +1,7 @@
|
||||
import { cva, type VariantProps } from "class-variance-authority";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const alertVariants = cva(
|
||||
"relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { cva, type VariantProps } from "class-variance-authority";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const badgeVariants = cva(
|
||||
"inline-flex items-center rounded-md border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
|
||||
|
||||
@@ -2,7 +2,7 @@ import { Slot } from "@radix-ui/react-slot";
|
||||
import { cva, type VariantProps } from "class-variance-authority";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const buttonVariants = cva(
|
||||
"inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
|
||||
|
||||
@@ -4,7 +4,7 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
|
||||
import { Cross2Icon } from "@radix-ui/react-icons";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const Dialog = DialogPrimitive.Root;
|
||||
|
||||
@@ -21,7 +21,7 @@ const DialogOverlay = React.forwardRef<
|
||||
<DialogPrimitive.Overlay
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
|
||||
"data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
@@ -38,13 +38,13 @@ const DialogContent = React.forwardRef<
|
||||
<DialogPrimitive.Content
|
||||
ref={ref}
|
||||
className={cn(
|
||||
"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
|
||||
"bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg duration-200 sm:rounded-lg",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
{children}
|
||||
<DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
|
||||
<DialogPrimitive.Close className="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute right-4 top-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:pointer-events-none">
|
||||
<Cross2Icon className="h-4 w-4" />
|
||||
<span className="sr-only">Close</span>
|
||||
</DialogPrimitive.Close>
|
||||
@@ -102,7 +102,7 @@ const DialogDescription = React.forwardRef<
|
||||
>(({ className, ...props }, ref) => (
|
||||
<DialogPrimitive.Description
|
||||
ref={ref}
|
||||
className={cn("text-sm text-muted-foreground", className)}
|
||||
className={cn("text-muted-foreground text-sm", className)}
|
||||
{...props}
|
||||
/>
|
||||
));
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
export function IconAI({ className, ...props }: React.ComponentProps<"svg">) {
|
||||
return (
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
"use client";
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
import { animate, motion, useMotionValue } from "framer-motion";
|
||||
import { useEffect, useState } from "react";
|
||||
import useMeasure from "react-use-measure";
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
export type InputProps = React.InputHTMLAttributes<HTMLInputElement>;
|
||||
|
||||
@@ -10,7 +10,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
|
||||
<input
|
||||
type={type}
|
||||
className={cn(
|
||||
"flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"border-input file:text-foreground placeholder:text-muted-foreground focus-visible:ring-ring flex h-9 w-full rounded-md border bg-transparent px-3 py-1 text-sm shadow-sm transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
|
||||
@@ -4,7 +4,7 @@ import * as LabelPrimitive from "@radix-ui/react-label";
|
||||
import { cva, type VariantProps } from "class-variance-authority";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const labelVariants = cva(
|
||||
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
function Skeleton({
|
||||
className,
|
||||
@@ -6,7 +6,7 @@ function Skeleton({
|
||||
}: React.HTMLAttributes<HTMLDivElement>) {
|
||||
return (
|
||||
<div
|
||||
className={cn("animate-pulse rounded-md bg-primary/10", className)}
|
||||
className={cn("bg-primary/10 animate-pulse rounded-md", className)}
|
||||
{...props}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import * as SliderPrimitive from "@radix-ui/react-slider";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const Slider = React.forwardRef<
|
||||
React.ElementRef<typeof SliderPrimitive.Root>,
|
||||
@@ -17,10 +17,10 @@ const Slider = React.forwardRef<
|
||||
)}
|
||||
{...props}
|
||||
>
|
||||
<SliderPrimitive.Track className="relative h-1.5 w-full grow overflow-hidden rounded-full bg-primary/20">
|
||||
<SliderPrimitive.Range className="absolute h-full bg-primary" />
|
||||
<SliderPrimitive.Track className="bg-primary/20 relative h-1.5 w-full grow overflow-hidden rounded-full">
|
||||
<SliderPrimitive.Range className="bg-primary absolute h-full" />
|
||||
</SliderPrimitive.Track>
|
||||
<SliderPrimitive.Thumb className="block h-4 w-4 rounded-full border border-primary/50 bg-background shadow transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50" />
|
||||
<SliderPrimitive.Thumb className="border-primary/50 bg-background focus-visible:ring-ring block h-4 w-4 rounded-full border shadow transition-colors focus-visible:outline-none focus-visible:ring-1 disabled:pointer-events-none disabled:opacity-50" />
|
||||
</SliderPrimitive.Root>
|
||||
));
|
||||
Slider.displayName = SliderPrimitive.Root.displayName;
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
export type TextareaProps = React.TextareaHTMLAttributes<HTMLTextAreaElement>;
|
||||
|
||||
@@ -9,7 +9,7 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
|
||||
return (
|
||||
<textarea
|
||||
className={cn(
|
||||
"flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50",
|
||||
"border-input placeholder:text-muted-foreground focus-visible:ring-ring flex min-h-[60px] w-full rounded-md border bg-transparent px-3 py-2 text-sm shadow-sm focus-visible:outline-none focus-visible:ring-1 disabled:cursor-not-allowed disabled:opacity-50",
|
||||
className,
|
||||
)}
|
||||
ref={ref}
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
import * as TooltipPrimitive from "@radix-ui/react-tooltip";
|
||||
import * as React from "react";
|
||||
|
||||
import { cn } from "@/lib/utils";
|
||||
import { cn } from "@/libs/utils";
|
||||
|
||||
const TooltipProvider = TooltipPrimitive.Provider;
|
||||
|
||||
@@ -20,7 +20,7 @@ const TooltipContent = React.forwardRef<
|
||||
ref={ref}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
"bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 overflow-hidden rounded-md px-3 py-1.5 text-xs",
|
||||
className,
|
||||
)}
|
||||
{...props}
|
||||
|
||||
@@ -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/)
|
||||
@@ -1,6 +0,0 @@
|
||||
{
|
||||
"title": "LlamaCloud",
|
||||
"description": "The Cloud framework for LLM",
|
||||
"root": true,
|
||||
"pages": ["---Guide---", "index", "api"]
|
||||
}
|
||||
@@ -1,12 +0,0 @@
|
||||
---
|
||||
title: Agents
|
||||
---
|
||||
|
||||
A built-in agent that can take decisions and reasoning based on the tools provided to it.
|
||||
|
||||
## OpenAI Agent
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/agent/openai";
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,8 +0,0 @@
|
||||
---
|
||||
title: Gemini Agent
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSourceGemini from "!raw-loader!../../../../../../../examples/gemini/agent.ts";
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSourceGemini} />
|
||||
@@ -1,10 +0,0 @@
|
||||
---
|
||||
title: Chat Engine
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/chatEngine";
|
||||
|
||||
Chat Engine is a class that allows you to create a chatbot from a retriever. It is a wrapper around a retriever that allows you to chat with it in a conversational manner.
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,61 +0,0 @@
|
||||
---
|
||||
title: Context-Aware Agent
|
||||
---
|
||||
|
||||
The Context-Aware Agent enhances the capabilities of standard LLM agents by incorporating relevant context from a retriever for each query. This allows the agent to provide more informed and specific responses based on the available information.
|
||||
|
||||
## Usage
|
||||
|
||||
Here's a simple example of how to use the Context-Aware Agent:
|
||||
|
||||
```typescript
|
||||
import {
|
||||
Document,
|
||||
VectorStoreIndex,
|
||||
OpenAIContextAwareAgent,
|
||||
OpenAI,
|
||||
} from "llamaindex";
|
||||
|
||||
async function createContextAwareAgent() {
|
||||
// Create and index some documents
|
||||
const documents = [
|
||||
new Document({
|
||||
text: "LlamaIndex is a data framework for LLM applications.",
|
||||
id_: "doc1",
|
||||
}),
|
||||
new Document({
|
||||
text: "The Eiffel Tower is located in Paris, France.",
|
||||
id_: "doc2",
|
||||
}),
|
||||
];
|
||||
|
||||
const index = await VectorStoreIndex.fromDocuments(documents);
|
||||
const retriever = index.asRetriever({ similarityTopK: 1 });
|
||||
|
||||
// Create the Context-Aware Agent
|
||||
const agent = new OpenAIContextAwareAgent({
|
||||
llm: new OpenAI({ model: "gpt-3.5-turbo" }),
|
||||
contextRetriever: retriever,
|
||||
});
|
||||
|
||||
// Use the agent to answer queries
|
||||
const response = await agent.chat({
|
||||
message: "What is LlamaIndex used for?",
|
||||
});
|
||||
|
||||
console.log("Agent Response:", response.response);
|
||||
}
|
||||
|
||||
createContextAwareAgent().catch(console.error);
|
||||
```
|
||||
|
||||
In this example, the Context-Aware Agent uses the retriever to fetch relevant context for each query, allowing it to provide more accurate and informed responses based on the indexed documents.
|
||||
|
||||
## Key Components
|
||||
|
||||
- `contextRetriever`: A retriever (e.g., from a VectorStoreIndex) that fetches relevant documents or passages for each query.
|
||||
|
||||
## Available Context-Aware Agents
|
||||
|
||||
- `OpenAIContextAwareAgent`: A context-aware agent using OpenAI's models.
|
||||
- `AnthropicContextAwareAgent`: A context-aware agent using Anthropic's models.
|
||||
@@ -1,15 +0,0 @@
|
||||
{
|
||||
"title": "Examples",
|
||||
"pages": [
|
||||
"more_examples",
|
||||
"chat_engine",
|
||||
"vector_index",
|
||||
"summary_index",
|
||||
"save_load_index",
|
||||
"context_aware_agent",
|
||||
"agent",
|
||||
"agent_gemini",
|
||||
"local_llm",
|
||||
"other_llms"
|
||||
]
|
||||
}
|
||||
@@ -1,43 +0,0 @@
|
||||
---
|
||||
title: Using other LLM APIs
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/mistral";
|
||||
|
||||
By default LlamaIndex.TS uses OpenAI's LLMs and embedding models, but we support [lots of other LLMs](../modules/llms) including models from Mistral (Mistral, Mixtral), Anthropic (Claude) and Google (Gemini).
|
||||
|
||||
If you don't want to use an API at all you can [run a local model](../../examples/local_llm)
|
||||
|
||||
## Using another LLM
|
||||
|
||||
You can specify what LLM LlamaIndex.TS will use on the `Settings` object, like this:
|
||||
|
||||
```typescript
|
||||
import { MistralAI, Settings } from "llamaindex";
|
||||
|
||||
Settings.llm = new MistralAI({
|
||||
model: "mistral-tiny",
|
||||
apiKey: "<YOUR_API_KEY>",
|
||||
});
|
||||
```
|
||||
|
||||
You can see examples of other APIs we support by checking out "Available LLMs" in the sidebar of our [LLMs section](../modules/llms).
|
||||
|
||||
## Using another embedding model
|
||||
|
||||
A frequent gotcha when trying to use a different API as your LLM is that LlamaIndex will also by default index and embed your data using OpenAI's embeddings. To completely switch away from OpenAI you will need to set your embedding model as well, for example:
|
||||
|
||||
```typescript
|
||||
import { MistralAIEmbedding, Settings } from "llamaindex";
|
||||
|
||||
Settings.embedModel = new MistralAIEmbedding();
|
||||
```
|
||||
|
||||
We support [many different embeddings](../modules/embeddings).
|
||||
|
||||
## Full example
|
||||
|
||||
This example uses Mistral's `mistral-tiny` model as the LLM and Mistral for embeddings as well.
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,8 +0,0 @@
|
||||
---
|
||||
title: Save/Load an Index
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/storageContext";
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,8 +0,0 @@
|
||||
---
|
||||
title: Summary Index
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/summaryIndex";
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,8 +0,0 @@
|
||||
---
|
||||
title: Vector Index
|
||||
---
|
||||
|
||||
import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
|
||||
import CodeSource from "!raw-loader!../../../../../../../examples/vectorIndex";
|
||||
|
||||
<DynamicCodeBlock lang="ts" code={CodeSource} />
|
||||
@@ -1,76 +1,60 @@
|
||||
---
|
||||
title: Concepts
|
||||
title: High-Level Concepts
|
||||
---
|
||||
|
||||
LlamaIndex.TS helps you build LLM-powered applications (e.g. Q&A, chatbot) over custom data.
|
||||
This is a quick guide to the high-level concepts you'll encounter frequently when building LLM applications.
|
||||
|
||||
In this high-level concepts guide, you will learn:
|
||||
## Large Language Models (LLMs)
|
||||
|
||||
- how an LLM can answer questions using your own data.
|
||||
- key concepts and modules in LlamaIndex.TS for composing your own query pipeline.
|
||||
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.
|
||||
|
||||
## Answering Questions Across Your Data
|
||||
## Agentic Applications
|
||||
|
||||
LlamaIndex uses a two stage method when using an LLM with your data:
|
||||
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**.
|
||||
|
||||
1. **indexing stage**: preparing a knowledge base, and
|
||||
2. **querying stage**: retrieving relevant context from the knowledge to assist the LLM in responding to a question
|
||||
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.
|
||||
|
||||
This process is also known as Retrieval Augmented Generation (RAG).
|
||||
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).
|
||||
|
||||
LlamaIndex.TS provides the essential toolkit for making both steps super easy.
|
||||
## Agents
|
||||
|
||||
Let's explore each stage in detail.
|
||||
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).
|
||||
|
||||
### Indexing Stage
|
||||
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
|
||||
|
||||
LlamaIndex.TS help you prepare the knowledge base with a suite of data connectors and indexes.
|
||||
You can [learn more about agents](/docs/llamaindex/tutorials/basic_agent).
|
||||
|
||||

|
||||
## Retrieval Augmented Generation (RAG)
|
||||
|
||||
[**Data Loaders**](/docs/llamaindex/modules/data_loaders/index):
|
||||
A data connector (i.e. `Reader`) ingest data from different data sources and data formats into a simple `Document` representation (text and simple metadata).
|
||||
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).
|
||||
|
||||
[**Documents / Nodes**](/docs/llamaindex/modules/documents_and_nodes/index): A `Document` is a generic container around any data source - for instance, a PDF, an API output, or retrieved data from a database. A `Node` is the atomic unit of data in LlamaIndex and represents a "chunk" of a source `Document`. It's a rich representation that includes metadata and relationships (to other nodes) to enable accurate and expressive retrieval operations.
|
||||
## Use cases
|
||||
|
||||
[**Data Indexes**](/docs/llamaindex/modules/data_index):
|
||||
Once you've ingested your data, LlamaIndex helps you index data into a format that's easy to retrieve.
|
||||
There are endless use cases for data-backed LLM applications but they can be roughly grouped into four categories:
|
||||
|
||||
Under the hood, LlamaIndex parses the raw documents into intermediate representations, calculates vector embeddings, and stores your data in-memory or to disk.
|
||||
[**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.
|
||||
|
||||
### Querying Stage
|
||||
[**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.
|
||||
|
||||
In the querying stage, the query pipeline retrieves the most relevant context given a user query,
|
||||
and pass that to the LLM (along with the query) to synthesize a response.
|
||||
[**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.
|
||||
|
||||
This gives the LLM up-to-date knowledge that is not in its original training data,
|
||||
(also reducing hallucination).
|
||||
[**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.
|
||||
|
||||
The key challenge in the querying stage is retrieval, orchestration, and reasoning over (potentially many) knowledge bases.
|
||||
|
||||
LlamaIndex provides composable modules that help you build and integrate RAG pipelines for Q&A (query engine), chatbot (chat engine), or as part of an agent.
|
||||
|
||||
These building blocks can be customized to reflect ranking preferences, as well as composed to reason over multiple knowledge bases in a structured way.
|
||||
|
||||

|
||||
|
||||
#### Building Blocks
|
||||
|
||||
[**Retrievers**](/docs/llamaindex/modules/retriever):
|
||||
A retriever defines how to efficiently retrieve relevant context from a knowledge base (i.e. index) when given a query.
|
||||
The specific retrieval logic differs for different indices, the most popular being dense retrieval against a vector index.
|
||||
|
||||
[**Response Synthesizers**](/docs/llamaindex/modules/response_synthesizer):
|
||||
A response synthesizer generates a response from an LLM, using a user query and a given set of retrieved text chunks.
|
||||
|
||||
#### Pipelines
|
||||
|
||||
[**Query Engines**](/docs/llamaindex/modules/query_engines):
|
||||
A query engine is an end-to-end pipeline that allow you to ask question 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/chat_engine):
|
||||
A chat engine is an end-to-end pipeline for having a conversation with your data
|
||||
(multiple back-and-forth instead of a single question & answer).
|
||||
[**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).
|
||||
|
||||
@@ -1,11 +1,7 @@
|
||||
---
|
||||
title: Chatbot tutorial
|
||||
title: Create-Llama
|
||||
---
|
||||
|
||||
Once you've mastered basic [retrieval-augment generation](retrieval_augmented_generation) you may want to create an interface to chat with your data. You can do this step-by-step, but we recommend getting started quickly using `create-llama`.
|
||||
|
||||
## Using create-llama
|
||||
|
||||
`create-llama` is a powerful but easy to use command-line tool that generates a working, full-stack web application that allows you to chat with your data. You can learn more about it on [the `create-llama` README page](https://www.npmjs.com/package/create-llama).
|
||||
|
||||
Run it once and it will ask you a series of questions about the kind of application you want to generate. Then you can customize your application to suit your use-case. To get started, run:
|
||||
@@ -22,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:
|
||||
|
||||

|
||||

|
||||
@@ -1,17 +1,17 @@
|
||||
---
|
||||
title: See all examples
|
||||
title: Code examples
|
||||
---
|
||||
|
||||
Our GitHub repository has a wealth of examples to explore and try out. You can check out our [examples folder](https://github.com/run-llama/LlamaIndexTS/tree/main/examples) to see them all at once, or browse the pages in this section for some selected highlights.
|
||||
|
||||
## Check out all examples
|
||||
## Use examples locally
|
||||
|
||||
It may be useful to check out all the examples at once so you can try them out locally. To do this into a folder called `my-new-project`, run these commands:
|
||||
|
||||
```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.:
|
||||
@@ -19,3 +19,14 @@ Then you can run any example in the folder with `tsx`, e.g.:
|
||||
```bash npm2yarn
|
||||
npx tsx ./vectorIndex.ts
|
||||
```
|
||||
|
||||
## Try examples online
|
||||
|
||||
You can also try the examples online using StackBlitz:
|
||||
|
||||
<iframe
|
||||
className="w-full h-[440px]"
|
||||
aria-label="LlamaIndex.TS Examples"
|
||||
aria-description="This is a list of examples for LlamaIndex.TS."
|
||||
src="https://stackblitz.com/github/run-llama/LlamaIndexTS/tree/main/examples?file=README.md"
|
||||
/>
|
||||
@@ -1,35 +0,0 @@
|
||||
---
|
||||
title: Installation
|
||||
description: Install llamaindex by running a single command.
|
||||
---
|
||||
|
||||
import { Tab, Tabs } from "fumadocs-ui/components/tabs";
|
||||
|
||||
<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>
|
||||
|
||||
## What's next?
|
||||
|
||||
<Cards>
|
||||
<Card
|
||||
title="I want to try LlamaIndex.TS"
|
||||
description="Learn how to use LlamaIndex.TS with different JS runtime and frameworks."
|
||||
href="/docs/llamaindex/getting_started/setup"
|
||||
/>
|
||||
<Card
|
||||
title="Show me code examples"
|
||||
description="Explore code examples using LlamaIndex.TS."
|
||||
href="https://stackblitz.com/github/run-llama/LlamaIndexTS/tree/main/examples?file=README.md"
|
||||
/>
|
||||
</Cards>
|
||||
@@ -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/setup/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,11 +62,9 @@ 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.
|
||||
- Some of LlamaIndex.TS modules are not available in Cloudflare Worker, for example `SimpleDirectoryReader` (requires `node:fs`), Some multimodal API that relies on [`onnxruntime-node`](https://www.npmjs.com/package/onnxruntime-node)(we might port to HTTP based module in the future).
|
||||
- `@llamaindex/core` is designed to work in all JavaScript environment, including Cloudflare Worker. If you find any issue, please report to us.
|
||||
- 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.
|
||||
|
||||
## Known issues
|
||||
|
||||
- `llamaindex` not work perfectly in Cloudflare Worker, bundle size will be larger than 1MB, which is the limit of Cloudflare Worker. You will need import submodule instead of the whole `llamaindex` module.
|
||||
@@ -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>
|
||||
@@ -0,0 +1,4 @@
|
||||
{
|
||||
"title": "Installation",
|
||||
"pages": ["node", "typescript", "next", "vite", "cloudflare"]
|
||||
}
|
||||
@@ -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/setup/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](./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.
|
||||
@@ -22,9 +22,19 @@ node --env-file .env your-script.js
|
||||
|
||||
For more information, see the [How to read environment variables from Node.js](https://nodejs.org/en/learn/command-line/how-to-read-environment-variables-from-nodejs).
|
||||
|
||||
## Performance Optimization
|
||||
|
||||
By the default, we are using `js-tiktoken` for tokenization. You can install `gpt-tokenizer` which is then automatically used by LlamaIndex to get a 60x speedup for tokenization:
|
||||
|
||||
```package-install
|
||||
npm i gpt-tokenizer
|
||||
```
|
||||
|
||||
**Note**: This only works for Node.js
|
||||
|
||||
## TypeScript support
|
||||
|
||||
<Card
|
||||
title="Getting Started with LlamaIndex.TS in TypeScript"
|
||||
href="/docs/llamaindex/getting_started/setup/typescript"
|
||||
href="/docs/llamaindex/getting_started/installation/typescript"
|
||||
/>
|
||||
@@ -0,0 +1,99 @@
|
||||
---
|
||||
title: With TypeScript
|
||||
description: In this guide, you'll learn how to use LlamaIndex with TypeScript
|
||||
---
|
||||
|
||||
LlamaIndex.TS is written in TypeScript and designed to be used in TypeScript projects.
|
||||
|
||||
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'
|
||||
const promptTemplate = new PromptTemplate({
|
||||
template: `Context information from multiple sources is below.
|
||||
---------------------
|
||||
{context}
|
||||
---------------------
|
||||
Given the information from multiple sources and not prior knowledge.
|
||||
Answer the query in the style of a Shakespeare play"
|
||||
Query: {query}
|
||||
Answer:`,
|
||||
templateVars: ["context", "query"],
|
||||
});
|
||||
// @noErrors
|
||||
promptTemplate.format({
|
||||
c
|
||||
//^|
|
||||
})
|
||||
```
|
||||
|
||||
## 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 "nodenext" | "node16" | "node"
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
We recommend using `bundler` or `nodenext`, but due to popularity of `node`, we still added support for it.
|
||||
|
||||
## Enable AsyncIterable for `Web Stream` API
|
||||
|
||||
Some modules uses `Web Stream` API like `ReadableStream` and `WritableStream`, you need to enable `DOM.AsyncIterable` in your `tsconfig.json`.
|
||||
|
||||
```json5
|
||||
{
|
||||
compilerOptions: {
|
||||
// ⬇️ add this lib to your tsconfig.json
|
||||
lib: ["DOM.AsyncIterable"],
|
||||
},
|
||||
}
|
||||
```
|
||||
|
||||
```typescript
|
||||
import { tool } from 'llamaindex'
|
||||
import { agent } from "@llamaindex/workflow";
|
||||
import { openai } from "@llamaindex/openai";
|
||||
|
||||
Settings.llm = openai({
|
||||
model: "gpt-4o-mini",
|
||||
});
|
||||
|
||||
const addTool = tool({
|
||||
name: "add",
|
||||
description: "Adds two numbers",
|
||||
parameters: z.object({x: z.number(), y: z.number()}),
|
||||
execute: ({ x, y }) => x + y,
|
||||
});
|
||||
|
||||
const myAgent = agent({
|
||||
tools: [addTool],
|
||||
});
|
||||
|
||||
// Chat with the agent
|
||||
const context = myAgent.run("Hello, how are you?");
|
||||
|
||||
for await (const event of context) {
|
||||
if (event instanceof AgentStream) {
|
||||
for (const chunk of event.data.delta) {
|
||||
process.stdout.write(chunk); // stream response
|
||||
}
|
||||
} else {
|
||||
console.log(event); // other events
|
||||
}
|
||||
}
|
||||
|
||||
```
|
||||
|
||||
## Run TypeScript Script in Node.js
|
||||
|
||||
We recommend to use [tsx](https://www.npmjs.com/package/tsx) to run TypeScript script in Node.js.
|
||||
|
||||
```shell
|
||||
node --import tsx ./my-script.ts
|
||||
```
|
||||
@@ -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/setup/node"
|
||||
href="/docs/llamaindex/getting_started/installation/node"
|
||||
/>
|
||||
|
||||
Also, make sure you have a basic understanding of [Vite](https://vitejs.dev/).
|
||||
@@ -1,4 +1,4 @@
|
||||
{
|
||||
"title": "Getting Started",
|
||||
"pages": ["index", "setup", "starter_tutorial", "environments", "concepts"]
|
||||
"pages": ["concepts", "installation", "create_llama", "examples"]
|
||||
}
|
||||
|
||||
@@ -1,42 +0,0 @@
|
||||
---
|
||||
title: Choose Framework
|
||||
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/setup/node" />
|
||||
<Card title={
|
||||
<>
|
||||
<SiTypescript className="inline" color="#3178C6" /> TypeScript
|
||||
</>
|
||||
} href="/docs/llamaindex/getting_started/setup/typescript" />
|
||||
<Card title={
|
||||
<>
|
||||
<SiVite className='inline' color='#646CFF' /> Vite
|
||||
</>
|
||||
} href="/docs/llamaindex/getting_started/setup/vite" />
|
||||
<Card
|
||||
title={
|
||||
<>
|
||||
<SiNextdotjs className='inline' /> Next.js (React Server Component)
|
||||
</>
|
||||
}
|
||||
href="/docs/llamaindex/getting_started/setup/next"
|
||||
/>
|
||||
<Card title={
|
||||
<>
|
||||
<SiCloudflareworkers className='inline' color='#F38020' /> Cloudflare Workers
|
||||
</>
|
||||
} href="/docs/llamaindex/getting_started/setup/cloudflare" />
|
||||
</Cards>
|
||||
@@ -1,6 +0,0 @@
|
||||
{
|
||||
"title": "Setup",
|
||||
"description": "The setup guide",
|
||||
"defaultOpen": true,
|
||||
"pages": ["index", "next", "node", "typescript", "vite", "cloudflare"]
|
||||
}
|
||||