ferst-core 0.7.6 → 0.7.8

package/bin/ferst-modules.mjs

@@ -0,0 +1,107 @@
+#!/usr/bin/env node
+// ferst-modules — what this site has from its organisation's modules in the Ferst portal:
+// the forms it can place and the calendar it shows. Run it in a client repo root:
+//
+//   npx --no-install ferst-modules                 # the site named in ferst-site.json
+//   npx --no-install ferst-modules --site <address> # or ask by the site's address
+//   npx --no-install ferst-modules --json          # the raw answer
+//
+// Forms and calendars live in the portal, never in the repo: place a form with a
+// `{ "type": "form", "form": "<id>" }` block, and show the calendar by setting
+// calendarSettings.embedUrl to the address printed here.
+import { readFileSync, realpathSync } from 'node:fs';
+import { resolve } from 'node:path';
+import { pathToFileURL } from 'node:url';
+import { resolveGitBase } from './cms-config.mjs';
+
+/**
+ * True when THIS file is run as a CLI (not imported). Each bin needs its own copy:
+ * `import.meta.url` is per file, so one borrowed from another bin only ever matches that
+ * bin (0.7.7 printed nothing). Handles npm's `node_modules/.bin` symlink via realpath.
+ */
+export function isDirectInvocation(argv1) {
+  if (!argv1) return false;
+  if (import.meta.url === pathToFileURL(argv1).href) return true;
+  try {
+    return import.meta.url === pathToFileURL(realpathSync(argv1)).href;
+  } catch {
+    return false;
+  }
+}
+
+/** The site to ask about: `--site <ref>`, else ferst-site.json's siteId, else null. */
+export function moduleRef(argv, siteMeta) {
+  const i = argv.indexOf('--site');
+  if (i !== -1 && argv[i + 1]) return argv[i + 1];
+  return siteMeta && typeof siteMeta.siteId === 'string' && siteMeta.siteId ? siteMeta.siteId : null;
+}
+
+/** A readable summary of GET /sites/:ref/modules. Pure — unit-tested. */
+export function formatModules(data) {
+  const out = [];
+  out.push(`Site: ${data.site.address ?? data.site.id} (${data.site.id})`, '');
+
+  out.push('Forms');
+  if (!data.modules.forms) out.push('  The Forms module is off for this site.');
+  else if (data.forms.length === 0) out.push('  No forms yet. They are created in the portal (Forms).');
+  for (const f of data.forms) {
+    out.push(`  ${f.name}`);
+    out.push(`    place it with: { "type": "form", "form": "${f.id}" }`);
+    out.push(`    fields: ${f.fields.map((x) => `${x.label}${x.required ? ' *' : ''}`).join(', ') || '(none)'}`);
+    out.push(`    button: ${f.submitLabel}`);
+  }
+  out.push('');
+
+  out.push('Events');
+  if (!data.events) out.push('  The Events module is off for this site.');
+  else {
+    out.push(`  calendarSettings.embedUrl = ${data.events.embedUrl}`);
+    out.push(
+      data.events.calendars.length
+        ? `  shows: ${data.events.calendars.map((c) => c.name).join(', ')}`
+        : '  No calendars chosen yet. They are connected in the portal (Events).',
+    );
+  }
+  return out.join('\n');
+}
+
+function readSiteMeta(cwd) {
+  try {
+    return JSON.parse(readFileSync(resolve(cwd, 'ferst-site.json'), 'utf8'));
+  } catch {
+    return null;
+  }
+}
+
+async function main() {
+  const argv = process.argv.slice(2);
+  const ref = moduleRef(argv, readSiteMeta(process.cwd()));
+  if (!ref) {
+    console.error('ferst-modules: no site to ask about. Pass --site <your site address> (e.g. --site example.pages.dev), or add "siteId" to ferst-site.json.');
+    process.exit(2);
+  }
+  const base = resolveGitBase();
+  const url = `${base}/sites/${encodeURIComponent(ref)}/modules`;
+  let res;
+  try {
+    res = await fetch(url, { headers: { Accept: 'application/json' } });
+  } catch (e) {
+    console.error(`ferst-modules: couldn't reach the Ferst platform at ${url}: ${e instanceof Error ? e.message : e}`);
+    process.exit(1);
+  }
+  if (res.status === 404) {
+    console.error(`ferst-modules: the platform doesn't know a site "${ref}". Check the address, or ask the core team (a core-request issue).`);
+    process.exit(1);
+  }
+  if (!res.ok) {
+    console.error(`ferst-modules: the platform answered ${res.status} for ${url}.`);
+    process.exit(1);
+  }
+  const data = await res.json();
+  console.log(argv.includes('--json') ? JSON.stringify(data, null, 2) : formatModules(data));
+}
+
+// Run when invoked directly as a bin — including via npm's node_modules/.bin symlink.
+if (isDirectInvocation(process.argv[1])) {
+  main();
+}

