twind bundles added

add preact items back in
revert to esm.sh
2024-05-15 09:33:06 -04:00 · 2024-05-15 09:19:10 -04:00 · 2024-05-14 22:52:52 -04:00 · 2024-05-14 20:34:18 -04:00 · 2024-05-14 17:17:10 -04:00 · 2024-05-14 15:34:18 -04:00
15 changed files with 385 additions and 87 deletions
--- a/app.tsx
+++ b/app.tsx
@ -1,7 +1,12 @@
 import * as ISO from ">able/iso-elements.tsx";
+import React from "react";

-console.log(ISO)
+const Custom =()=>{
+    const [countGet, countSet] = React.useState(5)
+    return <h1 class="p-4 bg-emerald-400 font-black" onClick={_=>countSet(countGet+1)}>CUSTOM {countGet}</h1>;
+}

 export default ()=><div>
-    <h1 class="p-4 bg-red-500 text-white">App</h1>
+    <h1 class="p-4 bg-blue-500 text-white">App</h1>
+    <Custom/>
 </div>;
--- a/bundled/preact/compat.js
+++ b/bundled/preact/compat.js
--- a/bundled/preact/signals.js
+++ b/bundled/preact/signals.js
--- a/bundled/preact/ssr.mjs
+++ b/bundled/preact/ssr.mjs
--- a/bundled/test.tsx
+++ b/bundled/test.tsx
@ -0,0 +1,16 @@
+import * as TW from "./twind/core.js";
+import {presetAutoprefix, presetTailwind} from "./twind/presets.js"
+const Configure =
+{
+  theme: {},
+  presets: [presetAutoprefix(), presetTailwind()],
+  hash: false
+} as TW.TwindUserConfig;
+
+//console.log(TW.install(Configure));
+
+
+
+import * as LOL from "react";
+
+console.log(LOL.jsx)
--- a/bundled/twind/core.js
+++ b/bundled/twind/core.js
--- a/bundled/twind/presets.d.ts
+++ b/bundled/twind/presets.d.ts
@ -0,0 +1,209 @@
+
+import { MaybeArray, BaseTheme, CSSProperties, Preset } from 'https://esm.sh/v135/@twind/core@1.1.3/core.d.ts';
+
+declare function presetAutoprefix(): Preset;
+export { presetAutoprefix };
+
+
+
+declare module 'https://esm.sh/v135/@twind/core@1.1.3/core.d.ts' {
+    interface CustomProperties {
+        '--tw-backdrop-blur'?: string;
+        '--tw-backdrop-brightness'?: string;
+        '--tw-backdrop-contrast'?: string;
+        '--tw-backdrop-grayscale'?: string;
+        '--tw-backdrop-hue-rotate'?: string;
+        '--tw-backdrop-invert'?: string;
+        '--tw-backdrop-opacity'?: string;
+        '--tw-backdrop-saturate'?: string;
+        '--tw-backdrop-sepia'?: string;
+        '--tw-bg-opacity'?: string | number;
+        '--tw-blur'?: string;
+        '--tw-border-opacity'?: string | number;
+        '--tw-border-spacing-x'?: string | number;
+        '--tw-border-spacing-y'?: string | number;
+        '--tw-brightness'?: string;
+        '--tw-contrast'?: string;
+        '--tw-divide-opacity'?: string | number;
+        '--tw-divide-x-reverse'?: string | number;
+        '--tw-divide-y-reverse'?: string | number;
+        '--tw-drop-shadow'?: string;
+        '--tw-gradient-from'?: string;
+        '--tw-gradient-stops'?: string;
+        '--tw-gradient-to'?: string;
+        '--tw-gradient-via'?: string;
+        '--tw-grayscale'?: string;
+        '--tw-hue-rotate'?: string;
+        '--tw-invert'?: string;
+        '--tw-numeric-figure'?: string;
+        '--tw-numeric-fraction'?: string;
+        '--tw-numeric-spacing'?: string;
+        '--tw-opacity'?: string | number;
+        '--tw-ordinal'?: string;
+        '--tw-placeholder-opacity'?: string;
+        '--tw-ring-color'?: string;
+        '--tw-ring-inset'?: string;
+        '--tw-ring-offset-color'?: string;
+        '--tw-ring-offset-shadow'?: string;
+        '--tw-ring-offset-width'?: string;
+        '--tw-ring-opacity'?: string | number;
+        '--tw-ring-shadow'?: string;
+        '--tw-rotate'?: string;
+        '--tw-saturate'?: string;
+        '--tw-scale-x'?: string;
+        '--tw-scale-y'?: string;
+        '--tw-sepia'?: string;
+        '--tw-shadow'?: string;
+        '--tw-shadow-color'?: string;
+        '--tw-shadow-colored'?: string;
+        '--tw-skew-x'?: string;
+        '--tw-skew-y'?: string;
+        '--tw-slashed-zero'?: string;
+        '--tw-scroll-snap-strictness'?: string;
+        '--tw-text-opacity'?: string;
+        '--tw-pan-x'?: string;
+        '--tw-pan-y'?: string;
+        '--tw-pinch-zoom'?: string;
+        '--tw-touch-action'?: string;
+        '--tw-transform'?: string;
+        '--tw-translate-x'?: string;
+        '--tw-translate-y'?: string;
+    }
+}
+declare type FontSizeValue = string | [size: string, lineHeight: string] | [size: string, options: {
+    lineHeight?: string;
+    letterSpacing?: string;
+    fontWeight?: string;
+}];
+declare type FontFamilyValue = MaybeArray<string> | [fontFamily: MaybeArray<string>, configuration: {
+    fontFeatureSettings?: string;
+}];
+interface Container {
+    screens?: BaseTheme['screens'];
+    center?: boolean;
+    padding?: string | Record<string, string>;
+}
+interface TailwindTheme extends BaseTheme {
+    columns: Record<string, string>;
+    spacing: Record<string, string>;
+    durations: Record<string, MaybeArray<string>>;
+    accentColor: BaseTheme['colors'];
+    animation: Record<string, MaybeArray<string>>;
+    aria: Record<string, string>;
+    aspectRatio: Record<string, string>;
+    backdropBlur: Record<string, string>;
+    backdropBrightness: Record<string, string>;
+    backdropContrast: Record<string, string>;
+    backdropGrayscale: Record<string, string>;
+    backdropHueRotate: Record<string, string>;
+    backdropInvert: Record<string, string>;
+    backdropOpacity: Record<string, string>;
+    backdropSaturate: Record<string, string>;
+    backdropSepia: Record<string, string>;
+    backgroundColor: BaseTheme['colors'];
+    backgroundImage: Record<string, MaybeArray<string>>;
+    backgroundOpacity: Record<string, string>;
+    backgroundPosition: Record<string, string>;
+    backgroundSize: Record<string, MaybeArray<string>>;
+    blur: Record<string, string>;
+    borderColor: BaseTheme['colors'];
+    borderOpacity: Record<string, string>;
+    borderRadius: Record<string, string>;
+    borderSpacing: Record<string, string>;
+    borderWidth: Record<string, string>;
+    boxShadow: Record<string, MaybeArray<string>>;
+    boxShadowColor: BaseTheme['colors'];
+    brightness: Record<string, string>;
+    caretColor: BaseTheme['colors'];
+    container: Container;
+    content: Record<string, string>;
+    contrast: Record<string, string>;
+    cursor: Record<string, MaybeArray<string>>;
+    data: Record<string, string>;
+    divideColor: BaseTheme['colors'];
+    divideOpacity: Record<string, string>;
+    divideWidth: Record<string, string>;
+    dropShadow: Record<string, MaybeArray<string>>;
+    fill: BaseTheme['colors'];
+    flex: Record<string, string>;
+    flexBasis: Record<string, string>;
+    flexGrow: Record<string, number | string>;
+    flexShrink: Record<string, number | string>;
+    fontFamily: Record<string, FontFamilyValue>;
+    fontSize: Record<string, FontSizeValue>;
+    fontWeight: Record<string, string>;
+    gap: Record<string, string>;
+    gradientColorStops: BaseTheme['colors'];
+    grayscale: Record<string, string>;
+    gridAutoColumns: Record<string, string>;
+    gridAutoRows: Record<string, string>;
+    gridColumn: Record<string, string>;
+    gridColumnEnd: Record<string, string>;
+    gridColumnStart: Record<string, string>;
+    gridRow: Record<string, string>;
+    gridRowEnd: Record<string, string>;
+    gridRowStart: Record<string, string>;
+    gridTemplateColumns: Record<string, string>;
+    gridTemplateRows: Record<string, string>;
+    height: Record<string, string>;
+    hueRotate: Record<string, string>;
+    inset: Record<string, string>;
+    invert: Record<string, string>;
+    keyframes: Record<string, Record<string, CSSProperties>>;
+    letterSpacing: Record<string, string>;
+    lineHeight: Record<string, string>;
+    listStyleType: Record<string, string>;
+    margin: Record<string, string>;
+    maxHeight: Record<string, string>;
+    maxWidth: Record<string, string>;
+    minHeight: Record<string, string>;
+    minWidth: Record<string, string>;
+    objectPosition: Record<string, string>;
+    opacity: Record<string, string>;
+    order: Record<string, string>;
+    outlineColor: BaseTheme['colors'];
+    outlineOffset: Record<string, string>;
+    outlineWidth: Record<string, string>;
+    padding: Record<string, string>;
+    placeholderColor: BaseTheme['colors'];
+    placeholderOpacity: Record<string, string>;
+    ringColor: BaseTheme['colors'];
+    ringOffsetColor: BaseTheme['colors'];
+    ringOffsetWidth: Record<string, string>;
+    ringOpacity: Record<string, string>;
+    ringWidth: Record<string, string>;
+    rotate: Record<string, string>;
+    saturate: Record<string, string>;
+    scale: Record<string, string>;
+    scrollMargin: Record<string, string>;
+    scrollPadding: Record<string, string>;
+    sepia: Record<string, string>;
+    skew: Record<string, string>;
+    space: Record<string, string>;
+    stroke: BaseTheme['colors'];
+    strokeWidth: Record<string, string>;
+    supports: Record<string, string>;
+    textColor: BaseTheme['colors'];
+    textDecorationColor: BaseTheme['colors'];
+    textDecorationThickness: Record<string, string>;
+    textIndent: Record<string, string>;
+    textOpacity: Record<string, string>;
+    textUnderlineOffset: Record<string, string>;
+    transformOrigin: Record<string, string>;
+    transitionDelay: Record<string, MaybeArray<string>>;
+    transitionDuration: Record<string, MaybeArray<string>>;
+    transitionProperty: Record<string, MaybeArray<string>>;
+    transitionTimingFunction: Record<string, MaybeArray<string>>;
+    translate: Record<string, string>;
+    width: Record<string, string>;
+    willChange: Record<string, string>;
+    zIndex: Record<string, string>;
+}
+
+interface TailwindPresetOptions {
+    /** Allows to disable to tailwind preflight (default: `false` eg include the tailwind preflight ) */
+    disablePreflight?: boolean | undefined;
+}
+declare function presetTailwind({ disablePreflight, }?: TailwindPresetOptions): Preset<TailwindTheme>;
+
+export { Container, FontFamilyValue, FontSizeValue, TailwindPresetOptions, TailwindTheme, presetTailwind };
--- a/bundled/twind/presets.js
+++ b/bundled/twind/presets.js
--- a/checker.tsx
+++ b/checker.tsx
@ -169,8 +169,9 @@ export async function Check()

            importMap["react"] = `https://esm.sh/preact@10.20.2/compat`;
            importMap["react/"] = `https://esm.sh/preact@10.20.2/compat/`;
