\n \n \n \n \n\n",[],[421,432],"58ac73a8-328d-11f0-a390-569c3dd06744","hono.ts","39fc6f7e-328a-11f0-878e-569c3dd06744",356,["D",1747424310626],"// deno-lint-ignore-file no-window\n\nimport { hc } from \"https://esm.sh/hono@4.7.7/client?deps=hono@4.7.7\";\nimport { QueryClient } from \"https://esm.sh/@tanstack/react-query@5.74.7?deps=react@19.0.0\";\nimport { AppType } from \"../backend/api/mod.ts\";\nimport { APP_URL } from \"../shared/consts.ts\";\n\nexport const client = hc(\n typeof window !== \"undefined\"\n ? window.location.origin + \"/api\"\n : APP_URL + \"/api\",\n { init: { credentials: \"include\" } },\n);\nexport const queryClient = new QueryClient();\n",[],[421,441],"aaca8df4-343c-11f0-9b89-9e149126039e","SearchPage.tsx","6220a176-343a-11f0-8c42-9e149126039e","70322a61-8486-4183-9922-c6f2af78d1ff",711,["D",1747609561620],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { DEFAULT_QUERY } from \"../../shared/consts.ts\";\nimport { NpmPackage } from \"../../shared/schemas.ts\";\nimport { client } from \"../hono.ts\";\nimport { Header } from \"../components/Header.tsx\";\nimport { Layout } from \"../components/common/Layout.tsx\";\nimport { PackageList } from \"../components/PackageList.tsx\";\nimport { generateProfilePicture } from \"../components/ProfilePicture.tsx\";\n\n// Interface for profile picture cache\ninterface ProfilePictureCache {\n [key: string]: string;\n}\n\nexport function SearchPage() {\n const [items, setItems] = useState([]);\n const [query, setQuery] = useState(DEFAULT_QUERY);\n const [page, setPage] = useState(1);\n const [hasMore, setHasMore] = useState(true);\n const [loading, setLoading] = useState(false);\n const [profilePictures, setProfilePictures] = useState(\n {},\n );\n\n const fetchPackages = async (\n searchQuery: string,\n pageNum: number,\n append = false,\n ) => {\n if (loading) return;\n\n setLoading(true);\n try {\n const response = await client.search.$get({\n query: {\n q: searchQuery,\n n: \"10\",\n page: pageNum.toString(),\n },\n });\n\n const data = await response.json();\n\n // Generate profile pictures for new packages\n const newPackages = data.packages;\n const newProfilePictures: ProfilePictureCache = { ...profilePictures };\n\n // Generate profile pictures in parallel\n const picturePromises = newPackages.map(async (pkg: NpmPackage) => {\n // Skip if we already have a picture for this package\n if (newProfilePictures[pkg.id]) return;\n\n // Use the package name and avatarText as the prompt\n const prompt = `${pkg.name} ${pkg.avatarText} profile picture`;\n const imageUrl = await generateProfilePicture(prompt);\n if (imageUrl) {\n newProfilePictures[pkg.id] = imageUrl;\n }\n });\n\n // Wait for all profile pictures to be generated\n await Promise.all(picturePromises);\n setProfilePictures(newProfilePictures);\n\n if (append) {\n setItems((prevItems) => [...prevItems, ...data.packages]);\n } else {\n setItems(data.packages);\n }\n\n setHasMore(data.hasMore || false);\n setLoading(false);\n } catch (error) {\n console.error(\"Error fetching packages:\", error);\n setLoading(false);\n }\n };\n\n const handleSearch = (searchQuery: string) => {\n setPage(1);\n setItems([]);\n setQuery(searchQuery);\n fetchPackages(searchQuery, 1);\n };\n\n const loadMorePackages = () => {\n if (!hasMore || loading) return;\n const nextPage = page + 1;\n setPage(nextPage);\n fetchPackages(query, nextPage, true);\n };\n\n useEffect(() => {\n fetchPackages(query, 1);\n }, []);\n\n return (\n }\n >\n

\n \n

\n \n );\n}\n",[],[421,457,449],"pages","457eea6a-343e-11f0-926c-9e149126039e","PackageDetailPage.tsx","97609daa-343a-11f0-a3e8-9e149126039e",723,["D",1747610250698],5,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { marked } from \"https://esm.sh/marked@4.3.0\";\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\nimport { APP_URL } from \"../../shared/consts.ts\";\nimport { NpmPackage } from \"../../shared/schemas.ts\";\nimport { client } from \"../hono.ts\";\nimport { AppHeader } from \"../components/common/AppHeader.tsx\";\nimport { Layout } from \"../components/common/Layout.tsx\";\nimport { PackageHeader } from \"../components/package/PackageHeader.tsx\";\nimport { PackageLoading } from \"../components/package/PackageLoading.tsx\";\nimport { PackageNotFound } from \"../components/package/PackageNotFound.tsx\";\nimport { PackageReadme } from \"../components/package/PackageReadme.tsx\";\nimport { PackageSearchBar } from \"../components/package/PackageSearchBar.tsx\";\nimport { PackageSidebar } from \"../components/package/PackageSidebar.tsx\";\n\ninterface PackageDetailPageProps {\n packageName: string;\n}\n\nexport function PackageDetailPage({ packageName }: PackageDetailPageProps) {\n const [packageData, setPackageData] = useState(null);\n const [readme, setReadme] = useState(\"\");\n const [loading, setLoading] = useState(true);\n\n const packageDownloadLink = packageData\n ? `${APP_URL}api/npm-package/${packageData.name}`\n : \"\";\n\n useEffect(() => {\n const fetchPackageDetails = async () => {\n try {\n // Fetch package details\n const response = await client.package\n .$get({ query: { name: packageName } });\n const data = await response.json();\n setPackageData(data.package);\n setReadme(marked(data.readme || \"\"));\n } catch (error) {\n console.error(\"Error fetching package details:\", error);\n } finally {\n setLoading(false);\n }\n };\n\n fetchPackageDetails();\n }, [packageName]);\n\n if (loading) {\n return ;\n }\n\n if (!packageData) {\n return ;\n }\n\n return (\n \n \n \n }\n >\n

