@zeropress/build-core 0.1.13 → 0.1.15

package/README.md

@@ -186,9 +186,13 @@ Build-core now derives:
 - taxonomy link HTML
 - formatted `published_at` / `updated_at`
 - `reading_time`
-- `comments_html`
+- `comments_enabled`
 
-Comment shell rendering is derived from preview-data policy:
+It also emits a comments allowlist artifact:
+
+- `/_zeropress/comment-policy.json`
+
+Comment availability is derived from preview-data policy:
 
 - `site.disallowComments`
 - `content.posts[].allow_comments`
@@ -216,7 +220,6 @@ Supported options:
 
 - `assetHashing`
 - `generateSpecialFiles`
-- `injectHtmx`
 - `writeManifest`
 
 These options apply to both full builds and partial renders where relevant.
@@ -225,7 +228,6 @@ Defaults:
 
 - `assetHashing: true`
 - `generateSpecialFiles: true`
-- `injectHtmx: true`
 - `writeManifest: false`
 
 ---

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zeropress/build-core",
-  "version": "0.1.13",
+  "version": "0.1.15",
   "description": "Shared ZeroPress build core",
   "type": "module",
   "license": "MIT",
@@ -34,8 +34,8 @@
   },
   "dependencies": {
     "@zeropress/slug-policy": "^0.1.0",
-    "@zeropress/preview-data-validator": "^0.4.3",
-    "@zeropress/theme-validator": "^0.3.2",
+    "@zeropress/preview-data-validator": "^0.4.4",
+    "@zeropress/theme-validator": "^0.3.4",
     "highlight.js": "^11.11.1",
     "markdown-it": "^14.1.0",
     "markdown-it-anchor": "^9.2.0"

package/src/api/build-site.js

@@ -9,7 +9,6 @@ import { ZeroPressEngine } from '../render/zeropress-engine.js';
 const DEFAULT_OPTIONS = {
   assetHashing: true,
   generateSpecialFiles: true,
-  injectHtmx: true,
   writeManifest: false,
 };
 
@@ -18,7 +17,12 @@ const DEFAULT_DATE_FORMAT = 'YYYY-MM-DD';
 const DEFAULT_TIME_FORMAT = 'HH:mm';
 const DEFAULT_TIMEZONE = 'UTC';
 const DEFAULT_LOCALE = 'en-US';
+const DEFAULT_THEME_RUNTIME = '0.3';
+const THEME_RUNTIME_V0_4 = '0.4';
+const COMMENT_POLICY_OUTPUT_PATH = '_zeropress/comment-policy.json';
 const OUTPUT_PATH_CONTROL_CHAR_PATTERN = /[\u0000-\u001F\u007F]/;
+const SAFE_MEDIA_PROTOCOLS = new Set(['http:', 'https:']);
+const SAFE_LINK_PROTOCOLS = new Set(['http:', 'https:', 'mailto:', 'tel:']);
 export async function buildSite(input) {
   const options = { ...DEFAULT_OPTIONS, ...(input.options || {}) };
   const state = await createBuildState(input, options);
@@ -58,6 +62,14 @@ export async function buildSite(input) {
     await writeOutput(state.writer, state.summaries, assetOutput.path, assetOutput.content, assetOutput.contentType);
   }
 
+  await writeOutput(
+    state.writer,
+    state.summaries,
+    COMMENT_POLICY_OUTPUT_PATH,
+    state.commentPolicyContent,
+    'application/json',
+  );
+
   if (options.generateSpecialFiles) {
     await maybeRenderNotFoundPage(state);
     if (hasCanonicalSiteUrl(state.previewData.site.url)) {
@@ -84,7 +96,8 @@ async function createBuildState(input, options) {
   const summaries = [];
   const themePackage = input.themePackage;
   const previewData = normalizePreviewData(input.previewData);
-  const renderData = createRenderData(previewData);
+  const renderData = createRenderData(previewData, themePackage.metadata);
+  const themeRuntime = normalizeThemeRuntime(themePackage.metadata?.runtime);
 
   engine.initialize(themePackage);
 
@@ -101,13 +114,15 @@ async function createBuildState(input, options) {
     writer: input.writer,
     previewData,
     renderData,
-    renderedWidgets: renderWidgetAreas(previewData, renderData),
+    themeRuntime,
+    widgets: buildWidgetsForTheme(previewData, renderData, themeRuntime),
     engine,
     assetProcessor,
     summaries,
     assetOutputs,
     assetMap,
     customCssHref: customCssAsset ? `/${customCssAsset.path}` : '',
+    commentPolicyContent: buildCommentPolicyManifest(renderData.posts),
     options,
     generatedAt: new Date(),
     emitted: {
@@ -149,7 +164,7 @@ async function renderRoute(state, templateName, route) {
     templateName,
     {
       menus: state.previewData.menus,
-      widgets: state.renderedWidgets,
+      widgets: state.widgets,
       ...route,
       meta: buildPageMeta(state.previewData.site, {
         currentUrl,
@@ -172,7 +187,7 @@ async function renderPost(state, post) {
     'post',
     {
       menus: state.previewData.menus,
-      widgets: state.renderedWidgets,
+      widgets: state.widgets,
       post,
       meta: buildPageMeta(state.previewData.site, {
         currentUrl,
@@ -188,9 +203,6 @@ async function renderPost(state, post) {
   );
   html = state.assetProcessor.updateAssetReferences(html, state.assetMap);
   html = injectCustomCssAssetLink(html, state.customCssHref);
-  if (state.options.injectHtmx) {
-    html = injectHtmxScript(html);
-  }
   await writeOutput(state.writer, state.summaries, `posts/${encodeSlugSegment(post.slug)}/index.html`, html, 'text/html');
   state.emitted.posts.push({
     url: currentUrl,
@@ -208,7 +220,7 @@ async function renderPage(state, page) {
     'page',
     {
       menus: state.previewData.menus,
-      widgets: state.renderedWidgets,
+      widgets: state.widgets,
       page,
       meta: buildPageMeta(state.previewData.site, {
         currentUrl,
@@ -240,7 +252,7 @@ async function maybeRenderNotFoundPage(state) {
     '404',
     {
       menus: state.previewData.menus,
-      widgets: state.renderedWidgets,
+      widgets: state.widgets,
       meta: buildPageMeta(state.previewData.site, {
         currentUrl: '/404.html',
         title: state.previewData.site.title,
@@ -272,7 +284,7 @@ function normalizePreviewData(previewData) {
   return {
     ...previewData,
     site: normalizedSite,
-    widgets: normalizeWidgetAreas(previewData.widgets),
+    widgets: normalizeWidgetAreas(previewData.widgets, normalizedSite.mediaBaseUrl),
     custom_css: normalizeCustomCss(previewData.custom_css),
     content: {
       ...previewData.content,
@@ -298,7 +310,7 @@ function normalizePreviewData(previewData) {
   };
 }
 
-function normalizeWidgetAreas(widgetAreas) {
+function normalizeWidgetAreas(widgetAreas, mediaBaseUrl) {
   if (!widgetAreas || typeof widgetAreas !== 'object') {
     return {};
   }
@@ -310,22 +322,39 @@ function normalizeWidgetAreas(widgetAreas) {
         ...widgetArea,
         name: normalizeNonEmptyString(widgetArea?.name, widgetAreaId),
         items: Array.isArray(widgetArea?.items)
-          ? widgetArea.items.map((item) => ({
-            ...item,
-            title: normalizeNonEmptyString(item?.title, 'Widget'),
-          }))
+          ? widgetArea.items.map((item) => normalizeWidgetItem(item, mediaBaseUrl))
           : [],
       },
     ]),
   );
 }
 
+function normalizeWidgetItem(item, mediaBaseUrl) {
+  const normalizedItem = {
+    ...item,
+    title: typeof item?.title === 'string' ? item.title.trim() : '',
+  };
+
+  if (item?.type === 'profile' && item?.settings && typeof item.settings === 'object') {
+    return {
+      ...normalizedItem,
+      settings: {
+        ...item.settings,
+        avatar: normalizeMediaField(item.settings.avatar, mediaBaseUrl),
+      },
+    };
+  }
+
+  return normalizedItem;
+}
+
 function normalizeCustomCss(customCss) {
   const content = normalizeOptionalString(customCss?.content);
   return content ? { content } : undefined;
 }
 
-function createRenderData(previewData) {
+function createRenderData(previewData, themeMetadata = {}) {
+  const themeSupportsComments = themeMetadata?.features?.comments === true;
   const authorsById = new Map(previewData.content.authors.map((author) => [author.id, author]));
   const categoriesBySlug = new Map(previewData.content.categories.map((category) => [category.slug, category]));
   const tagsBySlug = new Map(previewData.content.tags.map((tag) => [tag.slug, tag]));
@@ -346,7 +375,7 @@ function createRenderData(previewData) {
     }
   }
 
-  const posts = previewData.content.posts.map((post) => preparePost(post, previewData.site, authorsById, categoriesBySlug, tagsBySlug));
+  const posts = previewData.content.posts.map((post) => preparePost(post, previewData.site, authorsById, categoriesBySlug, tagsBySlug, themeSupportsComments));
   const pages = previewData.content.pages.map((page) => preparePage(page));
   const postBySlug = new Map(posts.map((post) => [post.slug, post]));
   const categoryLinks = renderCategoryLinks(previewData.content.categories, categoryCountBySlug);
@@ -399,6 +428,245 @@ function createRenderData(previewData) {
   };
 }
 
+function normalizeThemeRuntime(value) {
+  return value === THEME_RUNTIME_V0_4 ? THEME_RUNTIME_V0_4 : DEFAULT_THEME_RUNTIME;
+}
+
+function buildWidgetsForTheme(previewData, renderData, themeRuntime) {
+  if (themeRuntime === THEME_RUNTIME_V0_4) {
+    return resolveWidgetAreas(previewData, renderData);
+  }
+
+  return renderWidgetAreas(previewData, renderData);
+}
+
+function resolveWidgetAreas(previewData, renderData) {
+  if (!previewData.widgets || typeof previewData.widgets !== 'object') {
+    return {};
+  }
+
+  return Object.fromEntries(
+    Object.entries(previewData.widgets).map(([widgetAreaId, widgetArea]) => [
+      widgetAreaId,
+      resolveWidgetArea(widgetArea, previewData, renderData, widgetAreaId),
+    ]),
+  );
+}
+
+function resolveWidgetArea(widgetArea, previewData, renderData, widgetAreaId) {
+  if (!widgetArea || !Array.isArray(widgetArea.items)) {
+    return {
+      name: normalizeNonEmptyString(widgetArea?.name, widgetAreaId),
+      items: [],
+    };
+  }
+
+  return {
+    name: normalizeNonEmptyString(widgetArea?.name, widgetAreaId),
+    items: widgetArea.items
+      .map((item, index) => resolveWidgetItem(item, previewData, renderData, widgetAreaId, index))
+      .filter(Boolean),
+  };
+}
+
+function resolveWidgetItem(item, previewData, renderData, widgetAreaId, index) {
+  if (!item || typeof item !== 'object' || typeof item.type !== 'string') {
+    return null;
+  }
+
+  const baseWidget = {
+    id: `${widgetAreaId}-${index + 1}`,
+    type: item.type,
+    title: typeof item.title === 'string' ? item.title : '',
+    empty: false,
+  };
+
+  switch (item.type) {
+    case 'recent-posts':
+      return resolveRecentPostsWidget(baseWidget, item.settings, renderData);
+    case 'categories':
+      return resolveCategoriesWidget(baseWidget, item.settings, previewData);
+    case 'tags':
+      return resolveTagsWidget(baseWidget, item.settings, previewData);
+    case 'archives':
+      return resolveArchivesWidget(baseWidget, item.settings, previewData);
+    case 'text':
+      return resolveTextWidget(baseWidget, item.settings);
+    case 'link-list':
+      return resolveLinkListWidget(baseWidget, item.settings);
+    case 'search':
+      return resolveSearchWidget(baseWidget, item.settings, widgetAreaId, index);
+    case 'profile':
+      return resolveProfileWidget(baseWidget, item.settings);
+    default:
+      return null;
+  }
+}
+
+function resolveRecentPostsWidget(baseWidget, settings, renderData) {
+  const limit = clampInteger(settings?.limit, 5, 1, 20);
+  const items = renderData.posts
+    .slice(0, limit)
+    .map((post) => ({
+      title: post.title,
+      url: `/posts/${encodeSlugSegment(post.slug)}/`,
+      published_at: post.published_at,
+      published_at_iso: post.published_at_iso,
+    }));
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    show_date: settings?.show_date !== false,
+    items,
+  };
+}
+
+function resolveCategoriesWidget(baseWidget, settings, previewData) {
+  const countBySlug = buildTaxonomyCountMap(previewData.content.posts, 'category_slugs');
+  const items = previewData.content.categories
+    .map((category) => ({
+      name: category.name,
+      slug: category.slug,
+      url: `/categories/${encodeSlugSegment(category.slug)}/`,
+      count: countBySlug.get(category.slug) || 0,
+      depth: 0,
+    }))
+    .filter((category) => category.count > 0);
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    show_count: settings?.show_count === true,
+    hierarchical: settings?.hierarchical === true,
+    items,
+  };
+}
+
+function resolveTagsWidget(baseWidget, settings, previewData) {
+  const countBySlug = buildTaxonomyCountMap(previewData.content.posts, 'tag_slugs');
+  const limit = clampInteger(settings?.limit, 20, 1, 100);
+  const items = previewData.content.tags
+    .map((tag) => ({
+      name: tag.name,
+      slug: tag.slug,
+      url: `/tags/${encodeSlugSegment(tag.slug)}/`,
+      count: countBySlug.get(tag.slug) || 0,
+    }))
+    .filter((tag) => tag.count > 0)
+    .slice(0, limit);
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    show_count: settings?.show_count === true,
+    items,
+  };
+}
+
+function resolveArchivesWidget(baseWidget, settings, previewData) {
+  const limit = clampInteger(settings?.limit, 12, 1, 120);
+  const items = buildArchiveEntries(previewData.content.posts, previewData.site)
+    .slice(0, limit)
+    .map((entry) => ({
+      label: entry.label,
+      url: '/archive/',
+      count: entry.count,
+      year: entry.year,
+      month: entry.month,
+      meta: `${entry.count} posts`,
+    }));
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    items,
+  };
+}
+
+function resolveTextWidget(baseWidget, settings) {
+  const content = typeof settings?.content === 'string' ? settings.content : '';
+  const html = renderDocumentContent(content, normalizeDocumentType(settings?.document_type));
+
+  if (!normalizeOptionalString(html)) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    html,
+  };
+}
+
+function resolveLinkListWidget(baseWidget, settings) {
+  const items = (Array.isArray(settings?.links) ? settings.links : [])
+    .map((link) => {
+      const label = normalizeOptionalString(link?.label);
+      const url = normalizeThemeLinkUrl(link?.url);
+      if (!label || !url) {
+        return null;
+      }
+
+      const target = normalizeLinkTarget(link?.target);
+      return {
+        label,
+        url,
+        target,
+        rel: target === '_blank' ? 'noreferrer noopener' : '',
+      };
+    })
+    .filter(Boolean);
+
+  if (items.length === 0) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    items,
+  };
+}
+
+function resolveSearchWidget(baseWidget, settings, widgetAreaId, index) {
+  return {
+    ...baseWidget,
+    placeholder: normalizeNonEmptyString(settings?.placeholder, 'Search...'),
+    button_label: normalizeNonEmptyString(settings?.button_label, 'Search'),
+    dom_id: `widget-search-${widgetAreaId}-${index + 1}`,
+  };
+}
+
+function resolveProfileWidget(baseWidget, settings) {
+  const displayName = normalizeOptionalString(settings?.display_name);
+  const affiliation = normalizeOptionalString(settings?.affiliation);
+  const bioText = normalizeOptionalString(settings?.bio_short);
+  const avatarUrl = normalizeMediaField(settings?.avatar);
+
+  if (!displayName && !affiliation && !bioText && !avatarUrl) {
+    return null;
+  }
+
+  return {
+    ...baseWidget,
+    display_name: displayName,
+    affiliation,
+    avatar_url: avatarUrl,
+    bio_text: bioText,
+  };
+}
+
 function renderWidgetAreas(previewData, renderData) {
   if (!previewData.widgets || typeof previewData.widgets !== 'object') {
     return {};
@@ -567,7 +835,7 @@ function renderLinkListWidget(title, settings) {
   const items = links
     .map((link) => {
       const label = normalizeOptionalString(link?.label);
-      const url = normalizeOptionalString(link?.url);
+      const url = normalizeThemeLinkUrl(link?.url);
       if (!label || !url) {
         return '';
       }
@@ -656,14 +924,26 @@ function preparePage(page) {
   };
 }
 
-function preparePost(post, site, authorsById, categoriesBySlug, tagsBySlug) {
+function preparePost(post, site, authorsById, categoriesBySlug, tagsBySlug, themeSupportsComments) {
   const documentType = normalizeDocumentType(post.document_type);
   const html = renderDocumentContent(post.content, documentType);
   const author = authorsById.get(post.author_id);
 
   return {
-    ...post,
+    public_id: post.public_id,
+    title: post.title,
+    slug: post.slug,
+    content: post.content,
     document_type: documentType,
+    excerpt: post.excerpt,
+    published_at_iso: post.published_at_iso,
+    updated_at_iso: post.updated_at_iso,
+    author_id: post.author_id,
+    featured_image: post.featured_image,
+    status: post.status,
+    allow_comments: post.allow_comments,
+    category_slugs: post.category_slugs,
+    tag_slugs: post.tag_slugs,
     html,
     author_name: normalizeNonEmptyString(author?.display_name, post.author_id),
     author_avatar: author?.avatar,
@@ -672,50 +952,20 @@ function preparePost(post, site, authorsById, categoriesBySlug, tagsBySlug) {
     reading_time: calculateReadingTime(html),
     categories_html: renderInlineTaxonomyLinks(post.category_slugs, categoriesBySlug, 'category'),
     tags_html: renderInlineTaxonomyLinks(post.tag_slugs, tagsBySlug, 'tag'),
-    comments_html: renderCommentsContainer(site, post),
+    comments_enabled: themeSupportsComments && site.disallowComments !== true && post.allow_comments === true,
   };
 }
 
-function renderCommentsContainer(site, post) {
-  if (site.disallowComments === true || post.allow_comments !== true) {
-    return '';
-  }
+function buildCommentPolicyManifest(posts) {
+  const commentablePosts = posts
+    .filter((post) => post.status === 'published' && post.comments_enabled === true)
+    .map((post) => post.public_id)
+    .filter((value) => Number.isInteger(value) && value > 0);
 
-  const safePostId = encodeURIComponent(post.id);
-  return `<section id="comments" class="zp-comments">
-  <h2>댓글</h2>
-  <div id="comment-list"
-       hx-get="/api/comments/${safePostId}"
-       hx-trigger="load"
-       hx-swap="innerHTML">
-    <p class="zp-comments-loading">댓글을 불러오는 중...</p>
-  </div>
-  <form id="comment-form"
-        hx-post="/api/comments/${safePostId}"
-        hx-target="#comment-form-result"
-        hx-swap="innerHTML">
-    <div id="comment-form-result"></div>
-    <div>
-      <label for="author_name">이름</label>
-      <input type="text" id="author_name" name="author_name" required>
-    </div>
-    <div>
-      <label for="author_email">이메일</label>
-      <input type="email" id="author_email" name="author_email" required>
-    </div>
-    <div>
-      <label for="content">댓글</label>
-      <textarea id="content" name="content" required minlength="1" maxlength="5000"></textarea>
-    </div>
-    <div style="position:absolute;left:-9999px;" aria-hidden="true">
-      <input type="text" name="website" tabindex="-1" autocomplete="off">
-    </div>
-    <button type="submit">댓글 작성</button>
-  </form>
-  <noscript>
-    <p>댓글 기능을 사용하려면 JavaScript를 활성화해 주세요.</p>
-  </noscript>
-</section>`;
+  return JSON.stringify({
+    version: 1,
+    commentable_posts: commentablePosts,
+  }, null, 2);
 }
 
 function buildTaxonomyRoutes(options) {
@@ -966,6 +1216,8 @@ function buildArchiveEntries(posts, site) {
     .map((entry) => ({
       label: formatArchiveLabel(entry.date, site),
       count: entry.count,
+      year: entry.date.getUTCFullYear(),
+      month: entry.date.getUTCMonth() + 1,
     }));
 }
 
@@ -1115,6 +1367,7 @@ async function assertValidThemePackage(themePackage) {
     ...(themePackage.metadata.author ? { author: themePackage.metadata.author } : {}),
     ...(themePackage.metadata.description ? { description: themePackage.metadata.description } : {}),
     ...(themePackage.metadata.thumbnail ? { thumbnail: themePackage.metadata.thumbnail } : {}),
+    ...(themePackage.metadata.features ? { features: themePackage.metadata.features } : {}),
     ...(themePackage.metadata.menuSlots ? { menuSlots: themePackage.metadata.menuSlots } : {}),
     ...(themePackage.metadata.widgetAreas ? { widgetAreas: themePackage.metadata.widgetAreas } : {}),
     settings: themePackage.metadata.settings || {},
@@ -1276,7 +1529,7 @@ function resolveMetaImageUrl(image) {
   }
 
   if (isAbsoluteUrl(normalizedImage)) {
-    return normalizedImage;
+    return normalizeAbsoluteUrl(normalizedImage, SAFE_MEDIA_PROTOCOLS);
   }
 
   return '';
@@ -1293,7 +1546,7 @@ function normalizeMediaField(value, mediaBaseUrl) {
   }
 
   if (isAbsoluteUrl(normalizedValue)) {
-    return normalizedValue;
+    return normalizeAbsoluteUrl(normalizedValue, SAFE_MEDIA_PROTOCOLS);
   }
 
   const normalizedBaseUrl = normalizeOptionalString(mediaBaseUrl);
@@ -1317,6 +1570,31 @@ function isAbsoluteUrl(value) {
   }
 }
 
+function normalizeAbsoluteUrl(value, allowedProtocols) {
+  try {
+    const url = new URL(value);
+    if (!allowedProtocols.has(url.protocol)) {
+      return '';
+    }
+    return decodeURI(url.toString());
+  } catch {
+    return '';
+  }
+}
+
+function normalizeThemeLinkUrl(value) {
+  const normalizedValue = normalizeOptionalString(value);
+  if (!normalizedValue || normalizedValue.startsWith('//')) {
+    return '';
+  }
+
+  if (isAbsoluteUrl(normalizedValue)) {
+    return normalizeAbsoluteUrl(normalizedValue, SAFE_LINK_PROTOCOLS);
+  }
+
+  return normalizedValue;
+}
+
 async function writeOutput(writer, summaries, path, content, contentType) {
   const rawPath = String(path || '');
   const normalizedPath = normalizeOutputPath(rawPath);
@@ -1375,6 +1653,7 @@ function assertPlannedOutputPathsSafe(state) {
     ...state.renderData.posts.map((post) => `posts/${encodeSlugSegment(post.slug)}/index.html`),
     ...state.renderData.pages.map((page) => `${encodeSlugSegment(page.slug)}/index.html`),
     ...state.assetOutputs.map((assetOutput) => assetOutput.path),
+    COMMENT_POLICY_OUTPUT_PATH,
   ];
 
   if (state.options.generateSpecialFiles) {
@@ -1449,10 +1728,6 @@ function sha256(content) {
   return hash.digest('hex');
 }
 
-function injectHtmxScript(html) {
-  return html.replace('</body>', '<script src="https://unpkg.com/htmx.org@2.0.4" crossorigin="anonymous"></script>\n</body>');
-}
-
 function injectCustomCssAssetLink(html, href) {
   if (!normalizeOptionalString(href)) {
     return html;

package/src/index.d.ts

@@ -8,6 +8,10 @@ export interface ThemePackage {
     description?: string;
     thumbnail?: string;
     settings?: Record<string, unknown>;
+    features?: {
+      comments?: boolean;
+      newsletter?: boolean;
+    };
     menuSlots?: Record<string, {
       title: string;
       description?: string;
@@ -19,7 +23,7 @@ export interface ThemePackage {
     namespace?: string;
     slug?: string;
     license?: 'MIT' | 'Apache-2.0' | 'BSD-3-Clause' | 'GPL-3.0-only' | 'GPL-3.0-or-later';
-    runtime?: '0.3';
+    runtime?: '0.3' | '0.4';
   };
   templates: Map<string, string>;
   partials: Map<string, string>;
@@ -39,7 +43,6 @@ export interface BuildWriter {
 export interface BuildOptions {
   assetHashing?: boolean;
   generateSpecialFiles?: boolean;
-  injectHtmx?: boolean;
   writeManifest?: boolean;
 }
 

package/src/render/control-flow-renderer.js

@@ -0,0 +1,221 @@
+function isWhitespace(value) {
+  return /^[\s\r\n\t]*$/.test(value);
+}
+
+export class ControlFlowRenderer {
+  constructor(options = {}) {
+    this.resolvePath = typeof options.resolvePath === 'function'
+      ? options.resolvePath
+      : ((data, path) => path.split('.').reduce((current, segment) => {
+        if (current == null || typeof current !== 'object') {
+          return undefined;
+        }
+        return current[segment];
+      }, data));
+    this.renderText = typeof options.renderText === 'function'
+      ? options.renderText
+      : ((value) => value);
+  }
+
+  render(template, data, renderOptions = {}) {
+    const nodes = this.parse(template);
+    return this.renderNodes(nodes, data, renderOptions);
+  }
+
+  parse(template) {
+    const source = String(template || '');
+    const { nodes, nextIndex, stopTag } = this.parseNodes(source, 0, new Set());
+    if (stopTag) {
+      throw new Error(`Unexpected closing tag ${stopTag}`);
+    }
+    if (nextIndex !== source.length) {
+      throw new Error('Unexpected parser termination');
+    }
+    return nodes;
+  }
+
+  parseNodes(source, startIndex, stopTags) {
+    const nodes = [];
+    let index = startIndex;
+
+    while (index < source.length) {
+      const nextDelimiter = source.indexOf('{{', index);
+      if (nextDelimiter === -1) {
+        nodes.push({ type: 'text', value: source.slice(index) });
+        return { nodes, nextIndex: source.length, stopTag: null };
+      }
+
+      if (nextDelimiter > index) {
+        nodes.push({ type: 'text', value: source.slice(index, nextDelimiter) });
+      }
+
+      if (source.startsWith('{{!--', nextDelimiter)) {
+        const end = source.indexOf('--}}', nextDelimiter + 5);
+        if (end === -1) {
+          throw new Error('Unclosed block comment');
+        }
+        const commentBody = source.slice(nextDelimiter + 5, end);
+        if (commentBody.includes('{{!--')) {
+          throw new Error('Nested block comments are not allowed');
+        }
+        index = end + 4;
+        continue;
+      }
+
+      if (source.startsWith('{{!', nextDelimiter)) {
+        const end = source.indexOf('}}', nextDelimiter + 3);
+        if (end === -1) {
+          throw new Error('Unclosed inline comment');
+        }
+        index = end + 2;
+        continue;
+      }
+
+      const tokenEnd = source.indexOf('}}', nextDelimiter + 2);
+      if (tokenEnd === -1) {
+        throw new Error('Unclosed template tag');
+      }
+
+      const rawToken = source.slice(nextDelimiter, tokenEnd + 2);
+      const token = source.slice(nextDelimiter + 2, tokenEnd).trim();
+
+      if (token.startsWith('/')) {
+        const tagName = token.slice(1).trim();
+        if (!stopTags.has(tagName)) {
+          throw new Error(`Unexpected closing tag /${tagName}`);
+        }
+        return { nodes, nextIndex: tokenEnd + 2, stopTag: tagName };
+      }
+
+      if (token === '#else') {
+        if (!stopTags.has('else')) {
+          throw new Error('Unexpected else tag');
+        }
+        return { nodes, nextIndex: tokenEnd + 2, stopTag: 'else' };
+      }
+
+      if (token.startsWith('#if_eq ')) {
+        const expression = token.slice('#if_eq '.length).trim();
+        const match = /^([a-zA-Z_][a-zA-Z0-9_]*(?:\.[a-zA-Z_][a-zA-Z0-9_]*)*)\s+("(?:[^"\\]|\\.)*")$/.exec(expression);
+        if (!match) {
+          throw new Error(`Invalid if_eq expression: ${expression}`);
+        }
+        const [, path, literalSource] = match;
+        const literal = JSON.parse(literalSource);
+        const ifResult = this.parseNodes(source, tokenEnd + 2, new Set(['else', 'if_eq']));
+        let elseNodes = [];
+        let nextIndex = ifResult.nextIndex;
+        if (ifResult.stopTag === 'else') {
+          const elseResult = this.parseNodes(source, ifResult.nextIndex, new Set(['if_eq']));
+          if (elseResult.stopTag !== 'if_eq') {
+            throw new Error('Unclosed if_eq block after else');
+          }
+          elseNodes = elseResult.nodes;
+          nextIndex = elseResult.nextIndex;
+        } else if (ifResult.stopTag !== 'if_eq') {
+          throw new Error('Unclosed if_eq block');
+        }
+        nodes.push({ type: 'if_eq', path, literal, consequent: ifResult.nodes, alternate: elseNodes });
+        index = nextIndex;
+        continue;
+      }
+
+      if (token.startsWith('#if ')) {
+        const path = token.slice('#if '.length).trim();
+        if (!/^[a-zA-Z_][a-zA-Z0-9_]*(?:\.[a-zA-Z_][a-zA-Z0-9_]*)*$/.test(path)) {
+          throw new Error(`Invalid if expression: ${path}`);
+        }
+        const ifResult = this.parseNodes(source, tokenEnd + 2, new Set(['else', 'if']));
+        let elseNodes = [];
+        let nextIndex = ifResult.nextIndex;
+        if (ifResult.stopTag === 'else') {
+          const elseResult = this.parseNodes(source, ifResult.nextIndex, new Set(['if']));
+          if (elseResult.stopTag !== 'if') {
+            throw new Error('Unclosed if block after else');
+          }
+          elseNodes = elseResult.nodes;
+          nextIndex = elseResult.nextIndex;
+        } else if (ifResult.stopTag !== 'if') {
+          throw new Error('Unclosed if block');
+        }
+        nodes.push({ type: 'if', path, consequent: ifResult.nodes, alternate: elseNodes });
+        index = nextIndex;
+        continue;
+      }
+
+      if (token.startsWith('#for ')) {
+        const expression = token.slice('#for '.length).trim();
+        const match = /^([a-zA-Z_][a-zA-Z0-9_]*)\s+in\s+([a-zA-Z_][a-zA-Z0-9_]*(?:\.[a-zA-Z_][a-zA-Z0-9_]*)*)$/.exec(expression);
+        if (!match) {
+          throw new Error(`Invalid for expression: ${expression}`);
+        }
+        const [, itemName, path] = match;
+        const forResult = this.parseNodes(source, tokenEnd + 2, new Set(['for']));
+        if (forResult.stopTag !== 'for') {
+          throw new Error('Unclosed for block');
+        }
+        nodes.push({ type: 'for', itemName, path, body: forResult.nodes });
+        index = forResult.nextIndex;
+        continue;
+      }
+
+      nodes.push({ type: 'text', value: rawToken });
+      index = tokenEnd + 2;
+    }
+
+    if (stopTags.size > 0) {
+      const expected = Array.from(stopTags).filter((entry) => entry !== 'else').join(', ');
+      throw new Error(`Missing closing tag for ${expected}`);
+    }
+
+    return { nodes, nextIndex: source.length, stopTag: null };
+  }
+
+  renderNodes(nodes, data, renderOptions) {
+    return nodes.map((node) => this.renderNode(node, data, renderOptions)).join('');
+  }
+
+  renderNode(node, data, renderOptions) {
+    switch (node.type) {
+      case 'text':
+        return this.renderText(node.value, data, renderOptions);
+      case 'if': {
+        const value = this.resolvePath(data, node.path);
+        return this.isTruthy(value)
+          ? this.renderNodes(node.consequent, data, renderOptions)
+          : this.renderNodes(node.alternate, data, renderOptions);
+      }
+      case 'if_eq': {
+        const value = this.resolvePath(data, node.path);
+        return value === node.literal
+          ? this.renderNodes(node.consequent, data, renderOptions)
+          : this.renderNodes(node.alternate, data, renderOptions);
+      }
+      case 'for': {
+        const items = this.resolvePath(data, node.path);
+        if (!Array.isArray(items) || items.length === 0) {
+          return '';
+        }
+        return items
+          .map((item, index) => this.renderNodes(node.body, {
+            ...data,
+            [node.itemName]: item,
+            $index: index,
+          }, renderOptions))
+          .join('');
+      }
+      default:
+        return '';
+    }
+  }
+
+  isTruthy(value) {
+    if (Array.isArray(value)) {
+      return value.length > 0;
+    }
+    if (typeof value === 'string') {
+      return value.length > 0;
+    }
+    return Boolean(value);
+  }
+}

package/src/render/variable-resolver.js

@@ -2,15 +2,16 @@ export class VariableResolver {
   static MENU_PATTERN = /\{\{menu:([a-z][a-z0-9_-]{0,63})\}\}/g;
   static VARIABLE_PATTERN = /\{\{([a-zA-Z_][a-zA-Z0-9_]*(?:\.[a-zA-Z_][a-zA-Z0-9_]*)+)\}\}/g;
   static STANDALONE_PATTERN = /\{\{([a-zA-Z_][a-zA-Z0-9_]*)\}\}/g;
+  static RAW_STANDALONE = new Set(['posts', 'categories', 'tags', 'pagination']);
 
-  resolve(template, data) {
+  resolve(template, data, options = {}) {
     let result = template.replace(VariableResolver.MENU_PATTERN, (_, menuId) => {
       return this.renderMenu(data?.menus?.[menuId]);
     });
 
     result = result.replace(VariableResolver.VARIABLE_PATTERN, (_, variablePath) => {
       const value = this.resolvePath(data, variablePath);
-      return value == null ? '' : String(value);
+      return this.renderValue(value, variablePath, options);
     });
 
     result = result.replace(VariableResolver.STANDALONE_PATTERN, (match, variableName) => {
@@ -19,7 +20,7 @@ export class VariableResolver {
       }
 
       const value = data[variableName];
-      return value == null ? '' : String(value);
+      return this.renderValue(value, variableName, options);
     });
 
     return result;
@@ -64,11 +65,58 @@ export class VariableResolver {
     return `<li><a href="${url}" target="${target}"${rel}>${title}</a>${children}</li>`;
   }
 
+  renderValue(value, variablePath, options = {}) {
+    if (value == null) {
+      return '';
+    }
+
+    const stringValue = String(value);
+    if (options.escapeValues !== true) {
+      return stringValue;
+    }
+
+    if (this.shouldRenderRaw(variablePath, options)) {
+      return stringValue;
+    }
+
+    return this.escapeHtml(stringValue);
+  }
+
+  shouldRenderRaw(variablePath, options = {}) {
+    if (options.rawPaths instanceof Set && options.rawPaths.has(variablePath)) {
+      return true;
+    }
+
+    if (options.rawPathPrefixes instanceof Set) {
+      for (const prefix of options.rawPathPrefixes) {
+        if (variablePath === prefix || variablePath.startsWith(`${prefix}.`)) {
+          return true;
+        }
+      }
+    }
+
+    if (VariableResolver.RAW_STANDALONE.has(variablePath)) {
+      return true;
+    }
+
+    const lastSegment = variablePath.split('.').pop();
+    if (lastSegment === 'html' || lastSegment?.endsWith('_html')) {
+      return true;
+    }
+
+    if (lastSegment?.endsWith('_url')) {
+      return true;
+    }
+
+    return false;
+  }
+
   escapeHtml(value) {
     return value
       .replaceAll('&', '&amp;')
       .replaceAll('<', '&lt;')
       .replaceAll('>', '&gt;')
-      .replaceAll('"', '&quot;');
+      .replaceAll('"', '&quot;')
+      .replaceAll("'", '&#39;');
   }
 }

package/src/render/zeropress-engine.js

@@ -1,10 +1,15 @@
 import { SlotResolver } from './slot-resolver.js';
 import { VariableResolver } from './variable-resolver.js';
+import { ControlFlowRenderer } from './control-flow-renderer.js';
 
 export class ZeroPressEngine {
   constructor() {
     this.slotResolver = new SlotResolver();
     this.variableResolver = new VariableResolver();
+    this.controlFlowRenderer = new ControlFlowRenderer({
+      resolvePath: (data, path) => this.variableResolver.resolvePath(data, path),
+      renderText: (value, data, renderOptions) => this.variableResolver.resolve(value, data, renderOptions),
+    });
     this.themePackage = null;
   }
 
@@ -27,9 +32,10 @@ export class ZeroPressEngine {
       throw new Error('Template "layout" not found');
     }
 
-    const renderedContent = this.variableResolver.resolve(template, this.combineRenderData(data, context));
+    const renderData = this.combineRenderData(data, context);
+    const renderedContent = this.renderTemplate(template, renderData);
     const layoutWithSlots = this.slotResolver.resolve(layout, this.themePackage.partials, renderedContent);
-    return this.variableResolver.resolve(layoutWithSlots, this.combineRenderData(data, context));
+    return this.renderTemplate(layoutWithSlots, renderData);
   }
 
   combineRenderData(data, context) {
@@ -40,4 +46,16 @@ export class ZeroPressEngine {
       language: context.language,
     };
   }
+
+  renderTemplate(template, data) {
+    if (this.themePackage?.metadata?.runtime === '0.4') {
+      return this.controlFlowRenderer.render(template, data, {
+        escapeValues: true,
+        rawPaths: new Set(['meta.head_tags']),
+        rawPathPrefixes: new Set(['meta']),
+      });
+    }
+
+    return this.variableResolver.resolve(template, data);
+  }
 }

package/src/theme/load-theme-dir.js

@@ -51,6 +51,7 @@ export async function loadThemePackageFromDir(themeDir) {
       description: themeJson.description,
       thumbnail: themeJson.thumbnail,
       settings: themeJson.settings || {},
+      features: themeJson.features,
       menuSlots: themeJson.menuSlots,
       widgetAreas: themeJson.widgetAreas,
       namespace: themeJson.namespace,