[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_406":407,"_408":409},"routes/_app.x.$handle.$name",{"_100":99,"_32":45,"_108":86,"_27":109,"_13":14,"_110":-5,"_11":111,"_112":113,"_114":115,"_116":117,"_118":119,"_20":-5,"_120":121,"_122":123,"_124":26,"_125":126,"_127":24,"_128":-5,"_129":-5,"_130":131},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_43":44,"_32":45,"_38":46,"_47":-5,"_48":26,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":56,"_57":24,"_58":-5,"_59":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":79,"_80":81,"_82":83,"_84":26},"version",590,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":-7,"_23":24,"_25":26,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":37,"_38":39,"_40":14,"_41":42,"_23":26},"previous","deleted",true,"deletedHere",false,"path","backend/ai/api-generator.ts","latestPath","fileId","c63e4a0a-4308-11f0-9227-76b3cceeab13","name","api-generator.ts","fileType","script","content","import \"https://esm.town/v/wolf/StubFS@15-main/stubFs.ts\";\nimport { generateObject } from \"npm:ai\";\nimport { google } from \"npm:@ai-sdk/google\";\nimport { z } from \"npm:zod\";\nimport { Browser } from \"npm:puppeteer-core\";\nimport { analyzeWebsite, WebsiteAnalysis } from \"./website-analyzer.ts\";\nimport { Val } from \"../vt/Val.ts\";\n\nexport interface APIEndpoint {\n path: string;\n method: string;\n description: string;\n parameters: Array<{\n name: string;\n type: string;\n required: boolean;\n description: string;\n }>;\n elementId: string;\n pageUrl: string;\n action: 'click' | 'type' | 'select' | 'extract' | 'submit';\n}\n\nexport interface GeneratedAPI {\n baseUrl: string;\n endpoints: APIEndpoint[];\n serverCode: string;\n documentation: string;\n valId?: string;\n}\n\nexport class APIGenerator {\n constructor(private browser: Browser) {}\n\n public static of(browser: Browser): APIGenerator {\n return new APIGenerator(browser);\n }\n\n public async generateAPI(\n startUrl: string,\n apiName: string,\n maxPages = 10\n ): Promise {\n console.log(`Generating API for ${startUrl}`);\n \n // Step 1: Analyze the website\n const analysis = await analyzeWebsite(startUrl, this.browser, maxPages);\n \n // Step 2: Generate API endpoints based on elements\n const endpoints = await this.generateEndpoints(analysis);\n \n // Step 3: Generate server code\n const serverCode = await this.generateServerCode(endpoints, analysis);\n \n // Step 4: Generate documentation\n const documentation = await this.generateDocumentation(endpoints, analysis);\n \n // Step 5: Create the Val\n const valId = await this.createAPIVal(apiName, serverCode, endpoints);\n \n return {\n baseUrl: startUrl,\n endpoints,\n serverCode,\n documentation,\n valId,\n };\n }\n\n private async generateEndpoints(analysis: WebsiteAnalysis): Promise {\n // Get the most important elements across all pages\n const allElements = analysis.pages.flatMap(page => \n page.elements.map(element => ({\n ...element,\n pageUrl: page.url,\n pageTitle: page.title,\n }))\n );\n\n // Sort by importance and take top elements\n const topElements = allElements\n .sort((a, b) => b.importance - a.importance)\n .slice(0, 15); // Limit to 15 most important elements\n\n const { object: endpointSpecs } = await generateObject({\n model: google(\"gemini-2.0-flash\"),\n schema: z.array(z.object({\n path: z.string().describe(\"API endpoint path like /search or /submit-form\"),\n method: z.enum([\"GET\", \"POST\", \"PUT\", \"DELETE\"]),\n description: z.string().describe(\"What this endpoint does\"),\n parameters: z.array(z.object({\n name: z.string(),\n type: z.enum([\"string\", \"number\", \"boolean\"]),\n required: z.boolean(),\n description: z.string(),\n })),\n elementId: z.string().describe(\"The elementId this endpoint interacts with\"),\n action: z.enum([\"click\", \"type\", \"select\", \"extract\", \"submit\"]),\n })),\n prompt: `\nCreate RESTful API endpoints for interacting with website elements.\n\n# WEBSITE ELEMENTS\n${JSON.stringify(topElements, null, 2)}\n\n# REQUIREMENTS\nFor each useful element, create an API endpoint that:\n1. Has a clear, RESTful path (e.g., /search, /login, /products, /submit-contact)\n2. Uses appropriate HTTP methods (GET for data extraction, POST for form submissions)\n3. Defines clear parameters based on what the element needs\n4. Specifies the action to perform on the element\n\n# ELEMENT ACTIONS\n- \"extract\": Get data/text from the element (use GET)\n- \"click\": Click buttons, links (use POST)\n- \"type\": Fill input fields (use POST with text parameter)\n- \"select\": Choose from dropdown/select (use POST with value parameter)\n- \"submit\": Submit forms (use POST)\n\n# EXAMPLE ENDPOINTS\n- GET /search-results?query=string - Extract search results\n- POST /search - Type in search box and submit\n- POST /login - Fill login form\n- GET /product-info - Extract product details\n- POST /add-to-cart - Click add to cart button\n\nFocus on creating practical, useful API endpoints that would be valuable for automation.\nUse the exact elementId values provided in the elements data.\n`,\n });\n\n return endpointSpecs.map(spec => ({\n ...spec,\n pageUrl: topElements.find(el => el.elementId === spec.elementId)?.pageUrl || analysis.baseUrl,\n }));\n }\n\n private async generateServerCode(endpoints: APIEndpoint[], analysis: WebsiteAnalysis): Promise {\n const { object: codeGen } = await generateObject({\n model: google(\"gemini-2.0-flash\"),\n schema: z.object({\n serverCode: z.string().describe(\"Complete Hono server code with all endpoints\"),\n helperFunctions: z.string().describe(\"Helper functions for browser automation\"),\n }),\n prompt: `\nGenerate a complete Hono server that provides API endpoints for website automation.\n\n# API ENDPOINTS TO IMPLEMENT\n${JSON.stringify(endpoints, null, 2)}\n\n# WEBSITE ANALYSIS\nBase URL: ${analysis.baseUrl}\nPages: ${analysis.pages.map(p => p.url).join(', ')}\n\n# REQUIREMENTS\nCreate a Hono server with:\n1. All the specified API endpoints\n2. Puppeteer integration for browser automation\n3. Element ID setup function (adds data-element-id attributes)\n4. Error handling and validation\n5. CORS support\n6. JSON responses\n\n# CODE STRUCTURE\n\\`\\`\\`typescript\nimport { Hono } from \"npm:hono\";\nimport puppeteer from \"npm:puppeteer-core\";\n\nconst app = new Hono();\n\n// Helper function to setup element IDs\nasync function setupElementIds(page) {\n await page.evaluate(() => {\n const selectors = [\"input\", \"button\", \"select\", \"textarea\", \"form\", \"table\", \"ul\", \"ol\", \"h1\", \"h2\", \"h3\", \"pre\", \"article\", \"section\"];\n selectors.forEach(selector => {\n Array.from(document.querySelectorAll(selector)).forEach((el, i) => {\n const id = \\`element_\\${selector}_\\${i}\\`;\n el.setAttribute(\"data-element-id\", id);\n });\n });\n });\n}\n\n// Browser automation helper\nasync function withBrowser(callback) {\n const browser = await puppeteer.connect({\n browserWSEndpoint: \\`wss://connect.steel.dev?apiKey=\\${Deno.env.get(\"STEEL_API_KEY\")}\\`,\n });\n try {\n const page = await browser.newPage();\n return await callback(page);\n } finally {\n await browser.close();\n }\n}\n\n// API endpoints here...\n\nexport default app.fetch;\n\\`\\`\\`\n\n# CRITICAL REQUIREMENTS\n- Use exact elementId values from the endpoints data\n- Always call setupElementIds(page) before interacting with elements\n- Use [data-element-id=\"elementId\"] selectors\n- Handle errors gracefully\n- Return meaningful JSON responses\n- Include proper TypeScript types\n\nGenerate the complete, working server code.\n`,\n });\n\n return `${codeGen.serverCode}\\n\\n${codeGen.helperFunctions}`;\n }\n\n private async generateDocumentation(endpoints: APIEndpoint[], analysis: WebsiteAnalysis): Promise {\n const { object: docs } = await generateObject({\n model: google(\"gemini-2.0-flash\"),\n schema: z.object({\n documentation: z.string().describe(\"Complete API documentation in markdown format\"),\n }),\n prompt: `\nGenerate comprehensive API documentation for the website automation API.\n\n# API ENDPOINTS\n${JSON.stringify(endpoints, null, 2)}\n\n# WEBSITE INFO\nBase URL: ${analysis.baseUrl}\nTotal Pages: ${analysis.pages.length}\nTotal Elements: ${analysis.summary.totalElements}\n\n# DOCUMENTATION REQUIREMENTS\nCreate markdown documentation that includes:\n1. API Overview and purpose\n2. Base URL and authentication (if needed)\n3. Complete endpoint documentation with:\n - HTTP method and path\n - Description\n - Parameters (with types and examples)\n - Request/response examples\n - Error codes\n4. Usage examples with curl commands\n5. Rate limiting information\n6. Common use cases\n\nMake it professional and easy to understand for developers.\n`,\n });\n\n return docs.documentation;\n }\n\n private async createAPIVal(apiName: string, serverCode: string, endpoints: APIEndpoint[]): Promise {\n // Create the main API val\n const apiVal = await Val.create(apiName, \"public\");\n \n // Add the server code\n await apiVal.addFile(\"index.ts\", serverCode, \"http\");\n \n // Add documentation\n const readmeContent = `# ${apiName} API\n\nThis API provides programmatic access to website functionality through RESTful endpoints.\n\n## Endpoints\n\n${endpoints.map(endpoint => `\n### ${endpoint.method} ${endpoint.path}\n${endpoint.description}\n\n**Parameters:**\n${endpoint.parameters.map(param => `- \\`${param.name}\\` (${param.type}${param.required ? ', required' : ', optional'}): ${param.description}`).join('\\n')}\n`).join('\\n')}\n\n## Usage\n\nBase URL: \\`https://${apiName}.val.run\\`\n\nExample:\n\\`\\`\\`bash\ncurl -X POST https://${apiName}.val.run/search \\\\\n -H \"Content-Type: application/json\" \\\\\n -d '{\"query\": \"your search term\"}'\n\\`\\`\\`\n`;\n\n await apiVal.addFile(\"README.md\", readmeContent, \"script\");\n \n return apiVal.valId;\n }\n}\n\nexport async function generateWebsiteAPI(\n startUrl: string,\n apiName: string,\n browser: Browser,\n maxPages = 10\n): Promise {\n return await APIGenerator.of(browser).generateAPI(startUrl, apiName, maxPages);\n}","createdAt",["D",1749236541319],"branchVersion","branchId","2e2fb5a4-08c6-11f0-95cf-569c3dd06744","id","2e2c4c02-08c6-11f0-95cf-569c3dd06744","Apiify",["D",1742830771958],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","4555dd0e-707e-4444-acd3-049d206eb1db","pinnedFileId","76971c3b-c94e-4b49-b895-6b9840c6b2e4","pinPreview","pinMigrated","screenshotVersion",601,"likeCount",0,"orgId","bced381e-9ab2-4b55-929d-e7c5064f7f38","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_100":99,"_107":103},"org",{"_100":99,"_101":-5,"_102":103,"_18":54,"_104":105,"_106":26},"branch",{"_13":85,"_32":86,"_43":42,"_87":44,"_88":89,"_90":91,"_92":50,"_93":94,"_95":96,"_97":45,"_98":99},"isOwned",608,"main","projectId","forkedBranchId","961078ea-f528-11ef-aa68-569c3dd06744","forkedBranchVersion",38,"forkedProjectPrivacy","forkedProjectId","96102714-f528-11ef-aa68-569c3dd06744","forkedProjectOrgId","019aa807-52c2-709c-928b-2029bae9a558","projectName","userHandle","wolf","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvdXBsb2FkZWQvaW1nXzJvVXpPVUZRTjZGTGd2Q2t4c0RRdFpNZWJ5UCJ9","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_43":44,"_32":45,"_38":402,"_47":-5,"_48":26,"_49":50,"_51":50,"_52":-5,"_53":-5,"_18":54,"_55":56,"_57":24,"_58":-5,"_59":60,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":403,"_80":404,"_82":405,"_84":26},"tree",[205,221,226,227,228,229],"files",[205,206,207,208,209,210,211,212,213,214,215,216,217,218,219,220,221,222,223,224,225,226,227,228,229],"counts",{"_193":62,"_194":195,"_196":62,"_197":198,"_199":200},"contents",[144,145,146,147,148,149],"upstreamProject",{"_43":94,"_32":139,"_52":140,"_53":141,"_49":50,"_78":142},"upstreamBranch",{"_43":89,"_38":132,"_133":134,"_32":86,"_87":94,"_13":135,"_88":-5,"_90":-5,"_136":137,"_47":-5,"_84":26,"_49":50,"_98":138,"_63":96,"_97":139},"emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1740674013689],"updatedAt",["D",1785420707976],91,"lockfileKey","1785420708123-esm.town_v_templates_react-hono-starter@91-main","templates","react-hono-starter","Starter template with client-side React & Hono server","https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/64dc00cc-94d9-47dd-81b1-dde02610d900/square512?exp=1789549199&sig=78a5bc27f03474c98a49b09a954e18cc6dd63f22ba19ce3e096717a88d3522b5",{"_100":138,"_107":143},"https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/129cab32-3bd7-4c3e-f39b-f12900c76100/square512?exp=1789549199&sig=85ec03bbe2ae9af315fa5e89fceebe840b59020b3ec43df39e2ab37ef0d215ad",{"_43":188,"_32":189,"_30":190,"_153":-5,"_41":42,"_40":165,"_155":24,"_38":191,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_27":192},{"_43":182,"_32":183,"_30":184,"_153":-5,"_41":42,"_40":165,"_155":24,"_38":185,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_27":187},{"_43":175,"_32":176,"_30":177,"_153":-5,"_41":42,"_40":178,"_155":24,"_38":179,"_13":62,"_34":20,"_36":180,"_23":26,"_158":-5,"_27":181},{"_43":168,"_32":169,"_30":170,"_153":-5,"_41":42,"_40":171,"_155":26,"_38":172,"_13":165,"_34":20,"_36":173,"_23":26,"_158":-5,"_27":174},{"_43":160,"_32":161,"_30":162,"_153":-5,"_41":42,"_40":163,"_155":24,"_38":164,"_13":165,"_34":20,"_36":166,"_23":26,"_158":-5,"_27":167},{"_43":150,"_32":151,"_30":152,"_153":-5,"_41":42,"_40":154,"_155":24,"_38":156,"_13":62,"_34":20,"_36":157,"_23":26,"_158":-5,"_27":159},"37991c82-4306-11f0-9354-76b3cceeab13","versions.md","37991d72-4306-11f0-9354-76b3cceeab13","parentId",564,"latest",["D",1749235443007],"427","label",[151],"fa979388-4303-11f0-bbab-76b3cceeab13","deno.json","6d80bfb8-42dd-11f0-828a-76b3cceeab13",531,["D",1749234481656],1,"{\n \"$schema\": \"https://raw.githubusercontent.com/denoland/deno/348900b8b79f4a434cab4c74b3bc8d4d2fa8ee74/cli/schemas/config-file.v1.json\",\n \"lock\": false,\n \"compilerOptions\": {\n \"noImplicitAny\": false,\n \"strict\": false,\n \"types\": [\n \"https://www.val.town/types/valtown.d.ts\"\n ],\n \"lib\": [\n \"dom\",\n \"dom.iterable\",\n \"dom.asynciterable\",\n \"deno.ns\",\n \"deno.unstable\"\n ]\n },\n \"lint\": {\n \"files\": {\n \"include\": [\n \"deno:/https/esm.town/**/*\"\n ]\n },\n \"rules\": {\n \"exclude\": [\n \"no-explicit-any\"\n ]\n }\n },\n \"node_modules_dir\": false,\n \"experimental\": {\n \"unstable-node-globals\": true,\n \"unstable-temporal\": true,\n \"unstable-worker-options\": true,\n \"unstable-sloppy-imports\": true\n }\n}\n",[161],"fa899a08-4303-11f0-96f2-76b3cceeab13","README.md","b955ae38-8d6a-4999-885a-f02401a5a57c",529,["D",1749234481569],"# React Hono Starter\n\nThis app is a starter template for client-side React and server-side Hono.\n\n- **Remix** this starter template on the top right to get started.\n\n- The **entrypoint** is `/backend/index.ts`. That's the backend HTTP server,\n which also serves the all the frontend assets.\n\n- The **client-side entrypoint** is `/frontend/index.html`, which in turn\n imports `/frontend/index.tsx`, which in turn imports the React app from\n `/frontend/components/App.tsx`.\n\n[React Hono Example](https://www.val.town/x/stevekrouse/reactHonoExample) is a\nfuller featured example project, with a SQLite database table, queries,\nclient-side CSS and a favicon, and some shared code that runs on both client and\nserver.\n",[169],"6d774f0a-42dd-11f0-8567-76b3cceeab13",".vtignore","6d774fbe-42dd-11f0-8567-76b3cceeab13",397,["D",1749217924014],".git\n.vscode\n.cursorrules\n.DS_Store\nnode_modules\nvendor",[176],"2e31f134-08c6-11f0-95cf-569c3dd06744","frontend","ace2be34-3b25-41f0-98a9-deaf2a37046f",["D",1742830771958],"directory",[183],"2e31d258-08c6-11f0-95cf-569c3dd06744","backend","c42583f7-b9a9-4128-8e16-b83c81558d23",["D",1742830771958],[189],"pulls","branches",2,"forks","envVars",{"_201":203,"_204":62},"connections",{"_201":62,"_202":62},"count","unfilledCount",3,"emptyCount",{"_43":188,"_32":189,"_30":190,"_153":-5,"_41":42,"_40":165,"_155":24,"_38":399,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_231":400,"_27":401},{"_43":394,"_32":345,"_30":339,"_153":190,"_41":42,"_40":395,"_155":24,"_38":396,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_231":397,"_27":398},{"_43":390,"_32":33,"_30":31,"_153":339,"_41":42,"_40":14,"_155":26,"_38":391,"_13":62,"_34":35,"_36":37,"_23":26,"_158":-5,"_231":392,"_27":393},{"_43":381,"_32":382,"_30":383,"_153":339,"_41":42,"_40":384,"_155":24,"_38":385,"_13":386,"_34":35,"_36":387,"_23":26,"_158":-5,"_231":388,"_27":389},{"_43":372,"_32":373,"_30":374,"_153":339,"_41":42,"_40":375,"_155":26,"_38":376,"_13":377,"_34":35,"_36":378,"_23":26,"_158":-5,"_231":379,"_27":380},{"_43":363,"_32":364,"_30":365,"_153":339,"_41":42,"_40":366,"_155":24,"_38":367,"_13":368,"_34":35,"_36":369,"_23":26,"_158":-5,"_231":370,"_27":371},{"_43":354,"_32":355,"_30":356,"_153":339,"_41":42,"_40":357,"_155":26,"_38":358,"_13":359,"_34":35,"_36":360,"_23":26,"_158":-5,"_231":361,"_27":362},{"_43":346,"_32":347,"_30":348,"_153":339,"_41":42,"_40":349,"_155":24,"_38":350,"_13":62,"_34":35,"_36":351,"_23":26,"_158":-5,"_231":352,"_27":353},{"_43":336,"_32":337,"_30":338,"_153":339,"_41":42,"_40":340,"_155":26,"_38":341,"_13":165,"_34":35,"_36":342,"_23":26,"_158":-5,"_231":343,"_27":344},{"_43":331,"_32":313,"_30":307,"_153":190,"_41":42,"_40":332,"_155":24,"_38":333,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_231":334,"_27":335},{"_43":322,"_32":323,"_30":324,"_153":307,"_41":42,"_40":325,"_155":24,"_38":326,"_13":327,"_34":35,"_36":328,"_23":26,"_158":-5,"_231":329,"_27":330},{"_43":314,"_32":315,"_30":316,"_153":307,"_41":42,"_40":317,"_155":26,"_38":318,"_13":256,"_34":35,"_36":319,"_23":26,"_158":-5,"_231":320,"_27":321},{"_43":304,"_32":305,"_30":306,"_153":307,"_41":42,"_40":308,"_155":24,"_38":309,"_13":62,"_34":35,"_36":310,"_23":26,"_158":-5,"_231":311,"_27":312},{"_43":296,"_32":297,"_30":298,"_153":190,"_41":42,"_40":299,"_155":24,"_38":300,"_13":62,"_34":35,"_36":301,"_23":26,"_158":-5,"_231":302,"_27":303},{"_43":286,"_32":287,"_30":56,"_153":190,"_41":42,"_40":288,"_155":26,"_38":289,"_13":290,"_34":291,"_36":292,"_23":26,"_158":293,"_231":294,"_27":295},{"_43":278,"_32":279,"_30":280,"_153":190,"_41":42,"_40":281,"_155":24,"_38":282,"_13":256,"_34":35,"_36":283,"_23":26,"_158":-5,"_231":284,"_27":285},{"_43":182,"_32":183,"_30":184,"_153":-5,"_41":42,"_40":165,"_155":24,"_38":275,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_231":276,"_27":277},{"_43":271,"_32":270,"_30":263,"_153":184,"_41":42,"_40":165,"_155":24,"_38":272,"_13":62,"_34":186,"_36":-5,"_23":26,"_158":-5,"_231":273,"_27":274},{"_43":260,"_32":261,"_30":262,"_153":263,"_41":42,"_40":264,"_155":26,"_38":265,"_13":266,"_34":35,"_36":267,"_23":26,"_158":-5,"_231":268,"_27":269},{"_43":251,"_32":252,"_30":253,"_153":184,"_41":42,"_40":254,"_155":26,"_38":255,"_13":256,"_34":20,"_36":257,"_23":26,"_158":-5,"_231":258,"_27":259},{"_43":243,"_32":244,"_30":245,"_153":184,"_41":42,"_40":246,"_155":24,"_38":247,"_13":165,"_34":35,"_36":248,"_23":26,"_158":-5,"_231":249,"_27":250},{"_43":175,"_32":176,"_30":177,"_153":-5,"_41":42,"_40":178,"_155":24,"_38":240,"_13":62,"_34":20,"_36":180,"_23":26,"_158":-5,"_231":241,"_27":242},{"_43":168,"_32":169,"_30":170,"_153":-5,"_41":42,"_40":171,"_155":26,"_38":237,"_13":165,"_34":20,"_36":173,"_23":26,"_158":-5,"_231":238,"_27":239},{"_43":160,"_32":161,"_30":162,"_153":-5,"_41":42,"_40":163,"_155":24,"_38":234,"_13":165,"_34":20,"_36":166,"_23":26,"_158":-5,"_231":235,"_27":236},{"_43":150,"_32":151,"_30":152,"_153":-5,"_41":42,"_40":154,"_155":24,"_38":230,"_13":62,"_34":20,"_36":157,"_23":26,"_158":-5,"_231":232,"_27":233},["D",1749235443007],"children",[],[151],["D",1749234481656],[],[161],["D",1749234481569],[],[169],["D",1749217924014],[],[176],"fab66ede-4303-11f0-ae89-76b3cceeab13","index.tsx","74271529-7341-46c2-918a-f4b5c09c2d30",533,["D",1749234481508],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();\n",[],[183,244],"d42560c8-4307-11f0-bc95-76b3cceeab13","index.html","6d659e0e-bf7f-4f2b-87cf-3df60d4105a6",580,["D",1749236135141],4,"\n\n \n \n \n Website Automation Analyzer\n \n \n \n \n

\n \n \n \n\n",[],[183,252],"b4ba21ba-4307-11f0-9558-76b3cceeab13","App.tsx","fec0ec8e-b4f4-4da7-884a-019af796678b","5258744f-43e2-420e-83ea-1ed323ddcf10",579,["D",1749236082426],10,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface WebsiteAnalysis {\n baseUrl: string;\n pages: Array<{\n url: string;\n title: string;\n elements: Array<{\n elementId: string;\n type: string;\n content: string;\n importance: number;\n dataType: string;\n selectionCode: string;\n reason: string;\n }>;\n }>;\n generatedCode: string;\n summary: {\n totalPages: number;\n totalElements: number;\n mostImportantElements: Array<{\n url: string;\n elementId: string;\n importance: number;\n type: string;\n reason: string;\n }>;\n };\n}\n\nexport function App() {\n const [url, setUrl] = useState(\"\");\n const [maxPages, setMaxPages] = useState(5);\n const [loading, setLoading] = useState(false);\n const [analysis, setAnalysis] = useState(null);\n const [error, setError] = useState(null);\n const [activeTab, setActiveTab] = useState<'overview' | 'pages' | 'code'>('overview');\n\n const handleAnalyze = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!url) return;\n\n setLoading(true);\n setError(null);\n setAnalysis(null);\n\n try {\n const response = await fetch(\"/api/analyze-website\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ url, maxPages }),\n });\n\n const data = await response.json();\n \n if (data.success) {\n setAnalysis(data.analysis);\n } else {\n setError(data.error);\n }\n } catch (err) {\n setError(\"Failed to analyze website\");\n } finally {\n setLoading(false);\n }\n };\n\n const copyToClipboard = (text: string) => {\n navigator.clipboard.writeText(text);\n };\n\n return (\n

Website Automation Analyzer

\n Analyze any website to find useful elements and generate Puppeteer automation code\n

\n\n

\n \n Website URL\n \n setUrl(e.target.value)}\n placeholder=\"https://example.com\"\n className=\"w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n required\n />\n

\n \n

\n \n Max Pages\n \n setMaxPages(parseInt(e.target.value) || 5)}\n min=\"1\"\n max=\"20\"\n className=\"w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n />\n

