@nanisoft/prism-ui 0.15.0 → 0.16.0

package/dist/lib/figure.d.ts

@@ -0,0 +1,149 @@
+/**
+ * The arithmetic every Component that draws a figure shares.
+ *
+ * **One copy rather than one per Component.** Two Components in this package draw
+ * labelled marks into a fixed canvas and both have to answer the same three
+ * questions: where a label's ink box is, where a stroke leaving a mark has to stop
+ * before it enters one, and how a caller's own coordinate space is fitted into the
+ * canvas. Two copies of that
+ * arithmetic are two answers to one question, and the disagreement between them is
+ * invisible until a reader puts the two figures side by side and finds that one of
+ * them runs a line through a word. What stays with each Component is the half that
+ * is genuinely its own: the numbers its own drawing uses and the labels it prints.
+ *
+ * **How any of this is reachable from a server Component.** A Component that cannot
+ * measure text still knows a monospaced label's width, because a monospaced face has
+ * one advance width for every character and so a label's width is its character
+ * count. That is a property of the face every label in a figure is set in rather
+ * than of this module, and it is what makes a label's box arithmetic instead of a
+ * measurement. A label set in a proportional face would have no such answer, which
+ * is a limit of the rule rather than of the Component.
+ *
+ * **Two rules these serve, and the second one has a direction clause.** The
+ * legibility floor in DESIGN.md, and the ink-avoidance rule beside it: a stroke
+ * takes the longest stretch of the line between two marks that no label blocks, so a
+ * label a stroke does not run through costs it nothing. Nothing here draws and
+ * nothing here knows a colour, a token or a class name. A geometry helper that
+ * also held an ink would be holding a token, which is the one thing a figure in
+ * this system never does.
+ */
+/** A point in a figure's own coordinate space. */
+export type FigurePoint = {
+    x: number;
+    y: number;
+};
+/** An axis-aligned rectangle in a figure's own coordinate space. */
+export type FigureBox = {
+    l: number;
+    r: number;
+    t: number;
+    b: number;
+};
+/** The two ends of a drawn stroke. */
+export type FigureStroke = {
+    from: FigurePoint;
+    to: FigurePoint;
+};
+/**
+ * One label a Component prints beside a mark, in the three numbers the arithmetic
+ * below reads it by.
+ *
+ * A label is passed as its own text rather than as a measured box because there is
+ * no measurement to pass: the text is the measurement, and the Component that owns
+ * the label is the only one that knows its size and its baseline.
+ */
+export type FigureLabel = {
+    /** The label's own text, whose character count is its width. */
+    text: string;
+    /** Its type size, in user units. */
+    size: number;
+    /** Its baseline, measured down from the mark's centre. */
+    offset: number;
+};
+/**
+ * The canvas a caller's points are fitted into.
+ *
+ * `bottom` is separate from `height` because a figure that draws something along its
+ * foot reserves a band there, and the fitted area stops above that band rather than
+ * the canvas growing to fit both.
+ */
+export type FigureFrame = {
+    width: number;
+    height: number;
+    /** The band left empty on the top and on the two sides. */
+    padding: number;
+    /** The fitted area's lower edge, which defaults to `height - padding`. */
+    bottom?: number;
+};
+/**
+ * The metrics of the face every label in a figure is set in, as fractions of the
+ * type size, and the gap the drawing keeps between one piece of ink and the next.
+ *
+ * A monospaced face has one advance width for every character, so `MONO_ADVANCE` is
+ * what turns a label's character count into a width, and `LABEL_ASCENT` and
+ * `LABEL_DESCENT` are what turn a baseline into a box. The three are the face's own
+ * rather than a decision about any one drawing, and they are a little generous on
+ * purpose: a box wider or deeper than the ink it stands for costs a little length on
+ * a stroke, while a box narrower or shallower costs a word a reader has to guess at.
+ *
+ * `INK_CLEARANCE` is the space the box adds around that ink, so it is both the gap
+ * between a stroke and the label it would otherwise run through and the margin the
+ * box keeps around the mark's own centre line. One constant rather than two because
+ * it is one fact: no two pieces of ink in a figure touch.
+ */
+export declare const MONO_ADVANCE = 0.6;
+export declare const LABEL_ASCENT = 0.8;
+export declare const LABEL_DESCENT = 0.25;
+export declare const INK_CLEARANCE = 7;
+/** Half the width of a monospaced label of `size` user units, in user units. */
+export declare function labelHalfWidth(label: string, size: number): number;
+/** Half the height of a label of `size` user units, in user units. */
+export declare function labelHalfHeight(size: number): number;
+/**
+ * The visible part of a stroke between two marks: the longest stretch of the line
+ * between them that no label blocks, held off each mark by the mark's own clearance.
+ *
+ * **Trim a segment against what it would actually enter, and nothing else.** A label
+ * is an obstacle only where the stroke runs, so each label is its own box and a
+ * stroke that misses it pays nothing for it. A name is printed under its mark and a
+ * note under that, so both sit below it, and a stroke leaving sideways runs along
+ * the mark's own centre line and enters neither. Backing a stroke off the mark by
+ * the half-width of the widest label at the node anyway pushed every connector on a
+ * six-stage rail back by up to fifty units from a six-unit mark: a row of circles
+ * with short line segments floating between them, which is a drawing of a shape and
+ * none of its relations. So the whole rail reaches both of its marks and nothing is
+ * trimmed there at all.
+ *
+ * **The stretch is the one the whole stroke fits in, and not two trims taken one at a
+ * time, because a label can block the corridor behind a mark rather than the mark
+ * itself.** A node's name and note sit below it at two different depths, so a
+ * stroke arriving from below runs through the name, out of it, and then back into the
+ * note further along: stopping where the name ends leaves the stroke sitting on top
+ * of the note. The drawn stroke is what has to be clear, so the whole line between
+ * the two marks is divided once and the longest unblocked stretch of it is drawn.
+ *
+ * **A mark's own edge plus the clearance is where an end sits when nothing blocks
+ * it.** A mark is a circle, so its edge is `mark` away in every direction, and the
+ * clearance is the gap that holds a stroke off the ink it belongs to. A line with no
+ * label on it therefore starts one clearance from the first mark and ends one
+ * clearance from the second, and that pair is the whole of what a stroke leaving a
+ * node sideways is allowed to cost.
+ *
+ * Two blocked stretches can leave nothing between them when a caller puts two marks
+ * close together, and a line trimmed away entirely is a line that silently did not
+ * draw, which is the one failure a figure in this package exists to make impossible.
+ * The mark boundaries are then the shortest stroke that still joins the two marks,
+ * and a caller who has put two marks on top of one another has already been told what
+ * that draws.
+ */
+export declare function strokeBetween(from: FigurePoint, to: FigurePoint, mark: number, fromLabels: readonly FigureLabel[], toLabels: readonly FigureLabel[]): FigureStroke;
+/**
+ * The caller's points, fitted into the frame with their aspect ratio kept and the
+ * leftover shared out evenly.
+ *
+ * A caller whose points span one axis only, or who passes one item, gets the other
+ * axis centred rather than a division by zero: the scale is taken over the axes that
+ * have an extent, and a figure with no extent at all keeps the caller's own numbers.
+ */
+export declare function fitPoints<T extends FigurePoint>(items: readonly T[], frame: FigureFrame): (item: T) => FigurePoint;
+//# sourceMappingURL=figure.d.ts.map

