@vyckr/tachyon 0.3.0 → 1.1.0

package/src/client/yon.ts

@@ -0,0 +1,353 @@
+import { JSDOM } from 'jsdom'
+import Router from "../router.js";
+import { EventEmitter } from 'node:stream';
+import { BunRequest } from 'bun';
+
+export default class Yon {
+
+    private static htmlMethod = 'HTML'
+
+    private static emitter = new EventEmitter()
+
+    private static compMapping = new Map<string, string>()
+
+    static getParams(request: BunRequest, route: string) {
+        
+        const url = new URL(request.url)
+
+        const params = url.pathname.split('/').slice(route.split('/').length)
+
+        return { params: Router.parseParams(params) }
+    }
+
+    static async createStaticRoutes() {
+
+        Router.reqRoutes["/render.js"] = {
+            GET: async () => new Response(await Bun.file(`${import.meta.dir}/render.js`).bytes(), { headers: { 'Content-Type': 'application/javascript' } })
+        }
+
+        Router.reqRoutes["/hmr.js"] = {
+            GET: async () => new Response(await Bun.file(`${import.meta.dir}/hmr.js`).bytes(), { headers: { 'Content-Type': 'application/javascript' } })
+        }
+
+        Router.reqRoutes["/routes.json"] = {
+            GET: async () => new Response(await Bun.file(`${import.meta.dir}/routes.json`).bytes(), { headers: { 'Content-Type': 'application/json' } })
+        }
+
+        const main = Bun.file(`${process.cwd()}/main.js`)
+
+        if(await main.exists()) {
+            Router.reqRoutes["/main.js"] = {
+                GET: async () => new Response(await main.bytes(),  { headers: { 'Content-Type': 'application/javascript' } })
+            }
+        }
+
+        let styles = ''
+        
+        Yon.emitter.addListener('style', (msg) => {
+            styles += `${msg}\n`
+        })
+        
+        await Promise.all([Yon.bundleDependencies(), Yon.bundleComponents(), Yon.bundlePages(), Yon.bundleAssets()])
+        
+        await Bun.write(Bun.file(`${import.meta.dir}/routes.json`), JSON.stringify(Router.routeSlugs))
+        
+        Yon.emitter.removeAllListeners('style')
+        
+        if(styles) {
+            Router.reqRoutes["/styles.css"] = {
+                GET: () => new Response(styles, { headers: { 'Content-Type': 'text/css' }})
+            }
+        }
+    }
+
+    private static extractComponents(data: string) {
+
+        const html = new JSDOM('').window.document.createElement('div')
+
+        html.innerHTML = data
+
+        const scripts = html.querySelectorAll('script')
+
+        const script = scripts[0]
+
+        scripts.forEach(s => s.remove())
+
+        const styles = html.querySelectorAll('style')
+
+        const style = styles[0]
+
+        styles.forEach(s => s.remove())
+
+        return { html, script, style }
+    }
+
+    private static parseHTML(elements: HTMLCollection, imports: Map<string, Set<string>> = new Map<string, Set<string>>()) {
+
+        const parsed: { static?: string, render?: string, element?: string }[] = []
+
+        for (const element of elements) {
+
+            if(element.tagName.startsWith('TY-')) {
+
+                const component = element.tagName.split('-')[1].toLowerCase()
+
+                if(component === 'loop') {
+                    const attribute = element.attributes[0];
+                    if (attribute.name === ':for') parsed.push({ render: `for(${attribute.value}) {`})
+                } else if(component === "logic") {
+                    const attribute = element.attributes[0]
+                    if (attribute.name === ':if') parsed.push({ render: `if(${attribute.value}) {`});
+                    if (attribute.name === ':else-if') parsed.push({ render: `else if(${attribute.value}) {`});
+                    if (attribute.name === ':else') parsed.push({ render: `else {`});
+                } else {
+
+                    const exports: string[] = []
+
+                    const filepath = Yon.compMapping.get(component)
+
+                    if(filepath) {
+
+                        for(let i = 0; i < element.attributes.length; i++) {
+
+                            if(element.attributes[i].name.startsWith(':')) {
+                                const propName = element.attributes[i].name.slice(1)
+                                exports.push(`${propName} = ${"${" + element.attributes[i].value + "}"}`)
+                            } else {
+                                const propName = element.attributes[i].name
+                                exports.push(`${propName} = "${element.attributes[i].value}"`)
+                            }
+                        }
+
+                        if(imports.has(filepath)) {
+
+                            if(!imports.get(filepath)?.has(component)) {
+                                parsed.push({ static: `const { default: ${component} } = import('/components/${filepath}')`})
+                                imports.get(filepath)?.add(component)
+                            }
+
+                        } else {
+
+                            parsed.push({ static: `const { default: ${component} } = await import('/components/${filepath}')`})
+                            imports.set(filepath, new Set<string>([component]))
+                        }
+
+                        const hash = Bun.randomUUIDv7().split('-')[1]
+
+                        parsed.push({ static: `const comp_${hash} = await ${component}(\`${exports.join(';')}\`)`})
+
+                        parsed.push({ render: `elements += comp_${hash}(execute && execute.compId === "ty-${hash}" ? execute : null).replaceAll('class="', 'class="ty-${hash} ')`})
+                    }
+                }
+
+                const temp = new JSDOM('').window.document.createElement('div');
+                temp.innerHTML = element.innerHTML
+
+                parsed.push(...this.parseHTML(temp.children, imports))
+
+                if(component === "loop" || component === "logic") parsed.push({ render: '}'})
+
+            } else {
+
+                for(let i = 0; i < element.attributes.length; i++) {
+
+                    const attr = element.attributes[i]
+
+                    if(attr.name.startsWith(':')) {
+
+                        const attrName = attr.name.slice(1)
+
+                        element.removeAttribute(attr.name)
+                        element.setAttribute(attrName, "${" + attr.value + "}")
+                    }
+                }
+
+                parsed.push({ element: `\`${element.outerHTML}\`` })
+            }
+        }
+
+        return parsed
+    }
+
+    private static createJSData(html: { static?: string, render?: string, element?: string }[], scriptTag?: HTMLScriptElement, style?: HTMLStyleElement) {
+
+        const hash = Bun.randomUUIDv7().split('-')[3]
+
+        if(style && style.innerHTML) Yon.emitter.emit('style', `@scope (.ty-${hash}) { ${style.innerHTML} }`)
+
+        const outers: string[] = []
+        const inners: string[] = []
+
+        html.forEach(h => {
+            if(h.static) outers.push(h.static)
+            if(h.element) {
+                const temp = new JSDOM('').window.document.createElement('div');
+                temp.innerHTML = h.element
+                temp.children[0].classList.add(`ty-${hash}`)
+                inners.push(`elements += ${temp.innerHTML}`)
+            }
+            if(h.render) inners.push(h.render)
+        })
+
+        return `
+            
+            export default async function(props) {
+
+                ${scriptTag ? scriptTag.innerHTML : ''}
+
+                ${outers.join('\n')}
+
+                props?.split(';').map(exp => eval(exp))
+
+                return function(execute) {
+
+                    if(execute) {
+                        const { classId, compId, func } = execute
+                        if(classId === "ty-${hash}" || compId === "ty-${hash}") {
+                            eval(func)
+                        }
+                    }
+
+                    let elements = '';
+                
+                    ${inners.join('\n')}
+                    
+                    return elements
+                }
+            }
+        `
+    }
+
+    private static async addToStatix(html: HTMLDivElement, script: HTMLScriptElement, style: HTMLStyleElement, route: string, dir: 'pages' | 'components') {
+
+        const module = Yon.parseHTML(html.children)
+
+        const jsData = Yon.createJSData(module, script, style)
+
+        route = route.replace('.html', `.${script?.lang || 'js'}`)
+
+        await Bun.write(Bun.file(`/tmp/${route}`), jsData)
+
+        const result = await Bun.build({
+            entrypoints: [`/tmp/${route}`],
+            external: ["*"],
+            minify: {
+                whitespace: true,
+                syntax: true
+            }
+        })
+
+        route = route.replace('.ts', '.js')
+
+        Router.reqRoutes[`/${dir}/${route}`] = {
+            GET: () => new Response(result.outputs[0], { headers: { 'Content-Type': 'application/javascript' } })
+        }
+    }
+
+    private static async bundleAssets() {
+
+        const routes = Array.from(new Bun.Glob(`**/*`).scanSync({ cwd: Router.assetsPath }))
+
+        for(const route of routes) {
+
+            Router.reqRoutes[`/assets/${route}`] = {
+                GET: async () => new Response(await Bun.file(`${Router.assetsPath}/${route}`).text())
+            }
+        }
+    }
+
+    private static async bundlePages() {
+
+        const routes = Array.from(new Bun.Glob(`**/${Yon.htmlMethod}`).scanSync({ cwd: Router.routesPath }))
+        
+        for(const route of routes) {
+
+            await Router.validateRoute(route)
+
+            const data = await Bun.file(`${Router.routesPath}/${route}`).text()
+
+            const { html, script, style } = Yon.extractComponents(data)
+            
+            await Yon.addToStatix(html, script, style, `${route}.${script.lang || 'js'}`, 'pages')
+        }
+
+        const nfFile = Bun.file(`${process.cwd()}/404.html`)
+
+        const data = await nfFile.exists() ? await nfFile.text() : await Bun.file(`${import.meta.dir}/404.html`).text()
+
+        const { html, script, style } = Yon.extractComponents(data)
+        
+        await Yon.addToStatix(html, script, style, '404.html', 'pages')
+    }
+
+    private static async bundleComponents() {
+
+        const components = Array.from(new Bun.Glob(`**/*.html`).scanSync({ cwd: Router.componentsPath }))
+
+        for(let comp of components) {
+
+            const folders = comp.split('/')
+
+            const filename = folders[folders.length - 1].replace('.html', '')
+
+            Yon.compMapping.set(filename, comp.replace('.html', '.js'))
+
+            const data = await Bun.file(`${Router.componentsPath}/${comp}`).text()
+
+            const { html, script, style } = Yon.extractComponents(data)
+            
+            await Yon.addToStatix(html, script, style, comp, 'components')
+        }
+    }
+
+    private static async bundleDependencies() {
+
+        const packageFile = Bun.file(`${process.cwd()}/package.json`)
+
+        const otherEntries = ['index.js', 'index', 'index.node']
+        
+        if(await packageFile.exists()) {
+
+            const packages = await packageFile.json()
+
+            const modules = Object.keys(packages.dependencies ?? {})
+
+            for(const module of modules) {
+
+                let modPack = await Bun.file(`${process.cwd()}/node_modules/${module}/package.json`).json()
+                
+                let idx = 0
+                let entryExists = false
+                
+                while(!modPack.main && !entryExists && idx < otherEntries.length) {
+
+                    entryExists = await Bun.file(`${process.cwd()}/node_modules/${module}/${otherEntries[idx]}`).exists()
+
+                    if(entryExists) {
+                        modPack.main = otherEntries[idx]
+                        break
+                    }
+ 
+                    idx++
+                }
+
+                if(!modPack.main) continue
+                
+                try {
+
+                    const result = await Bun.build({
+                        entrypoints: [`${process.cwd()}/node_modules/${module}/${(modPack.main as string).replace('./', '')}`],
+                        minify: true
+                    })
+
+                    for(const output of result.outputs) {
+                        Router.reqRoutes[`/modules/${module}.js`] = {
+                            GET: () => new Response(output, { headers: { 'Content-Type': 'application/javascript' } })
+                        }
+                    }
+
+                } catch(e) {}
+            }
+        }
+    }
+}