+            importMap["react/jsx-runtime"] = "https://esm.sh/stable/preact@10.20.2/es2022/jsx-runtime.js",
            importMap["@preact/signals"] = `https://esm.sh/@preact/signals@1.2.3?deps=preact@10.20.2`;
-            importMap["@twind/core"] = `https://esm.sh/v126/@twind/core@1.1.3/es2022/core.mjs`;
+            importMap["@twind/core"] = `https://esm.sh/v126/@twind/core@1.1.3`;
            importMap[">able/"] = `${RootHost}`;
            if(!importMap[">able/app.tsx"])
            {
@ -199,7 +200,8 @@ export async function Check()
            const optionsRequired = 
            {
                "lib": ["deno.window", "dom", "dom.iterable", "dom.asynciterable"],
-                "jsx": "react-jsx"
+                "jsx": "react-jsx",
+                "jsxImportSource": "react"
            }
            const optionsCurrent = config.json.compilerOptions as Record<string, string|string[]> || {};
            //const compLib:string[] = compOpts.lib as string[] || [];
--- a/deno.jsonc
+++ b/deno.jsonc
@ -1,28 +1,25 @@
 {
-	"imports": {
+  "imports": {
+    "react": "./bundled/preact/compat.js",
+    "react/jsx-runtime": "./bundled/preact/compat.js",
+    "@preact/signals": "./bundled/preact/signals.js",
+    "@twind/core": "./bundled/twind/core.js",
+	"@twind/presets": "./bundled/twind/presets.js",

-		"react": "https://esm.sh/preact@10.20.2/compat",
-		"react-original": "https://esm.sh/preact@10.20.2/compat",
-		"react-original/": "https://esm.sh/preact@10.20.2/compat/",
-		"react/": "https://esm.sh/preact@10.20.2/compat/",
-		"@preact/signals": "https://esm.sh/@preact/signals@1.2.3?deps=preact@10.20.2",
-		"signals-original": "https://esm.sh/@preact/signals@1.2.3?deps=preact@10.20.2",
-		"@twind/core": "https://esm.sh/v126/@twind/core@1.1.3/es2022/core.mjs",
-
-		">other/": "https://esm.sh/",
-		">able/": "./",
-		">able/app.tsx": "./app.tsx"
-	},
-	"tasks": {
-		"check": "deno run -A --no-lock ./cli.tsx check",
-		"local": "deno run -A --no-lock ./cli.tsx local",
-		"debug": "deno run -A --no-lock ./cli.tsx debug",
-		"serve": "deno run -A --no-lock ./cli.tsx serve",
-		"cloud": "deno run -A --no-lock ./cli.tsx cloud",
-		"install": "deno install -A -r -f -n able ./cli.tsx"
-	},
-	"compilerOptions": {
-		"jsx": "react-jsx",
-		"lib": ["deno.window", "dom", "dom.iterable", "dom.asynciterable"]
-	}
-}
+    ">able/": "./",
+    ">able/app.tsx": "./app.tsx"
+  },
+  "tasks": {
+    "check": "deno run -A --no-lock ./cli.tsx check",
+    "local": "deno run -A --no-lock ./cli.tsx local",
+    "debug": "deno run -A --no-lock ./cli.tsx debug",
+    "serve": "deno run -A --no-lock ./cli.tsx serve",
+    "cloud": "deno run -A --no-lock ./cli.tsx cloud",
+    "install": "deno install -A -r -f -n able ./cli.tsx"
+  },
+  "compilerOptions": {
+    "jsx": "react-jsx",
+    "jsxImportSource": "react",
+    "lib": ["deno.window", "dom", "dom.iterable", "dom.asynciterable"]
+  }
+}
--- a/deno.lock
+++ b/deno.lock
@ -1,5 +1,11 @@
 {
  "version": "3",
+  "redirects": {
+    "https://esm.sh/preact-render-to-string": "https://esm.sh/preact-render-to-string@6.4.2",
+    "https://esm.sh/v126/@twind/core": "https://esm.sh/v126/@twind/core@1.1.3",
+    "https://esm.sh/v126/@twind/preset-autoprefix": "https://esm.sh/v126/@twind/preset-autoprefix@1.0.7",
+    "https://esm.sh/v126/@twind/preset-tailwind": "https://esm.sh/v126/@twind/preset-tailwind@1.1.4"
+  },
  "remote": {
    "https://deno.land/std@0.180.0/media_types/_db.ts": "7606d83e31f23ce1a7968cbaee852810c2cf477903a095696cdc62eaab7ce570",
    "https://deno.land/std@0.180.0/media_types/_util.ts": "916efbd30b6148a716f110e67a4db29d6949bf4048997b754415dd7e42c52378",
@ -21,12 +27,15 @@
    "https://deno.land/x/jsonct@v0.1.0/src/_util/asserts.ts": "178dfc49a464aee693a7e285567b3d0b555dc805ff490505a8aae34f9cfb1462",
    "https://deno.land/x/jsonct@v0.1.0/src/parse.ts": "a3a016822446b0584b40bae9098df480db5590a9915c9e3c623ba2801cf1b8df",
    "https://esm.sh/@swc/wasm-web@1.3.62": "b43fb5cde95beb7736182fa62250235dfa6b71717b9d38aa4e6077f05ec90e5e",
+    "https://esm.sh/preact-render-to-string@6.4.2": "338303f2113fea192cfa518fc46d2f8a1702d9b89843c64ed30fba99b23eb6a3",
+    "https://esm.sh/preact@10.20.2/compat": "042516b90993ba4b3348398faca2a3f0d6f5097854174c00d403940834a787b1",
    "https://esm.sh/preact@10.20.2/compat/jsx-runtime": "e3942a5ffd734d5eaf0790ada3ed4ad81c0c0c2ff56a8e4740247de259f7fb65",
    "https://esm.sh/stable/preact@10.20.2/denonext/compat.js": "2e0564fd10e09b587503f9ecd4407ac8726c79beae80026ac89034a47b270c68",
    "https://esm.sh/stable/preact@10.20.2/denonext/compat/jsx-runtime.js": "fbbbceb98af95d1c73181f9e5043fad6cdae30ef9e5fcf90d44ffd6fa6055c02",
    "https://esm.sh/stable/preact@10.20.2/denonext/hooks.js": "91d64a217b2f2c9f724042d0ed1b87bf3edf721261e86358aa6fd55501ee915f",
    "https://esm.sh/stable/preact@10.20.2/denonext/jsx-runtime.js": "2a5b981955e92e3ff86906ac0e5955ec0e6e5ca71032f3f063912cb85ae9a7f1",
    "https://esm.sh/stable/preact@10.20.2/denonext/preact.mjs": "f418bc70c24b785703afb9d4dea8cdc1e315e43c8df620a0c52fd27ad9bd70eb",
-    "https://esm.sh/v135/@swc/wasm-web@1.3.62/denonext/wasm-web.mjs": "57046d46c9ef1398a294ba7447034f5966e48866a05c309cccec4bb4d6e7c61b"
+    "https://esm.sh/v135/@swc/wasm-web@1.3.62/denonext/wasm-web.mjs": "57046d46c9ef1398a294ba7447034f5966e48866a05c309cccec4bb4d6e7c61b",
+    "https://esm.sh/v135/preact-render-to-string@6.4.2/denonext/preact-render-to-string.mjs": "912b3613479fb420eda357ac21d3cf970753cb8f486563f9df5c222bf1ced149"
  }
 }