package/components/BlockRenderer.astro

@@ -1,117 +1,125 @@
----
-/**
- * Renders an ordered list of blocks by mapping each block's `type` to its
- * component via a registry. Disabled blocks are skipped. The registry is typed
- * `Record<BlockType, …>`, so adding a block type to the union without a renderer
- * here is a compile error — no silent `undefined` component at runtime.
- */
-import type { Block, BlockType } from '../content/blocks';
-import Heading from './blocks/Heading.astro';
-import Prose from './blocks/Prose.astro';
-import ImageBlock from './blocks/ImageBlock.astro';
-import ButtonBlock from './blocks/ButtonBlock.astro';
-import Quote from './blocks/Quote.astro';
-import Divider from './blocks/Divider.astro';
-import Spacer from './blocks/Spacer.astro';
-import Badge from './blocks/Badge.astro';
-import Stat from './blocks/Stat.astro';
-import List from './blocks/List.astro';
-import Section from './blocks/Section.astro';
-import Grid from './blocks/Grid.astro';
-import Stack from './blocks/Stack.astro';
-import Hero from './recipes/Hero.astro';
-import FeatureCards from './recipes/FeatureCards.astro';
-import Cta from './recipes/Cta.astro';
-import Faq from './recipes/Faq.astro';
-import Gallery from './recipes/Gallery.astro';
-import Testimonial from './recipes/Testimonial.astro';
-import ContactForm from './recipes/ContactForm.astro';
-import Accordion from './recipes/Accordion.astro';
-import Tiles from './recipes/Tiles.astro';
-import Banner from './recipes/Banner.astro';
-import Stats from './recipes/Stats.astro';
-import Steps from './recipes/Steps.astro';
-import Pricing from './recipes/Pricing.astro';
-import Logos from './recipes/Logos.astro';
-import Tabs from './recipes/Tabs.astro';
-import Announcement from './recipes/Announcement.astro';
-import Bento from './recipes/Bento.astro';
-import Marquee from './recipes/Marquee.astro';
-import LatestPosts from './recipes/LatestPosts.astro';
-import MapEmbed from './recipes/MapEmbed.astro';
-import Table from './recipes/Table.astro';
-import Notice from './recipes/Notice.astro';
-import MediaCards from './recipes/MediaCards.astro';
-import ContactCard from './recipes/ContactCard.astro';
-import Locations from './recipes/Locations.astro';
-import Video from './recipes/Video.astro';
-import Documents from './recipes/Documents.astro';
-import LinkRow from './recipes/LinkRow.astro';
-import DocumentRecipe from './recipes/Document.astro';
-import Timetable from './recipes/Timetable.astro';
-import Contacts from './recipes/Contacts.astro';
-import MediaText from './recipes/MediaText.astro';
-
-interface Props {
-  blocks: Block[];
-}
-
-const { blocks } = Astro.props;
-
-const registry: Record<BlockType, any> = {
-  heading: Heading,
-  prose: Prose,
-  image: ImageBlock,
-  button: ButtonBlock,
-  quote: Quote,
-  divider: Divider,
-  spacer: Spacer,
-  badge: Badge,
-  stat: Stat,
-  list: List,
-  section: Section,
-  grid: Grid,
-  stack: Stack,
-  hero: Hero,
-  featureCards: FeatureCards,
-  cta: Cta,
-  faq: Faq,
-  gallery: Gallery,
-  testimonial: Testimonial,
-  contactForm: ContactForm,
-  accordion: Accordion,
-  tiles: Tiles,
-  banner: Banner,
-  stats: Stats,
-  steps: Steps,
-  pricing: Pricing,
-  logos: Logos,
-  tabs: Tabs,
-  announcement: Announcement,
-  bento: Bento,
-  marquee: Marquee,
-  latestPosts: LatestPosts,
-  mapEmbed: MapEmbed,
-  table: Table,
-  notice: Notice,
-  mediaCards: MediaCards,
-  contactCard: ContactCard,
-  locations: Locations,
-  video: Video,
-  documents: Documents,
-  linkRow: LinkRow,
-  document: DocumentRecipe,
-  timetable: Timetable,
-  contacts: Contacts,
-  mediaText: MediaText,
-};
----
-
-{
-  blocks
-    .filter((block) => block.enabled !== false)
-    .map((block) => {
-      const Component = registry[block.type];
-      return <Component {...block} />;
-    })
-}
+---
+/**
+ * Renders an ordered list of blocks by mapping each block's `type` to its
+ * component via a registry. Disabled blocks are skipped. The registry is typed
+ * `Record<BlockType, …>`, so adding a block type to the union without a renderer
+ * here is a compile error — no silent `undefined` component at runtime.
+ */
+import type { Block, BlockType } from '../content/blocks';
+import Heading from './blocks/Heading.astro';
+import Prose from './blocks/Prose.astro';
+import ImageBlock from './blocks/ImageBlock.astro';
+import ButtonBlock from './blocks/ButtonBlock.astro';
+import Quote from './blocks/Quote.astro';
+import Divider from './blocks/Divider.astro';
+import Spacer from './blocks/Spacer.astro';
+import Badge from './blocks/Badge.astro';
+import Stat from './blocks/Stat.astro';
+import List from './blocks/List.astro';
+import Section from './blocks/Section.astro';
+import Grid from './blocks/Grid.astro';
+import Stack from './blocks/Stack.astro';
+import Hero from './recipes/Hero.astro';
+import FeatureCards from './recipes/FeatureCards.astro';
+import Cta from './recipes/Cta.astro';
+import Faq from './recipes/Faq.astro';
+import Gallery from './recipes/Gallery.astro';
+import Testimonial from './recipes/Testimonial.astro';
+import ContactForm from './recipes/ContactForm.astro';
+import Form from './recipes/Form.astro';
+import Accordion from './recipes/Accordion.astro';
+import Tiles from './recipes/Tiles.astro';
+import Banner from './recipes/Banner.astro';
+import Stats from './recipes/Stats.astro';
+import Steps from './recipes/Steps.astro';
+import Pricing from './recipes/Pricing.astro';
+import Logos from './recipes/Logos.astro';
+import Tabs from './recipes/Tabs.astro';
+import Announcement from './recipes/Announcement.astro';
+import Bento from './recipes/Bento.astro';
+import Marquee from './recipes/Marquee.astro';
+import LatestPosts from './recipes/LatestPosts.astro';
+import MapEmbed from './recipes/MapEmbed.astro';
+import Table from './recipes/Table.astro';
+import Notice from './recipes/Notice.astro';
+import MediaCards from './recipes/MediaCards.astro';
+import ContactCard from './recipes/ContactCard.astro';
+import Locations from './recipes/Locations.astro';
+import Video from './recipes/Video.astro';
+import Documents from './recipes/Documents.astro';
+import LinkRow from './recipes/LinkRow.astro';
+import DocumentRecipe from './recipes/Document.astro';
+import Timetable from './recipes/Timetable.astro';
+import Contacts from './recipes/Contacts.astro';
+import MediaText from './recipes/MediaText.astro';
+
+interface Props {
+  blocks: Block[];
+}
+
+const { blocks } = Astro.props;
+
+const registry: Record<BlockType, any> = {
+  heading: Heading,
+  prose: Prose,
+  image: ImageBlock,
+  button: ButtonBlock,
+  quote: Quote,
+  divider: Divider,
+  spacer: Spacer,
+  badge: Badge,
+  stat: Stat,
+  list: List,
+  section: Section,
+  grid: Grid,
+  stack: Stack,
+  hero: Hero,
+  featureCards: FeatureCards,
+  cta: Cta,
+  faq: Faq,
+  gallery: Gallery,
+  testimonial: Testimonial,
+  contactForm: ContactForm,
+  form: Form,
+  accordion: Accordion,
+  tiles: Tiles,
+  banner: Banner,
+  stats: Stats,
+  steps: Steps,
+  pricing: Pricing,
+  logos: Logos,
+  tabs: Tabs,
+  announcement: Announcement,
+  bento: Bento,
+  marquee: Marquee,
+  latestPosts: LatestPosts,
+  mapEmbed: MapEmbed,
+  table: Table,
+  notice: Notice,
+  mediaCards: MediaCards,
+  contactCard: ContactCard,
+  locations: Locations,
+  video: Video,
+  documents: Documents,
+  linkRow: LinkRow,
+  document: DocumentRecipe,
+  timetable: Timetable,
+  contacts: Contacts,
+  mediaText: MediaText,
+};
+---
+
+{
+  blocks
+    .filter((block) => block.enabled !== false)
+    .map((block) => {
+      const Component = registry[block.type];
+      // A block's own `align` sets the alignment cascade for everything inside it. The
+      // wrapper is `display: contents`, so it adds no box and the layout is unchanged;
+      // heading / banner / section handle their own `align`.
+      const own = block.type === 'heading' || block.type === 'banner' || block.type === 'section';
+      return block.align && !own
+        ? <div class="block-align" data-content-align={block.align}><Component {...block} /></div>
+        : <Component {...block} />;
+    })
+}