package/dist/lib/figure.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"figure.d.ts","sourceRoot":"","sources":["../../src/lib/figure.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AAEH,kDAAkD;AAClD,MAAM,MAAM,WAAW,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAElD,oEAAoE;AACpE,MAAM,MAAM,SAAS,GAAG;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAAA;AAEtE,sCAAsC;AACtC,MAAM,MAAM,YAAY,GAAG;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,EAAE,EAAE,WAAW,CAAA;CAAE,CAAA;AAKjE;;;;;;;GAOG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,gEAAgE;IAChE,IAAI,EAAE,MAAM,CAAA;IACZ,oCAAoC;IACpC,IAAI,EAAE,MAAM,CAAA;IACZ,0DAA0D;IAC1D,MAAM,EAAE,MAAM,CAAA;CACf,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE,MAAM,CAAA;IACd,2DAA2D;IAC3D,OAAO,EAAE,MAAM,CAAA;IACf,0EAA0E;IAC1E,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AAED;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,YAAY,MAAM,CAAA;AAC/B,eAAO,MAAM,YAAY,MAAM,CAAA;AAC/B,eAAO,MAAM,aAAa,OAAO,CAAA;AACjC,eAAO,MAAM,aAAa,IAAI,CAAA;AAE9B,gFAAgF;AAChF,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAElE;AAED,sEAAsE;AACtE,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAEpD;AAiGD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAgB,aAAa,CAC3B,IAAI,EAAE,WAAW,EACjB,EAAE,EAAE,WAAW,EACf,IAAI,EAAE,MAAM,EACZ,UAAU,EAAE,SAAS,WAAW,EAAE,EAClC,QAAQ,EAAE,SAAS,WAAW,EAAE,GAC/B,YAAY,CAgCd;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,CAAC,SAAS,WAAW,EAC7C,KAAK,EAAE,SAAS,CAAC,EAAE,EACnB,KAAK,EAAE,WAAW,GACjB,CAAC,IAAI,EAAE,CAAC,KAAK,WAAW,CAyB1B"}

package/dist/lib/figure.js