\n \n\n {/* Package content */}\n

\n \n \n

\n \n );\n}\n",[],[421,457,459],"6220c49e-343a-11f0-8c42-9e149126039e",665,["D",1747608580746],[350,351],[421,457],"bdd65b4e-340a-11f0-bc2c-9e149126039e","SearchBox.tsx","9e754796-328f-11f0-808f-569c3dd06744","6b24ddef-5b5b-4807-884f-b0e1eef81fd9",518,["D",1747588118769],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { FormEvent, useState } from \"https://esm.sh/react@18.2.0\";\nimport { SearchIcon } from \"./icons/SearchIcon.tsx\";\n\ninterface SearchBoxProps {\n onSearch: (query: string) => void;\n initialQuery?: string;\n}\n\nexport function SearchBox({ onSearch, initialQuery = \"\" }: SearchBoxProps) {\n const [query, setQuery] = useState(initialQuery);\n\n const handleSubmit = (e: FormEvent) => {\n e.preventDefault();\n if (query.trim()) {\n onSearch(query.trim());\n }\n };\n\n return (\n

\n \n

\n );\n}\n",[],[421,481,473],"components","aa081ddc-343c-11f0-a2e4-9e149126039e","SearchBar.tsx","ae378472-3439-11f0-b724-9e149126039e",697,["D",1747609560263],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { FormEvent, useState } from \"https://esm.sh/react@18.2.0\";\nimport { SearchIcon } from \"./icons/SearchIcon.tsx\";\n\ninterface SearchBarProps {\n initialQuery: string;\n onSearch: (query: string) => void;\n}\n\nexport function SearchBar({ initialQuery, onSearch }: SearchBarProps) {\n const [query, setQuery] = useState(initialQuery);\n\n const handleSubmit = (e: FormEvent) => {\n e.preventDefault();\n if (query.trim()) {\n onSearch(query.trim());\n }\n };\n\n return (\n

\n );\n}\n",[],[421,481,483],"a9f46e90-343c-11f0-9b89-9e149126039e","ProfilePicture.tsx","959255be-3439-11f0-b83c-9e149126039e",695,["D",1747609560248],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useEffect, useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface ProfilePictureProps {\n imageUrl?: string;\n author: string;\n avatarText: string;\n packageId: string;\n}\n\n// Function to generate profile pictures using the provided API\nexport const generateProfilePicture = async (\n prompt: string,\n): Promise => {\n try {\n const response = await fetch(\n \"https://stevekrouse--411c225025f011f0ad23569c3dd06744.web.val.run/api/fal/proxy\",\n {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"x-fal-target-url\": \"https://fal.run/fal-ai/flux/schnell\",\n \"Origin\":\n \"https://stevekrouse--411c225025f011f0ad23569c3dd06744.web.val.run\",\n },\n body: JSON.stringify({\n prompt,\n image_size: \"landscape_4_3\",\n num_inference_steps: 4,\n num_images: 1,\n enable_safety_checker: true,\n sync_mode: true,\n }),\n },\n );\n\n if (!response.ok) {\n throw new Error(`Failed to generate image: ${response.statusText}`);\n }\n\n const data = await response.json();\n return data.images[0].url;\n } catch (error) {\n console.error(\"Error generating profile picture:\", error);\n return \"\"; // Return empty string if generation fails\n }\n};\n\nexport function ProfilePicture(\n { imageUrl, author, avatarText, packageId }: ProfilePictureProps,\n) {\n const [profileImage, setProfileImage] = useState(\n imageUrl,\n );\n const [isLoading, setIsLoading] = useState(!imageUrl);\n\n useEffect(() => {\n // If we already have an image URL, don't fetch a new one\n if (imageUrl) {\n setProfileImage(imageUrl);\n setIsLoading(false);\n return;\n }\n\n // If we're already loading or have an image, don't fetch again\n if (!isLoading || profileImage) return;\n\n // Generate a profile picture if we don't have one\n const fetchProfilePicture = async () => {\n const prompt = `${packageId} ${avatarText} profile picture`;\n const url = await generateProfilePicture(prompt);\n if (url) {\n setProfileImage(url);\n }\n setIsLoading(false);\n };\n\n fetchProfilePicture();\n }, [imageUrl, packageId, avatarText, isLoading, profileImage]);\n\n if (profileImage) {\n return (\n \n );\n }\n\n return (\n

\n {avatarText}\n

\n );\n}\n",[],[421,481,491],"a9f6e512-343c-11f0-b89c-9e149126039e","PackageList.tsx","bdfa24dc-3439-11f0-a89e-9e149126039e",696,["D",1747609560251],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport InfiniteScroll from \"https://esm.sh/react-infinite-scroll-component@6.1.0?deps=react@18.2.0,react-dom@18.2.0\";\nimport { NpmPackage } from \"../../shared/schemas.ts\";\nimport { PackageItem } from \"./PackageItem.tsx\";\n\ninterface ProfilePictureCache {\n [key: string]: string;\n}\n\ninterface PackageListProps {\n items: NpmPackage[];\n hasMore: boolean;\n loading: boolean;\n loadMore: () => void;\n profilePictures: ProfilePictureCache;\n}\n\nexport function PackageList({\n items,\n hasMore,\n loading,\n loadMore,\n profilePictures,\n}: PackageListProps) {\n return (\n \n

