fix issues and complete update

boywithkeyboard-archive · Aug 20, 2023 · da3407c · da3407c
1 parent fe1481b
commit da3407c
Show file tree

Hide file tree

Showing 5 changed files with 68 additions and 59 deletions.
diff --git a/mod.ts b/mod.ts
@@ -9,7 +9,7 @@ export type { Extension } from './extensions.ts'
 export { default as jwt } from './jwt.ts'
 export { LocationData } from './location_data.ts'
 export { otp } from './otp.ts'
-export { render } from './render.tsx'
+export { h, Renderer } from './render.ts'
 export { sendMail } from './send_mail.ts'
 export { Store } from './store.ts'
 

diff --git a/render.ts b/render.ts
@@ -0,0 +1,58 @@
+// Copyright 2023 Samuel Kopp. All rights reserved. Apache-2.0 license.
+import { brightYellow, gray } from 'https://deno.land/std@0.198.0/fmt/colors.ts'
+import {
+ defineConfig,
+ extract,
+ install,
+} from 'https://esm.sh/@twind/core@1.1.3'
+import presetAutoPrefix from 'https://esm.sh/@twind/preset-autoprefix@1.0.7'
+import presetTailwind from 'https://esm.sh/@twind/preset-tailwind@1.1.4'
+import { default as renderToString } from 'https://esm.sh/preact-render-to-string@6.1.0?deps=preact@10.17.1&target=es2022'
+import { VNode } from 'https://esm.sh/preact@10.17.1?target=es2022'
+import { Context } from './mod.ts'
+
+export function render(c: Context, Component: VNode) {
+ const htmlString = renderToString(Component)
+
+ try {
+ const { html, css } = extract(htmlString) // twind throws error when trying to extract if it is not installed
+
+ c.res.body = `<style>${css}</style><body>${html}</body>`
+ } catch (e) {
+ if (c.dev) {
+ console.warn(
+ gray(
+ `${
+ brightYellow('warning')
+ } - twind is not installed, thus styles might not be applied`,
+ ),
+ )
+ }
+
+ c.res.body = htmlString
+ }
+
+ c.res.header('content-type', 'text/html; charset=utf-8')
+}
+
+export class Renderer {
+ render
+
+ constructor(options?: Parameters<typeof defineConfig>[0]) {
+ if (options) {
+ options.presets = options.presets
+ ? [presetAutoPrefix(), presetTailwind(), ...options.presets]
+ : [presetAutoPrefix(), presetTailwind()]
+ }
+
+ install(defineConfig(
+ options ?? {
+ presets: [presetAutoPrefix(), presetTailwind()],
+ },
+ ))
+
+ this.render = render
+ }
+}
+
+export { h } from 'https://esm.sh/preact@10.17.1?target=es2022'
diff --git a/render.tsx b/render.tsx
diff --git a/test/deps.ts b/test/deps.ts
@@ -3,10 +3,5 @@ export {
  assertEquals,
  assertInstanceOf,
 } from 'https://deno.land/std@0.198.0/assert/mod.ts'
-export { z } from 'https://deno.land/x/zod@v3.21.4/mod.ts'
-export { defineConfig } from 'https://esm.sh/@twind/core@1.1.3'
-import presetAutoPrefix from 'https://esm.sh/@twind/preset-autoprefix@1.0.7'
-import presetTailwind from 'https://esm.sh/@twind/preset-tailwind@1.1.4'
-export { presetAutoPrefix, presetTailwind }
 export { DOMParser } from 'https://deno.land/x/deno_dom@v0.1.38/deno-dom-wasm.ts'
-export { install } from 'https://esm.sh/@twind/core@1.1.3'
+export { z } from 'https://deno.land/x/zod@v3.21.4/mod.ts'
diff --git a/test/render.test.tsx b/test/render.test.tsx
@@ -1,23 +1,12 @@
 // Copyright 2023 Samuel Kopp. All rights reserved. Apache-2.0 license.
 /** @jsx h */
-
-import { h, render } from '../render.tsx'
-import cheetah from '../mod.ts'
-import {
- assert,
- assertEquals,
- defineConfig,
- DOMParser,
- install,
- presetAutoPrefix,
- presetTailwind,
-} from './deps.ts'
+import cheetah, { h, Renderer } from '../mod.ts'
+import { assert, assertEquals, DOMParser } from './deps.ts'
 
 Deno.test('render', async () => {
  const app = new cheetah()
- install(defineConfig({
- presets: [presetAutoPrefix(), presetTailwind()],
- }))
+
+ const { render } = new Renderer()
 
  function Styled() {
  return (
@@ -27,12 +16,14 @@ Deno.test('render', async () => {
  )
  }
 
- app.get('/a', (c) => render(c, Styled))
+ app.get('/a', (c) => render(c, <Styled />))
 
  const a = await app.fetch(new Request('http://localhost/a'))
 
+ const tx = await a.text()
+
  const document = new DOMParser().parseFromString(
- await a.text(),
+ tx,
  'text/html',
  )