├── .prettierignore
├── .eslintrc.json
├── .vscode
└── settings.json
├── public
├── favicon.ico
├── vercel.svg
└── next.svg
├── postcss.config.js
├── prettier.config.js
├── next.config.js
├── README.md
├── lib
├── utils.ts
└── essay.ts
├── pages
├── _app.tsx
├── _document.tsx
├── api
│ ├── splitandembed.ts
│ └── retrieveandquery.ts
└── index.tsx
├── components.json
├── .gitignore
├── tsconfig.json
├── components
└── ui
│ ├── label.tsx
│ ├── textarea.tsx
│ ├── input.tsx
│ ├── slider.tsx
│ ├── popover.tsx
│ ├── button.tsx
│ └── linkedslider.tsx
├── LICENSE
├── styles
└── globals.css
├── package.json
├── tailwind.config.js
└── pnpm-lock.yaml
/.prettierignore:
--------------------------------------------------------------------------------
1 | pnpm-lock.yaml
2 |
--------------------------------------------------------------------------------
/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 | "extends": "next/core-web-vitals"
3 | }
4 |
--------------------------------------------------------------------------------
/.vscode/settings.json:
--------------------------------------------------------------------------------
1 | {
2 | "editor.tabSize": 2,
3 | "editor.formatOnSave": true
4 | }
5 |
--------------------------------------------------------------------------------
/public/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/run-llama/ts-playground/HEAD/public/favicon.ico
--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: {
3 | tailwindcss: {},
4 | autoprefixer: {},
5 | },
6 | };
7 |
--------------------------------------------------------------------------------
/prettier.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 | plugins: ["prettier-plugin-organize-imports", "prettier-plugin-tailwindcss"],
3 | };
4 |
--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
1 | /** @type {import('next').NextConfig} */
2 | const nextConfig = {
3 | reactStrictMode: true,
4 | };
5 |
6 | module.exports = nextConfig;
7 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # LlamaIndex.TS Playground
2 |
3 | ## Getting Started
4 |
5 | Run `pnpm install` and `pnpm run dev`
6 |
7 | Make sure to set your OpenAI key: `export OPENAI_API_KEY-="sk-..."`
8 |
--------------------------------------------------------------------------------
/lib/utils.ts:
--------------------------------------------------------------------------------
1 | import { clsx, type ClassValue } from "clsx";
2 | import { twMerge } from "tailwind-merge";
3 |
4 | export function cn(...inputs: ClassValue[]) {
5 | return twMerge(clsx(inputs));
6 | }
7 |
--------------------------------------------------------------------------------
/pages/_app.tsx:
--------------------------------------------------------------------------------
1 | import "@/styles/globals.css";
2 | import type { AppProps } from "next/app";
3 |
4 | export default function App({ Component, pageProps }: AppProps) {
5 | return ;
6 | }
7 |
--------------------------------------------------------------------------------
/pages/_document.tsx:
--------------------------------------------------------------------------------
1 | import { Head, Html, Main, NextScript } from "next/document";
2 |
3 | export default function Document() {
4 | return (
5 |
6 |
8 |
9 |
10 |
11 |
12 | );
13 | }
14 |
--------------------------------------------------------------------------------
/components.json:
--------------------------------------------------------------------------------
1 | {
2 | "$schema": "https://ui.shadcn.com/schema.json",
3 | "style": "default",
4 | "rsc": false,
5 | "tsx": true,
6 | "tailwind": {
7 | "config": "tailwind.config.js",
8 | "css": "styles/globals.css",
9 | "baseColor": "slate",
10 | "cssVariables": true
11 | },
12 | "aliases": {
13 | "components": "@/components",
14 | "utils": "@/lib/utils"
15 | }
16 | }
17 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
2 |
3 | # dependencies
4 | /node_modules
5 | /.pnp
6 | .pnp.js
7 |
8 | # testing
9 | /coverage
10 |
11 | # next.js
12 | /.next/
13 | /out/
14 |
15 | # production
16 | /build
17 |
18 | # misc
19 | .DS_Store
20 | *.pem
21 |
22 | # debug
23 | npm-debug.log*
24 | yarn-debug.log*
25 | yarn-error.log*
26 |
27 | # local env files
28 | .env*.local
29 |
30 | # vercel
31 | .vercel
32 |
33 | # typescript
34 | *.tsbuildinfo
35 | next-env.d.ts
36 |
--------------------------------------------------------------------------------
/public/vercel.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "target": "es5",
4 | "lib": ["dom", "dom.iterable", "esnext"],
5 | "allowJs": true,
6 | "skipLibCheck": true,
7 | "strict": true,
8 | "forceConsistentCasingInFileNames": true,
9 | "noEmit": true,
10 | "esModuleInterop": true,
11 | "module": "esnext",
12 | "moduleResolution": "bundler",
13 | "resolveJsonModule": true,
14 | "isolatedModules": true,
15 | "jsx": "preserve",
16 | "incremental": true,
17 | "paths": {
18 | "@/*": ["./*"]
19 | }
20 | },
21 | "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
22 | "exclude": ["node_modules"]
23 | }
24 |
--------------------------------------------------------------------------------
/components/ui/label.tsx:
--------------------------------------------------------------------------------
1 | import * as LabelPrimitive from "@radix-ui/react-label";
2 | import { cva, type VariantProps } from "class-variance-authority";
3 | import * as React from "react";
4 |
5 | import { cn } from "@/lib/utils";
6 |
7 | const labelVariants = cva(
8 | "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",
9 | );
10 |
11 | const Label = React.forwardRef<
12 | React.ElementRef,
13 | React.ComponentPropsWithoutRef &
14 | VariantProps
15 | >(({ className, ...props }, ref) => (
16 |
21 | ));
22 | Label.displayName = LabelPrimitive.Root.displayName;
23 |
24 | export { Label };
25 |
--------------------------------------------------------------------------------
/components/ui/textarea.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react";
2 |
3 | import { cn } from "@/lib/utils";
4 |
5 | export interface TextareaProps
6 | extends React.TextareaHTMLAttributes {}
7 |
8 | const Textarea = React.forwardRef(
9 | ({ className, ...props }, ref) => {
10 | return (
11 |
19 | );
20 | },
21 | );
22 | Textarea.displayName = "Textarea";
23 |
24 | export { Textarea };
25 |
--------------------------------------------------------------------------------
/components/ui/input.tsx:
--------------------------------------------------------------------------------
1 | import * as React from "react";
2 |
3 | import { cn } from "@/lib/utils";
4 |
5 | export interface InputProps
6 | extends React.InputHTMLAttributes {}
7 |
8 | const Input = React.forwardRef(
9 | ({ className, type, ...props }, ref) => {
10 | return (
11 |
20 | );
21 | },
22 | );
23 | Input.displayName = "Input";
24 |
25 | export { Input };
26 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2023 LlamaIndex
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/components/ui/slider.tsx:
--------------------------------------------------------------------------------
1 | import * as SliderPrimitive from "@radix-ui/react-slider";
2 | import * as React from "react";
3 |
4 | import { cn } from "@/lib/utils";
5 |
6 | const Slider = React.forwardRef<
7 | React.ElementRef,
8 | React.ComponentPropsWithoutRef
9 | >(({ className, ...props }, ref) => (
10 |
18 |
19 |
20 |
21 |
22 |
23 | ));
24 | Slider.displayName = SliderPrimitive.Root.displayName;
25 |
26 | export { Slider };
27 |
--------------------------------------------------------------------------------
/styles/globals.css:
--------------------------------------------------------------------------------
1 | @tailwind base;
2 | @tailwind components;
3 | @tailwind utilities;
4 |
5 | @layer base {
6 | :root {
7 | --background: 222.2 84% 4.9%;
8 | --foreground: 210 40% 98%;
9 |
10 | --muted: 217.2 32.6% 17.5%;
11 | --muted-foreground: 215 20.2% 65.1%;
12 |
13 | --popover: 222.2 84% 4.9%;
14 | --popover-foreground: 210 40% 98%;
15 |
16 | --card: 222.2 84% 4.9%;
17 | --card-foreground: 210 40% 98%;
18 |
19 | --border: 217.2 32.6% 17.5%;
20 | --input: 217.2 32.6% 17.5%;
21 |
22 | --primary: 210 40% 98%;
23 | --primary-foreground: 222.2 47.4% 11.2%;
24 |
25 | --secondary: 217.2 32.6% 17.5%;
26 | --secondary-foreground: 210 40% 98%;
27 |
28 | --accent: 217.2 32.6% 17.5%;
29 | --accent-foreground: 210 40% 98%;
30 |
31 | --destructive: 0 62.8% 30.6%;
32 | --destructive-foreground: 0 85.7% 97.3%;
33 |
34 | --ring: 217.2 32.6% 17.5%;
35 |
36 | --radius: 0.5rem;
37 | }
38 | }
39 |
40 | @layer base {
41 | * {
42 | @apply border-border;
43 | }
44 | body {
45 | @apply bg-background text-foreground;
46 | }
47 | }
48 |
49 | html,
50 | body,
51 | #__next {
52 | height: 100%;
53 | width: 100%;
54 | }
55 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "playground",
3 | "version": "0.1.0",
4 | "private": true,
5 | "scripts": {
6 | "dev": "NODE_TLS_REJECT_UNAUTHORIZED=0 next dev",
7 | "build": "next build",
8 | "start": "next start",
9 | "lint": "next lint"
10 | },
11 | "dependencies": {
12 | "@radix-ui/react-icons": "^1.3.0",
13 | "@radix-ui/react-label": "^2.0.2",
14 | "@radix-ui/react-popover": "^1.0.7",
15 | "@radix-ui/react-slider": "^1.1.2",
16 | "@radix-ui/react-slot": "^1.0.2",
17 | "@types/node": "20.7.0",
18 | "@types/react": "18.2.23",
19 | "@types/react-dom": "18.2.7",
20 | "autoprefixer": "10.4.16",
21 | "class-variance-authority": "^0.7.0",
22 | "clsx": "^2.0.0",
23 | "eslint": "8.53.0",
24 | "eslint-config-next": "13.5.3",
25 | "llamaindex": "0.0.34",
26 | "lucide-react": "^0.263.1",
27 | "next": "13.5.3",
28 | "postcss": "8.4.30",
29 | "react": "18.2.0",
30 | "react-dom": "18.2.0",
31 | "tailwind-merge": "^1.14.0",
32 | "tailwindcss": "3.3.3",
33 | "tailwindcss-animate": "^1.0.7",
34 | "typescript": "5.2.2"
35 | },
36 | "devDependencies": {
37 | "prettier": "^3.0.3",
38 | "prettier-plugin-organize-imports": "^3.2.3",
39 | "prettier-plugin-tailwindcss": "^0.5.6"
40 | }
41 | }
42 |
--------------------------------------------------------------------------------
/public/next.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/components/ui/popover.tsx:
--------------------------------------------------------------------------------
1 | import * as PopoverPrimitive from "@radix-ui/react-popover";
2 | import * as React from "react";
3 |
4 | import { cn } from "@/lib/utils";
5 |
6 | const Popover = PopoverPrimitive.Root;
7 |
8 | const PopoverTrigger = PopoverPrimitive.Trigger;
9 |
10 | const PopoverContent = React.forwardRef<
11 | React.ElementRef,
12 | React.ComponentPropsWithoutRef
13 | >(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
14 |
15 |
25 |
26 | ));
27 | PopoverContent.displayName = PopoverPrimitive.Content.displayName;
28 |
29 | export { Popover, PopoverContent, PopoverTrigger };
30 |
--------------------------------------------------------------------------------
/pages/api/splitandembed.ts:
--------------------------------------------------------------------------------
1 | // Next.js API route support: https://nextjs.org/docs/api-routes/introduction
2 | import {
3 | Document,
4 | MetadataMode,
5 | SentenceSplitter,
6 | VectorStoreIndex,
7 | getNodesFromDocument,
8 | serviceContextFromDefaults,
9 | } from "llamaindex";
10 | import type { NextApiRequest, NextApiResponse } from "next";
11 |
12 | type Input = {
13 | document: string;
14 | chunkSize?: number;
15 | chunkOverlap?: number;
16 | };
17 |
18 | type Output = {
19 | error?: string;
20 | payload?: {
21 | nodesWithEmbedding: {
22 | text: string;
23 | embedding: number[];
24 | }[];
25 | };
26 | };
27 |
28 | export default async function handler(
29 | req: NextApiRequest,
30 | res: NextApiResponse