\n \n }\n endMessage={\n

\n {items.length > 0\n ? \"Yay! You have seen all packages\"\n : \"No packages found\"}\n

\n }\n >\n

\n {items.map((item) => (\n \n ))}\n

\n \n );\n}\n",[],[421,481,499],"7c75ae24-343d-11f0-95cf-9e149126039e","PackageItem.tsx","a6768ab2-3439-11f0-a837-9e149126039e",716,["D",1747609913414],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { marked } from \"https://esm.sh/marked@4.3.0\";\nimport { NpmPackage } from \"../../shared/schemas.ts\";\nimport { ProfilePicture } from \"./ProfilePicture.tsx\";\n\ninterface PackageItemProps {\n item: NpmPackage;\n profilePictureUrl?: string;\n}\n\nexport function PackageItem({ item, profilePictureUrl }: PackageItemProps) {\n // Function to render markdown safely\n const renderMarkdown = (text: string) => {\n try {\n return { __html: marked(text) };\n } catch (error) {\n console.error(\"Error rendering markdown:\", error);\n return { __html: text };\n }\n };\n\n return (\n

\n \n {item.name}\n \n\n \n\n

\n {item.tags.map((tag) => (\n \n {tag}\n \n ))}\n

\n\n

\n \n \n {item.author}\n \n • v{item.version}\n \n • Published {new Date(item.updated).toLocaleDateString()}\n \n

\n\n

{new Intl.NumberFormat(\"en-US\").format(Number(item.downloads))}

\n {item.license}\n

\n );\n}\n",[],[421,481,507],"aa1c8286-343c-11f0-87a4-9e149126039e","Header.tsx","b5f4ab68-3439-11f0-828a-9e149126039e",699,["D",1747609560347],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { AppHeader } from \"./common/AppHeader.tsx\";\nimport { SearchBar } from \"./SearchBar.tsx\";\n\ninterface HeaderProps {\n initialQuery: string;\n onSearch: (query: string) => void;\n}\n\nexport function Header({ initialQuery, onSearch }: HeaderProps) {\n return (\n \n \n \n );\n}\n",[],[421,481,515],"aa719730-343c-11f0-9844-9e149126039e","PackageSidebar.tsx","735b770e-343a-11f0-8932-9e149126039e","568ada4d-9b31-4617-9d8e-078a4a8100f6",703,["D",1747609560993],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { NpmPackage } from \"../../../shared/schemas.ts\";\n\ninterface PackageSidebarProps {\n packageData: NpmPackage;\n packageDownloadLink: string;\n}\n\nexport function PackageSidebar(\n { packageData, packageDownloadLink }: PackageSidebarProps,\n) {\n return (\n

\n Installation\n

\n {\n navigator.clipboard.writeText(\n `npm install ${packageDownloadLink}`,\n );\n const target = e.currentTarget;\n const originalText = target.textContent;\n target.textContent = \"Copied!\";\n setTimeout(() => {\n target.textContent = originalText;\n }, 1500);\n }}\n >\n npm install {packageDownloadLink}\n \n

\n\n

\n Author\n

\n {packageData.author}\n

\n );\n}\n",[],[421,481,531,523],"package","b07cd1a8-3441-11f0-a06a-9e149126039e","PackageSearchBar.tsx","88cb59ba-343a-11f0-8148-9e149126039e",["D",1747611718692],4,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { SearchIcon } from \"../icons/SearchIcon.tsx\";\n\nexport function PackageSearchBar() {\n return (\n

\n \n

\n \n \n

\n \n Back to Search\n \n

\n );\n}\n",[],[421,481,531,533],"aa300536-343c-11f0-9844-9e149126039e","PackageReadme.tsx","789dd9e6-343a-11f0-b158-9e149126039e",700,["D",1747609560546],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface PackageReadmeProps {\n readme: string;\n}\n\nexport function PackageReadme({ readme }: PackageReadmeProps) {\n return (\n

\n \n

\n \n );\n}\n",[],[421,481,531,541],"aa1674ae-343c-11f0-a736-9e149126039e","PackageNotFound.tsx","7d9b5964-343a-11f0-b6fb-9e149126039e",698,["D",1747609560384],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface PackageNotFoundProps {\n packageName: string;\n}\n\nexport function PackageNotFound({ packageName }: PackageNotFoundProps) {\n return (\n

\n Package not found\n

\n The package \"{packageName}\" could not be found.\n

\n \n Return to search\n \n

\n );\n}\n",[],[421,481,531,549],"ab293976-343c-11f0-848f-9e149126039e","PackageLoading.tsx","823db80e-343a-11f0-82ca-9e149126039e",712,["D",1747609560986],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\nexport function PackageLoading() {\n return (\n

\n );\n}\n",[],[421,481,531,557],"aa669ec0-343c-11f0-aaa4-9e149126039e","PackageHeader.tsx","6a3a97ea-343a-11f0-888f-9e149126039e",702,["D",1747609560640],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { NpmPackage } from \"../../../shared/schemas.ts\";\n\ninterface PackageHeaderProps {\n packageData: NpmPackage;\n}\n\nexport function PackageHeader({ packageData }: PackageHeaderProps) {\n return (\n