@@ -0,0 +1,242 @@
+/**
+ * The arithmetic every Component that draws a figure shares.
+ *
+ * **One copy rather than one per Component.** Two Components in this package draw
+ * labelled marks into a fixed canvas and both have to answer the same three
+ * questions: where a label's ink box is, where a stroke leaving a mark has to stop
+ * before it enters one, and how a caller's own coordinate space is fitted into the
+ * canvas. Two copies of that
+ * arithmetic are two answers to one question, and the disagreement between them is
+ * invisible until a reader puts the two figures side by side and finds that one of
+ * them runs a line through a word. What stays with each Component is the half that
+ * is genuinely its own: the numbers its own drawing uses and the labels it prints.
+ *
+ * **How any of this is reachable from a server Component.** A Component that cannot
+ * measure text still knows a monospaced label's width, because a monospaced face has
+ * one advance width for every character and so a label's width is its character
+ * count. That is a property of the face every label in a figure is set in rather
+ * than of this module, and it is what makes a label's box arithmetic instead of a
+ * measurement. A label set in a proportional face would have no such answer, which
+ * is a limit of the rule rather than of the Component.
+ *
+ * **Two rules these serve, and the second one has a direction clause.** The
+ * legibility floor in DESIGN.md, and the ink-avoidance rule beside it: a stroke
+ * takes the longest stretch of the line between two marks that no label blocks, so a
+ * label a stroke does not run through costs it nothing. Nothing here draws and
+ * nothing here knows a colour, a token or a class name. A geometry helper that
+ * also held an ink would be holding a token, which is the one thing a figure in
+ * this system never does.
+ */
+/**
+ * The metrics of the face every label in a figure is set in, as fractions of the
+ * type size, and the gap the drawing keeps between one piece of ink and the next.
+ *
+ * A monospaced face has one advance width for every character, so `MONO_ADVANCE` is
+ * what turns a label's character count into a width, and `LABEL_ASCENT` and
+ * `LABEL_DESCENT` are what turn a baseline into a box. The three are the face's own
+ * rather than a decision about any one drawing, and they are a little generous on
+ * purpose: a box wider or deeper than the ink it stands for costs a little length on
+ * a stroke, while a box narrower or shallower costs a word a reader has to guess at.
+ *
+ * `INK_CLEARANCE` is the space the box adds around that ink, so it is both the gap
+ * between a stroke and the label it would otherwise run through and the margin the
+ * box keeps around the mark's own centre line. One constant rather than two because
+ * it is one fact: no two pieces of ink in a figure touch.
+ */
+export const MONO_ADVANCE = 0.6;
+export const LABEL_ASCENT = 0.8;
+export const LABEL_DESCENT = 0.25;
+export const INK_CLEARANCE = 7;
+/** Half the width of a monospaced label of `size` user units, in user units. */
+export function labelHalfWidth(label, size) {
+    return (label.length * MONO_ADVANCE * size) / 2;
+}
+/** Half the height of a label of `size` user units, in user units. */
+export function labelHalfHeight(size) {
+    return ((LABEL_ASCENT + LABEL_DESCENT) * size) / 2;
+}
+/**
+ * The box one label's ink occupies, with the clearance around it.
+ *
+ * One label rather than a node's whole set of them, and that is the whole of the
+ * trim rule: a stroke is stopped by the labels it would actually enter, so the
+ * clearance around one label has to be findable on its own rather than only as
+ * part of a rectangle enclosing all of them.
+ */
+function labelBox(at, label) {
+    const half = labelHalfWidth(label.text, label.size);
+    return {
+        l: at.x - half - INK_CLEARANCE,
+        r: at.x + half + INK_CLEARANCE,
+        t: at.y + label.offset - LABEL_ASCENT * label.size - INK_CLEARANCE,
+        b: at.y + label.offset + LABEL_DESCENT * label.size + INK_CLEARANCE,
+    };
+}
+/**
+ * The stretch of a ray that is inside one box, measured as a distance along the ray
+ * from where it starts, or `null` for a ray that misses it.
+ *
+ * The two axes are taken separately and intersected, so a ray running exactly along
+ * an axis is not a division by zero and a ray that clips a corner enters and leaves
+ * in the same place rather than entering at all.
+ */
+function raySpan(from, toward, box) {
+    const length = Math.hypot(toward.x - from.x, toward.y - from.y);
+    if (length === 0)
+        return null;
+    const ux = (toward.x - from.x) / length;
+    const uy = (toward.y - from.y) / length;
+    let enter = 0;
+    let leave = Number.POSITIVE_INFINITY;
+    for (const [origin, delta, low, high] of [
+        [from.x, ux, box.l, box.r],
+        [from.y, uy, box.t, box.b],
+    ]) {
+        if (delta === 0) {
+            if (origin < low || origin > high)
+                return null;
+            continue;
+        }
+        const near = (low - origin) / delta;
+        const far = (high - origin) / delta;
+        enter = Math.max(enter, Math.min(near, far));
+        leave = Math.min(leave, Math.max(near, far));
+        if (enter > leave)
+            return null;
+    }
+    return { enter, leave };
+}
+/**
+ * The stretches of the line between two marks that no label's clearance blocks, in
+ * order along it and with the two marks themselves as its ends.
+ *
+ * Two of the boxes a caller hands over can block the same stretch, and one box can
+ * block two, so the stretches are merged before they are compared: the answer is a
+ * set of gaps rather than a set of obstacles, and a gap that counted twice would be
+ * a gap that won twice.
+ */
+function freeStretches(from, to, boxes) {
+    const length = Math.hypot(to.x - from.x, to.y - from.y);
+    const blocked = boxes
+        .map((box) => raySpan(from, to, box))
+        .filter((span) => span !== null)
+        .map((span) => ({
+        enter: Math.max(0, span.enter),
+        leave: Math.min(length, span.leave),
+    }))
+        .filter((span) => span.leave > span.enter)
+        .sort((a, b) => a.enter - b.enter);
+    const merged = [];
+    for (const span of blocked) {
+        const open = merged[merged.length - 1];
+        if (open && span.enter <= open.leave) {
+            open.leave = Math.max(open.leave, span.leave);
+        }
+        else {
+            merged.push({ ...span });
+        }
+    }
+    const gaps = [];
+    let walked = 0;
+    for (const span of merged) {
+        if (span.enter > walked)
+            gaps.push({ enter: walked, leave: span.enter });
+        walked = span.leave;
+    }
+    gaps.push({ enter: walked, leave: length });
+    return gaps;
+}
+/**
+ * The visible part of a stroke between two marks: the longest stretch of the line
+ * between them that no label blocks, held off each mark by the mark's own clearance.
+ *
+ * **Trim a segment against what it would actually enter, and nothing else.** A label
+ * is an obstacle only where the stroke runs, so each label is its own box and a
+ * stroke that misses it pays nothing for it. A name is printed under its mark and a
+ * note under that, so both sit below it, and a stroke leaving sideways runs along
+ * the mark's own centre line and enters neither. Backing a stroke off the mark by
+ * the half-width of the widest label at the node anyway pushed every connector on a
+ * six-stage rail back by up to fifty units from a six-unit mark: a row of circles
+ * with short line segments floating between them, which is a drawing of a shape and
+ * none of its relations. So the whole rail reaches both of its marks and nothing is
+ * trimmed there at all.
+ *
+ * **The stretch is the one the whole stroke fits in, and not two trims taken one at a
+ * time, because a label can block the corridor behind a mark rather than the mark
+ * itself.** A node's name and note sit below it at two different depths, so a
+ * stroke arriving from below runs through the name, out of it, and then back into the
+ * note further along: stopping where the name ends leaves the stroke sitting on top
+ * of the note. The drawn stroke is what has to be clear, so the whole line between
+ * the two marks is divided once and the longest unblocked stretch of it is drawn.
+ *
+ * **A mark's own edge plus the clearance is where an end sits when nothing blocks
+ * it.** A mark is a circle, so its edge is `mark` away in every direction, and the
+ * clearance is the gap that holds a stroke off the ink it belongs to. A line with no
+ * label on it therefore starts one clearance from the first mark and ends one
+ * clearance from the second, and that pair is the whole of what a stroke leaving a
+ * node sideways is allowed to cost.
+ *
+ * Two blocked stretches can leave nothing between them when a caller puts two marks
+ * close together, and a line trimmed away entirely is a line that silently did not
+ * draw, which is the one failure a figure in this package exists to make impossible.
+ * The mark boundaries are then the shortest stroke that still joins the two marks,
+ * and a caller who has put two marks on top of one another has already been told what
+ * that draws.
+ */
+export function strokeBetween(from, to, mark, fromLabels, toLabels) {
+    const dx = to.x - from.x;
+    const dy = to.y - from.y;
+    const length = Math.hypot(dx, dy);
+    if (length === 0)
+        return { from, to };
+    const ux = dx / length;
+    const uy = dy / length;
+    // Both nodes' labels, in one list, because the corridor between the marks is one
+    // corridor and a label of either end can be what blocks it. Each label is anchored
+    // to the mark it is printed under, which for one of them is not where this line
+    // starts.
+    const gaps = freeStretches(from, to, [
+        ...fromLabels.map((label) => labelBox(from, label)),
+        ...toLabels.map((label) => labelBox(to, label)),
+    ]);
+    const room = gaps.reduce((best, gap) => gap.leave - gap.enter > best.leave - best.enter ? gap : best);
+    const head = Math.max(room.enter, mark + INK_CLEARANCE);
+    const tail = Math.min(room.leave, length - mark - INK_CLEARANCE);
+    if (tail > head) {
+        return {
+            from: { x: from.x + ux * head, y: from.y + uy * head },
+            to: { x: from.x + ux * tail, y: from.y + uy * tail },
+        };
+    }
+    return {
+        from: { x: from.x + ux * mark, y: from.y + uy * mark },
+        to: { x: to.x - ux * mark, y: to.y - uy * mark },
+    };
+}
+/**
+ * The caller's points, fitted into the frame with their aspect ratio kept and the
+ * leftover shared out evenly.
+ *
+ * A caller whose points span one axis only, or who passes one item, gets the other
+ * axis centred rather than a division by zero: the scale is taken over the axes that
+ * have an extent, and a figure with no extent at all keeps the caller's own numbers.
+ */
+export function fitPoints(items, frame) {
+    const bottom = frame.bottom ?? frame.height - frame.padding;
+    if (items.length === 0) {
+        return () => ({ x: frame.width / 2, y: (frame.padding + bottom) / 2 });
+    }
+    const xs = items.map((item) => item.x);
+    const ys = items.map((item) => item.y);
+    const minX = Math.min(...xs);
+    const minY = Math.min(...ys);
+    const spanX = Math.max(...xs) - minX;
+    const spanY = Math.max(...ys) - minY;
+    const roomX = frame.width - frame.padding * 2;
+    const roomY = bottom - frame.padding;
+    const scale = Math.min(spanX === 0 ? Number.POSITIVE_INFINITY : roomX / spanX, spanY === 0 ? Number.POSITIVE_INFINITY : roomY / spanY);
+    const unit = Number.isFinite(scale) && scale > 0 ? scale : 1;
+    const offsetX = frame.padding + (roomX - spanX * unit) / 2 - minX * unit;
+    const offsetY = frame.padding + (roomY - spanY * unit) / 2 - minY * unit;
+    return (item) => ({ x: item.x * unit + offsetX, y: item.y * unit + offsetY });
+}

