@port60/template-kit 0.20.3 → 0.20.4

package/src/vendor/validator/preview.mjs

@@ -1,8 +1,8 @@
 // The STUDIO PREVIEW renderer (developer program T1.3): a validated artifact rendered over the
-// contract's KIND FIXTURES — no tenant, no tenant data, exactly what `template-kit dev` will show
+// contract's KIND FIXTURES, no tenant, no tenant data, exactly what `template-kit dev` will show
 // locally in T3. Deliberately NOT the production TemplateHost path: a studio version must never
 // touch a live site, so this renders from an in-memory file map and the page it produces is
-// self-contained and network-dead — a CSP meta of default-src 'none' means the template's CSS
+// self-contained and network-dead, a CSP meta of default-src 'none' means the template's CSS
 // cannot fetch, beacon or import anything, and the consumer embeds it in a sandboxed iframe.
 // Islands render as realistic, non-interactive fixture skeletons through their public styling
 // classes. Preview HTML carries no runtime and never attempts a platform transaction.
@@ -23,21 +23,21 @@ import { normaliseFocus, previewActions, withResolvedActions, applyFocus } from
 
 // Fixture imagery resolved for the SEALED studio render (p60fixture: refs become inline-SVG data
 // URIs the network-dead CSP can show). The dev preview may instead resolve them to the platform