package/src/router.ts

@@ -0,0 +1,186 @@
+import { $, BunRequest, Server } from 'bun'
+
+export interface _ctx {
+    request: Record<string, any>,
+    slugs?: Record<string, any>,
+    ipAddress: string,
+    params?: Array<any>,
+    query?: Record<string, any>,
+    body: string
+}
+
+export default class Router {
+
+    static readonly reqRoutes: Record<string, Record<string, (req?: BunRequest, server?: Server) => Promise<Response> | Response>> = {}
+
+    static readonly allRoutes = new Map<string, Set<string>>()
+
+    static readonly routeSlugs: Record<string, Record<string, number>> = {}
+
+    static readonly routesPath = `${process.cwd()}/routes`
+    static readonly componentsPath = `${process.cwd()}/components`
+    static readonly assetsPath = `${process.cwd()}/assets`
+
+    private static readonly allMethods = process.env.ALLOW_METHODS ? process.env.ALLOW_METHODS.split(',') : ['GET', 'POST', 'PUT', 'DELETE', 'PATCH', 'HEAD', 'OPTIONS']
+
+    static headers = {
+        "Access-Control-Allow-Headers": process.env.ALLOW_HEADERS || "",
+        "Access-Control-Allow-Origin": process.env.ALLLOW_ORGINS || "",
+        "Access-Control-Allow-Credential": process.env.ALLOW_CREDENTIALS || "false",
+        "Access-Control-Expose-Headers": process.env.ALLOW_EXPOSE_HEADERS || "",
+        "Access-Control-Max-Age": process.env.ALLOW_MAX_AGE || "",
+        "Access-Control-Allow-Methods": process.env.ALLOW_METHODS || ""
+    }
+
+    static async validateRoute(route: string, staticPaths: string[] = []) {
+
+        const paths = route.split('/')
+    
+        const pattern = /^:.*/
+
+        const slugs: Record<string, number> = {}
+
+        if(pattern.test(paths[0])) throw new Error(`Invalid route ${route}`)
+
+        paths.forEach((path, idx) => {
+
+            if(pattern.test(path) && (pattern.test(paths[idx - 1]) || pattern.test(paths[idx + 1]))) {
+                throw new Error(`Invalid route ${route}`)
+            }
+
+            if(pattern.test(path)) slugs[path] = idx
+        })
+
+        const staticPath = paths.filter((path) => !pattern.test(path)).join(',')
+
+        if(staticPaths.includes(staticPath)) throw new Error(`Duplicate route ${route}`)
+
+        staticPaths.push(staticPath)
+
+        await $`chmod +x ${Router.routesPath}/${route}`
+
+        const method = paths.pop()!
+
+        route = `/${paths.join('/')}`
+
+        if(!Router.allRoutes.has(route)) Router.allRoutes.set(route, new Set<string>())
+
+        Router.allRoutes.get(route)?.add(method)
+
+        if(Object.keys(slugs).length > 0 || method === 'HTML') Router.routeSlugs[route] = slugs
+    }
+
+    static parseRequest(request: BunRequest) {
+
+        const req: Record<string, any> = {}
+
+        req.headers = Object.fromEntries(request.headers)
+        req.cache = request.cache
+        req.credentials = request.credentials
+        req.destination = request.destination
+        req.integrity = request.integrity
+        req.keepalive = request.keepalive
+        req.method = request.method
+        req.mode = request.mode
+        req.redirect = request.redirect
+        req.referrer = request.referrer
+        req.referrerPolicy = request.referrerPolicy
+        req.url = request.url
+        req.parans = request.params
+
+        return req
+    }
+
+    static processRequest(request: BunRequest, route: string, ctx: _ctx) {
+    
+        const { params } = Router.getParams(request, route)
+
+        ctx.slugs = request.params
+
+        const searchParams = new URL(request.url).searchParams
+
+        let queryParams: Record<string, any> | undefined;
+
+        if(searchParams.size > 0) queryParams = Router.parseKVParams(searchParams)
+
+        ctx.params = params
+        ctx.query = queryParams
+
+        return { handler: `${Router.routesPath}${route}/${request.method}`, ctx }
+    }
+
+    private static getParams(request: BunRequest, route: string) {
+
+        const url = new URL(request.url)
+
+        const params = url.pathname.split("/").slice(route.split("/").length)
+
+        return { params: Router.parseParams(params) }
+    }
+
+    static parseParams(input: string[]) {
+
+        const params: (string | boolean | number | null | undefined)[] = []
+
+        for(const param of input) {
+
+            const num = Number(param)
+
+            if(!Number.isNaN(num)) params.push(num)
+
+            else if(param === 'true') params.push(true)
+
+            else if(param === 'false') params.push(false)
+
+            else if(param === 'null') params.push(null)
+
+            else if(param === 'undefined') params.push(undefined)
+
+            else params.push(param)
+        }
+
+        return params
+    }
+
+    private static parseKVParams(input: URLSearchParams | FormData) {
+
+        const params: Record<string, any> = {}
+
+        for(const [key, val] of input) {
+
+            if(typeof val === "string") {
+
+                try {
+
+                    params[key] = JSON.parse(val)
+    
+                } catch {
+    
+                    const num = Number(val)
+    
+                    if(!Number.isNaN(num)) params[key] = num
+    
+                    else if(val === 'true') params[key] = true
+    
+                    else if(val === 'false') params[key] = false
+    
+                    else if(typeof val === "string" && val.includes(',')) params[key] = Router.parseParams(val.split(','))
+    
+                    else if(val === 'null') params[key] = null
+    
+                    if(params[key] === undefined) params[key] = val
+                }
+
+            } else params[key] = val
+        }
+
+        return params
+    }
+    
+    static async validateRoutes() {
+
+        const routes = Array.from(new Bun.Glob(`**/{${Router.allMethods.join(',')},SOCKET}`).scanSync({ cwd: Router.routesPath }))
+        
+        for(const route of routes) await Router.validateRoute(route)
+    }
+}