package/dist/live/run-stream-01/run-stream.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"run-stream.d.ts","sourceRoot":"","sources":["../../../src/live/run-stream-01/run-stream.tsx"],"names":[],"mappings":"AAQA;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEhE,6CAA6C;AAC7C,MAAM,MAAM,QAAQ,GAAG;IACrB,2FAA2F;IAC3F,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,YAAY,CAAA;IAClB,qEAAqE;IACrE,EAAE,EAAE,MAAM,CAAA;IACV,8CAA8C;IAC9C,OAAO,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,6FAA6F;AAC7F,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAA;AAE5E;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,KAAK,MAAM,IAAI,CAAA;AAE1E,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,SAAS,EAAE,YAAY,CAAA;IACvB;;;;;;;;;OASG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAChC;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,SAAS,QAAQ,EAAE,CAAA;IAC7B,gCAAgC;IAChC,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mFAAmF;IACnF,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;;;;OAOG;IACH,WAAW,EAAE,MAAM,CAAA;IACnB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AA8BD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,cAAc,EACd,OAAO,EACP,MAAM,EACN,WAAW,EACX,OAAO,EACP,KAAK,EACL,WAAW,EACX,UAAU,EACV,WAAW,EACX,SAAS,EACT,KAAW,EACX,SAAS,GACV,EAAE,gBAAgB,+BA8HlB;AAED,eAAe,WAAW,CAAA"}
+{"version":3,"file":"run-stream.d.ts","sourceRoot":"","sources":["../../../src/live/run-stream-01/run-stream.tsx"],"names":[],"mappings":"AASA;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,OAAO,GAAG,MAAM,GAAG,QAAQ,GAAG,OAAO,CAAA;AAEhE,6CAA6C;AAC7C,MAAM,MAAM,QAAQ,GAAG;IACrB,2FAA2F;IAC3F,EAAE,EAAE,MAAM,CAAA;IACV,IAAI,EAAE,YAAY,CAAA;IAClB,qEAAqE;IACrE,EAAE,EAAE,MAAM,CAAA;IACV,8CAA8C;IAC9C,OAAO,EAAE,MAAM,CAAA;IACf,gEAAgE;IAChE,MAAM,CAAC,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,6FAA6F;AAC7F,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,QAAQ,CAAA;AAE5E;;;;;;;;GAQG;AACH,MAAM,MAAM,YAAY,GAAG,CAAC,IAAI,EAAE,CAAC,KAAK,EAAE,QAAQ,KAAK,IAAI,KAAK,MAAM,IAAI,CAAA;AAE1E,MAAM,MAAM,gBAAgB,GAAG;IAC7B;;;;OAIG;IACH,SAAS,EAAE,YAAY,CAAA;IACvB;;;;;;;;;OASG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAChC;;;;;;;;OAQG;IACH,OAAO,CAAC,EAAE,SAAS,QAAQ,EAAE,CAAA;IAC7B,gCAAgC;IAChC,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,mFAAmF;IACnF,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,qEAAqE;IACrE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,8CAA8C;IAC9C,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;;;;;OAOG;IACH,WAAW,EAAE,MAAM,CAAA;IACnB,0DAA0D;IAC1D,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,8DAA8D;IAC9D,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AA8BD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgCG;AACH,wBAAgB,WAAW,CAAC,EAC1B,SAAS,EACT,cAAc,EACd,OAAO,EACP,MAAM,EACN,WAAW,EACX,OAAO,EACP,KAAK,EACL,WAAW,EACX,UAAU,EACV,WAAW,EACX,SAAS,EACT,KAAW,EACX,SAAS,GACV,EAAE,gBAAgB,+BA0IlB;AAED,eAAe,WAAW,CAAA"}