-// CDN via options.fixtureImageBase — the dev-richer / studio-sealed split.
+// CDN via options.fixtureImageBase, the dev-richer / studio-sealed split.
 const STUDIO_FX = resolveFixtureArt(contextContract.fixtures);
 
 const escapeHtml = (s) =>
   String(s).replace(/&/g, '&amp;').replace(/</g, '&lt;').replace(/>/g, '&gt;').replace(/"/g, '&quot;');
 
-// The platform base stylesheet — production loads it on EVERY template page before the theme, so
+// The platform base stylesheet, production loads it on EVERY template page before the theme, so
 // the preview does too: islands and platform components arrive with their real baseline look,
 // wearing the template's tokens, and the theme restyles over it exactly as in production.
-// (Generated copy of src/styles/global.css — scripts/build-preview-base.mjs.)
+// (Generated copy of src/styles/global.css, scripts/build-preview-base.mjs.)
 let PLATFORM_BASE = '';
 try {
   PLATFORM_BASE = readFileSync(join(import.meta.dirname, 'platform-base.css'), 'utf8');
 } catch {
-  // An older vendored copy without the file — the preview degrades to theme-only styling.
+  // An older vendored copy without the file, the preview degrades to theme-only styling.
 }
 
 function previewNote(name) {
@@ -73,7 +73,7 @@ function islandSkeleton(name, ctx = {}, fx = STUDIO_FX) {
         <p class="donate-note">Secure payment provided by Port60</p>
       </section>`;
     case 'member_menu':
-      // Lives INSIDE the nav row, so the wrapper stays inline and the badge trails the button —
+      // Lives INSIDE the nav row, so the wrapper stays inline and the badge trails the button,
       // block layout here read as a stray element between the nav's last link and Sign in.
       return `<div data-p60-preview-island="member_menu" style="display:inline-flex;align-items:center;gap:8px">
         <button class="nav-p60-signin" type="button" disabled><span class="p60-mark" aria-hidden="true">P</span> Sign in</button>
@@ -127,7 +127,7 @@ function islandSkeleton(name, ctx = {}, fx = STUDIO_FX) {
         <div class="article-comments-gate"><p class="article-comments-note">Sign in to join the conversation.</p></div>
       </section>`;
     case 'hero_carousel': {
-      // Hydrated from the surrounding section's images (the homeHero sample fixture) — real
+      // Hydrated from the surrounding section's images (the homeHero sample fixture), real
       // slides through the real styling API, CSS-crossfaded by the preview so it reads as alive.
       const images = Array.isArray(ctx.section?.images) ? ctx.section.images.filter((i) => i?.imageUrl) : [];
       const slides = images.length > 0
@@ -170,7 +170,7 @@ function islandSkeleton(name, ctx = {}, fx = STUDIO_FX) {
     case 'search':
       return `<div class="site-search" data-p60-preview-island="search">${previewNote(name)}<form class="site-search-form"><label class="site-search-label">Search this site</label><div class="site-search-fields"><input class="site-search-input" type="search" disabled><button class="site-search-submit" type="button" disabled>Search</button></div></form><ul class="site-search-results"><li class="site-search-result"><span class="site-search-kind">Article</span><a class="site-search-link" href="#">The Community Garden Opens Its Gates</a><p class="site-search-summary">Two years of digging and Saturday mornings in the rain: the Foundry Lane garden is open.</p></li></ul></div>`;
     case 'map': {
-      // The impact-map skeleton: the fixture's points projected onto a token-themed canvas —
+      // The impact-map skeleton: the fixture's points projected onto a token-themed canvas,
       // the same fallback rendering production uses until the platform tile layer is configured.
       const im = fx.sections?.impactMap?.impactMap ?? { title: 'Impact map', points: [] };
       const pts = im.points ?? [];
@@ -204,11 +204,11 @@ function islandSkeleton(name, ctx = {}, fx = STUDIO_FX) {
 // The ROUTED dev preview's answer to "what does X look like in my theme": each platform-owned
 // page as a fixture skeleton through the PRODUCTION class names, so the platform base + the
 // theme's tokens style it exactly as live, wrapped by the template's own layout. Never
-// interactive — the same posture as island skeletons. Where the theme ships its own page
+// interactive, the same posture as island skeletons. Where the theme ships its own page
 // template for a surface (events, course, articles, article), that template renders instead.
 
 function surfaceDivider(label) {
-  return `<div class="p60-preview-divider" role="note">platform page: ${escapeHtml(label)} — styled by your tokens and chrome</div>`;
+  return `<div class="p60-preview-divider" role="note">platform page: ${escapeHtml(label)}, styled by your tokens and chrome</div>`;
 }
 
 function eventsListingSkeleton(fx = STUDIO_FX) {
@@ -336,7 +336,7 @@ function serviceDetailSkeleton(fx = STUDIO_FX) {
       <h1>${escapeHtml(service.title)}</h1>
       ${service.summary ? `<p>${escapeHtml(service.summary)}</p>` : ''}
       <p>Content pages are written in the workspace's WYSIWYG editor and arrive as sanitised
-      HTML — headings, lists, images and embeds render here styled by your theme's typography.</p>
+      HTML, headings, lists, images and embeds render here styled by your theme's typography.</p>
     </article>
   </div></section>`;
 }
@@ -456,7 +456,7 @@ function knobValues(manifest, overrides = {}) {
 
 /**
  * Renders the artifact's declared sections (sample fixtures) inside its layout (when declared)
- * and returns a complete, self-contained HTML document. Throws on parse/render failure — callers
+ * and returns a complete, self-contained HTML document. Throws on parse/render failure, callers
  * preview only versions the validator has already passed, so a throw here is a bug report, not
  * a user flow.
  */
@@ -524,7 +524,7 @@ export async function renderStudioPreview(files, options = {}) {
   let contentHtml;
   if (surface !== 'home' && SURFACES[surface]) {
     // A routed platform surface: the theme's own page template when it ships one, else the
-    // platform-page fixture skeleton — either way inside the theme's layout below.
+    // platform-page fixture skeleton, either way inside the theme's layout below.
     const def = SURFACES[surface];
     const templateSource = def.template ? files[`pages/${def.template}.liquid`] : null;
     const fixture = def.template ? fx.pages?.[def.template] : null;
@@ -562,7 +562,7 @@ export async function renderStudioPreview(files, options = {}) {
           ...(fx.sections?.[type] ?? {})
         };
         const rendered = await liquid.parseAndRender(source, context);
-        // Island skeletons see the SAME context the section rendered with — that is what lets the
+        // Island skeletons see the SAME context the section rendered with, that is what lets the
         // hero carousel skeleton hydrate from the section's own photo fixtures.
         out.push(partsToHtml(rendered, '', context, fx));
       }
@@ -581,7 +581,7 @@ export async function renderStudioPreview(files, options = {}) {
       }
     }
 
-    // Declared page templates render too (over their page fixtures) — the loop an author lives in
+    // Declared page templates render too (over their page fixtures), the loop an author lives in
     // covers every surface they ship, not just home sections. The routed dev preview ALSO serves
     // each at its own path; this keeps the studio's single document complete.
     for (const page of surface === 'about' ? [] : (manifest?.supports?.pageTemplates ?? [])) {
@@ -625,7 +625,7 @@ export async function renderStudioPreview(files, options = {}) {
 
   // The kit's dev server passes the platform's own behaviour runtime (a self-contained bundle) so
   // authors see their carousels, reveals and tabs living locally. The document stays network-dead
-  // — the ONLY script it can run is the inline platform bundle; studio and demo previews pass
+  //, the ONLY script it can run is the inline platform bundle; studio and demo previews pass
   // nothing and keep the fully script-free CSP. Without the runtime, a CSS-only crossfade
   // approximates behaviour carousels so a static preview still reads as alive.
   const runtime = options.behaviorsRuntime ?? null;
@@ -667,7 +667,7 @@ export async function renderStudioPreview(files, options = {}) {
 <meta http-equiv="Content-Security-Policy" content="${csp}">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 ${fontLinks}
-<title>${escapeHtml(manifest?.label ?? manifest?.name ?? 'Template preview')} — studio preview</title>
+<title>${escapeHtml(manifest?.label ?? manifest?.name ?? 'Template preview')}, studio preview</title>
 <style>${vars ? `:root { ${vars} }` : ''}
 .p60-preview-badge { display: inline-flex; align-items: center; width: fit-content; margin: 0 0 8px;
   border: 1px solid currentColor; border-radius: 999px; padding: 3px 8px; font: 600 10px/1.2 system-ui, sans-serif;

package/src/vendor/validator/site-context.mjs

@@ -1,7 +1,7 @@
-// The `site` tree for validator and preview renders (content model v1 — contract/v1/
+// The `site` tree for validator and preview renders (content model v1, contract/v1/
 // content-model.json): ONE realistic organisation assembled from the canonical fixtures, with
 // `site.content.about` composed per-template from the section catalogue's samples for the
-// manifest's declared sections — the admin-authored page composition, previewed honestly.
+// manifest's declared sections, the admin-authored page composition, previewed honestly.
 import contextContract from '../contract/v1/context.json' with { type: 'json' };
 import sectionCatalogue from '../contract/v1/sections.json' with { type: 'json' };
 
@@ -20,6 +20,18 @@ export const PAGE_KEYS = ['home', 'about'];
  * site's composition is admin-authored, and the preview-content `pages` block plays that role.
  */
 export function composePage(manifest, page) {
+  // The template's own composition when it declares one (stage 4): its order, its choice of
+  // sections, the `optional` ones left out so the preview shows the designed default.
+  const declared = manifest?.compositions?.[page];
+  if (Array.isArray(declared) && declared.length > 0) {
+    return declared
+      .filter((entry) => entry && entry.role !== 'optional')
+      .map((entry) => {
+        const catalogueEntry = catalogueByType.get(entry.type);
+        return catalogueEntry ? { type: entry.type, content: catalogueEntry.sample ?? {} } : null;
+      })
+      .filter(Boolean);
+  }
   return (manifest?.supports?.sections ?? [])
     .map((type) => {
       const entry = catalogueByType.get(type);
@@ -132,7 +144,7 @@ export function validatePreviewContent(json) {
         continue;
       }
       for (const field of Object.keys(items)) {
-        if (field !== 'items') errors.push(`preview-content.json: nav.${field} does not exist — nav carries items`);
+        if (field !== 'items') errors.push(`preview-content.json: nav.${field} does not exist, nav carries items`);
       }
       validateNavItems(items.items, 'nav.items', errors);
       continue;
@@ -159,7 +171,7 @@ export function validatePreviewContent(json) {
       }
       for (const field of Object.keys(items)) {
         if (!BRAND_FIELDS.has(field)) {
-          errors.push(`preview-content.json: brand.${field} does not exist — brand carries ${[...BRAND_FIELDS].join(', ')}`);
+          errors.push(`preview-content.json: brand.${field} does not exist, brand carries ${[...BRAND_FIELDS].join(', ')}`);
         }
       }
       continue;
@@ -174,7 +186,7 @@ export function validatePreviewContent(json) {
       continue;
     }
     if (items.length > model.cap) {
-      errors.push(`preview-content.json: '${name}' holds ${items.length} items — the collection is bounded at ${model.cap}`);
+      errors.push(`preview-content.json: '${name}' holds ${items.length} items, the collection is bounded at ${model.cap}`);
     }
     items.forEach((item, i) => {
       if (item === null || typeof item !== 'object' || Array.isArray(item)) {
@@ -183,7 +195,7 @@ export function validatePreviewContent(json) {
       }
       for (const field of Object.keys(item)) {
         if (!model.item[field]) {
-          errors.push(`preview-content.json: ${name}[${i}].${field} does not exist in the model — a field that does not exist in production cannot exist in a preview`);
+          errors.push(`preview-content.json: ${name}[${i}].${field} does not exist in the model, a field that does not exist in production cannot exist in a preview`);
         }
       }
       for (const [field, spec] of Object.entries(model.item)) {

package/src/vendor/validator/validate.mjs

@@ -1,6 +1,6 @@
 // The Port60 template CONFORMANCE VALIDATOR as a PURE MODULE (developer program T1.3): the same
-// checks the publish-time CLI has always run, callable with an in-memory file map — no fs, no
-// argv, no process.exit — so the studio upload lane (an HTTP endpoint) and the CLI share ONE
+// checks the publish-time CLI has always run, callable with an in-memory file map, no fs, no
+// argv, no process.exit, so the studio upload lane (an HTTP endpoint) and the CLI share ONE
 // implementation, and "validated ⇒ renders in production" keeps holding: the Liquid instance is
 // configured identically to the engine's, dialect enforcement is the same shared module, and the
 // render budgets here match production's.
@@ -23,6 +23,7 @@ import fontCatalogue from '../contract/v1/fonts.json' with { type: 'json' };
 import layoutContract from '../contract/v1/layout.json' with { type: 'json' };
 import behaviourCatalogue from '../contract/v1/behaviours.json' with { type: 'json' };
 import { buildSiteFixture, extractContentFootprint, contentModel } from './site-context.mjs';
+import { proveNavigationHighlights } from './navigation-highlights.mjs';
 
 const Ajv = Ajv2020.default ?? Ajv2020;
 
@@ -42,7 +43,7 @@ const PRIMARY_ATTR = Object.fromEntries(
 );
 
 // Templates are markup and attributes, NEVER code (docs/template-behaviours.md). These are hard
-// errors over the RAW liquid source — even inside comments, because there is no legitimate reason
+// errors over the RAW liquid source, even inside comments, because there is no legitimate reason
 // for the tokens to appear at all. The handler pattern names real DOM event families rather than
 // matching any on* word, so attributes like `once` or `online` never false-positive.
 const FORBIDDEN_MARKUP = [
@@ -62,7 +63,7 @@ export async function validateArtifact(files) {
   // 1. Manifest against the schema.
   let manifest = null;
   if (!has('manifest.json')) {
-    return { errors: ['manifest.json is missing — every artifact starts with its manifest'], warnings, manifest };
+    return { errors: ['manifest.json is missing, every artifact starts with its manifest'], warnings, manifest };
   }
   try {
     manifest = JSON.parse(read('manifest.json'));
@@ -70,9 +71,9 @@ export async function validateArtifact(files) {
     return { errors: [`manifest.json unreadable: ${e.message}`], warnings, manifest: null };
   }
   // preview-content.json is a DEV-ONLY data override: package excludes it and the intake
-  // refuses it — an artifact must never carry data, only shape.
+  // refuses it, an artifact must never carry data, only shape.
   if (has('preview-content.json')) {
-    errors.push('preview-content.json: development preview data never ships in an artifact — remove it (package excludes it automatically)');
+    errors.push('preview-content.json: development preview data never ships in an artifact, remove it (package excludes it automatically)');
   }
 
   // Content model v1: the footprint is decidable from the sources (closed dialect); unknown
@@ -136,14 +137,14 @@ export async function validateArtifact(files) {
     }
   }
 
-  // Markup and attributes, NEVER code — the machine-enforced JavaScript ban over every liquid
+  // Markup and attributes, NEVER code, the machine-enforced JavaScript ban over every liquid
   // source (docs/template-behaviours.md). Behaviour is engine-owned; a template wanting motion
   // declares supports.behaviors and uses the data-p60-* grammar.
   for (const [path, source] of Object.entries(files)) {
     if (!path.endsWith('.liquid')) continue;
     for (const [pattern, what] of FORBIDDEN_MARKUP) {
       if (pattern.test(source)) {
-        errors.push(`${path}: contains ${what} — templates are markup and attributes, never code (behaviour is engine-owned; see the behaviour catalogue)`);
+        errors.push(`${path}: contains ${what}, templates are markup and attributes, never code (behaviour is engine-owned; see the behaviour catalogue)`);
       }
     }
   }
@@ -211,7 +212,7 @@ export async function validateArtifact(files) {
     }
   }
 
-  // Looks: every value must target a declared knob and be valid for it — a look that half-applies
+  // Looks: every value must target a declared knob and be valid for it, a look that half-applies
   // would leave the tenant in a state no author designed.
   {
     const knobByKey = new Map((manifest?.settings?.schema ?? []).map((k) => [k.key, k]));
@@ -253,11 +254,11 @@ export async function validateArtifact(files) {
 
   // Author-renderable widget sections (the flip): each carries a curated data context; a template
   // either places the section's DEFAULT ISLAND (which owns rendering + empty states) or renders
-  // the data itself — in which case both directions are proven behaviourally (the worship
+  // the data itself, in which case both directions are proven behaviourally (the worship
   // pattern): the populated fixture's sentinel must appear, and the EMPTY context must render it
-  // away (derive or omit — nothing invented, nothing dangling).
+  // away (derive or omit, nothing invented, nothing dangling).
   // Sentinels are DERIVED from the canonical fixtures (the first item's display field), never
-  // hardcoded — the fixture data is free to become richer without touching a proof, and a proof
+  // hardcoded, the fixture data is free to become richer without touching a proof, and a proof
   // can never drift from the data it renders.
   const sentinelOf = (type, dataKey, field) =>
     (contextContract.fixtures.sections?.[type]?.[dataKey] ?? [])[0]?.[field] ?? null;
@@ -270,7 +271,31 @@ export async function validateArtifact(files) {
     locations: { island: null, dataKey: 'locations', sentinel: sentinelOf('locations', 'locations', 'name') }
   };
 
-  // 2–4. Sections: catalogue membership, parse, fixture renders.
+  // 2b. Compositions (site editor stage 4): each page must be a supported page, each type a
+  // supported section the catalogue assigns to that page, listed once, with a role.
+  const compositions = manifest?.compositions ?? {};
+  for (const [page, entries] of Object.entries(compositions)) {
+    if (!(manifest?.supports?.pages ?? []).includes(page)) {
+      errors.push(`compositions.${page}: not in supports.pages`);
+      continue;
+    }
+    const seen = new Set();
+    for (const entry of entries ?? []) {
+      const type = entry?.type;
+      if (!(manifest?.supports?.sections ?? []).includes(type)) {
+        errors.push(`compositions.${page}: '${type}' is not in supports.sections`);
+        continue;
+      }
+      const catalogueEntry = catalogueByType.get(type);
+      if (catalogueEntry && !(catalogueEntry.pages ?? []).includes(page)) {
+        errors.push(`compositions.${page}: '${type}' is not a ${page} page section in the catalogue`);
+      }
+      if (seen.has(type)) errors.push(`compositions.${page}: '${type}' is listed twice`);
+      seen.add(type);
+    }
+  }
+
+  // 2-4. Sections: catalogue membership, parse, fixture renders.
   for (const type of manifest?.supports?.sections ?? []) {
     const entry = catalogueByType.get(type);
     if (!entry) {
@@ -286,7 +311,7 @@ export async function validateArtifact(files) {
     try {
       parsed = liquid.parse(read(file));
     } catch (e) {
-      errors.push(`section '${type}': does not parse under the dialect — ${e.message}`);
+      errors.push(`section '${type}': does not parse under the dialect, ${e.message}`);
       continue;
     }
     // Widget-section proof (independent of the minimal/sample loop): island placed → the island
@@ -307,8 +332,8 @@ export async function validateArtifact(files) {
           if (widget.sentinel && !populated.includes(widget.sentinel)) {
             errors.push(
               widget.island
-                ? `section '${type}': neither places the ${widget.island} island nor renders the ${widget.dataKey} context — render the data (the fixture's "${widget.sentinel}" must appear) or place the island`
-                : `section '${type}': does not render the ${widget.dataKey} context — the fixture's "${widget.sentinel}" must appear`
+                ? `section '${type}': neither places the ${widget.island} island nor renders the ${widget.dataKey} context, render the data (the fixture's "${widget.sentinel}" must appear) or place the island`
+                : `section '${type}': does not render the ${widget.dataKey} context, the fixture's "${widget.sentinel}" must appear`
             );
           }
           const empty = await liquid.render(parsed, {
@@ -318,14 +343,14 @@ export async function validateArtifact(files) {
             [widget.dataKey]: []
           });
           if (widget.sentinel && empty.includes(widget.sentinel)) {
-            errors.push(`section '${type}': still shows fixture content with an empty ${widget.dataKey} — content must come from the context`);
+            errors.push(`section '${type}': still shows fixture content with an empty ${widget.dataKey}, content must come from the context`);
           }
           if (/\bundefined\b|\bnull\b/.test(empty.replace(/data-[a-z-]+="[^"]*"/g, ''))) {
-            errors.push(`section '${type}': renders 'undefined'/'null' literals when ${widget.dataKey} is empty — guard the empty case (derive or omit)`);
+            errors.push(`section '${type}': renders 'undefined'/'null' literals when ${widget.dataKey} is empty, guard the empty case (derive or omit)`);
           }
         }
       } catch (e) {
-        errors.push(`section '${type}': failed rendering the ${widget.dataKey} context fixtures — ${e.message}`);
+        errors.push(`section '${type}': failed rendering the ${widget.dataKey} context fixtures, ${e.message}`);
       }
     }
     for (const fixtureName of ['minimal', 'sample']) {
@@ -359,45 +384,48 @@ export async function validateArtifact(files) {
         }
         for (const part of splitIslandParts(html)) {
           if (part.island === CONTENT_SLOT) {
-            errors.push(`section '${type}': uses {% content %} — that tag is layout-only`);
+            errors.push(`section '${type}': uses {% content %}, that tag is layout-only`);
           } else if (part.island) {
             placedIslands.add(part.island);
           }
         }
       } catch (e) {
-        errors.push(`section '${type}': failed rendering the ${fixtureName} fixture — ${e.message}`);
+        errors.push(`section '${type}': failed rendering the ${fixtureName} fixture, ${e.message}`);
       }
     }
   }
 
   // Hero-imagery honesty, checked BEHAVIOURALLY (the worship pattern). The homeHero sample
   // fixture carries photographs whose data URIs embed a quote-free marker that survives HTML
-  // escaping, so "does the rendered hero display the tenant's photos?" is a substring check —
+  // escaping, so "does the rendered hero display the tenant's photos?" is a substring check,
   // and with several photos, placing the hero_carousel island IS displaying them (the island
   // renders the slides at runtime). The single-photo path is proven separately: images[0] must
   // appear directly. Declaration and behaviour must agree; the choosers badge photo-led tenants
   // by supports.heroImagery. Legacy imageUrl-only renderers never match (the fixture's photos
-  // ride `images`), so they pass undeclared — they just don't earn the badge.
+  // ride `images`), so they pass undeclared, they just don't earn the badge.
   {
     const declaresHero = manifest?.supports?.heroImagery === true;
     if (declaresHero && !(manifest?.supports?.sections ?? []).includes('homeHero')) {
-      errors.push('manifest: supports.heroImagery requires the homeHero section — the photographs live on it');
+      errors.push('manifest: supports.heroImagery requires the homeHero section, the photographs live on it');
     } else if (homeHeroMultiShows !== null) {
       if (declaresHero && !homeHeroMultiShows) {
         errors.push('homeHero: manifest declares supports.heroImagery but the rendered section neither displays the images fixture nor places the hero_carousel island');
       }
       if (declaresHero && !homeHeroSingleShows) {
-        errors.push('homeHero: supports.heroImagery must render a SINGLE photograph directly (images[0], treated, never raw) — the carousel island only covers 2+');
+        errors.push('homeHero: supports.heroImagery must render a SINGLE photograph directly (images[0], treated, never raw), the carousel island only covers 2+');
       }
       if (!declaresHero && (homeHeroMultiShows || homeHeroSingleShows)) {
-        errors.push('homeHero: renders the hero photographs but the manifest does not declare supports.heroImagery — declare it so the choosers can badge it');
+        errors.push('homeHero: renders the hero photographs but the manifest does not declare supports.heroImagery, declare it so the choosers can badge it');
       }
     }
   }
 
   // 7. Layout (when declared): parse + render the layout fixture + exactly one content slot.
   if (manifest?.supports?.worship && !manifest?.supports?.layout) {
-    errors.push('manifest: supports.worship requires supports.layout — the worship rail is layout chrome');
+    errors.push('manifest: supports.worship requires supports.layout, the worship rail is layout chrome');
+  }
+  if (manifest?.supports?.navigationHighlights && !manifest?.supports?.layout) {
+    errors.push('manifest: supports.navigationHighlights requires supports.layout, highlights belong to navigation chrome');
   }
   if (manifest?.supports?.layout) {
     if (!has('layout.liquid')) {
@@ -407,7 +435,7 @@ export async function validateArtifact(files) {
       try {
         parsedLayout = liquid.parse(read('layout.liquid'));
       } catch (e) {
-        errors.push(`layout: does not parse under the dialect — ${e.message}`);
+        errors.push(`layout: does not parse under the dialect, ${e.message}`);
       }
       if (parsedLayout) {
         try {
@@ -429,11 +457,22 @@ export async function validateArtifact(files) {
             errors.push(`layout: must contain exactly one {% content %} slot (found ${contentSlots})`);
           }
           if (!layoutIslands.includes('member_menu')) {
-            warnings.push("layout: no {% island 'member_menu' %} — member sign-in will be unreachable on tenants that allow sign-ups; place it in your header");
+            warnings.push("layout: no {% island 'member_menu' %}, member sign-in will be unreachable on tenants that allow sign-ups; place it in your header");
           }
 
+          const highlights = await proveNavigationHighlights((nav) => liquid.render(parsedLayout, {
+            site: { ...siteFx, nav },
+            brand: contextContract.fixtures.brand,
+            nav,
+            socials: contextContract.fixtures.layout.socials ?? [],
+            worship: contextContract.fixtures.layout.worship ?? null,
+            locale: contextContract.fixtures.layout.locale
+          }), manifest?.supports?.navigationHighlights);
+          errors.push(...highlights.errors);
+          warnings.push(...highlights.warnings);
+
           // Two-sided worship honesty, checked BEHAVIOURALLY: does the rendered layout actually
-          // display the worship fixture's times? Declaration and behaviour must agree — the
+          // display the worship fixture's times? Declaration and behaviour must agree, the
           // choosers steer worship-enabled tenants by supports.worship, so a false declaration
           // either hides their times (undeclared but rendered is fine to fix by declaring) or
           // promises a rail that never appears.
@@ -441,10 +480,10 @@ export async function validateArtifact(files) {
           if (worshipProbe) {
             const rendersWorship = html.includes(worshipProbe);
             if (manifest?.supports?.worship && !rendersWorship) {
-              errors.push('layout: manifest declares supports.worship but the rendered layout does not display the worship fixture times — the rail never appears');
+              errors.push('layout: manifest declares supports.worship but the rendered layout does not display the worship fixture times, the rail never appears');
             }
             if (!manifest?.supports?.worship && rendersWorship) {
-              errors.push('layout: renders the worship rail but the manifest does not declare supports.worship — declare it so the choosers can badge it');
+              errors.push('layout: renders the worship rail but the manifest does not declare supports.worship, declare it so the choosers can badge it');
             }
             if (manifest?.supports?.worship) {
               const nullHtml = await liquid.render(parsedLayout, {
@@ -457,17 +496,17 @@ export async function validateArtifact(files) {
                 locale: contextContract.fixtures.layout.locale
               });
               if (nullHtml.includes(worshipProbe)) {
-                errors.push('layout: worship rail content appears even when `worship` is null — always branch on it (tenants without a schedule must not see a rail)');
+                errors.push('layout: worship rail content appears even when `worship` is null, always branch on it (tenants without a schedule must not see a rail)');
               }
             }
           }
         } catch (e) {
-          errors.push(`layout: failed rendering the layout fixture — ${e.message}`);
+          errors.push(`layout: failed rendering the layout fixture, ${e.message}`);
         }
       }
     }
   } else if (has('layout.liquid')) {
-    warnings.push('layout.liquid present but manifest.supports.layout is not true — it will be ignored');
+    warnings.push('layout.liquid present but manifest.supports.layout is not true, it will be ignored');
   }
 
   // 8. Page templates (when declared): file exists, parses, renders the page's data fixture.
@@ -486,20 +525,20 @@ export async function validateArtifact(files) {
     try {
       parsedPage = liquid.parse(read(pageFile));
     } catch (e) {
-      errors.push(`page template '${pageName}': does not parse under the dialect — ${e.message}`);
+      errors.push(`page template '${pageName}': does not parse under the dialect, ${e.message}`);
       continue;
     }
     try {
       const html = await liquid.render(parsedPage, { ...fixture, site: siteFx, brand: contextContract.fixtures.brand });
       for (const part of splitIslandParts(html)) {
         if (part.island === CONTENT_SLOT) {
-          errors.push(`page template '${pageName}': uses {% content %} — that tag is layout-only`);
+          errors.push(`page template '${pageName}': uses {% content %}, that tag is layout-only`);
         } else if (part.island) {
           placedIslands.add(part.island);
         }
       }
     } catch (e) {
-      errors.push(`page template '${pageName}': failed rendering the page fixture — ${e.message}`);
+      errors.push(`page template '${pageName}': failed rendering the page fixture, ${e.message}`);
     }
   }
 
@@ -513,18 +552,18 @@ export async function validateArtifact(files) {
     if (!allIslands.has(name)) {
       errors.push(`island '${name}': not in the platform island registry`);
     } else if (!availableIslands.has(name)) {
-      warnings.push(`island '${name}': registry status is 'planned' — it will render nothing until available`);
+      warnings.push(`island '${name}': registry status is 'planned', it will render nothing until available`);
     }
   }
 
   // 6. Theme.
   if (!has('assets/theme.css') || read('assets/theme.css').trim() === '') {
-    errors.push('assets/theme.css missing or empty — a template must ship its look');
+    errors.push('assets/theme.css missing or empty, a template must ship its look');
   }
 
   // 6b. Layout contract (contract/v1/layout.json). Platform pages render through the content SEAM
   // (.container / .full); a template STYLES those to place content, never a parallel content container.
-  // The rule is DATA — the seam token, the allowed selectors and the message all come from the contract
+  // The rule is DATA, the seam token, the allowed selectors and the message all come from the contract
   // file; this only implements the check KIND (a non-seam selector sizing its width off the token).
   {
     const css = has('assets/theme.css') ? read('assets/theme.css') : '';
@@ -552,7 +591,7 @@ export async function validateArtifact(files) {
   }
 
   // Open enums, proven survivable (content model v1 discipline 2): a template whose footprint
-  // reads site.content.events must survive a registration mode it has never heard of — new modes
+  // reads site.content.events must survive a registration mode it has never heard of, new modes
   // WILL arrive within the major. No throw, and no undefined/null literal leaking into markup.
   if (contentAnalysis.footprint.includes('content.events')) {
     const futureEvent = {
@@ -573,10 +612,10 @@ export async function validateArtifact(files) {
           site: doctored
         });
         if (/\bundefined\b|\bnull\b/.test(html.replace(/data-[a-z-]+="[^"]*"/g, ''))) {
-          errors.push(`section '${type}': renders 'undefined'/'null' literals for an unknown event registrationMode — the enum is OPEN, branch on the modes you style and fall back for the rest`);
+          errors.push(`section '${type}': renders 'undefined'/'null' literals for an unknown event registrationMode, the enum is OPEN, branch on the modes you style and fall back for the rest`);
         }
       } catch (e) {
-        errors.push(`section '${type}': failed rendering an unknown event registrationMode — the enum is OPEN and new modes will arrive (${e.message})`);
+        errors.push(`section '${type}': failed rendering an unknown event registrationMode, the enum is OPEN and new modes will arrive (${e.message})`);
       }
     }
   }

package/starter/manifest.json

@@ -5,6 +5,7 @@
   "label": "Starter",
   "description": "The reference template for the Port60 dialect, the developer docs' worked example and the base to copy when building your own. 1.1.0 adds the layout slot: the template owns the header, navigation and footer chrome.",
   "supports": {
+    "navigationHighlights": false,
     "pages": [
       "home",
       "about"
@@ -37,6 +38,44 @@
       "volunteer"
     ]
   },
+  "compositions": {
+    "home": [
+      {
+        "type": "homeHero",
+        "role": "core"
+      },
+      {
+        "type": "campaigns",
+        "role": "recommended"
+      },
+      {
+        "type": "impactMap",
+        "role": "optional"
+      },
+      {
+        "type": "cta",
+        "role": "recommended"
+      }
+    ],
+    "about": [
+      {
+        "type": "hero",
+        "role": "core"
+      },
+      {
+        "type": "values",
+        "role": "recommended"
+      },
+      {
+        "type": "people",
+        "role": "optional"
+      },
+      {
+        "type": "cta",
+        "role": "recommended"
+      }
+    ]
+  },
   "settings": {
     "schema": [
       {