@stacksjs/stx 0.2.148 → 0.2.149

package/dist/index.d.ts

@@ -228,5 +228,6 @@ export {
   validated,
   withDefaults,
 } from './props';
+export { isMarkdownPath, type MarkdownRenderer, type MarkdownView, protectCodeBlocks, renderMarkdownView } from './markdown-view';
 // Default export for the stx module
 export default {};

package/dist/index.js

@@ -144,3 +144,4 @@ export {
   withDefaults
 } from "./props.js";
 export default {};
+export { isMarkdownPath, protectCodeBlocks, renderMarkdownView } from "./markdown-view.js";

package/dist/markdown-view.d.ts

@@ -0,0 +1,25 @@
+/** Whether a path should be treated as a markdown view. */
+export declare function isMarkdownPath(filePath: string): boolean;
+/**
+ * Wrap code blocks so the stx pass leaves their contents alone.
+ *
+ * Applies to `<pre>` (fenced blocks) and to any `<code>` not already inside
+ * one (inline spans). Without this, a page documenting a directive executes it.
+ */
+export declare function protectCodeBlocks(html: string): string;
+/**
+ * Turn markdown source into HTML the stx pipeline can process.
+ *
+ * Frontmatter is returned rather than injected, so the caller decides how it
+ * merges with the rest of the render context.
+ */
+export declare function renderMarkdownView(source: string, options?: MarkdownViewOptions): Promise<MarkdownView>;
+export declare interface MarkdownViewOptions {
+  renderer?: MarkdownRenderer
+}
+export declare interface MarkdownView {
+  html: string
+  frontmatter: Record<string, any>
+}
+/** Converts markdown source to HTML. */
+export type MarkdownRenderer = (source: string) => string | Promise<string>;

package/dist/markdown-view.js

@@ -0,0 +1,39 @@
+import { parseFrontmatter, parseMarkdown } from "./internal-markdown.js";
+export function isMarkdownPath(filePath) {
+  return filePath.endsWith(".md") || filePath.endsWith(".markdown");
+}
+export function protectCodeBlocks(html) {
+  const protectedRanges = [];
+  collect(/<pre\b[^>]*>[\s\S]*?<\/pre>/gi);
+  const preRanges = [...protectedRanges];
+  collect(/<code\b[^>]*>[\s\S]*?<\/code>/gi, preRanges);
+  function collect(re, skipWithin) {
+    let m;
+    while ((m = re.exec(html)) !== null) {
+      const start = m.index, end = start + m[0].length;
+      if (skipWithin?.some((r) => start >= r.start && end <= r.end))
+        continue;
+      protectedRanges.push({ start, end });
+    }
+  }
+  if (protectedRanges.length === 0)
+    return html;
+  protectedRanges.sort((a, b) => a.start - b.start);
+  let out = "", cursor = 0;
+  for (const range of protectedRanges) {
+    if (range.start < cursor)
+      continue;
+    out += html.slice(cursor, range.start);
+    out += `@raw${html.slice(range.start, range.end)}@endraw`;
+    cursor = range.end;
+  }
+  out += html.slice(cursor);
+  return out;
+}
+export async function renderMarkdownView(source, options = {}) {
+  const { data, content } = parseFrontmatter(source), html = await (options.renderer ?? ((md) => parseMarkdown(md)))(content);
+  return {
+    html: protectCodeBlocks(html),
+    frontmatter: data ?? {}
+  };
+}

package/dist/render.d.ts

@@ -42,6 +42,7 @@ export declare function renderTemplateString(content: string, filePath: string,
 // Types
 // ============================================================================
 export declare interface RenderOptions {
+  markdownRenderer?: (source: string) => string | Promise<string>
   context?: Record<string, unknown>
   options?: Partial<StxOptions>
   processClientScripts?: boolean

package/dist/render.js

@@ -4,6 +4,7 @@ import { extractVariables } from "./variable-extractor.js";
 import { injectRouterScript, processDirectives } from "./process.js";
 import { extractBridgeData, processClientScript } from "./client-script.js";
 import { findSfcTemplateBlock } from "./sfc-template.js";
+import { isMarkdownPath, renderMarkdownView } from "./markdown-view.js";
 function parseTemplate(content) {
   let workingContent = content;
   const templateBlock = findSfcTemplateBlock(content);
@@ -69,7 +70,17 @@ export async function renderTemplate(filePath, renderOptions = {}) {
   const resolvedPath = resolve(filePath), file = Bun.file(resolvedPath);
   if (!await file.exists())
     throw Error(`Template file not found: ${resolvedPath}`);
-  const content = await file.text();
+  let content = await file.text(), markdownFrontmatter = null;
+  if (isMarkdownPath(resolvedPath)) {
+    const view = await renderMarkdownView(content, { renderer: renderOptions.markdownRenderer });
+    content = view.html;
+    markdownFrontmatter = view.frontmatter;
+  }
+  if (markdownFrontmatter)
+    renderOptions = {
+      ...renderOptions,
+      context: { ...markdownFrontmatter, ...renderOptions.context || {} }
+    };
   if (renderOptions.layout) {
     const layoutPath = resolve(renderOptions.layout), layoutFile = Bun.file(layoutPath);
     if (!await layoutFile.exists())

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@stacksjs/stx",
   "type": "module",
-  "version": "0.2.148",
+  "version": "0.2.149",
   "description": "A performant UI Framework. Powered by Bun.",
   "author": "Chris Breuer <chris@stacksjs.org>",
   "license": "MIT",
@@ -117,12 +117,12 @@
   "dependencies": {
     "@cwcss/crosswind": "^0.2.14",
     "@stacksjs/clapp": "^0.2.0",
-    "@stacksjs/desktop": "0.2.148",
-    "@stacksjs/sanitizer": "0.2.148",
+    "@stacksjs/desktop": "0.2.149",
+    "@stacksjs/sanitizer": "0.2.149",
     "@stacksjs/ts-i18n": "^0.1.11",
-    "bun-plugin-stx": "0.2.148",
+    "bun-plugin-stx": "0.2.149",
     "bunfig": "^0.15.17",
-    "stx-router": "0.2.148",
+    "stx-router": "0.2.149",
     "ts-broadcasting": "^0.0.9",
     "ts-images": "^0.1.9",
     "ts-syntax-highlighter": "^0.2.1"