package/dist/live/run-stream-01/run-stream.js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useRef, useState } from 'react';
 import { LiveRegion } from '../../components/ui/live-region.js';
 import { ScrollArea } from '../../components/ui/scroll-area.js';
+import { headingSizeClass } from '../../components/ui/section.js';
 import { cn } from '../../lib/utils.js';
 /** The ink each role is stated in, and the tick beside it. */
 const ROLE_INK = {
@@ -106,6 +107,6 @@ export function RunStream01({ subscribe, resubscribeKey, initial, status, status
                 stop();
         };
     }, [subscribe, resubscribeKey, limit]);
-    return (_jsxs("section", { "data-slot": "run-stream", className: cn('border-border flex flex-col gap-4 rounded-lg border p-4', className), children: [LiveRegion({ politeness: 'polite', label: liveLabel, children: newest }), title !== undefined || eyebrow !== undefined || description !== undefined ? (_jsxs("header", { className: "flex flex-col gap-1", children: [eyebrow ? (_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: eyebrow })) : null, title ? _jsx("h2", { className: "text-lg font-semibold tracking-tight", children: title }) : null, description ? (_jsx("p", { className: "text-muted-foreground text-pretty text-sm", children: description })) : null] })) : null, status !== undefined ? (_jsx("p", { "data-slot": "run-status", className: cn('font-mono text-xs', STATUS_INK[status]), children: statusLabel })) : null, events.length === 0 ? (_jsx("p", { "data-slot": "run-stream-empty", className: "text-muted-foreground text-sm", children: emptyLabel })) : (_jsx(ScrollArea, { label: eventsLabel, className: "max-h-80", children: _jsx("ol", { "data-slot": "run-events", className: "flex flex-col gap-2", children: events.map((event) => (_jsxs("li", { "data-slot": "run-event", "data-role": event.role, className: "grid grid-cols-[auto_auto_1fr] items-baseline gap-x-3 gap-y-0.5", children: [_jsx("span", { "aria-hidden": "true", className: cn('font-mono text-xs', ROLE_INK[event.role]), children: ROLE_MARK[event.role] }), _jsx("time", { dateTime: new Date(event.at).toISOString(), className: "text-muted-foreground font-mono text-xs tabular-nums", children: new Date(event.at).toISOString().slice(11, 19) }), _jsxs("span", { className: cn('text-pretty text-sm', ROLE_INK[event.role]), children: [event.message, event.detail ? (_jsx("span", { className: "text-muted-foreground block font-mono text-xs", children: event.detail })) : null] })] }, event.id))) }) }))] }));
+    return (_jsxs("section", { "data-slot": "run-stream", className: cn('border-border flex flex-col gap-4 rounded-lg border p-4', className), children: [LiveRegion({ politeness: 'polite', label: liveLabel, children: newest }), title !== undefined || eyebrow !== undefined || description !== undefined ? (_jsxs("header", { className: "flex flex-col gap-1", children: [eyebrow ? (_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: eyebrow })) : null, title ? _jsx("h2", { className: cn('font-semibold tracking-tight text-balance', headingSizeClass('h2')), children: title }) : null, description ? (_jsx("p", { className: "text-muted-foreground text-pretty text-sm", children: description })) : null] })) : null, status !== undefined ? (_jsx("p", { "data-slot": "run-status", className: cn('font-mono text-xs', STATUS_INK[status]), children: statusLabel })) : null, events.length === 0 ? (_jsx("p", { "data-slot": "run-stream-empty", className: "text-muted-foreground text-sm", children: emptyLabel })) : (_jsx(ScrollArea, { label: eventsLabel, className: "max-h-80", children: _jsx("ol", { "data-slot": "run-events", className: "flex flex-col gap-2", children: events.map((event) => (_jsxs("li", { "data-slot": "run-event", "data-role": event.role, className: "grid grid-cols-[auto_auto_1fr] items-baseline gap-x-3 gap-y-0.5", children: [_jsx("span", { "aria-hidden": "true", className: cn('font-mono text-xs', ROLE_INK[event.role]), children: ROLE_MARK[event.role] }), _jsx("time", { dateTime: new Date(event.at).toISOString(), className: "text-muted-foreground font-mono text-xs tabular-nums", children: new Date(event.at).toISOString().slice(11, 19) }), _jsxs("span", { className: cn('text-pretty text-sm', ROLE_INK[event.role]), children: [event.message, event.detail ? (_jsx("span", { className: "text-muted-foreground block font-mono text-xs", children: event.detail })) : null] })] }, event.id))) }) }))] }));
 }
 export default RunStream01;

