so much

app.tsx

@@ -1,4 +1,4 @@
-import * as React from ">/npm:react";
+import ReactDOM from "react-dom/client";
 
 export function App(){
     return <>
@@ -6,4 +6,4 @@ export function App(){
     </>
 }
 
-export default "lol"
+ReactDOM.createRoot(document.body).render(<App/>);

bundle-file.ts

@@ -0,0 +1,5 @@
+const resp = await Deno.bundle({
+    entrypoints:["file:///C:/Local%20Web%20Projects/gale/hmr/hmr-react.tsx"]
+});
+
+console.log(resp);

deno.json

@@ -4,10 +4,19 @@
   },
   "compilerOptions": {
     "jsx": "react-jsx",
-    "jsxImportSource": "react"
+    "jsxImportSource": "react",
+    "types": ["npm:@types/react", "npm:@types/react-dom"],
+    "lib": [
+      "deno.window", "dom", "dom.asynciterable"
+    ]
   },
   "imports": {
-    "@std/assert": "jsr:@std/assert@1",
-    "react":"npm:react"
+    "react":"npm:react",
+    "react-dom/client":"npm:react-dom/client",
+    "@preact/signals":"npm:@preact/signals",
+    
+    "signals-original": "npm:@preact/signals",
+    "react-original": "npm:react"
   }
 }
+

deno.lock