--- a/hmr-react.tsx
+++ b/hmr-react.tsx
@ -172,5 +172,5 @@ 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};
+export {ProxyCreate as createElement, ProxyCreate as jsxs, ProxyCreate as jsx, ProxyState as useState, ProxyReducer as useReducer };
+export default {...ReactParts, createElement:ProxyCreate, useState:ProxyState, useReducer:ProxyReducer };
--- a/run-browser.tsx
+++ b/run-browser.tsx
@ -1,16 +1,28 @@
 import React from "react";
 import * as TW from   "@twind/core";
-import TWPreTail from "https://esm.sh/v126/@twind/preset-tailwind@1.1.3/es2022/preset-tailwind.mjs";
-import TWPreAuto from "https://esm.sh/v126/@twind/preset-autoprefix@1.0.7/es2022/preset-autoprefix.mjs";
+import * as Pre from "@twind/presets";
+import * as App from ">able/app.tsx";

 const Configure =
 {
  theme: {},
-  presets: [TWPreTail(), TWPreAuto()],
+  presets: [Pre.presetAutoprefix(), Pre.presetTailwind()],
  hash: false
 } as TW.TwindUserConfig;

-export const Shadow =(inElement:HTMLElement, inConfig:TW.TwindUserConfig)=>
+let TwindInst:TW.Twind<TW.BaseTheme, unknown>;
+const TwindConfig = {...Configure, ...(App?.CSS || {})};
+export const CustomTwindExtractor =(inMarkup:string)=> {
+  if(!TwindInst)
+  {
+    TwindInst = TW.install(TwindConfig);
+  }
+  return TW.extract(inMarkup, TwindInst);
+}
+
+export const CustomApp = App.default;
+
+const Shadow =(inElement:HTMLElement)=>
 {
    const ShadowDOM = inElement.attachShadow({ mode: "open" });
    const ShadowDiv = document.createElement("div");
@ -18,16 +30,12 @@ export const Shadow =(inElement:HTMLElement, inConfig:TW.TwindUserConfig)=>

    ShadowDOM.append(ShadowCSS);
    ShadowDOM.append(ShadowDiv);
-    TW.observe(TW.twind(inConfig, TW.cssom(ShadowCSS)), ShadowDiv);
+    TW.observe(TW.twind(TwindConfig, TW.cssom(ShadowCSS)), ShadowDiv);
    return ShadowDiv;
 };

