sdocs 0.0.49 → 0.0.51

package/CHANGELOG.md

@@ -7,6 +7,42 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+## [0.0.51] - 2026-07-05
+
+### Changed
+
+- **The sdoc grammar colors `[PAGE]` bodies as markdown.** Headings, bold,
+  lists, and fences highlight in page prose (the body's block indent is
+  accounted for, so indented bodies don't read as code blocks). Applies
+  everywhere the grammar is used — the VS Code extension and ` ```sdoc `
+  fences on the site.
+
+### Fixed
+
+- **Page expressions with string literals no longer break the page.** The
+  markdown pass HTML-escaped quotes (and `&&`, `<`) inside `{…}` expressions,
+  so `{@render colorBox("#ff0000")}` or `{format("x")}` in a `[PAGE]` body
+  failed to compile. Balanced `{…}` spans now pass through verbatim; prose
+  around them escapes exactly as before, and code fences and inline code stay
+  inert.
+
+### Added
+
+- **`\{` escapes a literal brace in page prose.** Previously a lone brace
+  written in prose could break the page; a backslash-escaped brace now renders
+  as an inert literal `{`.
+
+## [0.0.50] - 2026-07-05
+
+### Fixed
+
+- **The last block of a page no longer gets clipped.** Preview iframes size
+  themselves to the preview root's `scrollHeight`, but the first and last
+  child's margins collapsed through that root and weren't counted — so the
+  final block of `[PAGE]` content (a closing paragraph, a raw HTML block)
+  was cut off. The preview root is now a block formatting context
+  (`display: flow-root`), so the reported height includes everything.
+
 ## [0.0.49] - 2026-07-05
 
 ### Fixed

package/dist/grammar/sdoc.tmLanguage.json

@@ -229,10 +229,11 @@
 			"patterns": [
 				{
 					"begin": "(^|\\G)",
-					"while": "(^|\\G)(?!\\s*\\[/PAGE\\]\\s*$)",
+					"while": "(^|\\G)(?!\\s*\\[/PAGE\\]\\s*$)(?:\\t|[ ]{1,4})?",
+					"contentName": "meta.embedded.block.markdown",
 					"patterns": [
 						{
-							"include": "source.svelte"
+							"include": "text.html.markdown"
 						}
 					]
 				}

package/dist/server/page-markdown.js

@@ -27,6 +27,55 @@ function escapeHtml(text) {
         .replace(/>/g, '>')
         .replace(/"/g, '"');
 }
+/** marked-equivalent prose escaping (entities already present survive). */
+function escapeProse(text) {
+    return text
+        .replace(/&(?!(?:#\d{1,7}|#[Xx][a-fA-F0-9]{1,6}|\w+);)/g, '&')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;')
+        .replace(/"/g, '&quot;')
+        .replace(/'/g, '&#39;');
+}
+/** Index of the `}` closing the `{` at `open`, or -1. Skips quoted strings. */
+function findExpressionEnd(text, open) {
+    let depth = 0;
+    for (let i = open; i < text.length; i++) {
+        const ch = text[i];
+        if (ch === '"' || ch === "'" || ch === '`') {
+            for (i++; i < text.length && text[i] !== ch; i++) {
+                if (text[i] === '\\')
+                    i++;
+            }
+            if (i >= text.length)
+                return -1;
+        }
+        else if (ch === '{')
+            depth++;
+        else if (ch === '}' && --depth === 0)
+            return i;
+    }
+    return -1;
+}
+/**
+ * Escape prose while passing balanced `{…}` spans through verbatim, so Svelte
+ * expressions survive the markdown pass — string literals, `&&`, comparisons.
+ * An unmatched `{` falls back to prose escaping, exactly as before.
+ */
+function escapeTextKeepingExpressions(text) {
+    let out = '';
+    let from = 0;
+    for (let i = 0; i < text.length; i++) {
+        if (text[i] !== '{')
+            continue;
+        const end = findExpressionEnd(text, i);
+        if (end === -1)
+            break;
+        out += escapeProse(text.slice(from, i)) + text.slice(i, end + 1);
+        from = end + 1;
+        i = end;
+    }
+    return out + escapeProse(text.slice(from));
+}
 function plainText(tokens) {
     let out = '';
     for (const token of tokens) {
@@ -97,6 +146,18 @@ export async function renderPageMarkdown(source) {
             // tags, {expressions} stay expressions.
             html(token) {
                 return token.text;
+            },
+            // Prose escapes for HTML, but balanced {…} spans stay verbatim so
+            // expressions keep their quotes and operators. A backslash-escaped
+            // brace (`\{`) becomes an inert literal brace.
+            text(token) {
+                if (token.type === 'escape')
+                    return escapeBraces(escapeProse(token.text));
+                if ('tokens' in token && token.tokens)
+                    return this.parser.parseInline(token.tokens);
+                if ('escaped' in token && token.escaped)
+                    return token.text;
+                return escapeTextKeepingExpressions(token.text);
             }
         }
     });

package/dist/server/snippet-compiler.js

@@ -138,7 +138,10 @@ ${stateBroadcast}
 
 		window.parent.postMessage({ type: 'sdocs:preview-ready' }, '*');
 
-		// Report content height to parent for auto-sizing
+		// Report content height to parent for auto-sizing. The preview div is
+		// display: flow-root so child margins are contained — otherwise the
+		// first/last child's margins collapse through it, scrollHeight comes up
+		// short, and the iframe clips the final block of content.
 		const ro = new ResizeObserver(() => {
 			const height = document.getElementById('sdocs-preview')?.scrollHeight ?? 0;
 			window.parent.postMessage({ type: 'sdocs:resize', height }, '*');
@@ -148,7 +151,7 @@ ${stateBroadcast}
 	});
 </script>
 
-<div id="sdocs-preview">
+<div id="sdocs-preview" style="display: flow-root">
 	{#snippet SdocsPreview(args)}
 		${injectRootRef(snippetBody, componentName)}
 	{/snippet}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "sdocs",
-	"version": "0.0.49",
+	"version": "0.0.51",
 	"description": "A lightweight documentation tool for Svelte 5 components",
 	"type": "module",
 	"license": "MIT",