package/components/Button.astro

@@ -159,7 +159,7 @@ const {
     align-items: center;
     justify-content: center;
     margin-top: auto;
-    align-self: flex-start;
+    align-self: var(--content-self, flex-start);
     background: var(--gold);
     color: var(--text-light);
     border: none;

package/components/Card.astro

@@ -27,6 +27,8 @@ const { as: Tag = 'div', hover = true, padding = '1.25rem 1.5rem', overflow = 'h
     padding: var(--card-padding);
     display: flex;
     flex-direction: column;
+    /* Children follow the page / section alignment (Base: --content-items). */
+    align-items: var(--content-items, stretch);
   }
 
   .card--hover {

package/components/ProseParts.astro

@@ -0,0 +1,26 @@
+---
+/**
+ * ProseParts — renders prose text as paragraphs and lists (lib/prose: blank lines →
+ * paragraphs, `- ` / `1. ` lines → lists, inline links / bold / italic, all escaped).
+ * The one place this markup lives, shared by prose, document, accordion, mediaText and
+ * table intros, so a fix lands everywhere at once.
+ *
+ * Note for callers: these elements carry THIS component's style scope, so a parent styles
+ * them through its own wrapper with `:global(p)`, `:global(ul)` etc.
+ */
+import { proseParts } from '../lib/prose';
+
+interface Props {
+  text: string | undefined | null;
+  /** Optional class on each paragraph / list (e.g. a table intro's). */
+  class?: string;
+}
+const { text, class: cls } = Astro.props;
+const parts = proseParts(text);
+---
+
+{parts.map((part) =>
+  part.kind === 'p' ? <p class={cls} set:html={part.html} />
+  : part.kind === 'ul' ? <ul class={cls}>{part.items.map((x) => <li set:html={x} />)}</ul>
+  : <ol class={cls}>{part.items.map((x) => <li set:html={x} />)}</ol>
+)}

package/components/SiteHeader.astro

@@ -1026,6 +1026,29 @@ const primaryNavLongestMatch = Math.max(-1, ...primaryNavMatchLengths);
     window.addEventListener('scroll', onScrollCompact, { passive: true });
   }
 
+  // The header's full height, published as --header-h on <html> so a full-screen opener
+  // fills the screen BELOW the sticky header (Hero size "screen"). Only the full-size header
+  // counts: while it's condensed on scroll, or animating between sizes, the last full value
+  // stays, so the opener never resizes as the page scrolls.
+  let headerAnimating = false;
+  function syncHeaderHeight() {
+    if (!siteHeader || headerAnimating || siteHeader.classList.contains('is-compact')) return;
+    document.documentElement.style.setProperty('--header-h', `${siteHeader.getBoundingClientRect().height}px`);
+  }
+  if (siteHeader) {
+    siteHeader.addEventListener('transitionrun', (e) => {
+      if (e.target === siteHeader && e.propertyName === 'height') headerAnimating = true;
+    });
+    const settled = (e: TransitionEvent) => {
+      if (e.target !== siteHeader || e.propertyName !== 'height') return;
+      headerAnimating = false;
+      syncHeaderHeight();
+    };
+    siteHeader.addEventListener('transitionend', settled);
+    siteHeader.addEventListener('transitioncancel', settled);
+    syncHeaderHeight();
+  }
+
   // Crowding (#11): on desktop the menu is centred on the header. When the site name (or
   // the right-hand buttons) would run into it, give the menu its own row instead. Decided
   // by measuring the real layout, so it adapts to any name and any number of links.
@@ -1048,6 +1071,7 @@ const primaryNavLongestMatch = Math.max(-1, ...primaryNavMatchLengths);
     const queue = () => { if (!queued) { queued = true; requestAnimationFrame(() => { queued = false; fitCheck(); }); } };
     if (brand) new ResizeObserver(queue).observe(brand);
     new ResizeObserver(queue).observe(siteHeader);
+    new ResizeObserver(syncHeaderHeight).observe(siteHeader);
     desktop.addEventListener('change', queue);
     document.fonts?.ready.then(queue);
     fitCheck();

package/components/blocks/Prose.astro

@@ -1,5 +1,5 @@
 ---
-import { proseParts } from '../../lib/prose';
+import ProseParts from '../ProseParts.astro';
 interface Props {
   text: string;
   variant?: 'body' | 'lead';
@@ -7,40 +7,35 @@ interface Props {
 const { text, variant = 'body' } = Astro.props;
 // Blank lines separate paragraphs; `- ` / `1. ` lines make lists; links, bold and
 // italic are rendered safely (lib/prose.ts → inlineMarkdown).
-const parts = proseParts(text);
 ---
 
 <div class="b-prose" data-variant={variant === 'lead' ? 'lead' : undefined}>
-  {parts.map((part) =>
-    part.kind === 'p' ? <p set:html={part.html} />
-    : part.kind === 'ul' ? <ul>{part.items.map((i) => <li set:html={i} />)}</ul>
-    : <ol>{part.items.map((i) => <li set:html={i} />)}</ol>
-  )}
+  <ProseParts text={text} />
 </div>
 
 <style>
   .b-prose {
     color: var(--fg);
   }
-  .b-prose p,
-  .b-prose ul,
-  .b-prose ol {
+  .b-prose :global(p),
+  .b-prose :global(ul),
+  .b-prose :global(ol) {
     margin: 0 0 1rem;
     line-height: 1.7;
     max-width: var(--max);
   }
-  .b-prose ul,
-  .b-prose ol {
+  .b-prose :global(ul),
+  .b-prose :global(ol) {
     padding-inline-start: 1.4em;
   }
-  .b-prose li + li {
+  .b-prose :global(li + li) {
     margin-top: 0.25rem;
   }
-  .b-prose > :last-child {
+  .b-prose > :global(:last-child) {
     margin-bottom: 0;
   }
   /* The page's introduction: larger, quieter, a narrower measure. */
-  .b-prose[data-variant='lead'] p {
+  .b-prose[data-variant='lead'] :global(p) {
     font-size: clamp(1.125rem, 1.6vw, 1.3125rem);
     line-height: 1.6;
     color: var(--muted);
@@ -55,10 +50,10 @@ const parts = proseParts(text);
      section is centred (or end-aligned) re-anchor it so the text reads as
      deliberately centred, not centred inside a left column. Text-align itself
      is inherited from the content-align cascade. */
-  :global([data-content-align='center']) .b-prose > * {
+  :global([data-content-align='center']) .b-prose > :global(*) {
     margin-inline: auto;
   }
-  :global([data-content-align='end']) .b-prose > * {
+  :global([data-content-align='end']) .b-prose > :global(*) {
     margin-inline-start: auto;
   }
 </style>