-export default async(inSelector:string, inModulePath:string, inMemberApp="default", inMemberCSS="CSS", inShadow=false):Promise<(()=>void)|false>=>
+export default async(inSelector:string, inShadow?:boolean):Promise<(()=>void)|false>=>
 {
-  if(!inModulePath)
-  {
-    return false;
-  }

  let dom = document.querySelector(inSelector);
  if(!dom)
@ -36,30 +44,18 @@ export default async(inSelector:string, inModulePath:string, inMemberApp="defaul
    return false;
  }

-  const module = await import(inModulePath);
-
-  const merge = inMemberCSS ? {...Configure, ...module[inMemberCSS]} : Configure;
-
  if(inShadow)
  {
-    dom = Shadow(dom as HTMLElement, merge);
+    console.log("init shadow root!", inShadow);
+    dom = Shadow(dom as HTMLElement);
  }
  else
  {
-    TW.install(merge);
+    TW.install(TwindConfig);
  }

-  const app = React.createElement(()=> React.createElement(module[inMemberApp], null), null);
-  if(React.render)
-  {
-    React.render(app, dom);
-    return ()=>dom && React.unmountComponentAtNode(dom);
-  }
-  else
-  {
-    const reactDom = await import(`https://esm.sh/react-dom@${React.version}/client`);
-    const root = reactDom.createRoot(dom);
-    root.render(app);
-    return root.unmount;        
-  }
+  const app = React.createElement(()=> React.createElement(App.default, null), null);
+  React.hydrate(app, dom);
+  return ()=>dom && React.unmountComponentAtNode(dom);
+
 };