@@ -1,11 +1,42 @@
 {
   "version": "5",
   "specifiers": {
+    "jsr:@std/media-types@*": "1.1.0",
+    "npm:@preact/signals@*": "2.3.2_preact@10.27.2",
+    "npm:react-dom@*": "19.2.0_react@19.2.0",
     "npm:react@*": "19.2.0"
   },
+  "jsr": {
+    "@std/media-types@1.1.0": {
+      "integrity": "c9d093f0c05c3512932b330e3cc1fe1d627b301db33a4c2c2185c02471d6eaa4"
+    }
+  },
   "npm": {
+    "@preact/signals-core@1.12.1": {
+      "integrity": "sha512-BwbTXpj+9QutoZLQvbttRg5x3l5468qaV2kufh+51yha1c53ep5dY4kTuZR35+3pAZxpfQerGJiQqg34ZNZ6uA=="
+    },
+    "@preact/signals@2.3.2_preact@10.27.2": {
+      "integrity": "sha512-Q22avIn4z0BQnmFeo6Y5HCnJTo8VufN84zN51OtqeNgZOVCYgdwEOcJKVX1x/IrjRVxUnOy6Ubn7H5aVFujXaQ==",
+      "dependencies": [
+        "@preact/signals-core",
+        "preact"
+      ]
+    },
+    "preact@10.27.2": {
+      "integrity": "sha512-5SYSgFKSyhCbk6SrXyMpqjb5+MQBgfvEKE/OC+PujcY34sOpqtr+0AZQtPYx5IA6VxynQ7rUPCtKzyovpj9Bpg=="
+    },
+    "react-dom@19.2.0_react@19.2.0": {
+      "integrity": "sha512-UlbRu4cAiGaIewkPyiRGJk0imDN2T3JjieT6spoL2UeSf5od4n5LB/mQ4ejmxhCFT1tYe8IvaFulzynWovsEFQ==",
+      "dependencies": [
+        "react",
+        "scheduler"
+      ]
+    },
     "react@19.2.0": {
       "integrity": "sha512-tmbWg6W31tQLeB5cdIBOicJDJRR2KzXsV7uSK9iNfLWQ5bIZfxuPEHp7M8wiHyHnn0DD1i7w3Zmin0FtkrwoCQ=="
+    },
+    "scheduler@0.27.0": {
+      "integrity": "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q=="
     }
   },
   "redirects": {
@@ -19,7 +50,10 @@
   },
   "workspace": {
     "dependencies": [
-      "jsr:@std/assert@1",
+      "npm:@preact/signals@*",
+      "npm:@types/react-dom@*",
+      "npm:@types/react@*",
+      "npm:react-dom@*",
       "npm:react@*"
     ]
   }

hmr/hmr-react.tsx

@@ -1,4 +1,8 @@
-import * as ReactParts from "react-original";
+import * as ReactOriginal from "react-original";
+
+const ReactParts = ReactOriginal.default ? ReactOriginal.default : ReactOriginal;
+
+console.log(ReactParts);
 
 /*
 
@@ -172,5 +176,6 @@ const ProxyReducer =(inReducer:(inState:Storelike, inAction:string)=>Storelike,
 };
 
 export * from "react-original";
-export {ProxyCreate as createElement, ProxyState as useState, ProxyReducer as useReducer };
-export default {...ReactParts, createElement:ProxyCreate, useState:ProxyState, useReducer:ProxyReducer};
+const Fragment = ReactParts.Fragment
+export {ProxyCreate as createElement, ProxyCreate as jsx, Fragment, ProxyState as useState, ProxyReducer as useReducer };
+export default {...ReactParts, createElement:ProxyCreate, jsx:ProxyCreate, Fragment, useState:ProxyState, useReducer:ProxyReducer};

hmr/hmr-static.tsx

@@ -119,7 +119,7 @@ export const ModuleProxy =(inText:string, inPath:string)=>
     const [local, foreign] = ModuleShape(inText);
     console.log("shape local", local);
     return `
-import {FileListen} from ">/hmr/hmr-listen.tsx";
+import {FileListen} from "/^/hmr/hmr-listen.tsx";
 import * as Import from "${inPath}?reload=${new Date().getTime()}";
 ${ local.map(m=>`let proxy_${m} = Import.${m}; export { proxy_${m} as ${m} };`).join("\n") }
 FileListen("${inPath}", (updatedModule)=>

index.html

@@ -6,7 +6,11 @@
 </head>
 <body>
     <script type="module">
-        import App from ">/app.tsx";
+        import React from "/>/npm:react";
+        console.log(React);
+
+        import "/app.tsx";
+
     </script>
 </body>
 </html>

jsx-runtime.tsx

@@ -0,0 +1,4 @@
+import Default from "react-jsx-runtime-original";
+const jsx = Default.jsx;
+const Fragment = Default.Fragment;
+export { jsx, Fragment };

server.ts

@@ -1,13 +1,14 @@
+import { contentType } from "jsr:@std/media-types";
 import { ModuleProxy } from "./hmr/hmr-static.tsx";
 
-const keyProxy = encodeURI(">");
-const keyAdjacent = "^";
+const keyBundle = encodeURI(">");
+const keyAdjacent = encodeURI("^");
 const keyReload = "reload";
-const keysRemote = ["npm:", "jsr:", "http"];
 const keysExtension = ["ts", "tsx"];
-const extractExtension =(path)=>
+const extractExtension =(path:string)=>
 {
-    return path.substring(path.lastIndexOf(".")+1);
+    const ind = path.lastIndexOf(".");
+    return ind === -1 ? "" : path.substring(ind+1);
 }
 
 const RootRunning = new URL(`file://${Deno.cwd()}`).toString();
@@ -20,15 +21,16 @@ const bakeConfigPackage:Deno.bundle.Options =
 {
     entrypoints:[""],
     platform: "browser",
+    format:"esm",
     write: false,
     minify: true,
 }
 const bakeConfigLocal:Deno.bundle.Options = {...bakeConfigPackage, minify:false, sourcemap:"inline", inlineImports:false };
 async function BakeForce(path:string, type?:"package")
 {
-    console.log("baking", path);
     const config = type ? bakeConfigPackage : bakeConfigLocal;
     config.entrypoints[0] = type ? path : RootRunning+path;
+    console.log("baking", config.entrypoints);
     const result = await Deno.bundle(config);
 
     if(result.outputFiles)
@@ -52,34 +54,44 @@ async function BakeCheck(path:string, type?:"package")
 type CachedTranspile = [file:string, profile:string]
 const BakeCache:Record<string, CachedTranspile> = {}
 
+const denoBody = await fetch(RootRunning+"/deno.json").then(resp=>resp.json());
 
-const JSResponse =(body:string)=>new Response(body, {headers:{"content-type":"application/javascript"}});
+for(const key in denoBody.imports)
+{
+    const value = denoBody.imports[key];
+    if(value.startsWith("npm:"))
+    {
+        denoBody.imports[key] = "/>/"+value;
+    }
+}
+
+denoBody.imports["react-jsx-runtime-original"] = "/>/npm:react/jsx-runtime";
+denoBody.imports["react/jsx-runtime"] = "/^/jsx-runtime.tsx";
+
+// denoBody.imports["react-original"] = denoBody.imports["react"];
+// denoBody.imports["react-jsx-runtime-original"] = denoBody.imports[denoBody.compilerOptions.jsxImportSource]+"/jsx-runtime";
+// denoBody.imports["signals-original"] = denoBody.imports["@preact/signals"];
+// denoBody.imports["@preact/signals"] = "/^/hmr/hmr-signal.tsx";
+// denoBody.imports["react"] = "/^/hmr/hmr-react.tsx";
+// denoBody.imports["react/jsx-runtime"] = "/^/hmr/hmr-react.tsx";
+
+console.log(denoBody.imports);
+
+const importMap = `<script type="importmap">{"imports":${JSON.stringify(denoBody.imports)}}</script>`;
+
+let htmlPageBody = await fetch(RootRunning+"/index.html").then(resp=>resp.text());
+htmlPageBody = htmlPageBody.replace("<head>", "<head>"+importMap);
+const htmlPageHead = {headers:{"content-type":"text/html"}}
+const IndexResponse =()=> new Response(htmlPageBody, htmlPageHead);
+
+const JSHead = {headers:{"content-type":"application/javascript"}};
+const JSResponse =(body:string)=>new Response(body, JSHead);
 
 Deno.serve(async(req:Request)=>
 {
-    const url = new URL(req.url);
-    const parts = url.pathname.split("/").filter(part=>part);
-
-    const lastPart = parts.at(-1);
-    const extension = extractExtension(lastPart);
-
-    console.log("REQUEST:", parts, extension);
-
-    if(parts[0] == keyProxy)
-    {
-        const proxiedPath = parts.slice(1).join("/");
-        console.log("PROXIED:", proxiedPath);
-        const transpiled = await BakeCheck(proxiedPath, "package");
-        return JSResponse(transpiled[0]);
-    }
-    if(keysExtension.includes(extension))
-    {
-        const transpiled = await BakeCheck(url.pathname);
-        return JSResponse(transpiled[url.searchParams.has(keyReload) ? 0 : 1]);
-    }
-
     if(req.headers.get("upgrade") == "websocket")
     {
+        console.log(" --serve socket", req.url)
         try
         {
             const { response, socket } = Deno.upgradeWebSocket(req);
@@ -90,7 +102,41 @@ Deno.serve(async(req:Request)=>
             return response;
         }
         catch(e){ console.log("Socket errored:", e); }
-    }   
+    } 
+
+    const url = new URL(req.url);
+    const parts = url.pathname.split("/").filter(part=>part);
+
+    const lastPart = parts.at(-1);
+    const extension = extractExtension(lastPart);
+    console.log("REQUEST:", parts);
+
+    if(parts[0] == keyBundle)
+    {
+        const proxiedPath = parts.slice(1).join("/");
+        const transpiled = await BakeCheck(proxiedPath, "package");
+        console.log(" --serve bundle", proxiedPath);
+        return JSResponse(transpiled[0]);
+    }
+    if(parts[0] == keyAdjacent)
+    {
+        const proxiedPath = "/"+parts.slice(1).join("/");
+        const transpiled = await BakeCheck(proxiedPath);
+        console.log(" --serve adjacent", proxiedPath);
+        return JSResponse(transpiled[0]);
+    }
+    if(keysExtension.includes(extension))
+    {
+        console.log(" --serve local file", parts)
+        const transpiled = await BakeCheck(url.pathname);
+        return JSResponse(transpiled[url.searchParams.has(keyReload) ? 0 : 1]);
+    }
+
+    if(!extension)
+    {
+        console.log(" --serving html page", parts);
+        return IndexResponse();
+    }
 
     return new Response();
 });