Release 0.10.2 (#1861)

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

apps/next/CHANGELOG.md

@@ -1,5 +1,21 @@
 # @llamaindex/doc
 
+## 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

apps/next/fallback.js

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

apps/next/next.config.mjs

@@ -1,5 +1,4 @@
 import { createMDX } from "fumadocs-mdx/next";
-import MonacoWebpackPlugin from "monaco-editor-webpack-plugin";
 const withMDX = createMDX();
 
 /** @type {import('next').NextConfig} */
@@ -16,7 +15,12 @@ const config = {
     "twoslash",
     "typescript",
   ],
-  webpack: (config, { isServer }) => {
+  turbopack: {
+    resolveAlias: {
+      fs: { browser: "./fallback.js" },
+    },
+  },
+  webpack: (config) => {
     if (Array.isArray(config.target) && config.target.includes("web")) {
       config.target = ["web", "es2020"];
     }
@@ -28,14 +32,6 @@ const config = {
     };
     config.resolve.fallback ??= {};
     config.resolve.fallback.fs = false;
-    if (!isServer) {
-      config.plugins.push(
-        new MonacoWebpackPlugin({
-          languages: ["typescript"],
-          filename: "static/[name].worker.js",
-        }),
-      );
-    }
     config.resolve.alias["replicate"] = false;
     return config;
   },

apps/next/package.json

@@ -1,18 +1,19 @@
 {
   "name": "@llamaindex/doc",
-  "version": "0.2.11",
+  "version": "0.2.13",
   "private": true,
   "scripts": {
     "postinstall": "fumadocs-mdx",
     "prebuild": "pnpm run build:docs",
     "build": "next build",
-    "dev": "next dev",
+    "dev": "next dev --turbo",
     "start": "next start",
     "postbuild": "tsx scripts/post-build.mts && tsx scripts/validate-links.mts",
     "build:docs": "cross-env NODE_OPTIONS=\"--max-old-space-size=8192\" typedoc && tsx scripts/generate-docs.mts",
     "validate-links": "tsx scripts/validate-links.mts"
   },
   "dependencies": {
+    "@huggingface/transformers": "^3.5.0",
     "@icons-pack/react-simple-icons": "^10.1.0",
     "@llama-flow/docs": "0.0.3",
     "@llamaindex/chat-ui": "0.2.0",
@@ -23,6 +24,7 @@
     "@llamaindex/readers": "workspace:*",
     "@llamaindex/workflow": "workspace:*",
     "@mdx-js/mdx": "^3.1.0",
+    "@monaco-editor/react": "^4.7.0",
     "@number-flow/react": "^0.3.4",
     "@radix-ui/react-dialog": "^1.1.2",
     "@radix-ui/react-icons": "^1.3.2",
@@ -40,9 +42,9 @@
     "fumadocs-core": "^15.2.7",
     "fumadocs-docgen": "^2.0.0",
     "fumadocs-mdx": "^11.6.0",
-    "fumadocs-openapi": "^6.3.0",
+    "fumadocs-openapi": "^8.0.1",
     "fumadocs-twoslash": "^3.1.1",
-    "fumadocs-typescript": "^3.1.0",
+    "fumadocs-typescript": "^4.0.2",
     "fumadocs-ui": "^15.2.7",
     "hast-util-to-jsx-runtime": "^2.3.2",
     "llamaindex": "workspace:*",
@@ -52,7 +54,6 @@
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
     "react-icons": "^5.3.0",
-    "react-monaco-editor": "^0.56.2",
     "react-use-measure": "^2.1.1",
     "rehype-katex": "^7.0.1",
     "remark-math": "^6.0.0",
@@ -64,6 +65,8 @@
     "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"
@@ -79,7 +82,6 @@
     "cross-env": "^7.0.3",
     "fast-glob": "^3.3.2",
     "gray-matter": "^4.0.3",
-    "monaco-editor-webpack-plugin": "^7.1.0",
     "postcss": "^8.5.3",
     "raw-loader": "^4.0.2",
     "remark": "^15.0.1",
@@ -88,9 +90,9 @@
     "remark-stringify": "^11.0.0",
     "tailwindcss": "^4.0.9",
     "tsx": "^4.19.3",
-    "typedoc": "0.27.4",
+    "typedoc": "0.28.2",
-    "typedoc-plugin-markdown": "^4.3.1",
+    "typedoc-plugin-markdown": "^4.6.2",
-    "typedoc-plugin-merge-modules": "^6.1.0",
+    "typedoc-plugin-merge-modules": "^7.0.0",
     "typescript": "^5.7.3"
   }
 }

apps/next/scripts/generate-docs.mts

@@ -1,9 +1,13 @@
 import { generateFiles as openapiGenerateFiles } from "fumadocs-openapi";
-import { generateFiles as typescriptGenerateFiles } from "fumadocs-typescript";
+import {
+  createGenerator,
+  generateFiles as typescriptGenerateFiles,
+} from "fumadocs-typescript";
 import fs from "node:fs";
 import * as path from "node:path";
 import { rimrafSync } from "rimraf";
 
+const generator = createGenerator();
 const out = "./src/content/docs/cloud/api";
 const apiRefOut = "./src/content/docs/api";
 
@@ -20,7 +24,7 @@ void openapiGenerateFiles({
   groupBy: "tag",
 });
 
-void typescriptGenerateFiles({
+void typescriptGenerateFiles(generator, {
   input: ["./src/content/docs/api/**/*.mdx"],
   output: (file) => path.resolve(path.dirname(file), path.basename(file)),
   transformOutput,

apps/next/source.config.ts

@@ -8,6 +8,9 @@ import remarkMath from "remark-math";
 
 export const docs = defineDocs({
   dir: ["./src/content/docs", "./node_modules/@llama-flow/docs"],
+  docs: {
+    async: true,
+  },
 });
 
 export default defineConfig({

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

@@ -10,16 +10,55 @@ import { MagicMove } from "@/components/magic-move";
 import { NpmInstall } from "@/components/npm-install";
 import { Supports } from "@/components/supports";
 import { Button } from "@/components/ui/button";
-import { Skeleton } from "@/components/ui/skeleton";
 import { DOCUMENT_URL } from "@/lib/const";
 import { SiStackblitz } from "@icons-pack/react-simple-icons";
-import {
-  CodeBlock as FumaCodeBlock,
-  Pre,
-} from "fumadocs-ui/components/codeblock";
 import { Blocks, Bot, Footprints, Terminal } from "lucide-react";
 import Link from "next/link";
-import { Suspense } from "react";
+
+const codes = [
+  `import { openai } from "@llamaindex/openai";
+
+const llm = openai();
+const response = await llm.complete({ prompt: "How are you?" });`,
+  `import { openai } from "@llamaindex/openai";
+
+const llm = openai();
+const response = await llm.chat({
+  messages: [{ content: "Tell me a joke.", role: "user" }],
+});`,
+  `import { agent } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+
+const analyseAgent = agent({
+  llm: openai({ model: "gpt-4o" }),
+  tools: [analyseTools],
+  systemPrompt,
+});
+const response = await analyseAgent.run(\`Analyse the given data:
+\${data}\`);`,
+  `import { agent, multiAgent } from "llamaindex";
+import { openai } from "@llamaindex/openai";
+
+const analyseAgent = agent({
+  name: "AnalyseAgent",
+  llm: openai({ model: "gpt-4o" }),
+  tools: [analyseTools],
+});
+const reporterAgent = agent({
+  name: "ReporterAgent",
+  llm: openai({ model: "gpt-4o" }),
+  tools: [reporterTools],
+  canHandoffTo: [analyseAgent],
+});
+
+const agents = multiAgent({
+  agents: [analyseAgent, reporterAgent],
+  rootAgent: reporterAgent,
+});
+
+const response = await agents.run(\`Analyse the given data:
+\${data}\`);`,
+];
 
 export default function HomePage() {
   return (
@@ -62,65 +101,10 @@ export default function HomePage() {
           heading="From the simplest to the most complex"
           description="LlamaIndex.TS is designed to be simple to get started, but powerful enough to build complex, agentic AI applications using multi-agents."
         >
-          <Suspense
+          <MagicMove
-            fallback={
+            placeholder={<CodeBlock lang="ts" code={codes[0]} />}
-              <FumaCodeBlock allowCopy={false}>
+            code={codes}
-                <Pre>
+          />
-                  <div className="space-y-2">
-                    <Skeleton className="h-4 w-[250px]" />
-                    <Skeleton className="h-4 w-[200px]" />
-                  </div>
-                </Pre>
-              </FumaCodeBlock>
-            }
-          >
-            <MagicMove
-              code={[
-                `import { openai } from "@llamaindex/openai";
-
-const llm = openai();
-const response = await llm.complete({ prompt: "How are you?" });`,
-                `import { openai } from "@llamaindex/openai";
-
-const llm = openai();
-const response = await llm.chat({
-  messages: [{ content: "Tell me a joke.", role: "user" }],
-});`,
-                `import { agent } from "llamaindex";
-import { openai } from "@llamaindex/openai";
-
-const analyseAgent = agent({
-  llm: openai({ model: "gpt-4o" }),
-  tools: [analyseTools],
-  systemPrompt,
-});
-const response = await analyseAgent.run(\`Analyse the given data:
-\${data}\`);`,
-                `import { agent, multiAgent } from "llamaindex";
-import { openai } from "@llamaindex/openai";
-
-const analyseAgent = agent({
-  name: "AnalyseAgent",
-  llm: openai({ model: "gpt-4o" }),
-  tools: [analyseTools],
-});
-const reporterAgent = agent({
-  name: "ReporterAgent",
-  llm: openai({ model: "gpt-4o" }),
-  tools: [reporterTools],
-  canHandoffTo: [analyseAgent],
-});
-
-const agents = multiAgent({
-  agents: [analyseAgent, reporterAgent],
-  rootAgent: reporterAgent,
-});
-
-const response = await agents.run(\`Analyse the given data:
-\${data}\`);`,
-              ]}
-            />
-          </Suspense>
         </Feature>
         <Feature
           icon={Bot}

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

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

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

@@ -1,7 +1,13 @@
+import { ChatDemoRSC } from "@/components/demo/chat/rsc/demo";
+import * as demos from "@/components/demo/lazy";
 import { createMetadata, metadataImage } from "@/lib/metadata";
 import { openapi, source } from "@/lib/source";
+import * as Icons from "@icons-pack/react-simple-icons";
+import { APIPage } from "fumadocs-openapi/ui";
 import { Popup, PopupContent, PopupTrigger } from "fumadocs-twoslash/ui";
-import { createTypeTable } from "fumadocs-typescript/ui";
+import { createGenerator } from "fumadocs-typescript";
+import { AutoTypeTable } from "fumadocs-typescript/ui";
+import { Accordion, Accordions } from "fumadocs-ui/components/accordion";
 import { Tab, Tabs } from "fumadocs-ui/components/tabs";
 import defaultMdxComponents from "fumadocs-ui/mdx";
 import {
@@ -12,6 +18,8 @@ import {
 } from "fumadocs-ui/page";
 import { notFound } from "next/navigation";
 
+const generator = createGenerator();
+
 export const revalidate = false;
 
 export default async function Page(props: {
@@ -21,14 +29,13 @@ export default async function Page(props: {
   const page = source.getPage(params.slug);
   if (!page) notFound();
 
-  const { AutoTypeTable } = createTypeTable();
+  const { body: MDX, toc, lastModified } = await page.data.load();
-  const MDX = page.data.body;
 
   return (
     <DocsPage
-      toc={page.data.toc}
+      toc={toc}
       full={page.data.full}
-      lastUpdate={page.data.lastModified}
+      lastUpdate={lastModified}
       editOnGithub={{
         owner: "run-llama",
         repo: "LlamaIndexTS",
@@ -41,14 +48,21 @@ export default async function Page(props: {
       <DocsBody>
         <MDX
           components={{
+            ...Icons,
             ...defaultMdxComponents,
-            APIPage: openapi.APIPage,
+            ...demos,
+            ChatDemoRSC,
+            Accordion,
+            Accordions,
+            APIPage: (props) => <APIPage {...openapi.getAPIPageProps(props)} />,
             Tab,
             Tabs,
             Popup,
             PopupContent,
             PopupTrigger,
-            AutoTypeTable,
+            AutoTypeTable: (props) => (
+              <AutoTypeTable generator={generator} {...props} />
+            ),
           }}
         />
       </DocsBody>

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

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

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

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

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

@@ -0,0 +1,18 @@
+"use client";
+import dynamic from "next/dynamic";
+
+// lazy load client components
+export const ChatDemo = dynamic(() =>
+  import("@/components/demo/chat/api/demo").then((mod) => mod.ChatDemo),
+);
+
+export const CodeNodeParserDemo = dynamic(() =>
+  import("@/components/demo/code-node-parser").then(
+    (mod) => mod.CodeNodeParserDemo,
+  ),
+);
+export const WorkflowStreamingDemo = dynamic(() =>
+  import("@/components/demo/workflow-streaming-ui").then(
+    (mod) => mod.WorkflowStreamingDemo,
+  ),
+);

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

@@ -1,25 +1,27 @@
 "use client";
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
-import { CodeBlock, Pre } from "fumadocs-ui/components/codeblock";
+import { CodeBlock } from "fumadocs-ui/components/codeblock";
 import { RotateCcw } from "lucide-react";
 import { useTheme } from "next-themes";
-import { use, useCallback, useEffect, useState } from "react";
+import { type ReactNode, use, useCallback, useEffect, useState } from "react";
-import { getSingletonHighlighter } from "shiki";
+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 && (
+      <ShikiMagicMove
-        <Pre>
+        className="shiki !block p-4 *:!inline"
-          <ShikiMagicMove
+        lang="ts"
-            lang="ts"
+        theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
-            theme={resolvedTheme === "dark" ? "vesper" : "github-light"}
+        highlighter={highlighter}
-            highlighter={highlighter}
+        code={currentCode}
-            code={currentCode}
+        options={{
-            options={{
+          duration: 800,
-              duration: 800,
+          stagger: 0.3,
-              stagger: 0.3,
+          lineNumbers: false,
-              lineNumbers: false,
+          containerStyle: false,
-              containerStyle: false,
+        }}
-            }}
+      />
-          />
-        </Pre>
-      )}
       <Button
         className={cn(
           "absolute bottom-2 right-2",

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

@@ -18,4 +18,4 @@ npm run dev
 
 to start the development server. You can then visit [http://localhost:3000](http://localhost:3000) to see your app, which should look something like this:
 
-![create-llama interface](./images/create_llama.png)
+![create-llama interface](/images/create_llama.png)

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

@@ -3,13 +3,6 @@ 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

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

@@ -3,14 +3,6 @@ title: Installation
 description: How to install llamaindex packages.
 ---
 
-import {
-	SiNodedotjs,
-	SiTypescript,
-	SiNextdotjs,
-	SiCloudflareworkers,
-	SiVite
-} from "@icons-pack/react-simple-icons";
-
 To install llamaindex, run the following command:
 
 ```package-install

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

@@ -3,13 +3,6 @@ title: What is LlamaIndex.TS
 description: LlamaIndex is the leading data framework for building LLM applications
 ---
 
-import {
-  SiNodedotjs,
-  SiDeno,
-  SiBun,
-  SiCloudflareworkers,
-} from "@icons-pack/react-simple-icons";
-
 LlamaIndex is a framework for building context-augmented generative AI applications with LLMs including agents and workflows.
 
 The TypeScript implementation is designed for JavaScript server side applications using <SiNodedotjs className="inline" color="#5FA04E" /> Node.js, <SiDeno className="inline" color="#70FFAF" /> Deno, <SiBun className="inline" /> Bun, <SiCloudflareworkers className="inline" color="#F38020" /> Cloudflare Workers, and more.

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

@@ -2,9 +2,6 @@
 title: Workflows
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/workflow/joke.ts";
-
 A `Workflow` in LlamaIndexTS is an event-driven abstraction used to chain together several events. Workflows are made up of `steps`, with each step responsible for handling certain event types and emitting new events.
 
 Workflows in LlamaIndexTS work by defining step functions that handle specific event types and emit new events.
@@ -22,7 +19,7 @@ npm i @llamaindex/workflow
 
 As an illustrative example, let's consider a naive workflow where a joke is generated and then critiqued.
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/workflow/joke.ts</include>
 
 There's a few moving pieces here, so let's go through this piece by piece.
 

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

@@ -3,10 +3,6 @@ title: Managed Index
 description: Managed index using LlamaCloud
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/cloud/chat.ts";
-import CodeSource2 from "!raw-loader!@/examples/cloud/from-documents.ts";
-
 LlamaCloud is a new generation of managed parsing, ingestion, and retrieval services, designed to bring production-grade context-augmentation to your LLM and RAG applications.
 
 LlamaCloud supports
@@ -22,13 +18,13 @@ Visit [LlamaCloud](https://cloud.llamaindex.ai) to sign in and get an API key.
 
 Here's an example of how to create a managed index by ingesting a couple of documents:
 
-<DynamicCodeBlock lang="ts" code={CodeSource2} />
+<include cwd>../../examples/cloud/chat.ts</include>
 
 ## Use a Managed Index
 
 Here's an example of how to use a managed index together with a chat engine:
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/cloud/from-documents.ts</include>
 
 ## API Reference
 

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

@@ -2,7 +2,6 @@
 title: Node Parsers / Text Splitters
 description: Learn how to use Node Parsers and Text Splitters to extract data from documents.
 ---
-import { CodeNodeParserDemo } from '@/components/demo/code-node-parser.tsx';
 
 Node parsers are a simple abstraction that take a list of `Document` objects, and chunk them into `Node` objects, such that each node is a specific chunk of the parent document. When a document is broken into nodes, all of it's attributes are inherited to the children nodes (i.e. `metadata`, text and metadata templates, etc.). You can read more about `Node` and `Document` properties [here](/docs/llamaindex/modules/data).
 
@@ -150,8 +149,6 @@ Try it out ⬇️
 
 <CodeNodeParserDemo/>
 
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
 <Accordions>
 	<Accordion title="Use it in browser">
 		You might setup WASM files for `web-tree-sitter` and use it in the browser.

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

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

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

@@ -3,11 +3,6 @@ title: Loading Data
 description: Loading data using Readers into Documents
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/readers/src/simple-directory-reader";
-import CodeSource2 from "!raw-loader!@/examples/readers/src/custom-simple-directory-reader";
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
 Before you can start indexing your documents, you need to load them into memory.
 A reader is a module that loads data from a file into a `Document` object.
 
@@ -55,7 +50,7 @@ LlamaIndex.TS supports easy loading of files from folders using the `SimpleDirec
 
 It is a simple reader that reads all files from a directory and its subdirectories and delegates the actual reading to the reader specified in the `fileExtToReader` map.
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/readers/src/simple-directory-reader.ts</include>
 
 Currently, the following readers are mapped to specific file types:
 
@@ -77,7 +72,7 @@ SimpleDirectoryReader supports up to 9 concurrent requests. Use the `numWorkers`
 
 ### Example
 
-<DynamicCodeBlock lang="ts" code={CodeSource2} />
+<include cwd>../../examples/readers/src/custom-simple-directory-reader.ts</include>
 
 ## Tips when using in non-Node.js environments
 

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

@@ -2,10 +2,6 @@
 title: LlamaParse
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/readers/src/llamaparse";
-import CodeSource2 from "!raw-loader!@/examples/readers/src/simple-directory-reader-with-llamaparse.ts";
-
 LlamaParse is an API created by LlamaIndex to efficiently parse files, e.g. it's great at converting PDF tables into markdown.
 
 To use it, first login and get an API key from https://cloud.llamaindex.ai. Make sure to store the key as `apiKey` parameter or in the environment variable `LLAMA_CLOUD_API_KEY`.
@@ -17,7 +13,7 @@ Official documentation for LlamaParse can be found [here](https://docs.cloud.lla
 You can then use the `LlamaParseReader` class to load local files and convert them into a parsed document that can be used by LlamaIndex.
 See [reader.ts](https://github.com/run-llama/LlamaIndexTS/blob/main/packages/cloud/src/reader.ts) for a list of supported file types:
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/readers/src/llamaparse.ts</include>
 
 ### Params
 
@@ -60,7 +56,7 @@ They can be divided into two groups.
 
 Below a full example of `LlamaParse` integrated in `SimpleDirectoryReader` with additional options.
 
-<DynamicCodeBlock lang="ts" code={CodeSource2} />
+<include cwd>../../examples/readers/src/simple-directory-reader-with-llamaparse.ts</include>
 
 ## API Reference
 

apps/next/src/content/docs/llamaindex/modules/models/llms/groq.mdx

@@ -2,9 +2,6 @@
 title: Groq
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/groq.ts";
-
 ## Installation
 
 ```package-install
@@ -58,7 +55,7 @@ const results = await queryEngine.query({
 
 ## Full Example
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/groq.ts</include>
 
 ## API Reference
 

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

@@ -2,7 +2,6 @@
 title: Using API Route
 description: Chat interface for your LlamaIndexTS application using API Route
 ---
-import { ChatDemo } from '../../../../../components/demo/chat/api/demo';
 
 Using [chat-ui](https://github.com/run-llama/chat-ui), it's easy to add a chat interface to your LlamaIndexTS application.
 You just need to create an API route that provides an `api/chat` endpoint and a chat component to consume the API.

apps/next/src/content/docs/llamaindex/modules/ui/llamaindex-server.mdx

@@ -22,7 +22,7 @@ npm i @llamaindex/server
 
 ## Quick Start
 
-Create index.ts file and add the following code:
+Create an `index.ts` file and add the following code:
 
 ```ts
 import { LlamaIndexServer } from "@llamaindex/server";
@@ -43,20 +43,20 @@ new LlamaIndexServer({
 
 In the same directory as `index.ts`, run the following command to start the server:
 
-  ```bash
+```bash
-  tsx index.ts
+tsx index.ts
-  ```
+```
 The server will start at `http://localhost:3000`
 
 You can also make a request to the server:
 
-  ```bash
+```bash
-  curl -X POST "http://localhost:3000/api/chat" -H "Content-Type: application/json" -d '{"message": "Who is the first president of the United States?"}'
+curl -X POST "http://localhost:3000/api/chat" -H "Content-Type: application/json" -d '{"message": "Who is the first president of the United States?"}'
-  ```
+```
 
 ## Configuration Options
 
-The LlamaIndexServer accepts the following configuration
+The `LlamaIndexServer` accepts the following configuration options:
 
 - `workflow`: A callable function that creates a workflow instance for each request
 - `uiConfig`: An object to configure the chat UI containing the following properties:
@@ -68,6 +68,72 @@ The LlamaIndexServer accepts the following configuration
 LlamaIndexServer accepts all the configuration options from Nextjs Custom Server such as `port`, `hostname`, `dev`, etc.
 See all Nextjs Custom Server options [here](https://nextjs.org/docs/app/building-your-application/configuring/custom-server).
 
+## AI-generated UI Components
+
+The LlamaIndex server provides support for rendering workflow events using custom UI components, allowing you to extend and customize the chat interface. 
+These components can be auto-generated using an LLM by providing a JSON schema of the workflow event. 
+
+### UI Event Schema 
+
+To display custom UI components, your workflow needs to emit UI events that have an event type for identification and a data object:
+
+```typescript
+class UIEvent extends WorkflowEvent<{
+  type: "ui_event";
+  data: UIEventData;
+}> {}
+```
+
+The `data` object can be any JSON object. To enable AI generation of the UI component, you need to provide a schema for that data (here we're using Zod):
+
+```typescript
+const MyEventDataSchema = z.object({
+  stage: z.enum(["retrieve", "analyze", "answer"]).describe("The current stage the workflow process is in."),
+  progress: z.number().min(0).max(1).describe("The progress in percent of the current stage"),
+}).describe("WorkflowStageProgress");
+
+type UIEventData = z.infer<typeof MyEventDataSchema>;
+```
+
+### Generate UI Components
+
+The `generateEventComponent` function uses an LLM to generate a custom UI component based on the JSON schema of a workflow event. The schema should contain accurate descriptions of each field so that the LLM can generate matching components for your use case. We've done this for you in the example above using the `describe` function from Zod:
+
+```typescript
+import { OpenAI } from "llamaindex";
+import { generateEventComponent } from "@llamaindex/server";
+import { MyEventDataSchema } from "./your-workflow";
+
+// Also works well with Claude 3.5 Sonnet and Google Gemini 2.5 Pro
+const llm = new OpenAI({ model: "gpt-4.1" });
+const code = generateEventComponent(MyEventDataSchema, llm);
+```
+
+After generating the code, we need to save it to a file. The file name must match the event type from your workflow (e.g., `ui_event.jsx` for handling events with `ui_event` type):
+
+```ts
+fs.writeFileSync("components/ui_event.jsx", code);
+```
+
+Feel free to modify the generated code to match your needs. If you're not satisfied with the generated code, we suggest improving the provided JSON schema first or trying another LLM.
+
+> Note that `generateEventComponent` is generating JSX code, but you can also provide a TSX file.
+
+
+### Server Setup
+
+To use the generated UI components, you need to initialize the LlamaIndex server with the `componentsDir` that contains your custom UI components:
+
+```ts
+new LlamaIndexServer({
+  workflow: createWorkflow,
+  uiConfig: {
+    appTitle: "LlamaIndex App",
+    componentsDir: "components",
+  },
+}).start();
+```
+
 ## Default Endpoints and Features
 
 ### Chat Endpoint
@@ -85,69 +151,19 @@ The server always provides a chat interface at the root path (`/`) with:
 ### Static File Serving
 
 - The server automatically mounts the `data` and `output` folders at `{server_url}{api_prefix}/files/data` (default: `/api/files/data`) and `{server_url}{api_prefix}/files/output` (default: `/api/files/output`) respectively.
-- Your workflows can use both folders to store and access files. As a convention, the `data` folder is used for documents that are ingested and the `output` folder is used for documents that are generated by the workflow.
+- Your workflows can use both folders to store and access files. By convention, the `data` folder is used for documents that are ingested, and the `output` folder is used for documents generated by the workflow.
 
 
-## Custom UI Components
-
-The LlamaIndex server provides support for rendering workflow events using custom UI components, allowing you to extend and customize the chat interface.
-
-### Overview
-
-Custom UI components are a powerful feature that enables you to:
-
-- Add custom interface elements to the chat UI using React JSX or TSX files
-- Extend the default chat interface functionality
-- Create specialized visualizations or interactions
-
-### Configuration
-
-Your workflow must emit events that fit this structure, allowing the LlamaIndex server to display the right UI components based on the event type.
-
-```json
-{
-    "type": "<event_name>",
-    "data": <data model>
-}
-```
-
-### Server Setup
-
-1. Initialize the LlamaIndex server with a component directory:
-
-```ts
-new LlamaIndexServer({
-  workflow: createWorkflow,
-  uiConfig: {
-    appTitle: "LlamaIndex App",
-    componentsDir: "components",
-  },
-}).start();
-```
-
-2. Add the custom component code to the directory following the naming pattern:
-
-   - File Extension: `.jsx` and `.tsx` for React components
-   - File Name: Should match the event type from your workflow (e.g., `deep_research_event.jsx` for handling `deep_research_event` type that you defined in your workflow). If there are TSX and JSX files with the same name, the TSX file will be used.
-   - Component Name: Export a default React component named `Component` that receives props from the event data
-
-   Example component structure:
-
-   ```jsx
-   function Component({ events }) {
-       // Your component logic here
-       return (
-           // Your UI code here
-       );
-   }
-   ```
-
 ## Best Practices
 
-1. Always provide a workflow factory that creates fresh workflow instances
+1. Always provide a workflow factory that creates a fresh workflow instance for each request.
-2. Use environment variables for sensitive configuration
+2. Use environment variables for sensitive configuration (e.g., API keys).
-3. Use starter questions to guide users in the chat UI
+3. Use starter questions to guide users in the chat UI.
 
 ## Getting Started with a New Project
 
-Want to start a new project with LlamaIndexServer? Check out our [create-llama](https://github.com/run-llama/create-llama) tool to quickly generate a new project with LlamaIndexServer.
+Want to start a new project with LlamaIndexServer? Check out our [create-llama](https://github.com/run-llama/create-llama) tool to quickly generate a new project with LlamaIndexServer.
+
+## API Reference
+
+- [LlamaIndexServer](/docs/api/classes/LlamaIndexServer)

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

@@ -2,7 +2,6 @@
 title: Using Next.js RSC
 description: Chat interface for your LlamaIndexTS application using Next.js RSC
 ---
-import { ChatDemoRSC } from '../../../../../components/demo/chat/rsc/demo';
 
 Using [chat-ui](https://github.com/run-llama/chat-ui), it's easy to add a chat interface to your LlamaIndexTS application using [Next.js RSC](https://nextjs.org/docs/app/building-your-application/rendering/server-components) and [Vercel AI RSC](https://sdk.vercel.ai/docs/ai-sdk-rsc/overview).
 

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

@@ -3,13 +3,6 @@ title: More
 description: More
 ---
 
-import {
-  SiGithub,
-  SiNpm,
-  SiX,
-  SiDiscord,
-} from "@icons-pack/react-simple-icons";
-
 ## 🗺️ Ecosystem
 
 To download or contribute, find LlamaIndex on:

apps/next/src/content/docs/llamaindex/tutorials/agents/1_setup.mdx

@@ -8,7 +8,7 @@ In this guide we'll walk you through the process of building an Agent in JavaScr
 
 In LlamaIndex, an agent is a semi-autonomous piece of software powered by an LLM that is given a task and executes a series of steps towards solving that task. It is given a set of tools, which can be anything from arbitrary functions up to full LlamaIndex query engines, and it selects the best available tool to complete each step. When each step is completed, the agent judges whether the task is now complete, in which case it returns a result to the user, or whether it needs to take another step, in which case it loops back to the start.
 
-![agent flow](./images/agent_flow.png)
+![agent flow](/images/agent_flow.png)
 
 ## Install LlamaIndex.TS
 

apps/next/src/content/docs/llamaindex/tutorials/basic_agent.mdx

@@ -2,9 +2,6 @@
 title: Basic Agent 
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/agent/openai";
-
 We have a comprehensive, step-by-step [guide to building agents in LlamaIndex.TS](/docs/llamaindex/tutorials/agents/1_setup) that we recommend to learn what agents are and how to build them for production. But building a basic agent is simple:
 
 ## Set up
@@ -27,7 +24,7 @@ Create the file `example.ts`. This code will:
 - Give an example of the data structure we wish to generate
 - Prompt the LLM with instructions and the example, plus a sample transcript
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/agent/openai.ts</include>
 
 To run the code:
 

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

@@ -2,10 +2,6 @@
 title: Retrieval Augmented Generation (RAG) 
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/vectorIndex";
-import TSConfigSource from "!!raw-loader!@/examples/tsconfig.json";
-
 One of the most common use-cases for LlamaIndex is Retrieval-Augmented Generation or RAG, in which your data is indexed and selectively retrieved to be given to an LLM as source material for responding to a query. You can learn more about the [concepts behind RAG](/docs/llamaindex/tutorials/rag/concepts).
 
 ## Set up the project
@@ -30,11 +26,11 @@ Create the file `example.ts`. This code will
 - index it (which creates embeddings using OpenAI)
 - create a query engine to answer questions about the data
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/vectorIndex.ts</include>
 
 Create a `tsconfig.json` file in the same folder:
 
-<DynamicCodeBlock lang="json" code={TSConfigSource} />
+<include cwd>../../examples/tsconfig.json</include>
 
 Now you can run the code with
 

apps/next/src/content/docs/llamaindex/tutorials/structured_data_extraction.mdx

@@ -2,9 +2,6 @@
 title: Structured data extraction 
 ---
 
-import { DynamicCodeBlock } from 'fumadocs-ui/components/dynamic-codeblock';
-import CodeSource from "!raw-loader!@/examples/jsonExtract";
-
 Make sure you have installed LlamaIndex.TS and have an OpenAI key. If you haven't, check out the [installation](/docs/llamaindex/getting_started/installation) guide.
 
 You can use [other LLMs](/docs/llamaindex/modules/models/llms) via their APIs; if you would prefer to use local models check out our [local LLM example](/docs/llamaindex/tutorials/local_llm).
@@ -26,7 +23,7 @@ Create the file `example.ts`. This code will:
 - Give an example of the data structure we wish to generate
 - Prompt the LLM with instructions and the example, plus a sample transcript
 
-<DynamicCodeBlock lang="ts" code={CodeSource} />
+<include cwd>../../examples/jsonExtract.ts</include>
 
 To run the code:
 

apps/next/src/content/docs/llamaindex/tutorials/workflow/different-inputs-outputs.mdx

@@ -164,8 +164,6 @@ This step means that it requires either `AEvent` or `BEvent`. It will return a `
 
 You can still combine the logic with `context.requireEvent` to get the data from the event.
 
-import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
-
 <Accordions>
 	<Accordion title="Under the hood">
 		We use JavaScript Inheritance and the prototype chain to implement the `or` logic.

apps/next/src/content/docs/llamaindex/tutorials/workflow/streaming.mdx

@@ -2,7 +2,6 @@
 title: Streaming
 description: Learn how to use the LlamaIndex workflow with streaming.
 ---
-import { WorkflowStreamingDemo } from '../../../../../components/demo/workflow-streaming-ui';
 
 `Workflow` API by default is designed for streaming data. In this guide, we will show you how to use the `Workflow` API with streaming data.
 

e2e/examples/cloudflare-worker-agent/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/cloudflare-worker-agent-test
 
+## 0.0.156
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.0.155
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.0.154
 
 ### Patch Changes

e2e/examples/cloudflare-worker-agent/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/cloudflare-worker-agent-test",
-  "version": "0.0.154",
+  "version": "0.0.156",
   "type": "module",
   "private": true,
   "scripts": {

e2e/examples/nextjs-agent/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/next-agent-test
 
+## 0.1.156
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.1.155
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.1.154
 
 ### Patch Changes

e2e/examples/nextjs-agent/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/next-agent-test",
-  "version": "0.1.154",
+  "version": "0.1.156",
   "private": true,
   "scripts": {
     "dev": "next dev",

e2e/examples/nextjs-edge-runtime/CHANGELOG.md

@@ -1,5 +1,17 @@
 # test-edge-runtime
 
+## 0.1.155
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.1.154
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.1.153
 
 ### Patch Changes

e2e/examples/nextjs-edge-runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/nextjs-edge-runtime-test",
-  "version": "0.1.153",
+  "version": "0.1.155",
   "private": true,
   "scripts": {
     "dev": "next dev",

e2e/examples/nextjs-node-runtime/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/next-node-runtime
 
+## 0.1.22
+
+### Patch Changes
+
+- llamaindex@0.10.2
+- @llamaindex/huggingface@0.1.6
+
+## 0.1.21
+
+### Patch Changes
+
+- llamaindex@0.10.1
+- @llamaindex/huggingface@0.1.5
+
 ## 0.1.20
 
 ### Patch Changes

e2e/examples/nextjs-node-runtime/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/next-node-runtime-test",
-  "version": "0.1.20",
+  "version": "0.1.22",
   "private": true,
   "scripts": {
     "dev": "next dev",

e2e/examples/vite-import-llamaindex/CHANGELOG.md

@@ -1,5 +1,17 @@
 # vite-import-llamaindex
 
+## 0.0.22
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.0.21
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.0.20
 
 ### Patch Changes

e2e/examples/vite-import-llamaindex/package.json

@@ -1,7 +1,7 @@
 {
   "name": "vite-import-llamaindex",
   "private": true,
-  "version": "0.0.20",
+  "version": "0.0.22",
   "type": "module",
   "scripts": {
     "build": "vite build",

e2e/examples/waku-query-engine/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/waku-query-engine-test
 
+## 0.0.156
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.0.155
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.0.154
 
 ### Patch Changes

e2e/examples/waku-query-engine/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/waku-query-engine-test",
-  "version": "0.0.154",
+  "version": "0.0.156",
   "type": "module",
   "private": true,
   "scripts": {
@@ -14,13 +14,14 @@
     "react": "19.0.0",
     "react-dom": "19.0.0",
     "react-server-dom-webpack": "19.0.0",
-    "waku": "0.21.20"
+    "waku": "0.22.2"
   },
   "devDependencies": {
+    "@tailwindcss/postcss": "^4.1.4",
     "@types/react": "19.0.10",
     "@types/react-dom": "19.0.4",
-    "autoprefixer": "^10.4.20",
+    "rollup": "4.38.0",
-    "tailwindcss": "^4.0.9",
+    "tailwindcss": "^4.1.4",
     "typescript": "5.7.3"
   }
 }

e2e/node/embedding/clip.e2e.ts

@@ -21,19 +21,21 @@ test.beforeEach(() => {
   callback.mock.resetCalls();
 });
 
-await test("clip embedding", async (t) => {
+await test.skip("clip embedding", async (t) => {
   const major = parseInt(process.versions.node.split(".")[0] ?? "0", 10);
   if (major < 20) {
     t.skip("Skip CLIP tests on Node.js < 20");
     return;
   }
+  const imageUrl = new URL(
+    "../../fixtures/img/llamaindex-white.png",
+    import.meta.url,
+  );
+
   await t.test("should trigger load transformer event", async () => {
     const nodes = [
       new ImageNode({
-        image: new URL(
+        image: imageUrl,
-          "../../fixtures/img/llamaindex-white.png",
-          import.meta.url,
-        ),
       }),
     ];
     assert.equal(callback.mock.callCount(), 0);
@@ -46,21 +48,14 @@ await test("clip embedding", async (t) => {
 
   await t.test("init & get image embedding", async () => {
     const clipEmbedding = new ClipEmbedding();
-    const imgUrl = new URL(
+    const vec = await clipEmbedding.getImageEmbedding(imageUrl);
-      "../../fixtures/img/llamaindex-white.png",
-      import.meta.url,
-    );
-    const vec = await clipEmbedding.getImageEmbedding(imgUrl);
     assert.ok(vec);
   });
 
   await t.test("load image document", async () => {
     const nodes = [
       new ImageNode({
-        image: new URL(
+        image: imageUrl,
-          "../../fixtures/img/llamaindex-white.png",
-          import.meta.url,
-        ),
       }),
     ];
     const clipEmbedding = new ClipEmbedding();
@@ -80,12 +75,8 @@ await test("clip embedding", async (t) => {
       }),
     );
     const clipEmbedding = new ClipEmbedding();
-    const imgUrl = new URL(
-      "../../fixtures/img/llamaindex-white.png",
-      import.meta.url,
-    );
     assert.equal(getter.mock.callCount(), 0);
-    const vec = await clipEmbedding.getImageEmbedding(imgUrl);
+    const vec = await clipEmbedding.getImageEmbedding(imageUrl);
     assert.ok(vec);
     assert.ok(getter.mock.callCount() > 0);
   });

e2e/package.json

@@ -10,7 +10,7 @@
   },
   "devDependencies": {
     "@faker-js/faker": "^9.2.0",
-    "@huggingface/transformers": "^3.0.2",
+    "@huggingface/transformers": "^3.5.0",
     "@llamaindex/anthropic": "workspace:*",
     "@llamaindex/clip": "workspace:*",
     "@llamaindex/core": "workspace:*",

examples/CHANGELOG.md

@@ -1,5 +1,43 @@
 # examples
 
+## 0.3.9
+
+### Patch Changes
+
+- Updated dependencies [96dac4d]
+- Updated dependencies [e5c3f95]
+  - @llamaindex/google@0.2.4
+  - @llamaindex/openai@0.3.4
+  - llamaindex@0.10.2
+  - @llamaindex/clip@0.0.52
+  - @llamaindex/deepinfra@0.0.52
+  - @llamaindex/deepseek@0.0.12
+  - @llamaindex/fireworks@0.0.12
+  - @llamaindex/groq@0.0.67
+  - @llamaindex/huggingface@0.1.6
+  - @llamaindex/jinaai@0.0.12
+  - @llamaindex/perplexity@0.0.9
+  - @llamaindex/together@0.0.12
+  - @llamaindex/vllm@0.0.38
+
+## 0.3.8
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+  - llamaindex@0.10.1
+  - @llamaindex/clip@0.0.51
+  - @llamaindex/deepinfra@0.0.51
+  - @llamaindex/deepseek@0.0.11
+  - @llamaindex/fireworks@0.0.11
+  - @llamaindex/groq@0.0.66
+  - @llamaindex/huggingface@0.1.5
+  - @llamaindex/jinaai@0.0.11
+  - @llamaindex/perplexity@0.0.8
+  - @llamaindex/together@0.0.11
+  - @llamaindex/vllm@0.0.37
+
 ## 0.3.7
 
 ### Patch Changes

examples/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@llamaindex/examples",
-  "version": "0.3.7",
+  "version": "0.3.9",
   "private": true,
   "scripts": {
     "lint": "eslint .",
@@ -15,16 +15,16 @@
     "@llamaindex/astra": "^0.0.16",
     "@llamaindex/azure": "^0.1.11",
     "@llamaindex/chroma": "^0.0.16",
-    "@llamaindex/clip": "^0.0.50",
+    "@llamaindex/clip": "^0.0.52",
     "@llamaindex/cloud": "^4.0.3",
     "@llamaindex/cohere": "^0.0.16",
     "@llamaindex/core": "^0.6.2",
-    "@llamaindex/deepinfra": "^0.0.50",
+    "@llamaindex/deepinfra": "^0.0.52",
     "@llamaindex/env": "^0.1.29",
     "@llamaindex/firestore": "^1.0.9",
-    "@llamaindex/google": "^0.2.3",
+    "@llamaindex/google": "^0.2.4",
-    "@llamaindex/groq": "^0.0.65",
+    "@llamaindex/groq": "^0.0.67",
-    "@llamaindex/huggingface": "^0.1.4",
+    "@llamaindex/huggingface": "^0.1.6",
     "@llamaindex/milvus": "^0.1.11",
     "@llamaindex/mistral": "^0.1.2",
     "@llamaindex/mixedbread": "^0.0.16",
@@ -32,7 +32,7 @@
     "@llamaindex/elastic-search": "^0.1.2",
     "@llamaindex/node-parser": "^2.0.2",
     "@llamaindex/ollama": "^0.1.2",
-    "@llamaindex/openai": "^0.3.2",
+    "@llamaindex/openai": "^0.3.4",
     "@llamaindex/pinecone": "^0.1.2",
     "@llamaindex/portkey-ai": "^0.0.44",
     "@llamaindex/postgres": "^0.0.45",
@@ -41,15 +41,15 @@
     "@llamaindex/replicate": "^0.0.44",
     "@llamaindex/upstash": "^0.0.16",
     "@llamaindex/vercel": "^0.1.2",
-    "@llamaindex/vllm": "^0.0.36",
+    "@llamaindex/vllm": "^0.0.38",
     "@llamaindex/voyage-ai": "^1.0.8",
     "@llamaindex/weaviate": "^0.0.16",
     "@llamaindex/workflow": "^1.0.3",
-    "@llamaindex/deepseek": "^0.0.10",
+    "@llamaindex/deepseek": "^0.0.12",
-    "@llamaindex/fireworks": "^0.0.10",
+    "@llamaindex/fireworks": "^0.0.12",
-    "@llamaindex/together": "^0.0.10",
+    "@llamaindex/together": "^0.0.12",
-    "@llamaindex/jinaai": "^0.0.10",
+    "@llamaindex/jinaai": "^0.0.12",
-    "@llamaindex/perplexity": "^0.0.7",
+    "@llamaindex/perplexity": "^0.0.9",
     "@llamaindex/supabase": "^0.1.1",
     "@llamaindex/tools": "^0.0.5",
     "@notionhq/client": "^2.2.15",
@@ -60,7 +60,7 @@
     "commander": "^12.1.0",
     "dotenv": "^16.4.5",
     "js-tiktoken": "^1.0.14",
-    "llamaindex": "^0.10.0",
+    "llamaindex": "^0.10.2",
     "mongodb": "6.7.0",
     "postgres": "^3.4.4",
     "wikipedia": "^2.1.2",

packages/autotool/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/autotool
 
+## 7.0.2
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 7.0.1
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 7.0.0
 
 ### Patch Changes

packages/autotool/examples/01_node/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/autotool-01-node-example
 
+## 0.0.103
+
+### Patch Changes
+
+- llamaindex@0.10.2
+- @llamaindex/autotool@7.0.2
+
+## 0.0.102
+
+### Patch Changes
+
+- llamaindex@0.10.1
+- @llamaindex/autotool@7.0.1
+
 ## 0.0.101
 
 ### Patch Changes

packages/autotool/examples/01_node/package.json

@@ -13,5 +13,5 @@
   "scripts": {
     "start": "node --import tsx --import @llamaindex/autotool/node ./src/index.ts"
   },
-  "version": "0.0.101"
+  "version": "0.0.103"
 }

packages/autotool/package.json

@@ -6,7 +6,7 @@
     "url": "git+https://github.com/run-llama/LlamaIndexTS.git",
     "directory": "packages/autotool"
   },
-  "version": "7.0.0",
+  "version": "7.0.2",
   "description": "auto transpile your JS function to LLM Agent compatible",
   "files": [
     "dist",

packages/env/package.json

@@ -116,7 +116,7 @@
     "test": "vitest"
   },
   "devDependencies": {
-    "@huggingface/transformers": "^3.0.2",
+    "@huggingface/transformers": "^3.5.0",
     "@types/node": "^22.9.0",
     "@types/readable-stream": "^4.0.15",
     "vitest": "^2.1.5"
@@ -127,7 +127,7 @@
     "js-tiktoken": "^1.0.12"
   },
   "peerDependencies": {
-    "@huggingface/transformers": "^3.0.2",
+    "@huggingface/transformers": "^3.5.0",
     "gpt-tokenizer": "^2.5.0"
   },
   "peerDependenciesMeta": {

packages/experimental/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/experimental
 
+## 0.0.172
+
+### Patch Changes
+
+- llamaindex@0.10.2
+
+## 0.0.171
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.0.170
 
 ### Patch Changes

packages/experimental/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/experimental",
   "description": "Experimental package for LlamaIndexTS",
-  "version": "0.0.170",
+  "version": "0.0.172",
   "type": "module",
   "types": "dist/type/index.d.ts",
   "main": "dist/cjs/index.js",

packages/llamaindex/CHANGELOG.md

@@ -1,5 +1,19 @@
 # llamaindex
 
+## 0.10.2
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.10.1
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.10.0
 
 ### Minor Changes

packages/llamaindex/package.json

@@ -1,6 +1,6 @@
 {
   "name": "llamaindex",
-  "version": "0.10.0",
+  "version": "0.10.2",
   "license": "MIT",
   "type": "module",
   "keywords": [

packages/providers/clip/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/clip
 
+## 0.0.52
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.51
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.50
 
 ### Patch Changes

packages/providers/clip/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/clip",
   "description": "Clip Embedding Adapter for LlamaIndex",
-  "version": "0.0.50",
+  "version": "0.0.52",
   "type": "module",
   "types": "dist/index.d.ts",
   "main": "dist/index.cjs",
@@ -39,7 +39,7 @@
     "dev": "bunchee --watch"
   },
   "dependencies": {
-    "@huggingface/transformers": "^3.0.2",
+    "@huggingface/transformers": "^3.5.0",
     "@llamaindex/core": "workspace:*",
     "@llamaindex/env": "workspace:*",
     "@llamaindex/openai": "workspace:*"

packages/providers/deepinfra/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/deepinfra
 
+## 0.0.52
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.51
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.50
 
 ### Patch Changes

packages/providers/deepinfra/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/deepinfra",
   "description": "Deepinfra Adapter for LlamaIndex",
-  "version": "0.0.50",
+  "version": "0.0.52",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/deepseek/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/deepseek
 
+## 0.0.12
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.11
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.10
 
 ### Patch Changes

packages/providers/deepseek/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/deepseek",
   "description": "DeepSeek Adapter for LlamaIndex",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/fireworks/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/fireworks
 
+## 0.0.12
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.11
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.10
 
 ### Patch Changes

packages/providers/fireworks/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/fireworks",
   "description": "Fireworks Adapter for LlamaIndex",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/google/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @llamaindex/google
 
+## 0.2.4
+
+### Patch Changes
+
+- 96dac4d: Add Gemini 2.5 Flash Preview
+
 ## 0.2.3
 
 ### Patch Changes

packages/providers/google/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/google",
   "description": "Google Adapter for LlamaIndex",
-  "version": "0.2.3",
+  "version": "0.2.4",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/google/src/base.ts

@@ -62,6 +62,7 @@ export const GEMINI_MODEL_INFO_MAP: Record<GEMINI_MODEL, GeminiModelInfo> = {
   [GEMINI_MODEL.GEMINI_2_0_FLASH_THINKING_EXP]: { contextWindow: 32768 },
   [GEMINI_MODEL.GEMINI_2_0_PRO_EXPERIMENTAL]: { contextWindow: 2 * 10 ** 6 },
   [GEMINI_MODEL.GEMINI_2_5_PRO_PREVIEW]: { contextWindow: 10 ** 6 },
+  [GEMINI_MODEL.GEMINI_2_5_FLASH_PREVIEW]: { contextWindow: 10 ** 6 },
 };
 
 export const SUPPORT_TOOL_CALL_MODELS: GEMINI_MODEL[] = [
@@ -79,6 +80,7 @@ export const SUPPORT_TOOL_CALL_MODELS: GEMINI_MODEL[] = [
   GEMINI_MODEL.GEMINI_2_0_FLASH,
   GEMINI_MODEL.GEMINI_2_0_PRO_EXPERIMENTAL,
   GEMINI_MODEL.GEMINI_2_5_PRO_PREVIEW,
+  GEMINI_MODEL.GEMINI_2_5_FLASH_PREVIEW,
 ];
 
 export const DEFAULT_GEMINI_PARAMS = {

packages/providers/google/src/types.ts

@@ -74,6 +74,7 @@ export enum GEMINI_MODEL {
   GEMINI_2_0_FLASH_THINKING_EXP = "gemini-2.0-flash-thinking-exp-01-21",
   GEMINI_2_0_PRO_EXPERIMENTAL = "gemini-2.0-pro-exp-02-05",
   GEMINI_2_5_PRO_PREVIEW = "gemini-2.5-pro-preview-03-25",
+  GEMINI_2_5_FLASH_PREVIEW = "gemini-2.5-flash-preview-04-17",
 }
 
 export interface GeminiModelInfo {

packages/providers/groq/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/groq
 
+## 0.0.67
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.66
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.65
 
 ### Patch Changes

packages/providers/groq/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/groq",
   "description": "Groq Adapter for LlamaIndex",
-  "version": "0.0.65",
+  "version": "0.0.67",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/huggingface/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/huggingface
 
+## 0.1.6
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.1.5
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.1.4
 
 ### Patch Changes

packages/providers/huggingface/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/huggingface",
   "description": "Huggingface Adapter for LlamaIndex",
-  "version": "0.1.4",
+  "version": "0.1.6",
   "type": "module",
   "types": "dist/index.d.ts",
   "main": "dist/index.cjs",
@@ -40,7 +40,7 @@
   },
   "dependencies": {
     "@huggingface/inference": "^2.8.1",
-    "@huggingface/transformers": "^3.0.2",
+    "@huggingface/transformers": "^3.5.0",
     "@llamaindex/core": "workspace:*",
     "@llamaindex/env": "workspace:*",
     "@llamaindex/openai": "workspace:*"

packages/providers/huggingface/src/embedding.ts

@@ -1,4 +1,7 @@
-import type { pipeline } from "@huggingface/transformers";
+import type {
+  FeatureExtractionPipeline,
+  pipeline,
+} from "@huggingface/transformers";
 import { BaseEmbedding } from "@llamaindex/core/embeddings";
 import { Settings } from "@llamaindex/core/global";
 import {
@@ -35,9 +38,7 @@ export class HuggingFaceEmbedding extends BaseEmbedding {
   modelType: string = HuggingFaceEmbeddingModelType.XENOVA_ALL_MINILM_L6_V2;
   modelOptions: Parameters<typeof pipeline<"feature-extraction">>[2] = {};
 
-  private extractor: Awaited<
+  private extractor: FeatureExtractionPipeline | null = null;
-    ReturnType<typeof pipeline<"feature-extraction">>
-  > | null = null;
 
   constructor(params: HuggingFaceEmbeddingParams = {}) {
     super();
@@ -60,11 +61,11 @@ export class HuggingFaceEmbedding extends BaseEmbedding {
           true,
         );
       });
-      this.extractor = await pipeline(
+      this.extractor = (await pipeline(
         "feature-extraction",
         this.modelType,
         this.modelOptions,
-      );
+      )) as never;
     }
     return this.extractor;
   }

packages/providers/jinaai/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/jinaai
 
+## 0.0.12
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.11
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.10
 
 ### Patch Changes

packages/providers/jinaai/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/jinaai",
   "description": "JinaAI Adapter for LlamaIndex",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/openai/CHANGELOG.md

@@ -1,5 +1,17 @@
 # @llamaindex/openai
 
+## 0.3.4
+
+### Patch Changes
+
+- e5c3f95: Update o4-mini to accept reasoning parameters and exclude temperature
+
+## 0.3.3
+
+### Patch Changes
+
+- 96dd798: Add o3 and o4-mini models
+
 ## 0.3.2
 
 ### Patch Changes

packages/providers/openai/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/openai",
   "description": "OpenAI Adapter for LlamaIndex",
-  "version": "0.3.2",
+  "version": "0.3.4",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/openai/src/utils.ts

@@ -59,6 +59,9 @@ export const GPT4_MODELS = {
   "gpt-4.1": { contextWindow: 10 ** 6 },
   "gpt-4.1-mini": { contextWindow: 10 ** 6 },
   "gpt-4.1-nano": { contextWindow: 10 ** 6 },
+  "gpt-4.1-2025-04-14": { contextWindow: 10 ** 6 },
+  "gpt-4.1-mini-2025-04-14": { contextWindow: 10 ** 6 },
+  "gpt-4.1-nano-2025-04-14": { contextWindow: 10 ** 6 },
 };
 
 // NOTE we don't currently support gpt-3.5-turbo-instruct and don't plan to in the near future
@@ -100,6 +103,21 @@ export const O3_MODELS = {
   "o3-mini-2025-01-31": {
     contextWindow: 200000,
   },
+  o3: {
+    contextWindow: 200000,
+  },
+  "o3-2025-04-16": {
+    contextWindow: 200000,
+  },
+};
+
+export const O4_MODELS = {
+  "o4-mini": {
+    contextWindow: 200000,
+  },
+  "o4-mini-2025-04-16": {
+    contextWindow: 200000,
+  },
 };
 
 /**
@@ -110,6 +128,7 @@ export const ALL_AVAILABLE_OPENAI_MODELS = {
   ...GPT35_MODELS,
   ...O1_MODELS,
   ...O3_MODELS,
+  ...O4_MODELS,
 } satisfies Record<ChatModel, { contextWindow: number }>;
 
 export function isFunctionCallingModel(llm: LLM): llm is OpenAI {
@@ -130,11 +149,12 @@ export function isFunctionCallingModel(llm: LLM): llm is OpenAI {
 export function isReasoningModel(model: ChatModel | string): boolean {
   const isO1 = model.startsWith("o1");
   const isO3 = model.startsWith("o3");
-  return isO1 || isO3;
+  const isO4 = model.startsWith("o4");
+  return isO1 || isO3 || isO4;
 }
 
 export function isTemperatureSupported(model: ChatModel | string): boolean {
-  return !model.startsWith("o3");
+  return !model.startsWith("o3") && !model.startsWith("o4");
 }
 
 export type OpenAIAdditionalMetadata = object;

packages/providers/perplexity/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/perplexity
 
+## 0.0.9
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.8
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.7
 
 ### Patch Changes

packages/providers/perplexity/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/perplexity",
   "description": "Perplexity Adapter for LlamaIndex",
-  "version": "0.0.7",
+  "version": "0.0.9",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/together/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/together
 
+## 0.0.12
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.11
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.10
 
 ### Patch Changes

packages/providers/together/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/together",
   "description": "Together Adapter for LlamaIndex",
-  "version": "0.0.10",
+  "version": "0.0.12",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/providers/vllm/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/vllm
 
+## 0.0.38
+
+### Patch Changes
+
+- Updated dependencies [e5c3f95]
+  - @llamaindex/openai@0.3.4
+
+## 0.0.37
+
+### Patch Changes
+
+- Updated dependencies [96dd798]
+  - @llamaindex/openai@0.3.3
+
 ## 0.0.36
 
 ### Patch Changes

packages/providers/vllm/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@llamaindex/vllm",
   "description": "vLLM Adapter for LlamaIndex",
-  "version": "0.0.36",
+  "version": "0.0.38",
   "type": "module",
   "main": "./dist/index.cjs",
   "module": "./dist/index.js",

packages/server/CHANGELOG.md

@@ -1,5 +1,19 @@
 # @llamaindex/server
 
+## 0.1.5
+
+### Patch Changes
+
+- 7ca9ddf: Add generate ui workflow to @llamaindex/server
+- 3310eaa: chore: bump chat-ui
+  - llamaindex@0.10.2
+
+## 0.1.4
+
+### Patch Changes
+
+- llamaindex@0.10.1
+
 ## 0.1.3
 
 ### Patch Changes

packages/server/next/app/components/chat-section.tsx

@@ -4,9 +4,10 @@ import { ChatSection as ChatSectionUI } from "@llamaindex/chat-ui";
 import "@llamaindex/chat-ui/styles/markdown.css";
 import "@llamaindex/chat-ui/styles/pdf.css";
 import { useChat } from "ai/react";
+import { Sparkles, Star } from "lucide-react";
 import { useEffect, useMemo, useState } from "react";
-import Header from "./header";
 import { RenderingErrors } from "./rendering-errors";
+import { Button } from "./ui/button";
 import CustomChatInput from "./ui/chat/chat-input";
 import CustomChatMessages from "./ui/chat/chat-messages";
 import { fetchComponentDefinitions } from "./ui/chat/custom/events/loader";
@@ -51,20 +52,66 @@ export default function ChatSection() {
     experimental_throttle: 100,
   });
   return (
-    <div className="flex h-[85vh] w-full flex-col gap-2">
+    <>
-      <Header />
+      <div className="grid h-screen w-screen grid-cols-4 gap-4 overflow-hidden">
-      <RenderingErrors
+        <div className="col-span-1">
-        uniqueErrors={uniqueErrors}
+          <div className="flex flex-col gap-8 p-2 pl-4">
-        clearErrors={() => setErrors([])}
+            <div className="flex items-center gap-2">
-      />
+              <Sparkles className="size-4" />
-      <ChatSectionUI handler={handler} className="min-h-0 w-full flex-1">
+              <h1 className="font-semibold">{getConfig("APP_TITLE")}</h1>
-        <CustomChatMessages
+            </div>
-          componentDefs={componentDefs}
+            <RenderingErrors
-          appendError={appendError}
+              uniqueErrors={uniqueErrors}
-        />
+              clearErrors={() => setErrors([])}
-        <CustomChatInput />
+            />
-      </ChatSectionUI>
+          </div>
+        </div>
+        <div className="col-span-2 h-full min-h-0">
+          <ChatSectionUI handler={handler} className="p-0">
+            <CustomChatMessages
+              componentDefs={componentDefs}
+              appendError={appendError}
+            />
+            <CustomChatInput />
+          </ChatSectionUI>
+        </div>
+        <div className="col-span-1">
+          <LlamaIndexLinks />
+        </div>
+      </div>
       <TailwindCDNInjection />
+    </>
+  );
+}
+
+function LlamaIndexLinks() {
+  return (
+    <div className="flex items-center justify-end gap-4 p-2 pr-4">
+      <div className="flex items-center gap-2">
+        <a
+          href="https://www.llamaindex.ai/"
+          target="_blank"
+          rel="noopener noreferrer"
+          className="text-sm text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200"
+        >
+          Built by LlamaIndex
+        </a>
+        <img
+          className="h-[24px] w-[24px] rounded-sm"
+          src="/llama.png"
+          alt="Llama Logo"
+        />
+      </div>
+      <a
+        href="https://github.com/run-llama/LlamaIndexTS"
+        target="_blank"
+        rel="noopener noreferrer"
+      >
+        <Button variant="outline" size="sm">
+          <Star className="mr-2 size-4" />
+          Star on GitHub
+        </Button>
+      </a>
     </div>
   );
 }

packages/server/next/app/components/header.tsx

@@ -1,28 +0,0 @@
-"use client";
-
-import { getConfig } from "./ui/lib/utils";
-
-export default function Header() {
-  return (
-    <div className="z-10 w-full max-w-5xl items-center justify-between font-mono text-sm">
-      <div className="flex w-full flex-col items-center pb-2 text-center">
-        <h1 className="mb-2 text-4xl font-bold">{getConfig("APP_TITLE")}</h1>
-        <div className="flex items-center justify-center gap-2">
-          <a
-            href="https://www.llamaindex.ai/"
-            target="_blank"
-            rel="noopener noreferrer"
-            className="text-sm text-gray-600 hover:text-gray-800 dark:text-gray-400 dark:hover:text-gray-200"
-          >
-            Built by LlamaIndex
-          </a>
-          <img
-            className="h-[24px] w-[24px] rounded-sm"
-            src="/llama.png"
-            alt="Llama Logo"
-          />
-        </div>
-      </div>
-    </div>
-  );
-}

packages/server/next/app/components/ui/chat/chat-avatar.tsx

@@ -1,25 +1,15 @@
 "use client";
 
-import { useChatMessage } from "@llamaindex/chat-ui";
+import { ChatMessage } from "@llamaindex/chat-ui";
-import { User2 } from "lucide-react";
 
 export function ChatMessageAvatar() {
-  const { message } = useChatMessage();
-  if (message.role === "user") {
-    return (
-      <div className="bg-background flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border shadow-sm">
-        <User2 className="h-4 w-4" />
-      </div>
-    );
-  }
-
   return (
-    <div className="flex h-8 w-8 shrink-0 select-none items-center justify-center rounded-md border bg-black text-white shadow-sm">
+    <ChatMessage.Avatar>
       <img
-        className="h-[40px] w-[40px] rounded-xl object-contain"
+        className="border-1 rounded-full border-[#e711dd]"
         src="/llama.png"
         alt="Llama Logo"
       />
-    </div>
+    </ChatMessage.Avatar>
   );
 }

packages/server/next/app/components/ui/chat/chat-input.tsx

@@ -45,30 +45,24 @@ export default function CustomChatInput() {
   const annotations = getAnnotations();
 
   return (
-    <ChatInput
+    <ChatInput resetUploadedFiles={reset} annotations={annotations}>
-      className="rounded-xl shadow-xl"
+      {/* Image preview section */}
-      resetUploadedFiles={reset}
+      {imageUrl && (
-      annotations={annotations}
+        <ImagePreview url={imageUrl} onRemove={() => setImageUrl(null)} />
-    >
+      )}
-      <div>
+      {/* Document previews section */}
-        {/* Image preview section */}
+      {files.length > 0 && (
-        {imageUrl && (
+        <div className="flex w-full gap-4 overflow-auto py-2">
-          <ImagePreview url={imageUrl} onRemove={() => setImageUrl(null)} />
+          {files.map((file) => (
-        )}
+            <DocumentInfo
-        {/* Document previews section */}
+              key={file.id}
-        {files.length > 0 && (
+              document={{ url: file.url, sources: [] }}
-          <div className="flex w-full gap-4 overflow-auto py-2">
+              className="mb-2 mt-2"
-            {files.map((file) => (
+              onRemove={() => removeDoc(file)}
-              <DocumentInfo
+            />
-                key={file.id}
+          ))}
-                document={{ url: file.url, sources: [] }}
+        </div>
-                className="mb-2 mt-2"
+      )}
-                onRemove={() => removeDoc(file)}
-              />
-            ))}
-          </div>
-        )}
-      </div>
       <ChatInput.Form>
         <ChatInput.Field />
         {uploadAPI && <ChatInput.Upload onUpload={handleUploadFile} />}

packages/server/next/app/components/ui/chat/chat-messages.tsx

@@ -16,7 +16,7 @@ export default function CustomChatMessages({
   const { messages } = useChatUI();
 
   return (
-    <ChatMessages className="rounded-xl shadow-xl">
+    <ChatMessages>
       <ChatMessages.List>
         {messages.map((message, index) => (
           <ChatMessage
@@ -32,9 +32,9 @@ export default function CustomChatMessages({
             <ChatMessage.Actions />
           </ChatMessage>
         ))}
+        <ChatMessages.Empty />
         <ChatMessages.Loading />
       </ChatMessages.List>
-      <ChatMessages.Actions />
       <ChatStarter />
     </ChatMessages>
   );

packages/server/next/app/components/ui/chat/chat-starter.tsx

@@ -4,7 +4,7 @@ import { useChatUI } from "@llamaindex/chat-ui";
 import { StarterQuestions } from "@llamaindex/chat-ui/widgets";
 import { getConfig } from "../lib/utils";
 
-export function ChatStarter() {
+export function ChatStarter({ className }: { className?: string }) {
   const { append, messages, requestData } = useChatUI();
   const starterQuestions = getConfig("STARTER_QUESTIONS") ?? [];
 
@@ -13,6 +13,7 @@ export function ChatStarter() {
     <StarterQuestions
       append={(message) => append(message, { data: requestData })}
       questions={starterQuestions}
+      className={className}
     />
   );
 }

packages/server/next/app/page.tsx

@@ -13,11 +13,5 @@ const ChatSection = dynamic(() => import("./components/chat-section"), {
 });
 
 export default function Home() {
-  return (
+  return <ChatSection />;
-    <main className="background-gradient flex h-screen w-screen items-center justify-center overflow-hidden">
-      <div className="w-[90%] space-y-2 lg:w-[60rem] lg:space-y-10">
-        <ChatSection />
-      </div>
-    </main>
-  );
 }