kris/reacord
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

decentralize asset transformers

Browse Source
This commit is contained in:
MapleLeaf
2022-01-08 16:08:44 -06:00
parent b6c5c41706
commit 924da96c36
13 changed files with 293 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/docs/src/html.tsx
View File

@@ -2,16 +2,19 @@ import packageJson from "reacord/package.json"
import type { ReactNode } from "react"
import React from "react"
import { LocalFileAsset, ModuleAsset } from "./asset-builder/asset.js"
import { scriptTransformer } from "./asset-builder/script-transformer.js"
import { stylesheetTransformer } from "./asset-builder/stylesheet-transformer.js"
export function Html({
title = "Reacord",
title: titleProp,
description = packageJson.description,
children,
}: {
title?: string
title: string
description?: string
children: ReactNode
}) {
const title = [titleProp, "Reacord"].filter(Boolean).join(" | ")
return (
<html lang="en" className="bg-slate-900 text-slate-100">
<head>
@@ -31,17 +34,27 @@ export function Html({
href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500&family=Rubik:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap"
/>
<ModuleAsset from="tailwindcss/tailwind.css">
<ModuleAsset
from="tailwindcss/tailwind.css"
using={stylesheetTransformer}
>
{(asset) => <link rel="stylesheet" href={asset.url} />}
</ModuleAsset>
<LocalFileAsset from={new URL("ui/prism-theme.css", import.meta.url)}>
<LocalFileAsset
from={new URL("ui/prism-theme.css", import.meta.url)}
using={stylesheetTransformer}
>
{(asset) => <link rel="stylesheet" href={asset.url} />}
</LocalFileAsset>
<title>{title}</title>
<ModuleAsset from="alpinejs/dist/cdn.js" as="alpine">
<ModuleAsset
from="alpinejs/dist/cdn.js"
as="alpine"
using={scriptTransformer}
>
{(asset) => <script defer src={asset.url} />}
</ModuleAsset>
</head>