--- a/run-local.tsx
+++ b/run-local.tsx
@ -28,6 +28,7 @@ Configure({
    {
        inImports["react-original"] = inImports["react"];
        inImports["react"] = `/>able/hmr-react.tsx`;
+        inImports["react/jsx-runtime"] = `/>able/hmr-react.tsx`;

        inImports["signals-original"] = inImports["@preact/signals"];
        inImports["@preact/signals"] = `/>able/hmr-signal.tsx`;
@ -36,7 +37,7 @@ Configure({
    },
    async Extra(inReq, inURL, inExt, inMap, inConfig)
    {
-        if(!inURL.pathname.startsWith(encodeURI("/>")))
+        if(!inURL.pathname.startsWith(encodeURI("/>")) && !inURL.pathname.startsWith("/bundled/") )
        {
            if(Transpile.Check(inExt) && !inURL.searchParams.get("reload"))
            {
--- a/run-serve.tsx
+++ b/run-serve.tsx
@ -1,5 +1,6 @@
 import * as MIME from "https://deno.land/std@0.180.0/media_types/mod.ts";
 import * as SWCW from "https://esm.sh/@swc/wasm-web@1.3.62";
+import SSR from "./bundled/preact/ssr.mjs";
 import { HuntConfig, Root } from "./checker.tsx";
 import CustomServe from ">able/api.tsx"; 

@ -34,7 +35,7 @@ const ImportMapReload =async()=>

 export type CustomHTTPHandler = (inReq:Request, inURL:URL, inExt:string|false, inMap:{imports:Record<string, string>}, inConfig:Configuration)=>void|false|Response|Promise<Response|void|false>;
 export type CustomRemapper = (inImports:Record<string, string>, inConfig:Configuration)=>Record<string, string>;
-export type Configuration     = {Start:string, Allow:string, Reset:string, SWCOp:SWCW.Options, Serve:CustomHTTPHandler, Extra:CustomHTTPHandler, Shell:CustomHTTPHandler, Remap:CustomRemapper};
+export type Configuration     = {Start:string, Allow:string, Reset:string, SWCOp:SWCW.Options, Serve:CustomHTTPHandler, Extra:CustomHTTPHandler, Remap:CustomRemapper};
 export type ConfigurationArgs = Partial<Configuration>;
 let Configuration:Configuration =
 {
@ -47,25 +48,6 @@ let Configuration:Configuration =
    {
        return inImports;
    },
-    Shell(inReq, inURL, inExt, inMap, inConfig)
-    {
-        return new Response(
-            `<!doctype html>
-            <html>
-                <head>
-                    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-                    <meta charset="utf-8"/>
-                </head>
-                <body>
-                    <div id="app"></div>
-                    <script type="importmap">${JSON.stringify(inMap, null, " ")}</script>
-                    <script type="module">
-                        import Mount from ">able/run-browser.tsx";
-                        Mount("#app", "${inConfig.Start}");
-                    </script>
-                </body>
-            </html>`, {status:200, headers:{"content-type":"text/html"}});
-    },
    SWCOp:
    {
        sourceMaps: false,
@ -195,7 +177,7 @@ export default async()=>
        }
    
        // transpileable files
-        if(Transpile.Check(ext))
+        if(Transpile.Check(ext) && !url.pathname.startsWith("/bundled/"))
        {
            const code = await Transpile.Fetch(proxy, url.pathname);    
            if(code)
@ -207,11 +189,38 @@ export default async()=>
        // custom page html
        if(!ext)
        {
-            const shell = await Configuration.Shell(req, url, ext, ImportMap, Configuration);
-            if(shell)
+            let markup = "";
+            let styles = "";
+            try
            {
-                return shell;
+                const User = await import("./run-browser.tsx");
+                markup = SSR(<User.CustomApp/>);
+                const {css, html} = User.CustomTwindExtractor(markup);
+                markup = html;
+                styles = css;
            }
+            catch(e)
+            {
+                console.log("SSR error:")
+                console.log(e);
+            }
+            return new Response(
+                `<!doctype html>
+                <html>
+                    <head>
+                        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
+                        <meta charset="utf-8"/>
+                        <style>${styles}</style>
+                    </head>
+                    <body>
+                        <div id="app">${markup}</div>
+                        <script type="importmap">${JSON.stringify(ImportMap, null, " ")}</script>
+                        <script type="module">
+                            import Mount from ">able/run-browser.tsx";
+                            Mount("#app");
+                        </script>
+                    </body>
+                </html>`, {status:200, headers:{"content-type":"text/html"}});
        }
    
        // cache-reset route
Author	SHA1	Message	Date
Seth Trowbridge	21f233e6b3	twind bundles added	2024-05-15 09:33:06 -04:00
Seth Trowbridge	1ecc3fc5bd	add preact items back in	2024-05-15 09:19:10 -04:00
Seth Trowbridge	b81a96d91a	revert to esm.sh	2024-05-14 22:52:52 -04:00
Seth Trowbridge	ee5881bcaa	more preact tweaks	2024-05-14 20:34:18 -04:00
Seth Trowbridge	b2b868d62f	change to add preact	2024-05-14 17:17:10 -04:00
Seth Trowbridge	9bc6ae00bc	finish twind "bundle"	2024-05-14 15:34:18 -04:00
Seth Trowbridge	c8cb92e2d8	start pre-compiled twind merge files for less browser requests	2024-05-14 12:19:01 -04:00
Seth Trowbridge	326a78acfe	ssr with twind working	2024-05-14 10:40:52 -04:00