refactor: use lit readable

.eslintrc.cjs

@@ -16,8 +16,7 @@ const tsConfigs = [
   './packages/addons/svg/tsconfig.json',
   './packages/addons/sitemap/tsconfig.json',
   './packages/addons/markdown/tsconfig.json',
-  // './packages/addons/minify/tsconfig.json',
-  // './packages/addons/markdown-old/tsconfig.json',
+  // './packages/addons/labs/minify/tsconfig.json',
   './packages/addons/markdown-preset-marked/tsconfig.json',
   './packages/addons/metadata/tsconfig.json',
   './integration/tsconfig.json',

integration/__fixtures__/static-site/dist_expected/03-custom-elements/00-lit-full/index.html

@@ -13,7 +13,7 @@
 			<!-- PAGE ASSETS -->
 			<!-- /PAGE ASSETS -->
 
-				<script type="module" crossorigin src="/assets/index-CD_ncSzw.js"></script>
+				<script type="module" crossorigin src="/assets/index-BoX7nWOj.js"></script>
 				<link rel="modulepreload" crossorigin href="/assets/modulepreload-polyfill-B5Qt9EMX.js">
 			</head>
 

packages/create-gracile/src/cli.ts

@@ -75,7 +75,11 @@ function handleCancel(result: unknown) {
 
 // eslint-disable-next-line no-console
 console.log('' /* Blank line */);
-clack.intro(c.cyan(`✨🧚 Create your new ${c.bold('Gracile')} project`)); // 🧚🏻‍♀️
+clack.intro(
+	c.cyan(
+		`✨🧚 Create your new ${c.underline(c.white(c.italic('Gracile')))} project`,
+	),
+); // 🧚🏻‍♀️
 
 if (DEV) clack.log.warn(c.yellow(`Development mode`));
 clack.log.info(

packages/engine/src/build/static.ts

@@ -6,7 +6,7 @@ import { logger } from '@gracile/internal-utils/logger';
 import c from 'picocolors';
 import type { ViteDevServer } from 'vite';
 
-import { renderRouteTempalte } from '../render/route-template.js';
+import { renderRouteTemplate } from '../render/route-template.js';
 import { collectRoutes, routes } from '../routes/collect.js';
 import { loadForeignRouteObject } from '../routes/load-module.js';
 
@@ -94,7 +94,7 @@ export async function renderRoutes(vite: ViteDevServer, root = process.cwd()) {
 
 					// MARK: Render
 
-					const { output } = await renderRouteTempalte(
+					const { output } = await renderRouteTemplate(
 						//
 						{ url: url.href },
 						vite,

packages/engine/src/dev/request.ts

@@ -13,7 +13,7 @@ import type { ViteDevServer } from 'vite';
 import { /*  errorInline, */ errorPage } from '../errors/templates.js';
 import {
 	type HandlerInfos,
-	renderRouteTempalte,
+	renderRouteTemplate,
 } from '../render/route-template.js';
 import { getRoute, type RouteInfos } from '../routes/match.js';
 import { renderSsrTemplate } from '../vite/utils.js';
@@ -50,7 +50,7 @@ export function createDevRequestHandler(vite: ViteDevServer) {
 			handlerInfos: HandlerInfos,
 			routeInfos: RouteInfos,
 		) {
-			const { output } = await renderRouteTempalte(
+			const { output } = await renderRouteTemplate(
 				requestPonyfilled,
 				vite,
 				'dev',

packages/engine/src/render/route-template.ts

@@ -1,8 +1,8 @@
-import { Readable } from 'node:stream';
-
 import { html } from '@gracile/internal-utils/dummy-literals';
 import { html as LitSsrHtml, render as renderLitSsr } from '@lit-labs/ssr';
 import { collectResult } from '@lit-labs/ssr/lib/render-result.js';
+import { RenderResultReadable as LitReadable } from '@lit-labs/ssr/lib/render-result-readable.js';
+import type { Readable } from 'stream';
 import type { ViteDevServer } from 'vite';
 
 import { isLitServerTemplate, isLitTemplate } from '../assertions.js';
@@ -30,7 +30,7 @@ export const pageAssets = LitSsrHtml`<!--__GRACILE_PAGE_ASSETS__-->`;
 
 export type HandlerInfos = { data: unknown; method: string };
 
-export async function renderRouteTempalte(
+export async function renderRouteTemplate(
 	request: Request | StaticRequest,
 	vite: ViteDevServer,
 	mode: 'dev' | 'build',
@@ -58,8 +58,7 @@ export async function renderRouteTempalte(
 				`Wrong template result for fragment template ${routeInfos.foundRoute.filePath}.`,
 			);
 		const fragmentRender = renderLitSsr(fragmentOutput);
-		// NOTE: Should use RenderResultReadable instead?
-		const output = Readable.from(fragmentRender);
+		const output = LitReadable.from(fragmentRender);
 
 		return { output };
 	}
@@ -117,8 +116,10 @@ export async function renderRouteTempalte(
 			: baseDocRenderedWithAssets;
 
 	const index = baseDocHtml.indexOf(SSR_OUTLET_MARKER);
-	const baseDocRenderStreamPre = Readable.from(baseDocHtml.substring(0, index));
-	const baseDocRenderStreamPost = Readable.from(
+	const baseDocRenderStreamPre = LitReadable.from(
+		baseDocHtml.substring(0, index),
+	);
+	const baseDocRenderStreamPost = LitReadable.from(
 		baseDocHtml.substring(index + SSR_OUTLET_MARKER.length + 1),
 	);
 
@@ -133,9 +134,9 @@ export async function renderRouteTempalte(
 				`Wrong template result for page template ${routeInfos.foundRoute.filePath}.`,
 			);
 
-		const renderStream = Readable.from(renderLitSsr(routeOutput));
+		const renderStream = LitReadable.from(renderLitSsr(routeOutput));
 
-		const output = Readable.from(
+		const output = LitReadable.from(
 			concatStreams(
 				baseDocRenderStreamPre,
 				renderStream,
@@ -145,7 +146,7 @@ export async function renderRouteTempalte(
 
 		return { output };
 	}
-	const output = Readable.from(baseDocHtml);
+	const output = LitReadable.from(baseDocHtml);
 
 	return { output };
 }

packages/gracile/src/server-html.ts

@@ -1 +1 @@
-export { html } from '@lit-labs/ssr';
+export { html } from '@lit-labs/ssr/lib/server-template.js';