package/src/serve.ts

@@ -0,0 +1,144 @@
+#!/usr/bin/env bun
+import Tach from "./server/tach.js"
+import Router, { _ctx } from "./router.js"
+import Yon from "./client/yon.js"
+import { Logger } from "./server/logger.js"
+import { ServerWebSocket } from "bun"
+import { watch } from "fs/promises"
+import { watch as watcher } from "node:fs";
+
+type WebSocketData = {
+    handler: string,
+    ctx: _ctx,
+    path: string
+}
+
+const start = Date.now()
+
+Logger()
+
+async function configureRoutes() {
+    await Router.validateRoutes()
+    Tach.createServerRoutes()
+    await Yon.createStaticRoutes()
+}
+
+await configureRoutes()
+
+const server = Bun.serve({
+    routes: Router.reqRoutes,
+    // websocket: {
+    //     async open(ws: ServerWebSocket<WebSocketData>) {
+
+    //         const { handler, path } = ws.data
+
+    //         const proc = Bun.spawn({
+    //             cmd: [handler],
+    //             stdout: 'inherit',
+    //             stderr: "pipe",
+    //             stdin: "pipe"
+    //         })
+ 
+    //         Tach.webSockets.set(ws, proc)
+
+    //         console.info(`WebSocket Connected - ${path} - ${proc.pid}`)
+
+    //         for await(const ev of watch(`/tmp`)) {
+
+    //             if(ev.filename === proc.pid.toString()) {
+
+    //                 const status = ws.send(Bun.mmap(`/tmp/${proc.pid}`))
+
+    //                 console.info(`WebSocket Message Sent - ${path} - ${proc.pid} - ${status} byte(s)`)
+    //             }
+    //         }
+    //     },
+    //     async message(ws: ServerWebSocket<WebSocketData>, message: string) {
+
+    //         const proc = Tach.webSockets.get(ws)!
+
+    //         const { ctx, path } = ws.data
+
+    //         ctx.body = message
+
+    //         proc.stdin.write(JSON.stringify(ctx))
+
+    //         proc.stdin.flush()
+
+    //         console.info(`WebSocket Message Received - ${path} - ${proc.pid} - ${message.length} byte(s)`)
+    //     },
+    //     close(ws, code, reason) {
+
+    //         const { path } = ws.data
+
+    //         const proc = Tach.webSockets.get(ws)!
+
+    //         proc.stdin.end()
+
+    //         Tach.webSockets.delete(ws)
+
+    //         console.info(`WebSocket Disconnected - ${path} - ${proc.pid} - Code (${code}): ${reason}`)
+    //     },
+    // },
+    port: process.env.PORT || 8080,
+    hostname: process.env.HOSTNAME || '0.0.0.0',
+    development: process.env.NODE_ENV === 'development'
+})
+
+if(server.development) {
+
+    const socket = Bun.serve({
+        fetch(req) {
+            socket.upgrade(req)
+            return undefined
+        },
+        websocket: {
+            open(ws) {
+                console.info("HMR Enabled")
+    
+                watcher(Router.routesPath, { recursive: true }, () => {
+                    queueMicrotask(async () => {
+                        console.info("HMR Update")
+                        await configureRoutes()
+                        server.reload({ routes: Router.reqRoutes })
+                        ws.send('')
+                    })
+                })
+                
+                watcher(Router.componentsPath, { recursive: true }, () => {
+                    queueMicrotask(async () => {
+                        console.info("HMR Update")
+                        await configureRoutes()
+                        server.reload({ routes: Router.reqRoutes })
+                        ws.send('')
+                    })
+                })
+            },
+            message(ws, message) {
+                
+            },
+            close(ws, code, reason) {
+                console.info(`HMR Closed ${code} ${reason}`)
+            },
+        },
+        port: 9876
+    })
+
+    watcher(Router.routesPath, { recursive: true }, () => {
+        queueMicrotask(async () => {
+            await configureRoutes()
+            server.reload({ routes: Router.reqRoutes })
+        })
+    })
+    
+    watcher(Router.componentsPath, { recursive: true }, () => {
+        queueMicrotask(async () => {
+            await configureRoutes()
+            server.reload({ routes: Router.reqRoutes })
+        })
+    })
+}
+
+const elapsed = Date.now() - start
+
+console.info(`Live Server is running on http://${server.hostname}:${server.port} (Press CTRL+C to quit) - ${elapsed.toFixed(2)}ms`)