package/dist/pages/blog-post-page/index.d.ts

@@ -61,19 +61,26 @@ export type BlogPostPageProps = {
      */
     description?: string;
     /**
-     * The publication date, already formatted for display, and the machine value
-     * for the `time` element's `dateTime`. Both are props, and the machine one is
-     * required: `dateTime` is what a reader's browser, a feed reader and a search
-     * engine use to order posts, and a formatted string is none of those.
+     * The publication date as a reader reads it: already formatted, in words, in
+     * whatever convention the publishing site writes dates in. The Page renders this
+     * string verbatim and never touches it, and **it is the caller's to format**.
+     *
+     * It is a separate prop from `dateTime` precisely so the two can differ, and
+     * passing one value to both is refused rather than rendered: see the component
+     * JSDoc below for why the Page will not show a reader a machine date.
      */
     date: string;
     /**
      * The date in a machine-readable form, `YYYY-MM-DD`, carried on the `time`
      * element. Required, and deliberately not derived from `date`: parsing a
-     * formatted date back into an ISO one is a guess about a locale, and a guess
-     * in a `datetime` attribute is a wrong date in a feed.
+     * formatted date back into an ISO one is a guess about a locale, and a guess in
+     * a `datetime` attribute is a wrong date in a feed.
+     *
+     * Typed as the shape it is rather than as `string`, so a formatted string
+     * passed here is a compile error instead of a `datetime` attribute no reader can
+     * check.
      */
-    dateTime: string;
+    dateTime: `${number}-${number}-${number}`;
     /** Who wrote the post. A name, or a link to an author page. */
     author?: ReactNode;
     /**
@@ -145,14 +152,28 @@ export type BlogPostPageProps = {
  * its frontmatter to this Page. The Page is what makes the frontmatter a
  * contract, because a field that is not a prop is a field nothing checks.
  *
- * **The date is two props.** `date` is the words a reader sees and `dateTime` is
- * the machine value on the `time` element, and they are kept apart because
- * parsing a formatted date back into an ISO one is a guess about a locale. A
- * wrong date in a `datetime` attribute is a wrong date in a feed reader and in a
- * search result, and neither reader can see the string that was wrong. This is
- * the arrangement every one of the four sites needs and none of them has, because
- * each of them formats its date in one place and has nowhere else to put the ISO
- * value.
+ * **The date is two props, and the Page will not collapse them into one.** `date`
+ * is the words a reader sees and `dateTime` is the machine value on the `time`
+ * element, and they are kept apart because parsing a formatted date back into an
+ * ISO one is a guess about a locale. A wrong date in a `datetime` attribute is a
+ * wrong date in a feed reader and in a search result, and neither reader can see
+ * the string that was wrong.
+ *
+ * The other half of that is the one this Page now refuses. A Page that renders a
+ * date has no business making a reader parse `2026-09-26`, and the Page is the
+ * only place in a site where that sentence can be enforced rather than requested,
+ * because a consumer's own pipeline is where the date is a string and Prism is
+ * where it becomes a page. So `date` is the caller's to format, and handing this
+ * Page the same string in both slots is refused at render rather than shipped:
+ * all four NaniSoft sites did exactly that, because a prop called `date` taking a
+ * string is not obviously wrong, and the defect is invisible to every reviewer who
+ * does not open the page. `StackGrid01` refuses its own missing `ownLabel` for the
+ * same reason and by the same mechanism. The refusal is on the pair, not on the
+ * shape of either value: a site whose own convention writes dates as `2026-09-26`
+ * has the machine value on the element already, in the `datetime` attribute and in
+ * every feed, so displaying it a second time is a redundancy rather than a
+ * choice, and the `description` and `footer` slots are there for anything else the
+ * page wants to say about the post.
  *
  * The body is `children` and it is held by `Prose`, not by a set of per-element
  * props. A post's body is authored somewhere else - a Markdown pipeline, a CMS -

package/dist/pages/blog-post-page/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pages/blog-post-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQtC;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,gDAAgD;IAChD,QAAQ,EAAE,MAAM,CAAA;IAChB,4CAA4C;IAC5C,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;OAKG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;OAKG;IACH,QAAQ,EAAE,MAAM,CAAA;IAChB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,WAAW,EAAE,CAAA;IAC7B,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAA;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACxB;;;;OAIG;IACH,WAAW,EAAE,mBAAmB,CAAA;IAChC;;;;;;OAMG;IACH,UAAU,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAC7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAsCG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,UAAU,EACV,SAAS,EACT,MAAM,EACN,SAAS,GACV,EAAE,iBAAiB,+BAgFnB;AAED,eAAe,YAAY,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/pages/blog-post-page/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQtC;;;;;;GAMG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,2BAA2B;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,6DAA6D;IAC7D,IAAI,CAAC,EAAE,MAAM,CAAA;CACd,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,wBAAwB;IACxB,KAAK,EAAE,MAAM,CAAA;IACb,yBAAyB;IACzB,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAAG;IAChC,gDAAgD;IAChD,QAAQ,EAAE,MAAM,CAAA;IAChB,4CAA4C;IAC5C,IAAI,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B;;;OAGG;IACH,KAAK,EAAE,MAAM,CAAA;IACb;;;;;OAKG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;;;;;OAQG;IACH,IAAI,EAAE,MAAM,CAAA;IACZ;;;;;;;;;OASG;IACH,QAAQ,EAAE,GAAG,MAAM,IAAI,MAAM,IAAI,MAAM,EAAE,CAAA;IACzC,+DAA+D;IAC/D,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,WAAW,EAAE,CAAA;IAC7B,oEAAoE;IACpE,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAA;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,iBAAiB,CAAA;IAC5B,IAAI,CAAC,EAAE,iBAAiB,CAAA;IACxB;;;;OAIG;IACH,WAAW,EAAE,mBAAmB,CAAA;IAChC;;;;;;OAMG;IACH,UAAU,EAAE,MAAM,CAAA;IAClB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,iBAAiB,CAAA;IAC7B;;;;;OAKG;IACH,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoDG;AACH,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,IAAI,EACJ,QAAQ,EACR,MAAM,EACN,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,IAAI,EACJ,WAAW,EACX,UAAU,EACV,SAAS,EACT,MAAM,EACN,SAAS,GACV,EAAE,iBAAiB,+BA6FnB;AAED,eAAe,YAAY,CAAA"}

package/dist/pages/blog-post-page/index.js

@@ -3,7 +3,7 @@ import { Badge } from '../../components/ui/badge.js';
 import { CtaLink } from '../../components/ui/cta-link.js';
 import { Heading, Text } from '../../components/ui/typography.js';
 import { Prose } from '../../components/ui/prose.js';
-import { Section } from '../../components/ui/section.js';
+import { Section, headingSizeClass } from '../../components/ui/section.js';
 /**
  * A complete blog post screen: the title, the standfirst, the byline, the body at
  * the measure, and the trail to the neighbouring posts.
@@ -19,14 +19,28 @@ import { Section } from '../../components/ui/section.js';
  * its frontmatter to this Page. The Page is what makes the frontmatter a
  * contract, because a field that is not a prop is a field nothing checks.
  *
- * **The date is two props.** `date` is the words a reader sees and `dateTime` is
- * the machine value on the `time` element, and they are kept apart because
- * parsing a formatted date back into an ISO one is a guess about a locale. A
- * wrong date in a `datetime` attribute is a wrong date in a feed reader and in a
- * search result, and neither reader can see the string that was wrong. This is
- * the arrangement every one of the four sites needs and none of them has, because
- * each of them formats its date in one place and has nowhere else to put the ISO
- * value.
+ * **The date is two props, and the Page will not collapse them into one.** `date`
+ * is the words a reader sees and `dateTime` is the machine value on the `time`
+ * element, and they are kept apart because parsing a formatted date back into an
+ * ISO one is a guess about a locale. A wrong date in a `datetime` attribute is a
+ * wrong date in a feed reader and in a search result, and neither reader can see
+ * the string that was wrong.
+ *
+ * The other half of that is the one this Page now refuses. A Page that renders a
+ * date has no business making a reader parse `2026-09-26`, and the Page is the
+ * only place in a site where that sentence can be enforced rather than requested,
+ * because a consumer's own pipeline is where the date is a string and Prism is
+ * where it becomes a page. So `date` is the caller's to format, and handing this
+ * Page the same string in both slots is refused at render rather than shipped:
+ * all four NaniSoft sites did exactly that, because a prop called `date` taking a
+ * string is not obviously wrong, and the defect is invisible to every reviewer who
+ * does not open the page. `StackGrid01` refuses its own missing `ownLabel` for the
+ * same reason and by the same mechanism. The refusal is on the pair, not on the
+ * shape of either value: a site whose own convention writes dates as `2026-09-26`
+ * has the machine value on the element already, in the `datetime` attribute and in
+ * every feed, so displaying it a second time is a redundancy rather than a
+ * choice, and the `description` and `footer` slots are there for anything else the
+ * page wants to say about the post.
  *
  * The body is `children` and it is held by `Prose`, not by a set of per-element
  * props. A post's body is authored somewhere else - a Markdown pipeline, a CMS -
@@ -44,6 +58,17 @@ import { Section } from '../../components/ui/section.js';
  * document their pipeline produced.
  */
 export function BlogPostPage({ title, description, date, dateTime, author, tags, readingTime, children, previous, next, trailLabels, trailLabel, indexLink, footer, className, }) {
-    return (_jsxs(Section, { className: className, children: [_jsxs("article", { "data-slot": "blog-post", className: "flex flex-col gap-8", children: [_jsxs("header", { className: "flex flex-col gap-4", children: [_jsx(Heading, { as: "h1", size: "3xl", children: title }), description ? (_jsx(Text, { size: "lg", className: "text-muted-foreground max-w-measure", children: description })) : null, _jsxs("div", { className: "text-muted-foreground flex flex-wrap items-center gap-x-3 gap-y-2 text-sm", children: [author ? _jsx("span", { className: "text-foreground font-medium", children: author }) : null, _jsx("time", { dateTime: dateTime, children: date }), readingTime ? _jsx("span", { children: readingTime }) : null] }), tags && tags.length > 0 ? (_jsx("ul", { className: "flex flex-wrap items-center gap-2", children: tags.map((tag) => (_jsx("li", { children: tag.href ? (_jsx("a", { href: tag.href, className: "rounded-sm", "aria-label": `Posts tagged ${tag.label}`, children: _jsx(Badge, { variant: "secondary", children: tag.label }) })) : (_jsx(Badge, { variant: "secondary", children: tag.label })) }, tag.label))) })) : null] }), _jsx(Prose, { children: children }), previous || next ? (_jsxs("nav", { "aria-label": trailLabel, className: "border-border grid gap-4 border-t pt-6 sm:grid-cols-2", children: [previous ? (_jsxs("a", { href: previous.href, className: "flex flex-col gap-1 rounded-sm", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: trailLabels.previous }), _jsx("span", { className: "text-sm font-semibold", children: previous.title })] })) : null, next ? (_jsxs("a", { href: next.href, className: "flex flex-col gap-1 rounded-sm sm:items-end sm:text-right", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: trailLabels.next }), _jsx("span", { className: "text-sm font-semibold", children: next.title })] })) : null] })) : null, footer ? _jsx("div", { className: "border-border border-t pt-8", children: footer }) : null] }), indexLink ? (_jsx("div", { className: "mt-10 flex justify-center", children: _jsx(CtaLink, { href: indexLink.href, variant: "outline", children: indexLink.title }) })) : null] }));
+    // The one input this Page refuses, and the reason it is a refusal rather than a
+    // note in a JSDoc block. A JSDoc block is read by whoever is integrating Prism
+    // and by an agent reading the corpus; this line runs in the four consumer
+    // repositories the next time one of them builds, which is the only place the
+    // string that was wrong could still be changed.
+    if (date === dateTime) {
+        throw new Error('BlogPostPage: `date` and `dateTime` are the same string, so the Page has been handed no ' +
+            'display formatting and would put a machine value in front of a reader. `date` is the words ' +
+            'a reader sees and `dateTime` is the machine value on the `time` element; format `date` for ' +
+            'display and pass the ISO date as `dateTime`.');
+    }
+    return (_jsxs(Section, { className: className, children: [_jsxs("article", { "data-slot": "blog-post", className: "flex flex-col gap-8", children: [_jsxs("header", { className: "flex flex-col gap-4", children: [_jsx(Heading, { as: "h1", className: headingSizeClass('h1'), children: title }), description ? (_jsx(Text, { size: "lg", className: "text-muted-foreground max-w-measure", children: description })) : null, _jsxs("div", { className: "text-muted-foreground flex flex-wrap items-center gap-x-3 gap-y-2 text-sm", children: [author ? _jsx("span", { className: "text-foreground font-medium", children: author }) : null, _jsx("time", { dateTime: dateTime, children: date }), readingTime ? _jsx("span", { children: readingTime }) : null] }), tags && tags.length > 0 ? (_jsx("ul", { className: "flex flex-wrap items-center gap-2", children: tags.map((tag) => (_jsx("li", { children: tag.href ? (_jsx("a", { href: tag.href, className: "rounded-sm", "aria-label": `Posts tagged ${tag.label}`, children: _jsx(Badge, { variant: "secondary", children: tag.label }) })) : (_jsx(Badge, { variant: "secondary", children: tag.label })) }, tag.label))) })) : null] }), _jsx(Prose, { children: children }), previous || next ? (_jsxs("nav", { "aria-label": trailLabel, className: "border-border grid gap-4 border-t pt-6 sm:grid-cols-2", children: [previous ? (_jsxs("a", { href: previous.href, className: "flex flex-col gap-1 rounded-sm", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: trailLabels.previous }), _jsx("span", { className: "text-sm font-semibold", children: previous.title })] })) : null, next ? (_jsxs("a", { href: next.href, className: "flex flex-col gap-1 rounded-sm sm:items-end sm:text-right", children: [_jsx("span", { className: "text-muted-foreground text-xs font-medium tracking-wide uppercase", children: trailLabels.next }), _jsx("span", { className: "text-sm font-semibold", children: next.title })] })) : null] })) : null, footer ? _jsx("div", { className: "border-border border-t pt-8", children: footer }) : null] }), indexLink ? (_jsx("div", { className: "mt-10 flex justify-center", children: _jsx(CtaLink, { href: indexLink.href, variant: "outline", children: indexLink.title }) })) : null] }));
 }
 export default BlogPostPage;