\n {packageData.name}\n

\n {packageData.tags.map((tag) => (\n \n {tag}\n \n ))}\n

\n\n

\n v{packageData.version}\n •\n \n Published {new Date(packageData.updated).toLocaleDateString()}\n \n

\n License: {packageData.license}\n

\n \n {packageData.downloads.toLocaleString()} weekly downloads\n \n

\n );\n}\n",[],[421,481,531,565],"6a3ab90a-343a-11f0-888f-9e149126039e",666,["D",1747608594341],[337,338,339,340,341,342],[421,481,531],"c5ef212a-3285-11f0-9d8b-569c3dd06744","LibraryItem.tsx","abe19264-3284-11f0-8d0a-569c3dd06744","abd75af6-3284-11f0-ae91-569c3dd06744",49,["D",1747421058122],16,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ntype LibraryItemProps = {\n title: string;\n subtitle: string;\n tags: string[];\n avatarText: string;\n author: string;\n version: string;\n updated: string;\n dependents: number | string;\n license: string;\n downloads: number;\n};\n\nexport default function LibraryItem({\n title,\n subtitle,\n tags,\n avatarText,\n author,\n version,\n updated,\n dependents,\n license,\n downloads,\n}: LibraryItemProps) {\n return (\n

{title}

{subtitle}

\n\n

\n {tags.map((tag) => (\n \n {tag}\n \n ))}\n

\n\n

\n \n {avatarText}\n \n {author}\n • {version}\n • {updated}\n • {dependents} dependents\n • {license}\n

\n\n

\n {downloads.toLocaleString()}\n

\n );\n}\n",[],[421,481,180,578],"abd75a60-3284-11f0-ae91-569c3dd06744",["D",1747420584852],[335],[421,481,180],"a9e747a6-343c-11f0-b255-9e149126039e","SearchIcon.tsx","b79c3406-340a-11f0-8213-9e149126039e","f0f4f75f-b921-4df5-8832-eb9cab4eeb30",693,["D",1747609560110],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface SearchIconProps {\n className?: string;\n}\n\nexport function SearchIcon(\n { className = \"w-4 h-4 text-gray-500\" }: SearchIconProps,\n) {\n return (\n \n \n \n \n );\n}\n",[],[421,481,600,592],"icons","b79c5846-340a-11f0-8213-9e149126039e",516,["D",1747588108303],[333],[421,481,600],"aa899b50-343c-11f0-b255-9e149126039e","Layout.tsx","d2b7b406-343a-11f0-b709-9e149126039e","a077ae03-f058-40e1-b9a4-74d2b5d2b4bf",705,["D",1747609561226],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface LayoutProps {\n header: React.ReactNode;\n children: React.ReactNode;\n}\n\nexport function Layout({ header, children }: LayoutProps) {\n return (\n

\n {header}\n

\n {children}\n

\n );\n}\n",[],[421,481,615,607],"common","aa7f6a0e-343c-11f0-a0bd-9e149126039e","AppHeader.tsx","a09ea2f4-343a-11f0-910f-9e149126039e",704,["D",1747609561126],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\n\ninterface AppHeaderProps {\n children: React.ReactNode;\n}\n\nexport function AppHeader({ children }: AppHeaderProps) {\n return (\n

\n {/* Top navigation */}\n

\n \n \n \n \n

\n \n Sign Up\n \n \n Sign In\n \n

\n\n {children}\n

