@cogenta/theme-docs 0.3.2 → 0.5.3

package/dist/src/render/blocks/gallery.d.ts

@@ -1,10 +1,14 @@
 import type { GalleryBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
 /**
- * The carousel ships **no JavaScript**. It is a scroll-snapping list, which
- * gives touch swiping, trackpad scrolling and — because the list is
- * focusable and labelled — arrow-key scrolling, with none of the failure
- * modes of a scripted carousel.
+ * A set of screenshots or diagrams, each in the hairline frame.
+ *
+ * - `grid`: two or three columns, every frame cropped to the same 16:10 so
+ *   the rows stay level.
+ * - `masonry`: three columns that keep each picture's own proportions.
+ * - `carousel`: one row that scrolls sideways inside the container, with
+ *   scroll snapping and no script, named so a screen reader announces it as
+ *   a scrollable group.
  */
 export declare function renderGallery(block: GalleryBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=gallery.d.ts.map

package/dist/src/render/blocks/gallery.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/gallery.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAEnF;;;;;GAKG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CA6BlF"}
+{"version":3,"file":"gallery.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/gallery.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAGnF;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CA4BlF"}

package/dist/src/render/blocks/gallery.js

@@ -1,19 +1,25 @@
 import { h, image } from '@cogenta/theme-kit';
+import { section } from '../layout.js';
 /**
- * The carousel ships **no JavaScript**. It is a scroll-snapping list, which
- * gives touch swiping, trackpad scrolling and — because the list is
- * focusable and labelled — arrow-key scrolling, with none of the failure
- * modes of a scripted carousel.
+ * A set of screenshots or diagrams, each in the hairline frame.
+ *
+ * - `grid`: two or three columns, every frame cropped to the same 16:10 so
+ *   the rows stay level.
+ * - `masonry`: three columns that keep each picture's own proportions.
+ * - `carousel`: one row that scrolls sideways inside the container, with
+ *   scroll snapping and no script, named so a screen reader announces it as
+ *   a scrollable group.
  */
 export function renderGallery(block, ctx) {
-    const items = h('ul', { class: 'cg-gallery__items' }, block.items.map((item) => h('li', { class: 'cg-gallery__item' }, image(ctx, item.media, { sizes: '(min-width: 45rem) 20rem, 60vw' }))));
-    return h('section', { class: 'cg-block cg-gallery', 'data-block': 'gallery', 'data-layout': block.layout }, block.layout === 'carousel'
-        ? h('div', {
-            class: 'cg-gallery__viewport',
-            role: 'region',
-            'aria-label': ctx.t('gallery.carousel'),
-            tabindex: '0',
-        }, items)
-        : items);
+    const carousel = block.layout === 'carousel';
+    return section('div', 'gallery', 'cd-gallery', { 'data-layout': block.layout, 'data-count': String(Math.min(block.items.length, 6)) }, 'div', h('ul', {
+        class: 'cd-gallery__items',
+        ...(carousel
+            ? { role: 'region', 'aria-label': ctx.t('gallery.carousel'), tabindex: 0 }
+            : {}),
+    }, block.items.map((item) => h('li', { class: 'cd-gallery__item cd-frame' }, image(ctx, item.media, {
+        className: 'cd-gallery__image cd-frame__image',
+        sizes: '(min-width: 64rem) 25rem, (min-width: 40rem) 50vw, 100vw',
+    })))));
 }
 //# sourceMappingURL=gallery.js.map

package/dist/src/render/blocks/gallery.js.map

@@ -1 +1 @@
-{"version":3,"file":"gallery.js","sourceRoot":"","sources":["../../../../src/render/blocks/gallery.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AAEnF;;;;;GAKG;AACH,MAAM,UAAU,aAAa,CAAC,KAAmB,EAAE,GAAkB;IACnE,MAAM,KAAK,GAAG,CAAC,CACb,IAAI,EACJ,EAAE,KAAK,EAAE,mBAAmB,EAAE,EAC9B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CACvB,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAC7B,KAAK,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,gCAAgC,EAAE,CAAC,CACpE,CACF,CACF,CAAA;IAED,OAAO,CAAC,CACN,SAAS,EACT,EAAE,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,KAAK,CAAC,MAAM,EAAE,EACtF,KAAK,CAAC,MAAM,KAAK,UAAU;QACzB,CAAC,CAAC,CAAC,CACC,KAAK,EACL;YACE,KAAK,EAAE,sBAAsB;YAC7B,IAAI,EAAE,QAAQ;YACd,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC,kBAAkB,CAAC;YACvC,QAAQ,EAAE,GAAG;SACd,EACD,KAAK,CACN;QACH,CAAC,CAAC,KAAK,CACV,CAAA;AACH,CAAC"}
+{"version":3,"file":"gallery.js","sourceRoot":"","sources":["../../../../src/render/blocks/gallery.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AACnF,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAEtC;;;;;;;;;GASG;AACH,MAAM,UAAU,aAAa,CAAC,KAAmB,EAAE,GAAkB;IACnE,MAAM,QAAQ,GAAG,KAAK,CAAC,MAAM,KAAK,UAAU,CAAA;IAC5C,OAAO,OAAO,CACZ,KAAK,EACL,SAAS,EACT,YAAY,EACZ,EAAE,aAAa,EAAE,KAAK,CAAC,MAAM,EAAE,YAAY,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,EACtF,KAAK,EACL,CAAC,CACC,IAAI,EACJ;QACE,KAAK,EAAE,mBAAmB;QAC1B,GAAG,CAAC,QAAQ;YACV,CAAC,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,YAAY,EAAE,GAAG,CAAC,CAAC,CAAC,kBAAkB,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE;YAC1E,CAAC,CAAC,EAAE,CAAC;KACR,EACD,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CACvB,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,2BAA2B,EAAE,EACtC,KAAK,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE;QACrB,SAAS,EAAE,mCAAmC;QAC9C,KAAK,EAAE,0DAA0D;KAClE,CAAC,CACH,CACF,CACF,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/hero.d.ts

@@ -1,16 +1,19 @@
 import type { HeroBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
 /**
- * The hero carries the page's `h1` (contract B: `headingLevel: 'h1'`), so
- * `renderPage` relies on it to avoid emitting a second one.
+ * The opening of a documentation site: a clear statement and the search.
  *
- * A reference-docs hero: copy on the left, a decorative search-looking
- * prompt right under the actions (purely presentational — `aria-hidden`,
- * no `<input>`, no `<form>` — this theme ships zero client JavaScript and a
- * fake control that looked operable would be a worse failure than no
- * control at all), and an optional small illustration on the right rather
- * than a full-bleed image wash, matching the information-dense register the
- * aesthetic direction asks for.
+ * Left-aligned on the grid, never centred. An eyebrow, when there is one, is
+ * a quiet line above the title (a product and its version), never a badge.
+ * The title is short and set large on the first eight columns, the subtitle
+ * says in two sentences what the documentation covers, and under it the
+ * search field at its large size: a real `GET /search` form, the first thing
+ * a reader of documentation reaches for. The actions follow, the primary one
+ * as the small teal control and the rest as underlined arrow links.
+ *
+ * Media, when an editor adds one, is a diagram or a screenshot on the last
+ * five columns in the hairline frame, loaded eagerly: it is above the fold by
+ * construction. Nothing decorative stands in for it when there is none.
  */
 export declare function renderHero(block: HeroBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=hero.d.ts.map

package/dist/src/render/blocks/hero.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"hero.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/hero.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAGL,KAAK,WAAW,EAIhB,KAAK,aAAa,EAEnB,MAAM,oBAAoB,CAAA;AAE3B;;;;;;;;;;;GAWG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAoC5E"}
+{"version":3,"file":"hero.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/hero.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAChD,OAAO,EAAc,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAI/F;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAoC5E"}

package/dist/src/render/blocks/hero.js

@@ -1,28 +1,30 @@
-import { actionList, blockHeadingTag, h, heading, image, renderIcon, } from '@cogenta/theme-kit';
+import { actionList, h, image } from '@cogenta/theme-kit';
+import { optionalText } from '../layout.js';
+import { renderSearchForm } from '../search.js';
 /**
- * The hero carries the page's `h1` (contract B: `headingLevel: 'h1'`), so
- * `renderPage` relies on it to avoid emitting a second one.
+ * The opening of a documentation site: a clear statement and the search.
  *
- * A reference-docs hero: copy on the left, a decorative search-looking
- * prompt right under the actions (purely presentational — `aria-hidden`,
- * no `<input>`, no `<form>` — this theme ships zero client JavaScript and a
- * fake control that looked operable would be a worse failure than no
- * control at all), and an optional small illustration on the right rather
- * than a full-bleed image wash, matching the information-dense register the
- * aesthetic direction asks for.
+ * Left-aligned on the grid, never centred. An eyebrow, when there is one, is
+ * a quiet line above the title (a product and its version), never a badge.
+ * The title is short and set large on the first eight columns, the subtitle
+ * says in two sentences what the documentation covers, and under it the
+ * search field at its large size: a real `GET /search` form, the first thing
+ * a reader of documentation reaches for. The actions follow, the primary one
+ * as the small teal control and the rest as underlined arrow links.
+ *
+ * Media, when an editor adds one, is a diagram or a screenshot on the last
+ * five columns in the hairline frame, loaded eagerly: it is above the fold by
+ * construction. Nothing decorative stands in for it when there is none.
  */
 export function renderHero(block, ctx) {
-    const tag = blockHeadingTag('hero') ?? 'h1';
-    return h('section', { class: 'cg-block cg-hero', 'data-block': 'hero' }, h('div', { class: 'cg-hero__copy' }, block.eyebrow === undefined
-        ? null
-        : h('p', { class: 'cg-hero__eyebrow', 'data-field': 'eyebrow' }, block.eyebrow), heading(tag, { class: 'cg-hero__title', 'data-field': 'title' }, block.title), block.subtitle === undefined
-        ? null
-        : h('p', { class: 'cg-hero__subtitle', 'data-field': 'subtitle' }, block.subtitle), actionList(ctx, block.actions, ctx.t('hero.actions')), h('div', { class: 'cg-hero__search', 'aria-hidden': 'true' }, renderIcon('search', { className: 'cg-hero__search-icon' }), h('span', { class: 'cg-hero__search-text' }, 'Search the docs…'), h('kbd', { class: 'cg-hero__search-key' }, '/'))), block.media === undefined
+    const actions = actionList(ctx, block.actions, ctx.t('hero.actions'));
+    const media = block.media !== undefined;
+    return h('section', { class: 'cd-section cd-hero', 'data-block': 'hero', 'data-media': media ? 'true' : 'false' }, h('div', { class: 'cd-container cd-hero__inner' }, h('div', { class: 'cd-hero__copy' }, optionalText('p', 'cd-hero__eyebrow', block.eyebrow, { 'data-field': 'eyebrow' }), h('h1', { class: 'cd-hero__title', 'data-field': 'title' }, block.title), optionalText('p', 'cd-hero__subtitle', block.subtitle, { 'data-field': 'subtitle' }), h('div', { class: 'cd-hero__search' }, renderSearchForm(ctx.locale, 'cd-search-hero', 'large')), actions === null ? null : h('div', { class: 'cd-hero__actions' }, actions)), block.media === undefined
         ? null
-        : h('div', { class: 'cg-hero__panel' }, image(ctx, block.media, {
-            className: 'cg-hero__media',
+        : h('figure', { class: 'cd-hero__media cd-frame' }, image(ctx, block.media, {
+            className: 'cd-hero__image cd-frame__image',
             loading: 'eager',
-            sizes: '(min-width: 64rem) 32vw, 100vw',
-        })));
+            sizes: '(min-width: 64rem) 30rem, 100vw',
+        }))));
 }
 //# sourceMappingURL=hero.js.map

package/dist/src/render/blocks/hero.js.map

@@ -1 +1 @@
-{"version":3,"file":"hero.js","sourceRoot":"","sources":["../../../../src/render/blocks/hero.ts"],"names":[],"mappings":"AACA,OAAO,EACL,UAAU,EACV,eAAe,EAEf,CAAC,EACD,OAAO,EACP,KAAK,EAEL,UAAU,GACX,MAAM,oBAAoB,CAAA;AAE3B;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,UAAU,CAAC,KAAgB,EAAE,GAAkB;IAC7D,MAAM,GAAG,GAAG,eAAe,CAAC,MAAM,CAAC,IAAI,IAAI,CAAA;IAC3C,OAAO,CAAC,CACN,SAAS,EACT,EAAE,KAAK,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,EAAE,EACnD,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,eAAe,EAAE,EAC1B,KAAK,CAAC,OAAO,KAAK,SAAS;QACzB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,EACjF,OAAO,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,OAAO,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,EAC7E,KAAK,CAAC,QAAQ,KAAK,SAAS;QAC1B,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,UAAU,EAAE,EAAE,KAAK,CAAC,QAAQ,CAAC,EACpF,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,EACrD,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,iBAAiB,EAAE,aAAa,EAAE,MAAM,EAAE,EACnD,UAAU,CAAC,QAAQ,EAAE,EAAE,SAAS,EAAE,sBAAsB,EAAE,CAAC,EAC3D,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,EAAE,kBAAkB,CAAC,EAChE,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAAE,GAAG,CAAC,CAChD,CACF,EACD,KAAK,CAAC,KAAK,KAAK,SAAS;QACvB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAC3B,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,EAAE;YACtB,SAAS,EAAE,gBAAgB;YAC3B,OAAO,EAAE,OAAO;YAChB,KAAK,EAAE,gCAAgC;SACxC,CAAC,CACH,CACN,CAAA;AACH,CAAC"}
+{"version":3,"file":"hero.js","sourceRoot":"","sources":["../../../../src/render/blocks/hero.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AAC/F,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAC3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAA;AAE/C;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,UAAU,CAAC,KAAgB,EAAE,GAAkB;IAC7D,MAAM,OAAO,GAAG,UAAU,CAAC,GAAG,EAAE,KAAK,CAAC,OAAO,EAAE,GAAG,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAA;IACrE,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,KAAK,SAAS,CAAA;IAEvC,OAAO,CAAC,CACN,SAAS,EACT,EAAE,KAAK,EAAE,oBAAoB,EAAE,YAAY,EAAE,MAAM,EAAE,YAAY,EAAE,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE,EAC7F,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,6BAA6B,EAAE,EACxC,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,eAAe,EAAE,EAC1B,YAAY,CAAC,GAAG,EAAE,kBAAkB,EAAE,KAAK,CAAC,OAAO,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC,EACjF,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,YAAY,EAAE,OAAO,EAAE,EAAE,KAAK,CAAC,KAAK,CAAC,EACxE,YAAY,CAAC,GAAG,EAAE,mBAAmB,EAAE,KAAK,CAAC,QAAQ,EAAE,EAAE,YAAY,EAAE,UAAU,EAAE,CAAC,EACpF,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,gBAAgB,CAAC,GAAG,CAAC,MAAM,EAAE,gBAAgB,EAAE,OAAO,CAAC,CACxD,EACD,OAAO,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAAE,OAAO,CAAC,CAC3E,EACD,KAAK,CAAC,KAAK,KAAK,SAAS;QACvB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,QAAQ,EACR,EAAE,KAAK,EAAE,yBAAyB,EAAE,EACpC,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,EAAE;YACtB,SAAS,EAAE,gCAAgC;YAC3C,OAAO,EAAE,OAAO;YAChB,KAAK,EAAE,iCAAiC;SACzC,CAAC,CACH,CACN,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/logo-strip.d.ts

@@ -1,4 +1,10 @@
 import type { LogoStripBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
+/**
+ * A strip of wordmarks ("Runs in production at"): the caption on its own
+ * line above, then one row of marks at one height in grey, wrapping to three
+ * and then two to a row on smaller screens. A hairline above separates the
+ * strip from what precedes it.
+ */
 export declare function renderLogoStrip(block: LogoStripBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=logo-strip.d.ts.map

package/dist/src/render/blocks/logo-strip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"logo-strip.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/logo-strip.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAiB,MAAM,iBAAiB,CAAA;AACpE,OAAO,EAAE,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAgBnF,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAatF"}
+{"version":3,"file":"logo-strip.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/logo-strip.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAA;AACrD,OAAO,EAAE,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAGnF;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,cAAc,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAoBtF"}

package/dist/src/render/blocks/logo-strip.js

@@ -1,16 +1,12 @@
 import { h, image } from '@cogenta/theme-kit';
+import { optionalText, section } from '../layout.js';
 /**
- * `blocks@2.0` (RFC 0001). The lighter-weight "as seen in" row next to
- * `logos`: no per-logo name or link, so no accessible-name field to
- * require — each image's own alt text (set once, in the media library)
- * names it.
+ * A strip of wordmarks ("Runs in production at"): the caption on its own
+ * line above, then one row of marks at one height in grey, wrapping to three
+ * and then two to a row on smaller screens. A hairline above separates the
+ * strip from what precedes it.
  */
-function renderItem(item, _ctx) {
-    return h('li', { class: 'cg-logo-band__item' }, image(_ctx, item.media, { className: 'cg-logo-band__image', variant: { fit: 'contain' } }));
-}
 export function renderLogoStrip(block, ctx) {
-    return h('figure', { class: 'cg-block cg-logo-band', 'data-block': 'logoStrip' }, h('ul', { class: 'cg-logo-band__items' }, block.logos.map((item) => renderItem(item, ctx))), block.caption === undefined
-        ? null
-        : h('figcaption', { class: 'cg-logo-band__caption', 'data-field': 'caption' }, block.caption));
+    return section('div', 'logoStrip', 'cd-strip', { 'data-count': String(Math.min(block.logos.length, 6)) }, 'div', optionalText('p', 'cd-strip__caption', block.caption, { 'data-field': 'caption' }), h('ul', { class: 'cd-strip__items' }, block.logos.map((logo) => h('li', { class: 'cd-strip__item' }, image(ctx, logo.media, { className: 'cd-strip__image cd-mark', sizes: '9rem' })))));
 }
 //# sourceMappingURL=logo-strip.js.map

package/dist/src/render/blocks/logo-strip.js.map

@@ -1 +1 @@
-{"version":3,"file":"logo-strip.js","sourceRoot":"","sources":["../../../../src/render/blocks/logo-strip.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AAEnF;;;;;GAKG;AACH,SAAS,UAAU,CAAC,IAAmB,EAAE,IAAmB;IAC1D,OAAO,CAAC,CACN,IAAI,EACJ,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAC/B,KAAK,CAAC,IAAI,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,qBAAqB,EAAE,OAAO,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,CAAC,CAC3F,CAAA;AACH,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,KAAqB,EAAE,GAAkB;IACvE,OAAO,CAAC,CACN,QAAQ,EACR,EAAE,KAAK,EAAE,uBAAuB,EAAE,YAAY,EAAE,WAAW,EAAE,EAC7D,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAChC,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CACjD,EACD,KAAK,CAAC,OAAO,KAAK,SAAS;QACzB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CAAC,YAAY,EAAE,EAAE,KAAK,EAAE,uBAAuB,EAAE,YAAY,EAAE,SAAS,EAAE,EAAE,KAAK,CAAC,OAAO,CAAC,CAChG,CAAA;AACH,CAAC"}
+{"version":3,"file":"logo-strip.js","sourceRoot":"","sources":["../../../../src/render/blocks/logo-strip.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AACnF,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAEpD;;;;;GAKG;AACH,MAAM,UAAU,eAAe,CAAC,KAAqB,EAAE,GAAkB;IACvE,OAAO,OAAO,CACZ,KAAK,EACL,WAAW,EACX,UAAU,EACV,EAAE,YAAY,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,EACzD,KAAK,EACL,YAAY,CAAC,GAAG,EAAE,mBAAmB,EAAE,KAAK,CAAC,OAAO,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC,EAClF,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CACvB,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAC3B,KAAK,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,yBAAyB,EAAE,KAAK,EAAE,MAAM,EAAE,CAAC,CAChF,CACF,CACF,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/logos.d.ts

@@ -1,4 +1,14 @@
 import type { LogosBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
+/**
+ * Named organisations (the companies running the product, the platforms it
+ * integrates with) as a ruled grid: hairlines between cells, each wordmark in
+ * grey at one height, linked when the block gives an address. The
+ * organisation's name is the image's accessible name when the media library
+ * has no alt text.
+ *
+ * Wordmarks are shown in grey in light and inverted in dark, so a logo drawn
+ * in dark ink stays legible on the dark ground.
+ */
 export declare function renderLogos(block: LogosBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=logos.d.ts.map

package/dist/src/render/blocks/logos.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"logos.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/logos.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAY,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAC3D,OAAO,EAEL,KAAK,WAAW,EAIhB,KAAK,aAAa,EACnB,MAAM,oBAAoB,CAAA;AA0B3B,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAiB9E"}
+{"version":3,"file":"logos.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/logos.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EAAE,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAGnF;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CA2B9E"}

package/dist/src/render/blocks/logos.js

@@ -1,22 +1,25 @@
-import { blockHeadingTag, h, heading, image, } from '@cogenta/theme-kit';
+import { h, image } from '@cogenta/theme-kit';
+import { section, sectionHead } from '../layout.js';
 /**
- * Contract B says the organisation's name **is** the accessible name of the
- * link. So the logo image carries it as alt text when the media entity has
- * none, and no visually hidden duplicate is added.
+ * Named organisations (the companies running the product, the platforms it
+ * integrates with) as a ruled grid: hairlines between cells, each wordmark in
+ * grey at one height, linked when the block gives an address. The
+ * organisation's name is the image's accessible name when the media library
+ * has no alt text.
+ *
+ * Wordmarks are shown in grey in light and inverted in dark, so a logo drawn
+ * in dark ink stays legible on the dark ground.
  */
-function renderItem(item, ctx) {
-    const logo = image(ctx, item.media, {
-        className: 'cg-logo__image',
-        altFrom: item.name,
-        variant: { fit: 'contain' },
-    });
-    return h('li', { class: 'cg-logo' }, item.url === undefined
-        ? logo
-        : h('a', { class: 'cg-logo__link', href: ctx.link(item.url), rel: 'noopener noreferrer' }, logo));
-}
 export function renderLogos(block, ctx) {
-    return h('section', { class: 'cg-block cg-logos', 'data-block': 'logos' }, block.title === undefined
-        ? null
-        : heading(blockHeadingTag('logos') ?? 'h2', { class: 'cg-logos__title', 'data-field': 'title' }, block.title), h('ul', { class: 'cg-logos__items' }, block.items.map((item) => renderItem(item, ctx))));
+    return section('section', 'logos', 'cd-logos', { 'data-count': String(Math.min(block.items.length, 6)) }, 'div', sectionHead('logos', block.title), h('ul', { class: 'cd-logos__items' }, block.items.map((item) => {
+        const mark = image(ctx, item.media, {
+            className: 'cd-logos__image cd-mark',
+            altFrom: item.name,
+            sizes: '10rem',
+        });
+        return h('li', { class: 'cd-logos__item' }, item.url === undefined
+            ? mark
+            : h('a', { class: 'cd-logos__link', href: ctx.link(item.url), rel: 'noopener' }, mark));
+    })));
 }
 //# sourceMappingURL=logos.js.map

package/dist/src/render/blocks/logos.js.map

@@ -1 +1 @@
-{"version":3,"file":"logos.js","sourceRoot":"","sources":["../../../../src/render/blocks/logos.ts"],"names":[],"mappings":"AACA,OAAO,EACL,eAAe,EAEf,CAAC,EACD,OAAO,EACP,KAAK,GAEN,MAAM,oBAAoB,CAAA;AAE3B;;;;GAIG;AACH,SAAS,UAAU,CAAC,IAAc,EAAE,GAAkB;IACpD,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE;QAClC,SAAS,EAAE,gBAAgB;QAC3B,OAAO,EAAE,IAAI,CAAC,IAAI;QAClB,OAAO,EAAE,EAAE,GAAG,EAAE,SAAS,EAAE;KAC5B,CAAC,CAAA;IACF,OAAO,CAAC,CACN,IAAI,EACJ,EAAE,KAAK,EAAE,SAAS,EAAE,EACpB,IAAI,CAAC,GAAG,KAAK,SAAS;QACpB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,GAAG,EACH,EAAE,KAAK,EAAE,eAAe,EAAE,IAAI,EAAE,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,qBAAqB,EAAE,EAChF,IAAI,CACL,CACN,CAAA;AACH,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAiB,EAAE,GAAkB;IAC/D,OAAO,CAAC,CACN,SAAS,EACT,EAAE,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,OAAO,EAAE,EACrD,KAAK,CAAC,KAAK,KAAK,SAAS;QACvB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,OAAO,CACL,eAAe,CAAC,OAAO,CAAC,IAAI,IAAI,EAChC,EAAE,KAAK,EAAE,iBAAiB,EAAE,YAAY,EAAE,OAAO,EAAE,EACnD,KAAK,CAAC,KAAK,CACZ,EACL,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC,CACjD,CACF,CAAA;AACH,CAAC"}
+{"version":3,"file":"logos.js","sourceRoot":"","sources":["../../../../src/render/blocks/logos.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AACnF,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AAEnD;;;;;;;;;GASG;AACH,MAAM,UAAU,WAAW,CAAC,KAAiB,EAAE,GAAkB;IAC/D,OAAO,OAAO,CACZ,SAAS,EACT,OAAO,EACP,UAAU,EACV,EAAE,YAAY,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,EACzD,KAAK,EACL,WAAW,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,EACjC,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;QACvB,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,IAAI,CAAC,KAAK,EAAE;YAClC,SAAS,EAAE,yBAAyB;YACpC,OAAO,EAAE,IAAI,CAAC,IAAI;YAClB,KAAK,EAAE,OAAO;SACf,CAAC,CAAA;QACF,OAAO,CAAC,CACN,IAAI,EACJ,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAC3B,IAAI,CAAC,GAAG,KAAK,SAAS;YACpB,CAAC,CAAC,IAAI;YACN,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,IAAI,EAAE,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,EAAE,GAAG,EAAE,UAAU,EAAE,EAAE,IAAI,CAAC,CACzF,CAAA;IACH,CAAC,CAAC,CACH,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/media-figure.d.ts

@@ -1,10 +1,4 @@
 import type { MediaFigureBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
-/**
- * `<figure>`/`<figcaption>` rather than a div and a paragraph: the
- * association between the picture and its caption is then in the markup,
- * and a screen reader announces the caption as belonging to the image
- * instead of as loose text after it.
- */
 export declare function renderMediaFigure(block: MediaFigureBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=media-figure.d.ts.map

package/dist/src/render/blocks/media-figure.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"media-figure.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/media-figure.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AACvD,OAAO,EAAe,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAEhG;;;;;GAKG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CA0B1F"}
+{"version":3,"file":"media-figure.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/media-figure.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAA;AACvD,OAAO,EAAe,KAAK,WAAW,EAAY,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAuBhG,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,gBAAgB,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAiC1F"}

package/dist/src/render/blocks/media-figure.js

@@ -1,25 +1,37 @@
 import { aspectRatio, h, image } from '@cogenta/theme-kit';
+import { optionalText } from '../layout.js';
 /**
- * `<figure>`/`<figcaption>` rather than a div and a paragraph: the
- * association between the picture and its caption is then in the markup,
- * and a screen reader announces the caption as belonging to the image
- * instead of as loose text after it.
+ * A diagram, a screenshot or a photograph, in the hairline frame, with its
+ * caption and credit under it in the secondary ink.
+ *
+ * `align` (contract B) places the frame: `wide` takes the whole container
+ * (or the whole reading column on a documentation page), `center` the middle
+ * eight columns, `start` and `end` eight columns on either side, and `full`
+ * runs to the edges of the window, without a frame.
+ *
+ * `ratio` crops from the top edge, so an interface keeps its title bar; a
+ * focal point set in the media library still wins.
  */
+const SIZES = {
+    full: '100vw',
+    wide: '(min-width: 80rem) 76rem, 100vw',
+    center: '(min-width: 64rem) 50rem, 100vw',
+    start: '(min-width: 64rem) 50rem, 100vw',
+    end: '(min-width: 64rem) 50rem, 100vw',
+};
 export function renderMediaFigure(block, ctx) {
+    const align = block.align ?? 'wide';
     const ratio = aspectRatio(block.ratio);
     const hasCaption = block.caption !== undefined || block.credit !== undefined;
-    return h('figure', {
-        class: 'cg-block cg-figure',
-        'data-block': 'mediaFigure',
-        'data-align': block.align ?? 'center',
-        style: ratio === undefined ? undefined : `--cg-ratio:${ratio}`,
+    return h('div', { class: 'cd-section cd-figure', 'data-block': 'mediaFigure', 'data-align': align }, h('figure', { class: 'cd-container cd-figure__inner' }, h('div', {
+        class: align === 'full' ? 'cd-figure__media' : 'cd-figure__media cd-frame',
+        style: ratio === undefined ? undefined : `aspect-ratio:${ratio}`,
+        'data-ratio': ratio === undefined ? 'original' : 'fixed',
     }, image(ctx, block.media, {
-        className: 'cg-figure__media',
-        sizes: '(min-width: 45rem) 40rem, 100vw',
-    }), hasCaption
-        ? h('figcaption', { class: 'cg-figure__caption' }, block.caption, block.credit === undefined
-            ? null
-            : h('span', { class: 'cg-figure__credit', 'data-field': 'credit' }, block.credit))
-        : null);
+        className: 'cd-figure__image cd-frame__image',
+        sizes: SIZES[align] ?? '100vw',
+    })), hasCaption
+        ? h('figcaption', { class: 'cd-figure__caption' }, optionalText('span', 'cd-figure__text', block.caption, { 'data-field': 'caption' }), optionalText('span', 'cd-figure__credit', block.credit, { 'data-field': 'credit' }))
+        : null));
 }
 //# sourceMappingURL=media-figure.js.map

package/dist/src/render/blocks/media-figure.js.map

@@ -1 +1 @@
-{"version":3,"file":"media-figure.js","sourceRoot":"","sources":["../../../../src/render/blocks/media-figure.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AAEhG;;;;;GAKG;AACH,MAAM,UAAU,iBAAiB,CAAC,KAAuB,EAAE,GAAkB;IAC3E,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;IACtC,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,SAAS,CAAA;IAC5E,OAAO,CAAC,CACN,QAAQ,EACR;QACE,KAAK,EAAE,oBAAoB;QAC3B,YAAY,EAAE,aAAa;QAC3B,YAAY,EAAE,KAAK,CAAC,KAAK,IAAI,QAAQ;QACrC,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,cAAc,KAAK,EAAE;KAC/D,EACD,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,EAAE;QACtB,SAAS,EAAE,kBAAkB;QAC7B,KAAK,EAAE,iCAAiC;KACzC,CAAC,EACF,UAAU;QACR,CAAC,CAAC,CAAC,CACC,YAAY,EACZ,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAC/B,KAAK,CAAC,OAAO,EACb,KAAK,CAAC,MAAM,KAAK,SAAS;YACxB,CAAC,CAAC,IAAI;YACN,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,QAAQ,EAAE,EAAE,KAAK,CAAC,MAAM,CAAC,CACpF;QACH,CAAC,CAAC,IAAI,CACT,CAAA;AACH,CAAC"}
+{"version":3,"file":"media-figure.js","sourceRoot":"","sources":["../../../../src/render/blocks/media-figure.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAoB,CAAC,EAAE,KAAK,EAAsB,MAAM,oBAAoB,CAAA;AAChG,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAA;AAE3C;;;;;;;;;;;GAWG;AACH,MAAM,KAAK,GAAqC;IAC9C,IAAI,EAAE,OAAO;IACb,IAAI,EAAE,iCAAiC;IACvC,MAAM,EAAE,iCAAiC;IACzC,KAAK,EAAE,iCAAiC;IACxC,GAAG,EAAE,iCAAiC;CACvC,CAAA;AAED,MAAM,UAAU,iBAAiB,CAAC,KAAuB,EAAE,GAAkB;IAC3E,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,IAAI,MAAM,CAAA;IACnC,MAAM,KAAK,GAAG,WAAW,CAAC,KAAK,CAAC,KAAK,CAAC,CAAA;IACtC,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,KAAK,SAAS,IAAI,KAAK,CAAC,MAAM,KAAK,SAAS,CAAA;IAE5E,OAAO,CAAC,CACN,KAAK,EACL,EAAE,KAAK,EAAE,sBAAsB,EAAE,YAAY,EAAE,aAAa,EAAE,YAAY,EAAE,KAAK,EAAE,EACnF,CAAC,CACC,QAAQ,EACR,EAAE,KAAK,EAAE,+BAA+B,EAAE,EAC1C,CAAC,CACC,KAAK,EACL;QACE,KAAK,EAAE,KAAK,KAAK,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,2BAA2B;QAC1E,KAAK,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,gBAAgB,KAAK,EAAE;QAChE,YAAY,EAAE,KAAK,KAAK,SAAS,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,OAAO;KACzD,EACD,KAAK,CAAC,GAAG,EAAE,KAAK,CAAC,KAAK,EAAE;QACtB,SAAS,EAAE,kCAAkC;QAC7C,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,OAAO;KAC/B,CAAC,CACH,EACD,UAAU;QACR,CAAC,CAAC,CAAC,CACC,YAAY,EACZ,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAC/B,YAAY,CAAC,MAAM,EAAE,iBAAiB,EAAE,KAAK,CAAC,OAAO,EAAE,EAAE,YAAY,EAAE,SAAS,EAAE,CAAC,EACnF,YAAY,CAAC,MAAM,EAAE,mBAAmB,EAAE,KAAK,CAAC,MAAM,EAAE,EAAE,YAAY,EAAE,QAAQ,EAAE,CAAC,CACpF;QACH,CAAC,CAAC,IAAI,CACT,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/pricing-table.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pricing-table.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/pricing-table.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAe,MAAM,iBAAiB,CAAA;AACrE,OAAO,EAIL,KAAK,WAAW,EAIhB,KAAK,aAAa,EACnB,MAAM,oBAAoB,CAAA;AA0C3B,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAmB5F"}
+{"version":3,"file":"pricing-table.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/pricing-table.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAe,MAAM,iBAAiB,CAAA;AACrE,OAAO,EAEL,KAAK,WAAW,EAGhB,KAAK,aAAa,EACnB,MAAM,oBAAoB,CAAA;AA0C3B,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,iBAAiB,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAe5F"}

package/dist/src/render/blocks/pricing-table.js

@@ -1,28 +1,24 @@
-import { actionLink, blockHeadingTag, h, heading, nestedHeadingTag, } from '@cogenta/theme-kit';
+import { actionLink, h, nestedHeadingTag, } from '@cogenta/theme-kit';
+import { optionalText, section, sectionHead } from '../layout.js';
+import { word } from '../strings.js';
 /**
- * `blocks@2.0` (RFC 0001). Bordered plates, one lifted (border + a small
- * "recommended" rule) when `highlighted` is set — an editorial signal,
- * never a colour: it becomes `data-highlighted` for the stylesheet, and
- * `aria-current` so the emphasis is announced, not only shown.
+ * Plans, the way a documentation site shows them (support plans, usage
+ * limits): columns side by side between hairlines, never cards. Each plan
+ * names itself, prints its price in tabular numerals with the interval after
+ * it, lists what it includes as ruled lines, and ends on its action. The
+ * recommended plan is marked by a rule in ink above it and a word, never by a
+ * tinted background.
  */
-function renderTier(tier, ctx, tag) {
-    return h('li', {
-        class: 'cg-pricing__tier',
-        'data-highlighted': tier.highlighted === true ? 'true' : undefined,
-        'aria-current': tier.highlighted === true ? 'true' : undefined,
-    }, heading(tag, { class: 'cg-pricing__name' }, tier.name), h('p', { class: 'cg-pricing__price' }, h('span', { class: 'cg-pricing__amount' }, tier.price), tier.interval === undefined
+function tier(item, ctx, tag) {
+    const highlighted = item.highlighted === true;
+    return h('li', { class: 'cd-plans__item', 'data-highlighted': highlighted ? 'true' : 'false' }, h('div', { class: 'cd-plans__head' }, h(tag, { class: 'cd-plans__name' }, item.name), highlighted ? h('p', { class: 'cd-plans__flag' }, word(ctx.locale, 'recommended')) : null), h('p', { class: 'cd-plans__price' }, h('span', { class: 'cd-plans__amount' }, item.price), optionalText('span', 'cd-plans__interval', item.interval)), item.features.length === 0
         ? null
-        : h('span', { class: 'cg-pricing__interval' }, tier.interval)), tier.features.length === 0
+        : h('ul', { class: 'cd-plans__features' }, item.features.map((feature) => h('li', { class: 'cd-plans__feature' }, feature))), item.action === undefined
         ? null
-        : h('ul', { class: 'cg-pricing__features' }, tier.features.map((feature) => h('li', { class: 'cg-pricing__feature' }, feature))), tier.action === undefined
-        ? null
-        : h('div', { class: 'cg-pricing__action' }, actionLink(ctx, { ...tier.action, emphasis: tier.action.emphasis ?? 'primary' })));
+        : h('div', { class: 'cd-plans__action' }, actionLink(ctx, item.action)));
 }
 export function renderPricingTable(block, ctx) {
-    const hasTitle = block.title !== undefined;
-    const tierTag = nestedHeadingTag('pricingTable', hasTitle);
-    return h('section', { class: 'cg-block cg-pricing', 'data-block': 'pricingTable' }, hasTitle
-        ? heading(blockHeadingTag('pricingTable') ?? 'h2', { class: 'cg-pricing__title', 'data-field': 'title' }, block.title ?? '')
-        : null, h('ul', { class: 'cg-pricing__tiers' }, block.tiers.map((tier) => renderTier(tier, ctx, tierTag))));
+    const tag = nestedHeadingTag('pricingTable', block.title !== undefined);
+    return section('section', 'pricingTable', 'cd-plans', { 'data-count': String(Math.min(block.tiers.length, 4)) }, 'div', sectionHead('pricingTable', block.title), h('ul', { class: 'cd-plans__items' }, block.tiers.map((item) => tier(item, ctx, tag))));
 }
 //# sourceMappingURL=pricing-table.js.map

package/dist/src/render/blocks/pricing-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"pricing-table.js","sourceRoot":"","sources":["../../../../src/render/blocks/pricing-table.ts"],"names":[],"mappings":"AACA,OAAO,EACL,UAAU,EACV,eAAe,EAGf,CAAC,EACD,OAAO,EACP,gBAAgB,GAEjB,MAAM,oBAAoB,CAAA;AAE3B;;;;;GAKG;AACH,SAAS,UAAU,CAAC,IAAiB,EAAE,GAAkB,EAAE,GAAe;IACxE,OAAO,CAAC,CACN,IAAI,EACJ;QACE,KAAK,EAAE,kBAAkB;QACzB,kBAAkB,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAClE,cAAc,EAAE,IAAI,CAAC,WAAW,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;KAC/D,EACD,OAAO,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,EACtD,CAAC,CACC,GAAG,EACH,EAAE,KAAK,EAAE,mBAAmB,EAAE,EAC9B,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EACtD,IAAI,CAAC,QAAQ,KAAK,SAAS;QACzB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,sBAAsB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAChE,EACD,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC;QACxB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,sBAAsB,EAAE,EACjC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAAE,OAAO,CAAC,CAAC,CACnF,EACL,IAAI,CAAC,MAAM,KAAK,SAAS;QACvB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAC/B,UAAU,CAAC,GAAG,EAAE,EAAE,GAAG,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,QAAQ,IAAI,SAAS,EAAE,CAAC,CACjF,CACN,CAAA;AACH,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,KAAwB,EAAE,GAAkB;IAC7E,MAAM,QAAQ,GAAG,KAAK,CAAC,KAAK,KAAK,SAAS,CAAA;IAC1C,MAAM,OAAO,GAAG,gBAAgB,CAAC,cAAc,EAAE,QAAQ,CAAC,CAAA;IAC1D,OAAO,CAAC,CACN,SAAS,EACT,EAAE,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,cAAc,EAAE,EAC9D,QAAQ;QACN,CAAC,CAAC,OAAO,CACL,eAAe,CAAC,cAAc,CAAC,IAAI,IAAI,EACvC,EAAE,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,OAAO,EAAE,EACrD,KAAK,CAAC,KAAK,IAAI,EAAE,CAClB;QACH,CAAC,CAAC,IAAI,EACR,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,mBAAmB,EAAE,EAC9B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,UAAU,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC,CAC1D,CACF,CAAA;AACH,CAAC"}
+{"version":3,"file":"pricing-table.js","sourceRoot":"","sources":["../../../../src/render/blocks/pricing-table.ts"],"names":[],"mappings":"AACA,OAAO,EACL,UAAU,EAEV,CAAC,EACD,gBAAgB,GAEjB,MAAM,oBAAoB,CAAA;AAC3B,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,WAAW,EAAE,MAAM,cAAc,CAAA;AACjE,OAAO,EAAE,IAAI,EAAE,MAAM,eAAe,CAAA;AAEpC;;;;;;;GAOG;AACH,SAAS,IAAI,CAAC,IAAiB,EAAE,GAAkB,EAAE,GAAW;IAC9D,MAAM,WAAW,GAAG,IAAI,CAAC,WAAW,KAAK,IAAI,CAAA;IAC7C,OAAO,CAAC,CACN,IAAI,EACJ,EAAE,KAAK,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,EAAE,EAC/E,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAC3B,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,IAAI,CAAC,IAAI,CAAC,EAC9C,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,IAAI,CAAC,GAAG,CAAC,MAAM,EAAE,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAC1F,EACD,CAAC,CACC,GAAG,EACH,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,CAAC,CAAC,MAAM,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,EACpD,YAAY,CAAC,MAAM,EAAE,oBAAoB,EAAE,IAAI,CAAC,QAAQ,CAAC,CAC1D,EACD,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC;QACxB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,oBAAoB,EAAE,EAC/B,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,KAAK,EAAE,mBAAmB,EAAE,EAAE,OAAO,CAAC,CAAC,CACjF,EACL,IAAI,CAAC,MAAM,KAAK,SAAS;QACvB,CAAC,CAAC,IAAI;QACN,CAAC,CAAC,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,kBAAkB,EAAE,EAAE,UAAU,CAAC,GAAG,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAC1E,CAAA;AACH,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,KAAwB,EAAE,GAAkB;IAC7E,MAAM,GAAG,GAAG,gBAAgB,CAAC,cAAc,EAAE,KAAK,CAAC,KAAK,KAAK,SAAS,CAAC,CAAA;IACvE,OAAO,OAAO,CACZ,SAAS,EACT,cAAc,EACd,UAAU,EACV,EAAE,YAAY,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,EACzD,KAAK,EACL,WAAW,CAAC,cAAc,EAAE,KAAK,CAAC,KAAK,CAAC,EACxC,CAAC,CACC,IAAI,EACJ,EAAE,KAAK,EAAE,iBAAiB,EAAE,EAC5B,KAAK,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,CAAC,CAChD,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/prose.d.ts

@@ -1,4 +1,16 @@
 import type { ProseBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
-export declare function renderProse(block: ProseBlock, ctx: RenderContext): HtmlElement;
+import { type HeadingAnchors } from '../rich-text.js';
+/**
+ * Running text. `prose` declares `headingLevel: 'none'`: its headings come
+ * from the rich text document, whose vocabulary starts at `h2`.
+ *
+ * The body is set on the reading measure from the first column; code blocks,
+ * notes and reference tables are read out of the document by
+ * `renderDocsRichText` (see its own comment for the four shapes).
+ *
+ * `anchors` is the page's own set of heading ids, so the table of contents
+ * and the headings agree; a prose block rendered on its own computes its own.
+ */
+export declare function renderProse(block: ProseBlock, ctx: RenderContext, anchors?: HeadingAnchors): HtmlElement;
 //# sourceMappingURL=prose.d.ts.map

package/dist/src/render/blocks/prose.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"prose.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/prose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EACL,KAAK,WAAW,EAGhB,KAAK,aAAa,EAEnB,MAAM,oBAAoB,CAAA;AAmC3B,wBAAgB,WAAW,CAAC,KAAK,EAAE,UAAU,EAAE,GAAG,EAAE,aAAa,GAAG,WAAW,CAM9E"}
+{"version":3,"file":"prose.d.ts","sourceRoot":"","sources":["../../../../src/render/blocks/prose.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAA;AACjD,OAAO,EAAE,KAAK,WAAW,EAAK,KAAK,aAAa,EAAE,MAAM,oBAAoB,CAAA;AAC5E,OAAO,EAAE,KAAK,cAAc,EAAsC,MAAM,iBAAiB,CAAA;AAEzF;;;;;;;;;;GAUG;AACH,wBAAgB,WAAW,CACzB,KAAK,EAAE,UAAU,EACjB,GAAG,EAAE,aAAa,EAClB,OAAO,GAAE,cAAwC,GAChD,WAAW,CAcb"}

package/dist/src/render/blocks/prose.js

@@ -1,36 +1,17 @@
-import { h, renderRichText, } from '@cogenta/theme-kit';
+import { h } from '@cogenta/theme-kit';
+import { headingAnchors, renderDocsRichText } from '../rich-text.js';
 /**
- * `prose` declares `headingLevel: 'none'`: it contributes no heading of its
- * own. Whatever headings appear come from the rich text document, whose
- * vocabulary starts at `h2`.
+ * Running text. `prose` declares `headingLevel: 'none'`: its headings come
+ * from the rich text document, whose vocabulary starts at `h2`.
  *
- * Contract A's rich text schema (`@cogenta/schema`, frozen) has no fenced
- * "code block" node — the only code-shaped thing it can carry is a
- * paragraph whose sole span carries the `code` mark, which
- * `renderRichText` (`@cogenta/theme-kit`) already turns into
- * `<p><code>…</code></p>`. A documentation theme without a real, multi-line
- * code block would be dishonest about what it is for, so this is the one
- * place in the theme that post-processes theme-kit's own output rather than
- * writing a second rich-text renderer: a `<p>` whose only child is a bare
- * `<code>` is promoted to `<pre><code>`, everything else is untouched. The
- * transform only ever changes two tag names on an already-escaped tree — no
- * new content is invented, and R3 (a block never stores HTML) still holds,
- * since the source is still the same structured span the editor wrote.
+ * The body is set on the reading measure from the first column; code blocks,
+ * notes and reference tables are read out of the document by
+ * `renderDocsRichText` (see its own comment for the four shapes).
+ *
+ * `anchors` is the page's own set of heading ids, so the table of contents
+ * and the headings agree; a prose block rendered on its own computes its own.
  */
-function promoteCodeBlocks(nodes) {
-    return nodes.map((node) => {
-        if (node.kind !== 'element')
-            return node;
-        if (node.tag === 'p' &&
-            node.children.length === 1 &&
-            node.children[0]?.kind === 'element' &&
-            node.children[0].tag === 'code') {
-            return h('pre', { class: 'cg-prose__code' }, node.children[0]);
-        }
-        return node;
-    });
-}
-export function renderProse(block, ctx) {
-    return h('div', { class: 'cg-block cg-prose', 'data-block': 'prose' }, promoteCodeBlocks(renderRichText(ctx, block.body)));
+export function renderProse(block, ctx, anchors = headingAnchors([block])) {
+    return h('div', { class: 'cd-section cd-prose', 'data-block': 'prose' }, h('div', { class: 'cd-container cd-prose__inner' }, h('div', { class: 'cd-prose__body cd-rich' }, renderDocsRichText(ctx, block.body, { anchors: { blockKey: block._key, map: anchors } }))));
 }
 //# sourceMappingURL=prose.js.map

package/dist/src/render/blocks/prose.js.map

@@ -1 +1 @@
-{"version":3,"file":"prose.js","sourceRoot":"","sources":["../../../../src/render/blocks/prose.ts"],"names":[],"mappings":"AACA,OAAO,EAGL,CAAC,EAED,cAAc,GACf,MAAM,oBAAoB,CAAA;AAE3B;;;;;;;;;;;;;;;;;GAiBG;AACH,SAAS,iBAAiB,CAAC,KAA0B;IACnD,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE;QACxB,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS;YAAE,OAAO,IAAI,CAAA;QACxC,IACE,IAAI,CAAC,GAAG,KAAK,GAAG;YAChB,IAAI,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC;YAC1B,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,IAAI,KAAK,SAAS;YACpC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,MAAM,EAC/B,CAAC;YACD,OAAO,CAAC,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,gBAAgB,EAAE,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAA;QAChE,CAAC;QACD,OAAO,IAAI,CAAA;IACb,CAAC,CAAC,CAAA;AACJ,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,KAAiB,EAAE,GAAkB;IAC/D,OAAO,CAAC,CACN,KAAK,EACL,EAAE,KAAK,EAAE,mBAAmB,EAAE,YAAY,EAAE,OAAO,EAAE,EACrD,iBAAiB,CAAC,cAAc,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,CAAC,CAAC,CACnD,CAAA;AACH,CAAC"}
+{"version":3,"file":"prose.js","sourceRoot":"","sources":["../../../../src/render/blocks/prose.ts"],"names":[],"mappings":"AACA,OAAO,EAAoB,CAAC,EAAsB,MAAM,oBAAoB,CAAA;AAC5E,OAAO,EAAuB,cAAc,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAA;AAEzF;;;;;;;;;;GAUG;AACH,MAAM,UAAU,WAAW,CACzB,KAAiB,EACjB,GAAkB,EAClB,OAAO,GAAmB,cAAc,CAAC,CAAC,KAAK,CAAC,CAAC;IAEjD,OAAO,CAAC,CACN,KAAK,EACL,EAAE,KAAK,EAAE,qBAAqB,EAAE,YAAY,EAAE,OAAO,EAAE,EACvD,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,8BAA8B,EAAE,EACzC,CAAC,CACC,KAAK,EACL,EAAE,KAAK,EAAE,wBAAwB,EAAE,EACnC,kBAAkB,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,EAAE,EAAE,OAAO,EAAE,EAAE,QAAQ,EAAE,KAAK,CAAC,IAAI,EAAE,GAAG,EAAE,OAAO,EAAE,EAAE,CAAC,CACzF,CACF,CACF,CAAA;AACH,CAAC"}

package/dist/src/render/blocks/quote.d.ts

@@ -1,9 +1,11 @@
 import type { QuoteBlock } from '@cogenta/blocks';
 import { type HtmlElement, type RenderContext } from '@cogenta/theme-kit';
 /**
- * `<figure><blockquote>…</blockquote><figcaption>` is the attribution
- * pattern the HTML spec prescribes: putting the author inside the
- * `<blockquote>` would claim the author's name is part of what was said.
+ * A quotation: in documentation, a line from an RFC, a maintainer or a team
+ * that runs the product. Set at the quote size on the reading measure, in
+ * real curly quotation marks drawn by the stylesheet, hanging from a rule in
+ * ink on its left; the attribution under it, with a small round portrait when
+ * there is one.
  */
 export declare function renderQuote(block: QuoteBlock, ctx: RenderContext): HtmlElement;
 //# sourceMappingURL=quote.d.ts.map