\n\n \n {loading ? \"Analyzing Website...\" : \"Analyze Website\"}\n \n \n

\n\n {error && (\n

\n Error: {error}\n

\n )}\n\n {analysis && (\n

\n {/* Tab Navigation */}\n

\n {[\n { id: 'overview', label: 'Overview' },\n { id: 'pages', label: 'Pages & Elements' },\n { id: 'code', label: 'Generated Code' },\n ].map((tab) => (\n setActiveTab(tab.id as any)}\n className={`py-4 px-1 border-b-2 font-medium text-sm ${\n activeTab === tab.id\n ? 'border-blue-500 text-blue-600'\n : 'border-transparent text-gray-500 hover:text-gray-700'\n }`}\n >\n {tab.label}\n \n ))}\n

\n\n

\n {activeTab === 'overview' && (\n

Analysis Summary

{analysis.summary.totalPages}

Pages Analyzed

{analysis.summary.totalElements}

Useful Elements Found

{analysis.summary.mostImportantElements.length}

High Priority Elements

\n\n

Most Important Elements

\n {analysis.summary.mostImportantElements.slice(0, 5).map((element, index) => (\n

\n {element.type}\n on {new URL(element.url).pathname}\n

\n \n Importance: {element.importance}/10\n \n

\n ))}\n

\n )}\n\n {activeTab === 'pages' && (\n

\n {analysis.pages.map((page, pageIndex) => (\n

{page.title}

\n \n {page.url}\n \n

\n \n

Elements ({page.elements.length})

\n {page.elements.slice(0, 5).map((element, elementIndex) => (\n

\n {element.type}\n ({element.dataType})\n {element.content && (\n

\n {element.content}\n

\n )}\n

{element.reason}

\n \n {element.importance}/10\n \n

\n ))}\n {page.elements.length > 5 && (\n

\n ... and {page.elements.length - 5} more elements\n

\n )}\n

\n ))}\n

\n )}\n\n {activeTab === 'code' && (\n

Generated Automation Code

\n copyToClipboard(analysis.generatedCode)}\n className=\"bg-gray-100 hover:bg-gray-200 text-gray-700 px-4 py-2 rounded-md text-sm font-medium\"\n >\n Copy Code\n \n

\n                    {analysis.generatedCode}\n

\n )}\n

\n );\n}\n",[],[183,270,261],"components","2e31d64a-08c6-11f0-95cf-569c3dd06744",["D",1742830771958],[223],[183,270],["D",1742830771958],[222,224,225],[183],"3d1a37fc-4303-11f0-a4f6-76b3cceeab13","types.ts","e475d958-4302-11f0-9eda-76b3cceeab13",514,["D",1749234163748],"export type ValItemType =\n | \"script\"\n | \"http\"\n | \"email\"\n | \"interval\"\n | \"file\"\n | \"directory\";\n\nexport type ValFileType = Exclude;\n",[],[189,279],"33658c98-4308-11f0-9a0c-76b3cceeab13","index.ts",589,["D",1749236294947],46,"http","import { serveFile, readFile } from \"https://esm.town/v/std/utils@64-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport puppeteer from \"npm:puppeteer-core\";\nimport { generateWebsite } from \"./ai/generator.ts\";\nimport { analyzeWebsite } from \"./ai/website-analyzer.ts\";\n\nconst app = new Hono();\n\napp.get(\"/\", async (c) => {\n try {\n const html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n } catch (error) {\n console.error(\"Error serving index.html:\", error);\n return c.text(\"Error loading page\", 500);\n }\n})\n .get(\"/frontend/**/*\", (c) => serveFile(c.req.path, import.meta.url))\n .post(\"/api/analyze-website\", async (c) => {\n try {\n const { url, maxPages = 10 } = await c.req.json();\n\n if (!url) {\n return c.json(\n { success: false, error: \"URL is required\" },\n 400,\n );\n }\n\n const browser = await puppeteer.connect({\n browserWSEndpoint: `wss://connect.steel.dev?apiKey=${Deno.env.get(\"STEEL_API_KEY\")}`,\n });\n\n try {\n const analysis = await analyzeWebsite(url, browser, maxPages);\n return c.json({ success: true, analysis });\n } finally {\n await browser.close();\n }\n } catch (error) {\n console.error(\"Website analysis error:\", error);\n return c.json({ success: false, error: error.message }, 500);\n }\n })\n .post(\"/api/generate-website\", async (c) => {\n try {\n const { url, websiteName } = await c.req.json();\n\n if (!url || !websiteName) {\n return c.json(\n { success: false, error: \"URL and website name are required\" },\n 400,\n );\n }\n\n const browser = await puppeteer.connect({\n browserWSEndpoint: `wss://connect.steel.dev?apiKey=${Deno.env.get(\"STEEL_API_KEY\")}`,\n });\n\n try {\n const valId = await generateWebsite(browser, url, websiteName);\n return c.json({ success: true, valId });\n } finally {\n await browser.close();\n }\n } catch (error) {\n console.error(\"Website generation error:\", error);\n return c.json({ success: false, error: error.message }, 500);\n }\n })\n .onError((err, _c) => {\n throw err;\n });\n\nexport default app.fetch;\n","apiify",[],[189,287],"6d7babae-42dd-11f0-93ea-76b3cceeab13","env.ts","6d7bac76-42dd-11f0-93ea-76b3cceeab13",398,["D",1749217924020],"import { envsafe, str } from \"npm:envsafe\";\n\nexport const env = envsafe({\n STEEL_API_KEY: str({}),\n});\n",[],[189,297],"6aec3818-4300-11f0-b8ae-76b3cceeab13","utils.ts","6aec38d6-4300-11f0-b8ae-76b3cceeab13","69f3ef5a-4300-11f0-b5f6-76b3cceeab13",495,["D",1749232952135],"import ValTown from \"jsr:@valtown/sdk\";\nimport { vt } from \"./sdk.ts\";\n\n/**\n * Lists all branches for a given project and finds the ID of the specified branch name.\n *\n * @param {string} projectId - The ID of the project to search branches within.\n * @param {string} branchName - The name of the branch to find.\n * @returns {Promise} - The ID of the specified branch.\n * @throws {Deno.errors.NotFound} If the branch with the specified name is not found.\n */\nexport async function branchIdToBranch(\n projectId: string,\n branchName: string,\n): Promise {\n for await (\n const branch of vt.projects.branches.list(projectId, {\n limit: 100,\n offset: 0,\n })\n ) if (branch.name === branchName) return branch;\n throw new Deno.errors.NotFound(`Branch '${branchName}' not found`);\n}\n\n/**\n * Forks a new branch from a specified source branch within a project.\n *\n * @param {string} projectId - The ID of the project where the branch will be created.\n * @param {string} newBranchName - The name of the new branch to create.\n * @param {string} sourceBranchId - The ID of the branch to fork from.\n * @returns {Promise

Diff · v590