\n );\n}\n",[],[421,481,615,617],"a09ed2f6-343a-11f0-910f-9e149126039e",675,["D",1747608685586],[330,331],[421,481,615],"e8488f2e-3283-11f0-bd7a-569c3dd06744",["D",1747420256725],[329,332,334,336,343,344,345,346,347,348],[421,481],"e848b332-3283-11f0-bd7a-569c3dd06744",["D",1747420256725],[328,349,352,353,354,355],[421],"e1f5c824-343d-11f0-9796-9e149126039e","index.ts",719,["D",1747610083705],81,"http","import {\n readFile,\n serveFile,\n} from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport { Hono } from \"https://esm.sh/hono@4.7.7\";\nimport { apiRoute } from \"./api/mod.ts\";\n\nconst app = new Hono()\n .get(\"/\", () => serveFile(\"/frontend/index.html\", import.meta.url))\n .get(\"/package/:name\", async (c) => {\n // Serve the same HTML but with the package name in the title\n const packageName = c.req.param(\"name\");\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n\n // Update the title to include the package name\n html = html.replace(\n \"NPLLM\",\n `${packageName} - NPLLM`,\n );\n\n // Add a script to pass the package name to the frontend\n const packageScript =\n ``;\n html = html.replace(\"\", `${packageScript}`);\n\n return c.html(html);\n })\n .route(\"/api\", apiRoute)\n .get(\"/frontend/*\", (c) => serveFile(c.req.path, import.meta.url))\n .get(\"/shared/*\", (c) => serveFile(c.req.path, import.meta.url))\n .onError((err) => {\n throw err;\n });\n\nexport default app.fetch;\n","npllm",[],[280,638],"baa231ce-3288-11f0-93fa-569c3dd06744","env.ts","97c96960-3288-11f0-92dd-569c3dd06744",291,["D",1747422327620],17,"import { safeEnv, string } from \"https://esm.sh/jsr/@safe-env/safe-env@0.1.7\";\n\nexport const env = safeEnv({\n GOOGLE_GENERATIVE_AI_API_KEY: string(),\n});\n",[],[280,648],["D",1747609559981],[],[280,180,91],["D",1747611416462],[],[280,180,76],["D",1747609560030],[],[280,180,100],["D",1747606371501],[322,323,324],[280,180],"2391c836-3291-11f0-b1c5-569c3dd06744","mod.ts","353f1da8-3288-11f0-938a-569c3dd06744","29f737dc-3288-11f0-b5d9-569c3dd06744",399,["D",1747425939677],19,"import { Hono } from \"https://esm.sh/hono@4.7.7\";\nimport { searchRoute } from \"./routes/search.ts\";\nimport { packageRoute } from \"./routes/package.ts\";\nimport { npmPackageRoute } from \"./routes/npm-package.ts\";\n\nexport const apiRoute = new Hono()\n .route(\"/search\", searchRoute)\n .route(\"/package\", packageRoute)\n .route(\"/npm-package\", npmPackageRoute);\n\nexport type AppType = typeof apiRoute;\n",[],[280,678,669],"api","f2ee0068-3291-11f0-b18f-569c3dd06744","package-generator.ts","17968968-3291-11f0-a8c2-569c3dd06744","a9a53afa-6aa3-439c-bf34-7a86492b3349",412,["D",1747426287572],"import { TarStream } from \"https://esm.sh/jsr/@std/tar@0.1.6\";\nimport { generateFakeNpmPackages } from \"../ai/generate.ts\";\nimport { geminiFlashModel } from \"../ai/models.ts\";\nimport { generateText } from \"https://esm.sh/ai@4.3.15?deps=zod@3.23.4\";\n\n/**\n * Generates a TypeScript implementation for a package based on its name and description\n */\nexport async function generatePackageImplementation(\n packageName: string,\n description: string,\n): Promise {\n const prompt = `\nCreate a simple TypeScript implementation for an npm package with the following details:\n- Package name: ${packageName}\n- Description: ${description}\n\nThe implementation should:\n1. Be a single TypeScript file\n2. Export a main function or class that fulfills the package description\n3. Include proper JSDoc comments\n4. Be simple but functional\n5. Include 2-3 helper functions if appropriate\n\nOnly return the TypeScript code without any explanation or markdown formatting.\n`;\n const response = await generateText({ model: geminiFlashModel, prompt });\n return response.text.trim();\n}\n\n/**\n * Compiles TypeScript to JavaScript\n * This is a simple implementation that doesn't use the TypeScript compiler\n * In a real-world scenario, you would use the TypeScript compiler API\n */\nexport function compileTypeScript(tsCode: string): string {\n // This is a very simplified \"compilation\" that just removes TypeScript types\n // In a real implementation, you would use the TypeScript compiler\n return tsCode\n .replace(/: [A-Za-z<>[\\]|&]+/g, \"\") // Remove type annotations\n .replace(/<[A-Za-z,\\s]+>/g, \"\") // Remove generic type parameters\n .replace(/export default/g, \"module.exports =\") // Convert export default to module.exports\n .replace(/export /g, \"\") // Remove export keywords\n .replace(/import .* from .*;\\n/g, \"\"); // Remove import statements\n}\n\n/**\n * Creates a tar archive for an npm package\n */\nexport async function createPackageTar(\n packageName: string,\n version: string = \"1.0.0\",\n description: string = \"\",\n author: string = \"Val Town\",\n license: string = \"MIT\",\n): Promise> {\n // Generate implementation if description is empty\n if (!description) {\n const results = await generateFakeNpmPackages(packageName, 1);\n description = results.packages[0].description;\n }\n\n // Generate TypeScript implementation\n const tsImplementation = await generatePackageImplementation(\n packageName,\n description,\n );\n\n // Compile to JavaScript\n const jsImplementation = compileTypeScript(tsImplementation);\n\n // Create package.json\n const packageJson = {\n name: packageName,\n version,\n description,\n main: \"index.js\",\n types: \"index.d.ts\",\n scripts: {\n test: 'echo \"Error: no test specified\" && exit 1',\n },\n keywords: packageName.split(\"-\"),\n author,\n license,\n };\n\n // Create type definition file\n const dtsContent = `/**\n * Type definitions for ${packageName}\n */\n${\n tsImplementation.replace(/export function/g, \"export declare function\")\n .replace(/export class/g, \"export declare class\")\n .replace(/export const/g, \"export declare const\")\n .replace(/export default/g, \"export default\")\n .replace(/= [^;]+;/g, \";\")\n }\n`;\n\n // Convert content to bytes\n const packageJsonBytes = new TextEncoder().encode(\n JSON.stringify(packageJson, null, 2),\n );\n const indexJsBytes = new TextEncoder().encode(jsImplementation);\n const indexTsBytes = new TextEncoder().encode(tsImplementation);\n const indexDtsBytes = new TextEncoder().encode(dtsContent);\n\n // Create a ReadableStream of TarStreamInput objects\n const inputStream = new ReadableStream({\n start(controller) {\n // Add package directory\n controller.enqueue({\n type: \"directory\",\n path: \"package\",\n });\n\n // Add package.json file\n controller.enqueue({\n type: \"file\",\n path: \"package/package.json\",\n size: packageJsonBytes.length,\n readable: ReadableStream.from([packageJsonBytes]),\n });\n\n // Add index.js file\n controller.enqueue({\n type: \"file\",\n path: \"package/index.js\",\n size: indexJsBytes.length,\n readable: ReadableStream.from([indexJsBytes]),\n });\n\n // Add index.ts file\n controller.enqueue({\n type: \"file\",\n path: \"package/index.ts\",\n size: indexTsBytes.length,\n readable: ReadableStream.from([indexTsBytes]),\n });\n\n // Add index.d.ts file\n controller.enqueue({\n type: \"file\",\n path: \"package/index.d.ts\",\n size: indexDtsBytes.length,\n readable: ReadableStream.from([indexDtsBytes]),\n });\n\n controller.close();\n },\n });\n\n // Pipe the input stream through the TarStream to create the tar archive\n return inputStream.pipeThrough(new TarStream());\n}\n",[],[280,678,688,680],"utils","1796ae02-3291-11f0-a8c2-569c3dd06744",397,["D",1747425919578],[319],[280,678,688],"8f2dcd68-3293-11f0-b176-569c3dd06744","search.ts","2b4dcbd2-3288-11f0-af8a-569c3dd06744","54b85b0e-3288-11f0-b259-569c3dd06744",436,["D",1747426979213],15,"import { Hono } from \"https://esm.sh/hono@4.7.7\";\nimport { z } from \"https://esm.sh/zod@3.23.4\";\nimport { zValidator } from \"https://esm.sh/@hono/zod-validator@0.4.3?deps=hono@4.7.7,zod@3.23.4\";\nimport { generateFakeNpmPackages } from \"../ai/generate.ts\";\nimport { blob } from \"https://esm.town/v/std/blob?v=13\";\nimport { searchResultSchema } from \"../../../shared/schemas.ts\";\nimport { S3_PREFIX } from \"../../../shared/consts.ts\";\n\nexport const searchRoute = new Hono()\n .get(\n \"/\",\n zValidator(\n \"query\",\n z.object({\n q: z.string().min(1).describe(\"Search query term\"),\n n: z.string().transform((val) => parseInt(val, 10)),\n page: z.string().transform((val) => parseInt(val, 10)).default(\"1\"),\n }),\n ),\n async (c) => {\n const { q, n, page } = c.req.valid(\"query\");\n\n // Create a cache key based on the search query and page\n const cacheKey = `${S3_PREFIX}npm_search_${q}_${n}_${page}`;\n\n // Try to get cached results\n const cachedResults = await blob.getJSON(cacheKey);\n if (cachedResults) {\n // Validate the cached data against our schema\n const validatedResults = searchResultSchema.parse(cachedResults);\n return c.json(validatedResults);\n }\n\n // Generate new results\n const results = await generateFakeNpmPackages(q, n);\n\n // Add pagination info\n const resultsWithPagination = {\n ...results,\n page,\n hasMore: page < 10, // Limit to 10 pages for demo purposes\n };\n\n // Cache the results\n try {\n await blob.setJSON(cacheKey, resultsWithPagination);\n } catch (error) {\n console.error(\"Error caching results:\", error);\n }\n\n return c.json(resultsWithPagination);\n },\n );\n",[],[280,678,704,695],"routes","457a41b8-343e-11f0-82e4-9e149126039e","package.ts","d0f62b7c-328f-11f0-ac05-569c3dd06744",722,["D",1747610250652],7,"import { zValidator } from \"https://esm.sh/@hono/zod-validator@0.4.3?deps=hono@4.7.7,zod@3.23.4\";\nimport { Hono } from \"https://esm.sh/hono@4.7.7\";\nimport { z } from \"https://esm.sh/zod@3.23.4\";\nimport { blob } from \"https://esm.town/v/std/blob?v=13\";\nimport { generatePackageReadme } from \"../ai/generate-readme.ts\";\nimport { generateFakeNpmPackages } from \"../ai/generate.ts\";\n\nexport const packageRoute = new Hono()\n .get(\n \"/\",\n zValidator(\n \"query\",\n z.object({ name: z.string().min(1).describe(\"Package name\") }),\n ),\n async (c) => {\n const { name } = c.req.valid(\"query\");\n\n // Create a cache key for the package\n const cacheKey = `npm_package_${name}`;\n\n // Try to get cached package data\n const cachedPackage = await blob.getJSON(cacheKey);\n if (cachedPackage) {\n return c.json(cachedPackage);\n }\n\n // Generate a fake package\n const results = await generateFakeNpmPackages(name, 1);\n const packageData = results.packages[0];\n\n // Generate a fake README\n const readme = await generatePackageReadme(packageData);\n\n const packageResponse = {\n package: packageData,\n readme,\n };\n\n // Cache the package data\n try {\n await blob.setJSON(cacheKey, packageResponse);\n } catch (error) {\n console.error(\"Error caching package data:\", error);\n }\n\n return c.json(packageResponse);\n },\n );\n",[],[280,678,704,706],"a9bde44c-343c-11f0-8fad-9e149126039e","npm-package.ts","2041bb5a-3291-11f0-8ff6-569c3dd06744",687,["D",1747609559875],21,"import { zValidator } from \"https://esm.sh/@hono/zod-validator@0.4.3?deps=hono@4.7.7,zod@3.23.4\";\nimport { Hono } from \"https://esm.sh/hono@4.7.7\";\nimport { z } from \"https://esm.sh/zod@3.23.4\";\nimport {\n cachePackageTar,\n createPackageTar,\n getCachedPackageTar,\n} from \"../../npm/generator.ts\";\n\nexport const npmPackageRoute = new Hono()\n .get(\n \"/:packageName\",\n zValidator(\n \"param\",\n z.object({\n packageName: z.string().min(1).describe(\"Package name\"),\n }),\n ),\n async (c) => {\n const { packageName } = c.req.valid(\"param\");\n\n // Try to get from cache first\n const cachedPackage = await getCachedPackageTar(packageName);\n if (cachedPackage) {\n return new Response(cachedPackage, {\n headers: {\n \"Content-Type\": \"application/x-tar\",\n \"Content-Disposition\": `attachment; filename=${packageName}.tar`,\n },\n });\n }\n\n // Create the tar archive\n const tarArchive = await createPackageTar(packageName);\n\n // Clone the stream for caching and response\n const [cacheStream, responseStream] = tarArchive.tee();\n\n // Cache the package in the background\n cachePackageTar(packageName, cacheStream).catch((err) => {\n console.error(`Error caching package ${packageName}:`, err);\n });\n\n // Return the response stream\n return new Response(responseStream, {\n headers: {\n \"Content-Type\": \"application/x-tar\",\n \"Content-Disposition\": `attachment; filename=${packageName}.tar`,\n },\n });\n },\n );\n",[],[280,678,704,715],"54b85a5a-3288-11f0-b259-569c3dd06744",262,["D",1747422156673],[315,316,317],[280,678,704],"bbdc25b8-3288-11f0-8f50-569c3dd06744","models.ts","313e683a-3288-11f0-8339-569c3dd06744","2b36d8be-3288-11f0-b5d9-569c3dd06744",292,["D",1747422329668],"import { google } from \"https://esm.sh/@ai-sdk/google@1.2.18\";\nimport { wrapLanguageModel } from \"https://esm.sh/ai@4.3.15\";\n\nexport const geminiFlashModel = wrapLanguageModel({\n model: google(\"gemini-1.5-flash-002\"),\n middleware: {},\n});\n",[],[280,678,737,729],"ai","aaa11adc-343c-11f0-97d3-9e149126039e","generate.ts","31476656-3288-11f0-a061-569c3dd06744",706,["D",1747609559891],53,"import { generateObject } from \"https://esm.sh/ai@4.3.15?deps=zod@3.23.4\";\nimport { z } from \"https://esm.sh/zod@3.23.4\";\nimport { geminiFlashModel } from \"./models.ts\";\n\nconst packageSchema = z.object({\n name: z.string()\n .describe(\"NPM package name following standard naming conventions\"),\n description: z.string()\n .describe(\n \"Brief description of what the package does, using markdown formatting for emphasis and links. Keep it realistic and focused on practical use cases.\",\n ),\n tags: z.array(\n z.string()\n .describe(\n \"Technologies or categories related to this package. Use common, realistic tags like 'react', 'node', 'utility', 'api', etc.\",\n ),\n ),\n author: z.string()\n .describe(\"Name of the fictional package author\"),\n version: z.string()\n .describe(\"Package version (e.g., '1.2.3')\"),\n license: z.string()\n .describe(\"Open source license (e.g., MIT, Apache-2.0)\"),\n downloads: z.number()\n .describe(\"Number of downloads (between 1,000 and 5,000,000)\"),\n avatarText: z.string()\n .describe(\"Text to display in the package avatar (usually initials)\"),\n updated: z.string()\n .describe(\"Date when the package was last updated (ISO format)\"),\n dependents: z.number()\n .describe(\"Number of packages that depend on this one\"),\n id: z.string()\n .describe(\"Unique identifier for the package\"),\n});\n\nexport type NpmPackage = z.infer;\n\nexport async function generateFakeNpmPackages(\n query: string,\n count: number = 5,\n): Promise<{ packages: NpmPackage[] }> {\n // Create an array of prompts with slight variations to increase diversity\n const prompts = Array.from({ length: count }, (_, i) => {\n const variations = [\n `Generate a realistic NPM package related to \"${query}\". Make it practical and focused on common developer needs. Use markdown formatting in the description field to emphasize key points or add links.`,\n `Create a fictional but realistic NPM package for \"${query}\" with practical features and naming. The description should use markdown formatting to highlight important features. Focus on common use cases that developers would actually need.`,\n `Invent a practical NPM package that would appear when searching \"${query}\". Be realistic with names and details. Use markdown in the description to make it more readable with emphasis or links. Avoid exotic or impractical technologies.`,\n `Design a realistic NPM package for \"${query}\" purposes. The description should use markdown formatting like **bold**, *italic*, or \\`code\\`. Focus on solving real-world problems that developers face.`,\n `Generate a practical NPM package related to \"${query}\". Use realistic naming and download counts. Include markdown formatting in the description to make it look like a real npm package description. Focus on common development needs.`,\n ];\n\n // Choose a prompt variation, cycling through them or randomly\n return variations[i % variations.length] + ` Index: ${i}`;\n });\n\n // Create an array of promises for concurrent execution with different prompts\n const generatePromises = prompts.map((prompt) =>\n generateObject({\n schema: packageSchema,\n model: geminiFlashModel,\n prompt: prompt +\n ` Make sure the package is realistic and practical, not using exotic technologies or making unrealistic claims. Focus on common developer needs and real-world use cases.`,\n temperature: 0.7,\n })\n );\n\n // Wait for all promises to resolve\n const results = await Promise.all(generatePromises);\n\n // Extract the objects from results and ensure uniqueness\n const packages = results.map((result, index) => ({\n ...result.object,\n // Ensure unique fields by adding index if necessary\n id: `${result.object.id}-${index}`,\n downloads: Math.floor(100000 + Math.random() * 4900000),\n updated: new Date(Date.now() - Math.floor(Math.random() * 30 * 86400000))\n .toISOString(),\n dependents: Math.floor(10 + Math.random() * 3000),\n }));\n\n return { packages };\n}\n\nexport type FakeNpmPackage = z.infer;\n\nexport type FakeNpmPackage = z.infer;\n",[],[280,678,737,739],"977e53c2-343f-11f0-909b-9e149126039e","generate-readme.ts","d652f366-328f-11f0-90da-569c3dd06744",728,["D",1747610817765],13,"import { geminiFlashModel } from \"./models.ts\";\nimport { NpmPackage } from \"../../../shared/schemas.ts\";\nimport { APP_URL } from \"../../../shared/consts.ts\";\n\nexport async function generatePackageReadme(\n packageData: NpmPackage,\n): Promise {\n const downloadUrl = `${APP_URL}api/npm-package/${packageData.name}`;\n\n const prompt = `\nGenerate a realistic README.md for an npm package with the following details:\n\n- Package name: ${packageData.name}\n- Description: ${packageData.description}\n- Tags/Keywords: ${packageData.tags.join(\", \")}\n- Author: ${packageData.author}\n- Version: ${packageData.version}\n- License: ${packageData.license}\n\nThe README should include:\n1. A title and badges (npm version, license, downloads)\n2. A brief introduction explaining what the package does\n3. Installation instructions\n4. Contributing guidelines\n6. License information\n\nDO NOT ADD EXAMPLES.\n\nMake it look like a real npm package README with proper markdown formatting.\n\nIMPORTANT: Keep the content realistic and practical. Focus on common developer needs and real-world use cases. Avoid exotic technologies or making unrealistic claims. The package should solve practical problems that developers actually face.\n`;\n\n try {\n const response = await geminiFlashModel.generateContent(prompt);\n let markdown = response.response.text();\n\n // Post-process the markdown to replace npm install commands\n markdown = replaceNpmInstallCommands(\n markdown,\n packageData.name,\n downloadUrl,\n );\n\n return markdown;\n } catch (error) {\n console.error(\"Error generating README:\", error);\n return generateFallbackReadme(\n packageData.name,\n packageData.description,\n downloadUrl,\n );\n }\n}\n\n/**\n * Replaces npm install commands in the markdown with our download URL instructions\n */\nfunction replaceNpmInstallCommands(\n markdown: string,\n packageName: string,\n downloadUrl: string,\n): string {\n // Replace npm install commands in code blocks\n const npmInstallRegex = new RegExp(\n `(npm|yarn) (install|add) ${packageName}`,\n \"g\",\n );\n const pnpmAddRegex = new RegExp(`pnpm add ${packageName}`, \"g\");\n\n // First, find all code blocks and replace npm install commands\n let processedMarkdown = markdown.replace(\n /```(?:bash|sh)?\\n([\\s\\S]*?)```/g,\n (match, codeContent) => {\n // Check if this code block contains an npm install command\n if (npmInstallRegex.test(codeContent) || pnpmAddRegex.test(codeContent)) {\n // Replace with our download instructions\n return \"```bash\\n\" +\n `npm install ${downloadUrl}\\n` +\n \"```\";\n }\n return match; // Return unchanged if no npm install command\n },\n );\n\n // Also replace any inline npm install commands\n processedMarkdown = processedMarkdown.replace(\n /`(npm|yarn) (install|add) ${packageName}`/g,\n `\\`npm install ${downloadUrl}\\``,\n );\n\n // Add our installation section if none exists\n if (\n !processedMarkdown.includes(\"# Installation\") &&\n !processedMarkdown.includes(\"## Installation\")\n ) {\n processedMarkdown += `\\n\\n## Installation\\n\\n` +\n \"```bash\\n\" +\n `npm install ${downloadUrl}\\n` +\n \"```\\n\";\n }\n\n return processedMarkdown;\n}\n\n/**\n * Generates a fallback README if AI generation fails\n */\nfunction generateFallbackReadme(\n packageName: string,\n description: string,\n downloadUrl: string,\n): string {\n return `# ${packageName}\n\n${description}\n\n## Installation\n\n\\`\\`\\`bash\nnpm install ${downloadUrl}\n\\`\\`\\`\n\n## License\n\nMIT\n`;\n}\n",[],[280,678,737,748],"2b36d7ec-3288-11f0-b5d9-569c3dd06744",240,["D",1747422087039],[311,312,313],[280,678,737],"29f73746-3288-11f0-b5d9-569c3dd06744",238,["D",1747422084942],[310,314,318,320],[280,678],"e84871f6-3283-11f0-bd7a-569c3dd06744",["D",1747420256725],[309,321,325,326],[280],["D",1747420256725],{"_11":12,"_235":82},{"_11":12,"_231":-5,"_81":82,"_31":80,"_232":233,"_234":30},{"_51":218,"_13":16,"_45":48,"_219":183,"_220":221,"_222":223,"_224":188,"_225":226,"_227":228,"_229":14,"_230":12},"ctx",{"_64":-5,"_256":807,"_808":809,"_810":811,"_812":30,"_813":30,"_814":30,"_815":24,"_816":-5,"_817":-7,"_818":-7,"_819":26,"_820":30,"_821":30,"_822":-5,"_823":30,"_824":30,"_825":30,"_826":-5},"ENV",{"_778":779,"_780":781,"_782":16,"_783":784,"_785":786,"_787":788,"_789":790,"_791":792,"_793":794,"_795":796,"_797":798,"_799":800,"_801":802,"_803":804,"_805":806},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","5015b8df46402d8bba4f485ecc37aec202b0e06b","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

History · npm