@kensio/colophon 2.4.0 → 2.6.0

package/dist/templates/article/index.js

@@ -0,0 +1,42 @@
+import { drawLines } from "../../layout/index.js";
+import { contentArea, imageFrame, markRoom } from "../frame.js";
+import { logoElement, logoRect } from "../logo.js";
+import { articleBottom } from "./bottom.js";
+import { articleLines, bylineParts } from "./lines.js";
+import { tagBand } from "./tags.js";
+/**
+ * The default blog card: tags along the top, the headline and its standfirst
+ * in the middle, and who wrote it and when along the bottom.
+ *
+ * It reads `tags`, `author` and `date` on top of the usual `title` and
+ * `subtitle`, and draws the `avatar` prop beside the byline rather than beside
+ * the footer. That leaves the two ends of the bottom line saying different
+ * things: who wrote this post at the left, and whose site it is at the right.
+ */
+export const articleTemplate = {
+    name: "article",
+    render({ props, config, dimensions, measure, logo, avatar, }) {
+        const { width, height } = dimensions;
+        const { fontFamily, colors } = config;
+        const said = bylineParts(props);
+        const frame = imageFrame(dimensions, config, avatar, {
+            footer: said.length > 0,
+        });
+        const { pad } = frame;
+        const mark = logoRect(logo, dimensions, pad, "start");
+        const chips = tagBand(props, config, dimensions, pad, markRoom(mark?.width, pad), measure);
+        const topMark = Math.max(chips.height, mark?.height ?? 0);
+        const area = contentArea(frame, markRoom(topMark, Math.round(height * 0.035)));
+        const body = drawLines(articleLines(props, {
+            measure,
+            fontFamily,
+            contentWidth: area.width,
+            titleFs: Math.round(height * 0.082),
+            standfirstFs: Math.round(height * 0.042),
+            height,
+        }), area, { fontFamily, fill: colors.foreground, lineHeight: 1.28 });
+        const bottom = articleBottom(said, config, frame, width, avatar, measure);
+        return chips.svg + logoElement(logo, mark) + body + bottom;
+    },
+};
+//# sourceMappingURL=index.js.map

package/dist/templates/article/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/templates/article/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAChE,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACnD,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AACvD,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AAEpC;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,eAAe,GAAa;IACvC,IAAI,EAAE,SAAS;IACf,MAAM,CAAC,EACL,KAAK,EACL,MAAM,EACN,UAAU,EACV,OAAO,EACP,IAAI,EACJ,MAAM,GACU;QAChB,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;QACrC,MAAM,EAAE,UAAU,EAAE,MAAM,EAAE,GAAG,MAAM,CAAC;QACtC,MAAM,IAAI,GAAG,WAAW,CAAC,KAAK,CAAC,CAAC;QAChC,MAAM,KAAK,GAAG,UAAU,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE;YACnD,MAAM,EAAE,IAAI,CAAC,MAAM,GAAG,CAAC;SACxB,CAAC,CAAC;QACH,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;QACtB,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,EAAE,UAAU,EAAE,GAAG,EAAE,OAAO,CAAC,CAAC;QAEtD,MAAM,KAAK,GAAG,OAAO,CACnB,KAAK,EACL,MAAM,EACN,UAAU,EACV,GAAG,EACH,QAAQ,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,CAAC,EAC1B,OAAO,CACR,CAAC;QAEF,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,EAAE,IAAI,EAAE,MAAM,IAAI,CAAC,CAAC,CAAC;QAC1D,MAAM,IAAI,GAAG,WAAW,CACtB,KAAK,EACL,QAAQ,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC,CAC9C,CAAC;QAEF,MAAM,IAAI,GAAG,SAAS,CACpB,YAAY,CAAC,KAAK,EAAE;YAClB,OAAO;YACP,UAAU;YACV,YAAY,EAAE,IAAI,CAAC,KAAK;YACxB,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;YACnC,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;YACxC,MAAM;SACP,CAAC,EACF,IAAI,EACJ,EAAE,UAAU,EAAE,IAAI,EAAE,MAAM,CAAC,UAAU,EAAE,UAAU,EAAE,IAAI,EAAE,CAC1D,CAAC;QAEF,MAAM,MAAM,GAAG,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,CAAC;QAE1E,OAAO,KAAK,CAAC,GAAG,GAAG,WAAW,CAAC,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,GAAG,MAAM,CAAC;IAC7D,CAAC;CACF,CAAC"}

package/dist/templates/article/lines.d.ts

@@ -0,0 +1,27 @@
+import type { TextLine } from "../../layout/index.js";
+import type { MeasureText, MetaImageProps } from "../../types.js";
+/** The space the article's text has, and how to measure it into it. */
+export interface ArticleText {
+    readonly measure: MeasureText;
+    readonly fontFamily: string;
+    readonly contentWidth: number;
+    readonly titleFs: number;
+    readonly standfirstFs: number;
+    readonly height: number;
+}
+/** The headline, then the standfirst under it. */
+export declare function articleLines(props: MetaImageProps, text: ArticleText): TextLine[];
+/**
+ * The byline in the two forms it can take: who wrote it and when, then who
+ * wrote it alone.
+ *
+ * The bottom line is shared with the site's own footer, so there is not always
+ * room for both. Dropping the date is a better answer than cutting the line,
+ * which on a square image lands in the middle of the month. Either may be
+ * missing to begin with, and a post with neither leaves the avatar to stand
+ * for both.
+ */
+export declare function bylineParts(props: MetaImageProps): readonly string[];
+/** The byline as the post would have it, before any of it is given up. */
+export declare function bylineText(props: MetaImageProps): string;
+//# sourceMappingURL=lines.d.ts.map

package/dist/templates/article/lines.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"lines.d.ts","sourceRoot":"","sources":["../../../src/templates/article/lines.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,OAAO,KAAK,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAUlE,uEAAuE;AACvE,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC;IAC9B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,OAAO,EAAE,MAAM,CAAC;IACzB,QAAQ,CAAC,YAAY,EAAE,MAAM,CAAC;IAC9B,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAC;CACzB;AAED,kDAAkD;AAClD,wBAAgB,YAAY,CAC1B,KAAK,EAAE,cAAc,EACrB,IAAI,EAAE,WAAW,GAChB,QAAQ,EAAE,CAsBZ;AAED;;;;;;;;;GASG;AACH,wBAAgB,WAAW,CAAC,KAAK,EAAE,cAAc,GAAG,SAAS,MAAM,EAAE,CASpE;AAED,0EAA0E;AAC1E,wBAAgB,UAAU,CAAC,KAAK,EAAE,cAAc,GAAG,MAAM,CAExD"}

package/dist/templates/article/lines.js

@@ -0,0 +1,53 @@
+import { blockLines, optionalString } from "../../layout/index.js";
+const maxTitleLines = 4;
+const maxStandfirstLines = 3;
+const titleFloor = 0.6;
+const standfirstFloor = 0.8;
+/** What goes between the author and the date. */
+const separator = " · ";
+/** The headline, then the standfirst under it. */
+export function articleLines(props, text) {
+    const { measure, fontFamily, contentWidth } = text;
+    return [
+        ...blockLines(props.title, measure, fontFamily, {
+            maxWidth: contentWidth,
+            maxLines: maxTitleLines,
+            fontSize: text.titleFs,
+            floor: titleFloor,
+            fontWeight: 800,
+            opacity: 1,
+        }),
+        ...blockLines(props.subtitle, measure, fontFamily, {
+            maxWidth: contentWidth,
+            maxLines: maxStandfirstLines,
+            fontSize: text.standfirstFs,
+            floor: standfirstFloor,
+            fontWeight: 500,
+            opacity: 0.85,
+            gapBefore: Math.round(text.height * 0.03),
+        }),
+    ];
+}
+/**
+ * The byline in the two forms it can take: who wrote it and when, then who
+ * wrote it alone.
+ *
+ * The bottom line is shared with the site's own footer, so there is not always
+ * room for both. Dropping the date is a better answer than cutting the line,
+ * which on a square image lands in the middle of the month. Either may be
+ * missing to begin with, and a post with neither leaves the avatar to stand
+ * for both.
+ */
+export function bylineParts(props) {
+    const author = optionalString(props["author"]) ?? "";
+    const date = optionalString(props["date"]) ?? "";
+    if (author === "" || date === "") {
+        return [author === "" ? date : author].filter((part) => part !== "");
+    }
+    return [`${author}${separator}${date}`, author];
+}
+/** The byline as the post would have it, before any of it is given up. */
+export function bylineText(props) {
+    return bylineParts(props)[0] ?? "";
+}
+//# sourceMappingURL=lines.js.map

package/dist/templates/article/lines.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"lines.js","sourceRoot":"","sources":["../../../src/templates/article/lines.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AAGnE,MAAM,aAAa,GAAG,CAAC,CAAC;AACxB,MAAM,kBAAkB,GAAG,CAAC,CAAC;AAC7B,MAAM,UAAU,GAAG,GAAG,CAAC;AACvB,MAAM,eAAe,GAAG,GAAG,CAAC;AAE5B,iDAAiD;AACjD,MAAM,SAAS,GAAG,KAAK,CAAC;AAYxB,kDAAkD;AAClD,MAAM,UAAU,YAAY,CAC1B,KAAqB,EACrB,IAAiB;IAEjB,MAAM,EAAE,OAAO,EAAE,UAAU,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC;IAEnD,OAAO;QACL,GAAG,UAAU,CAAC,KAAK,CAAC,KAAK,EAAE,OAAO,EAAE,UAAU,EAAE;YAC9C,QAAQ,EAAE,YAAY;YACtB,QAAQ,EAAE,aAAa;YACvB,QAAQ,EAAE,IAAI,CAAC,OAAO;YACtB,KAAK,EAAE,UAAU;YACjB,UAAU,EAAE,GAAG;YACf,OAAO,EAAE,CAAC;SACX,CAAC;QACF,GAAG,UAAU,CAAC,KAAK,CAAC,QAAQ,EAAE,OAAO,EAAE,UAAU,EAAE;YACjD,QAAQ,EAAE,YAAY;YACtB,QAAQ,EAAE,kBAAkB;YAC5B,QAAQ,EAAE,IAAI,CAAC,YAAY;YAC3B,KAAK,EAAE,eAAe;YACtB,UAAU,EAAE,GAAG;YACf,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;SAC1C,CAAC;KACH,CAAC;AACJ,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,UAAU,WAAW,CAAC,KAAqB;IAC/C,MAAM,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,IAAI,EAAE,CAAC;IACrD,MAAM,IAAI,GAAG,cAAc,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,CAAC;IAEjD,IAAI,MAAM,KAAK,EAAE,IAAI,IAAI,KAAK,EAAE,EAAE,CAAC;QACjC,OAAO,CAAC,MAAM,KAAK,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,KAAK,EAAE,CAAC,CAAC;IACvE,CAAC;IAED,OAAO,CAAC,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI,EAAE,EAAE,MAAM,CAAC,CAAC;AAClD,CAAC;AAED,0EAA0E;AAC1E,MAAM,UAAU,UAAU,CAAC,KAAqB;IAC9C,OAAO,WAAW,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC;AACrC,CAAC"}

package/dist/templates/article/tags.d.ts

@@ -0,0 +1,25 @@
+import type { Rect } from "../../layout/index.js";
+import type { Dimensions, MeasureText, MetaImageProps, ResolvedConfig } from "../../types.js";
+import type { PillStyle } from "../pill.js";
+/**
+ * A row of tags along the top of the image.
+ *
+ * Tags that do not fit are dropped rather than being wrapped onto a second
+ * line or shrunk. A post's tag list is written for its own pages, where there
+ * is a sidebar to hold all nine of them, and the share image wants the first
+ * two or three of that list as a hint at the subject. Growing to fit them all
+ * would take the room the title is drawn in.
+ */
+export declare function tagRow(tags: readonly string[], area: Rect, style: PillStyle, measure: MeasureText): string;
+/**
+ * The row of tags along the top, and how much room it took.
+ *
+ * Both are wanted at once: the tags are drawn from the top margin, and the
+ * headline underneath starts below whichever of them and the logo reaches
+ * furthest down.
+ */
+export declare function tagBand(props: MetaImageProps, config: ResolvedConfig, dimensions: Dimensions, pad: number, reserved: number, measure: MeasureText): {
+    readonly svg: string;
+    readonly height: number;
+};
+//# sourceMappingURL=tags.d.ts.map

package/dist/templates/article/tags.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tags.d.ts","sourceRoot":"","sources":["../../../src/templates/article/tags.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAClD,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,cAAc,EACd,cAAc,EACf,MAAM,gBAAgB,CAAC;AACxB,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAS5C;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CACpB,IAAI,EAAE,SAAS,MAAM,EAAE,EACvB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,SAAS,EAChB,OAAO,EAAE,WAAW,GACnB,MAAM,CA6BR;AAED;;;;;;GAMG;AACH,wBAAgB,OAAO,CACrB,KAAK,EAAE,cAAc,EACrB,MAAM,EAAE,cAAc,EACtB,UAAU,EAAE,UAAU,EACtB,GAAG,EAAE,MAAM,EACX,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,WAAW,GACnB;IAAE,QAAQ,CAAC,GAAG,EAAE,MAAM,CAAC;IAAC,QAAQ,CAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAyBnD"}

package/dist/templates/article/tags.js

@@ -0,0 +1,63 @@
+import { row, stringList } from "../../layout/index.js";
+import { pill, pillWidth } from "../pill.js";
+/** The tags' height, as a fraction of the image's. */
+const heightScale = 0.05;
+/** Space between one tag and the next, as a fraction of their height. */
+const gapScale = 0.3;
+/**
+ * A row of tags along the top of the image.
+ *
+ * Tags that do not fit are dropped rather than being wrapped onto a second
+ * line or shrunk. A post's tag list is written for its own pages, where there
+ * is a sidebar to hold all nine of them, and the share image wants the first
+ * two or three of that list as a hint at the subject. Growing to fit them all
+ * would take the room the title is drawn in.
+ */
+export function tagRow(tags, area, style, measure) {
+    const gap = Math.round(area.height * gapScale);
+    const widths = [];
+    let used = 0;
+    for (const tag of tags) {
+        const width = pillWidth(tag, area.height, style, measure);
+        const advance = width + (widths.length === 0 ? 0 : gap);
+        if (used + advance > area.width) {
+            break;
+        }
+        widths.push(width);
+        used += advance;
+    }
+    const placed = row(widths.map((size, index) => ({
+        size,
+        ...(index > 0 && { gapBefore: gap }),
+    })), area, "start");
+    return placed
+        .map((rect, index) => pill(tags[index] ?? "", rect, style))
+        .join("");
+}
+/**
+ * The row of tags along the top, and how much room it took.
+ *
+ * Both are wanted at once: the tags are drawn from the top margin, and the
+ * headline underneath starts below whichever of them and the logo reaches
+ * furthest down.
+ */
+export function tagBand(props, config, dimensions, pad, reserved, measure) {
+    const tags = stringList(props["tags"]);
+    const height = tags.length === 0 ? 0 : Math.round(dimensions.height * heightScale);
+    return {
+        height,
+        svg: tagRow(tags, {
+            x: pad,
+            y: pad,
+            width: dimensions.width - pad * 2 - reserved,
+            height,
+        }, {
+            fontFamily: config.fontFamily,
+            fontWeight: 700,
+            fill: config.colors.foreground,
+            background: config.colors.foreground,
+            backgroundOpacity: 0.16,
+        }, measure),
+    };
+}
+//# sourceMappingURL=tags.js.map

package/dist/templates/article/tags.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tags.js","sourceRoot":"","sources":["../../../src/templates/article/tags.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AASxD,OAAO,EAAE,IAAI,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE7C,sDAAsD;AACtD,MAAM,WAAW,GAAG,IAAI,CAAC;AAEzB,yEAAyE;AACzE,MAAM,QAAQ,GAAG,GAAG,CAAC;AAErB;;;;;;;;GAQG;AACH,MAAM,UAAU,MAAM,CACpB,IAAuB,EACvB,IAAU,EACV,KAAgB,EAChB,OAAoB;IAEpB,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,QAAQ,CAAC,CAAC;IAC/C,MAAM,MAAM,GAAa,EAAE,CAAC;IAC5B,IAAI,IAAI,GAAG,CAAC,CAAC;IAEb,KAAK,MAAM,GAAG,IAAI,IAAI,EAAE,CAAC;QACvB,MAAM,KAAK,GAAG,SAAS,CAAC,GAAG,EAAE,IAAI,CAAC,MAAM,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAC1D,MAAM,OAAO,GAAG,KAAK,GAAG,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;QAExD,IAAI,IAAI,GAAG,OAAO,GAAG,IAAI,CAAC,KAAK,EAAE,CAAC;YAChC,MAAM;QACR,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QACnB,IAAI,IAAI,OAAO,CAAC;IAClB,CAAC;IAED,MAAM,MAAM,GAAG,GAAG,CAChB,MAAM,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;QAC3B,IAAI;QACJ,GAAG,CAAC,KAAK,GAAG,CAAC,IAAI,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC;KACrC,CAAC,CAAC,EACH,IAAI,EACJ,OAAO,CACR,CAAC;IAEF,OAAO,MAAM;SACV,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,EAAE,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;SAC1D,IAAI,CAAC,EAAE,CAAC,CAAC;AACd,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,OAAO,CACrB,KAAqB,EACrB,MAAsB,EACtB,UAAsB,EACtB,GAAW,EACX,QAAgB,EAChB,OAAoB;IAEpB,MAAM,IAAI,GAAG,UAAU,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;IACvC,MAAM,MAAM,GACV,IAAI,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,CAAC,MAAM,GAAG,WAAW,CAAC,CAAC;IAEtE,OAAO;QACL,MAAM;QACN,GAAG,EAAE,MAAM,CACT,IAAI,EACJ;YACE,CAAC,EAAE,GAAG;YACN,CAAC,EAAE,GAAG;YACN,KAAK,EAAE,UAAU,CAAC,KAAK,GAAG,GAAG,GAAG,CAAC,GAAG,QAAQ;YAC5C,MAAM;SACP,EACD;YACE,UAAU,EAAE,MAAM,CAAC,UAAU;YAC7B,UAAU,EAAE,GAAG;YACf,IAAI,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU;YAC9B,UAAU,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU;YACpC,iBAAiB,EAAE,IAAI;SACxB,EACD,OAAO,CACR;KACF,CAAC;AACJ,CAAC"}

package/dist/templates/attribution.d.ts

@@ -1,11 +1,7 @@
 import type { ImageAsset, MeasureText, ResolvedConfig } from "../types.js";
-import type { FooterPlacement } from "./footer.js";
+import type { PortraitPlacement } from "./portrait.js";
 /** Where the attribution line goes: a footer placement, plus room to lay it out. */
-export interface AttributionPlacement extends FooterPlacement {
-    /** Left edge and width of the content area the line is set within. */
-    readonly left: number;
-    readonly width: number;
-}
+export type AttributionPlacement = PortraitPlacement;
 /**
  * The footer line, with the post's avatar before it.
  *

package/dist/templates/attribution.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"attribution.d.ts","sourceRoot":"","sources":["../../src/templates/attribution.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAC3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAYnD,oFAAoF;AACpF,MAAM,WAAW,oBAAqB,SAAQ,eAAe;IAC3D,sEAAsE;IACtE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,MAAM,CAAC;CACxB;AAED;;;;;;GAMG;AACH,wBAAgB,WAAW,CACzB,MAAM,EAAE,cAAc,EACtB,SAAS,EAAE,oBAAoB,EAC/B,MAAM,EAAE,UAAU,GAAG,SAAS,EAC9B,OAAO,EAAE,WAAW,GACnB,MAAM,CAqCR"}
+{"version":3,"file":"attribution.d.ts","sourceRoot":"","sources":["../../src/templates/attribution.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE3E,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAMvD,oFAAoF;AACpF,MAAM,MAAM,oBAAoB,GAAG,iBAAiB,CAAC;AAErD;;;;;;GAMG;AACH,wBAAgB,WAAW,CACzB,MAAM,EAAE,cAAc,EACtB,SAAS,EAAE,oBAAoB,EAC/B,MAAM,EAAE,UAAU,GAAG,SAAS,EAC9B,OAAO,EAAE,WAAW,GACnB,MAAM,CAgBR"}

package/dist/templates/attribution.js

@@ -1,10 +1,7 @@
-import { image, measureIn, row } from "../layout/index.js";
+import { measureIn } from "../layout/index.js";
 import { footerElement, hasFooter } from "./footer.js";
-/** The avatar's diameter, as a multiple of the footer's font size. */
-const avatarScale = 1.9;
-/** Where a circular avatar's centre sits above the footer's baseline. */
-const avatarRise = 0.34;
-/** Unique within one image, which is as many avatars as there are. */
+import { portraitImage, portraitRow } from "./portrait.js";
+/** Unique within one image, which is as many footer avatars as there are. */
 const avatarId = "colophon-avatar";
 /**
  * The footer line, with the post's avatar before it.
@@ -17,23 +14,12 @@ export function attribution(config, placement, avatar, measure) {
     if (avatar === undefined) {
         return footerElement(config, placement);
     }
-    const { fontSize } = placement;
-    const size = Math.round(fontSize * avatarScale);
     const text = hasFooter(config) ? (config.footer ?? "") : "";
-    const gap = text === "" ? 0 : Math.round(fontSize * 0.5);
-    const textWidth = text === ""
+    const width = text === ""
         ? 0
-        : measureIn(measure, config.fontFamily, 500)(text, fontSize);
-    // Only the horizontal placement comes from the row. The baseline is the one
-    // the template asked for, so a footer with no avatar and a footer with one
-    // sit at the same height.
-    const [portrait, label] = row([{ size }, { size: Math.round(textWidth), gapBefore: gap }], { x: placement.left, y: placement.y, width: placement.width, height: size }, placement.anchor === "middle" ? "centre" : "start");
-    const top = Math.round(placement.y - fontSize * avatarRise - size / 2);
-    return (image({ x: portrait?.x ?? placement.left, y: top, width: size, height: size }, avatar.href, { fit: "cover", radius: Math.round(size / 2), id: avatarId }) +
-        footerElement(config, {
-            ...placement,
-            x: label?.x ?? placement.left,
-            anchor: "start",
-        }));
+        : measureIn(measure, config.fontFamily, 500)(text, placement.fontSize);
+    const { rect, labelX } = portraitRow(placement, width);
+    return (portraitImage(avatar, rect, avatarId) +
+        footerElement(config, { ...placement, x: labelX, anchor: "start" }));
 }
 //# sourceMappingURL=attribution.js.map

package/dist/templates/attribution.js.map

@@ -1 +1 @@
-{"version":3,"file":"attribution.js","sourceRoot":"","sources":["../../src/templates/attribution.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,oBAAoB,CAAC;AAG3D,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAEvD,sEAAsE;AACtE,MAAM,WAAW,GAAG,GAAG,CAAC;AAExB,yEAAyE;AACzE,MAAM,UAAU,GAAG,IAAI,CAAC;AAExB,sEAAsE;AACtE,MAAM,QAAQ,GAAG,iBAAiB,CAAC;AASnC;;;;;;GAMG;AACH,MAAM,UAAU,WAAW,CACzB,MAAsB,EACtB,SAA+B,EAC/B,MAA8B,EAC9B,OAAoB;IAEpB,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,OAAO,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAC1C,CAAC;IAED,MAAM,EAAE,QAAQ,EAAE,GAAG,SAAS,CAAC;IAC/B,MAAM,IAAI,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,WAAW,CAAC,CAAC;IAChD,MAAM,IAAI,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,QAAQ,GAAG,GAAG,CAAC,CAAC;IACzD,MAAM,SAAS,GACb,IAAI,KAAK,EAAE;QACT,CAAC,CAAC,CAAC;QACH,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAEjE,4EAA4E;IAC5E,2EAA2E;IAC3E,0BAA0B;IAC1B,MAAM,CAAC,QAAQ,EAAE,KAAK,CAAC,GAAG,GAAG,CAC3B,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,EAAE,SAAS,EAAE,GAAG,EAAE,CAAC,EAC3D,EAAE,CAAC,EAAE,SAAS,CAAC,IAAI,EAAE,CAAC,EAAE,SAAS,CAAC,CAAC,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,EAC3E,SAAS,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO,CACnD,CAAC;IAEF,MAAM,GAAG,GAAG,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,GAAG,QAAQ,GAAG,UAAU,GAAG,IAAI,GAAG,CAAC,CAAC,CAAC;IAEvE,OAAO,CACL,KAAK,CACH,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,IAAI,SAAS,CAAC,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,EACvE,MAAM,CAAC,IAAI,EACX,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,CAC7D;QACD,aAAa,CAAC,MAAM,EAAE;YACpB,GAAG,SAAS;YACZ,CAAC,EAAE,KAAK,EAAE,CAAC,IAAI,SAAS,CAAC,IAAI;YAC7B,MAAM,EAAE,OAAO;SAChB,CAAC,CACH,CAAC;AACJ,CAAC"}
+{"version":3,"file":"attribution.js","sourceRoot":"","sources":["../../src/templates/attribution.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAEvD,OAAO,EAAE,aAAa,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE3D,6EAA6E;AAC7E,MAAM,QAAQ,GAAG,iBAAiB,CAAC;AAKnC;;;;;;GAMG;AACH,MAAM,UAAU,WAAW,CACzB,MAAsB,EACtB,SAA+B,EAC/B,MAA8B,EAC9B,OAAoB;IAEpB,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,OAAO,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAC1C,CAAC;IAED,MAAM,IAAI,GAAG,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAC5D,MAAM,KAAK,GACT,IAAI,KAAK,EAAE;QACT,CAAC,CAAC,CAAC;QACH,CAAC,CAAC,SAAS,CAAC,OAAO,EAAE,MAAM,CAAC,UAAU,EAAE,GAAG,CAAC,CAAC,IAAI,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;IAC3E,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,WAAW,CAAC,SAAS,EAAE,KAAK,CAAC,CAAC;IAEvD,OAAO,CACL,aAAa,CAAC,MAAM,EAAE,IAAI,EAAE,QAAQ,CAAC;QACrC,aAAa,CAAC,MAAM,EAAE,EAAE,GAAG,SAAS,EAAE,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,CAAC,CACpE,CAAC;AACJ,CAAC"}

package/dist/templates/banner/badge-props.d.ts

@@ -0,0 +1,16 @@
+import type { Badge, MetaImageProps, ResolvedConfig } from "../../types.js";
+/**
+ * The badge to draw: the one the post declares, or the configured one where it
+ * declares nothing.
+ *
+ * A badge in config is the same badge on every image a site renders, and a
+ * post the badge does not describe has no other way to be rid of it. `false`
+ * is that way out, and an object is the same door in the other direction, so a
+ * post can carry a badge of its own without the config knowing about it.
+ *
+ * Anything else is a mistake in the frontmatter. It is reported and the
+ * configured badge is drawn, which leaves the post with the image it would
+ * have had if it had said nothing at all.
+ */
+export declare function badgeFor(props: MetaImageProps, config: ResolvedConfig): Badge | undefined;
+//# sourceMappingURL=badge-props.d.ts.map

package/dist/templates/banner/badge-props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge-props.d.ts","sourceRoot":"","sources":["../../../src/templates/banner/badge-props.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,cAAc,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAgC5E;;;;;;;;;;;;GAYG;AACH,wBAAgB,QAAQ,CACtB,KAAK,EAAE,cAAc,EACrB,MAAM,EAAE,cAAc,GACrB,KAAK,GAAG,SAAS,CA6BnB"}

package/dist/templates/banner/badge-props.js

@@ -0,0 +1,58 @@
+import { optionalString } from "../../props.js";
+/**
+ * Read a badge out of the object a post declared, field by field, the way
+ * every other prop is read. What frontmatter yields is a plain value rather
+ * than the interface the compiler was shown, so a badge is built here from
+ * what is actually there instead of being passed along as one.
+ *
+ * Returns `undefined` for an object carrying no text, since the text is the
+ * badge and there is nothing to draw without it.
+ */
+function badgeFromProps(declared) {
+    const text = optionalString("text" in declared ? declared.text : undefined);
+    if (text === undefined || text === "") {
+        return undefined;
+    }
+    const color = optionalString("color" in declared ? declared.color : undefined);
+    const background = optionalString("background" in declared ? declared.background : undefined);
+    return {
+        text,
+        ...(color !== undefined && { color }),
+        ...(background !== undefined && { background }),
+    };
+}
+/**
+ * The badge to draw: the one the post declares, or the configured one where it
+ * declares nothing.
+ *
+ * A badge in config is the same badge on every image a site renders, and a
+ * post the badge does not describe has no other way to be rid of it. `false`
+ * is that way out, and an object is the same door in the other direction, so a
+ * post can carry a badge of its own without the config knowing about it.
+ *
+ * Anything else is a mistake in the frontmatter. It is reported and the
+ * configured badge is drawn, which leaves the post with the image it would
+ * have had if it had said nothing at all.
+ */
+export function badgeFor(props, config) {
+    // Widened because this arrives from a post's frontmatter: the declared type
+    // is what a project means to write, not what the file holds.
+    const declared = props.badge;
+    if (declared === undefined) {
+        return config.badge;
+    }
+    if (declared === false) {
+        return undefined;
+    }
+    const badge = typeof declared === "object" && declared !== null
+        ? badgeFromProps(declared)
+        : undefined;
+    if (badge === undefined) {
+        config.onWarning("props.badge is neither a badge nor false, so the configured badge was" +
+            " drawn. Give it an object with the `text` to draw, or `false` for no" +
+            " badge on this image.");
+        return config.badge;
+    }
+    return badge;
+}
+//# sourceMappingURL=badge-props.js.map

package/dist/templates/banner/badge-props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"badge-props.js","sourceRoot":"","sources":["../../../src/templates/banner/badge-props.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAGhD;;;;;;;;GAQG;AACH,SAAS,cAAc,CAAC,QAAgB;IACtC,MAAM,IAAI,GAAG,cAAc,CAAC,MAAM,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE5E,IAAI,IAAI,KAAK,SAAS,IAAI,IAAI,KAAK,EAAE,EAAE,CAAC;QACtC,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,KAAK,GAAG,cAAc,CAC1B,OAAO,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CACjD,CAAC;IACF,MAAM,UAAU,GAAG,cAAc,CAC/B,YAAY,IAAI,QAAQ,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAC,CAAC,SAAS,CAC3D,CAAC;IAEF,OAAO;QACL,IAAI;QACJ,GAAG,CAAC,KAAK,KAAK,SAAS,IAAI,EAAE,KAAK,EAAE,CAAC;QACrC,GAAG,CAAC,UAAU,KAAK,SAAS,IAAI,EAAE,UAAU,EAAE,CAAC;KAChD,CAAC;AACJ,CAAC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,UAAU,QAAQ,CACtB,KAAqB,EACrB,MAAsB;IAEtB,4EAA4E;IAC5E,6DAA6D;IAC7D,MAAM,QAAQ,GAAY,KAAK,CAAC,KAAK,CAAC;IAEtC,IAAI,QAAQ,KAAK,SAAS,EAAE,CAAC;QAC3B,OAAO,MAAM,CAAC,KAAK,CAAC;IACtB,CAAC;IAED,IAAI,QAAQ,KAAK,KAAK,EAAE,CAAC;QACvB,OAAO,SAAS,CAAC;IACnB,CAAC;IAED,MAAM,KAAK,GACT,OAAO,QAAQ,KAAK,QAAQ,IAAI,QAAQ,KAAK,IAAI;QAC/C,CAAC,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC1B,CAAC,CAAC,SAAS,CAAC;IAEhB,IAAI,KAAK,KAAK,SAAS,EAAE,CAAC;QACxB,MAAM,CAAC,SAAS,CACd,uEAAuE;YACrE,sEAAsE;YACtE,uBAAuB,CAC1B,CAAC;QAEF,OAAO,MAAM,CAAC,KAAK,CAAC;IACtB,CAAC;IAED,OAAO,KAAK,CAAC;AACf,CAAC"}

package/dist/templates/banner/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/templates/banner/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAmB,MAAM,gBAAgB,CAAC;AAOhE;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,QAmF5B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/templates/banner/index.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAmB,MAAM,gBAAgB,CAAC;AAQhE;;;;;;;;GAQG;AACH,eAAO,MAAM,cAAc,EAAE,QA8E5B,CAAC"}

package/dist/templates/banner/index.js

@@ -3,6 +3,7 @@ import { optionalString } from "../../props.js";
 import { attribution } from "../attribution.js";
 import { footerBaseline, hasFooter } from "../footer.js";
 import { logoElement, logoRect } from "../logo.js";
+import { badgeFor } from "./badge-props.js";
 import { renderBadge } from "./badge.js";
 import { bannerLines } from "./lines.js";
 /**
@@ -23,11 +24,12 @@ export const bannerTemplate = {
         const footerFs = Math.round(height * 0.034);
         const badgeHeight = Math.round(height * 0.072);
         const mark = logoRect(logo, dimensions, pad, "start");
+        const badge = badgeFor(props, config);
         const subtitle = optionalString(props.subtitle);
         const hasSubtitle = subtitle !== undefined && subtitle !== "";
         // The text sits between whatever the marks along the top and the footer
         // along the bottom leave behind.
-        const topMark = Math.max(config.badge === undefined ? 0 : badgeHeight, mark?.height ?? 0);
+        const topMark = Math.max(badge === undefined ? 0 : badgeHeight, mark?.height ?? 0);
         const area = inset({ x: 0, y: 0, width, height }, {
             top: pad + (topMark === 0 ? 0 : topMark + Math.round(height * 0.03)),
             right: pad,
@@ -51,9 +53,9 @@ export const bannerTemplate = {
             fill: config.colors.foreground,
             lineHeight: 1.28,
         });
-        const badge = config.badge === undefined
+        const badgeMark = badge === undefined
             ? ""
-            : renderBadge(config.badge, fontFamily, config.colors.brand, pad, badgeHeight);
+            : renderBadge(badge, fontFamily, config.colors.brand, pad, badgeHeight);
         const footer = attribution(config, {
             x: pad,
             y: footerBaseline(height, pad, footerFs),
@@ -62,7 +64,7 @@ export const bannerTemplate = {
             left: pad,
             width: width - pad * 2,
         }, avatar, measure);
-        return badge + logoElement(logo, mark) + body + footer;
+        return badgeMark + logoElement(logo, mark) + body + footer;
     },
 };
 //# sourceMappingURL=index.js.map

package/dist/templates/banner/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/templates/banner/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/templates/banner/index.ts"],"names":[],"mappings":"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"}

package/dist/templates/banner/version.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../../src/templates/banner/version.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAErD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C;;;GAGG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,cAAc,EACrB,KAAK,EAAE,WAAW,GACjB,SAAS,QAAQ,EAAE,CAgBrB"}
+{"version":3,"file":"version.d.ts","sourceRoot":"","sources":["../../../src/templates/banner/version.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AACrD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAC;AAEtD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,YAAY,CAAC;AAE9C;;;GAGG;AACH,wBAAgB,YAAY,CAC1B,KAAK,EAAE,cAAc,EACrB,KAAK,EAAE,WAAW,GACjB,SAAS,QAAQ,EAAE,CAgBrB"}

package/dist/templates/banner/version.js

@@ -1,16 +1,16 @@
-import { optionalString } from "../../props.js";
+import { versionLabel } from "../version.js";
 /**
  * The version line, or nothing where there is no version. It is never wrapped
  * or shrunk: a version string that needed either would not be one.
  */
 export function versionLines(props, sizes) {
-    const version = optionalString(props.version);
-    if (version === undefined || version === "") {
+    const version = versionLabel(props.version);
+    if (version === undefined) {
         return [];
     }
     return [
         {
-            text: `v${version}`,
+            text: version,
             fontSize: sizes.versionFs,
             fontWeight: 700,
             opacity: 0.85,

package/dist/templates/banner/version.js.map

@@ -1 +1 @@
-{"version":3,"file":"version.js","sourceRoot":"","sources":["../../../src/templates/banner/version.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAC;AAIhD;;;GAGG;AACH,MAAM,UAAU,YAAY,CAC1B,KAAqB,EACrB,KAAkB;IAElB,MAAM,OAAO,GAAG,cAAc,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAE9C,IAAI,OAAO,KAAK,SAAS,IAAI,OAAO,KAAK,EAAE,EAAE,CAAC;QAC5C,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO;QACL;YACE,IAAI,EAAE,IAAI,OAAO,EAAE;YACnB,QAAQ,EAAE,KAAK,CAAC,SAAS;YACzB,UAAU,EAAE,GAAG;YACf,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;SAC3C;KACF,CAAC;AACJ,CAAC"}
+{"version":3,"file":"version.js","sourceRoot":"","sources":["../../../src/templates/banner/version.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,MAAM,eAAe,CAAC;AAG7C;;;GAGG;AACH,MAAM,UAAU,YAAY,CAC1B,KAAqB,EACrB,KAAkB;IAElB,MAAM,OAAO,GAAG,YAAY,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAE5C,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,OAAO,EAAE,CAAC;IACZ,CAAC;IAED,OAAO;QACL;YACE,IAAI,EAAE,OAAO;YACb,QAAQ,EAAE,KAAK,CAAC,SAAS;YACzB,UAAU,EAAE,GAAG;YACf,OAAO,EAAE,IAAI;YACb,SAAS,EAAE,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,IAAI,CAAC;SAC3C;KACF,CAAC;AACJ,CAAC"}

package/dist/templates/bottom.d.ts

@@ -0,0 +1,23 @@
+import type { LinesStyle, Rect, TextLine } from "../layout/index.js";
+import type { ImageAsset, MeasureText, ResolvedConfig } from "../types.js";
+import type { Frame } from "./frame.js";
+/**
+ * The footer line as most templates want it: on the bottom margin, across the
+ * content width, with the post's avatar before it where there is one.
+ *
+ * Every template ends with the same dozen lines of placement, which is a dozen
+ * chances for one of them to drift from the rest. A template wanting something
+ * else, such as the `article` with its byline at the other end of the same
+ * line, still calls `attribution` itself.
+ */
+export declare function footerLine(config: ResolvedConfig, frame: Frame, imageWidth: number, avatar: ImageAsset | undefined, measure: MeasureText, align?: "start" | "middle", opacity?: number): string;
+/**
+ * Draw a block of lines in a slot a `stack` handed back, or nothing where
+ * there was no slot to draw it in.
+ *
+ * A stack returns one rectangle per item, so the missing case never happens;
+ * it is the type that says otherwise, and every template that stacks its text
+ * would otherwise carry the same conditional to prove it.
+ */
+export declare function drawSlot(lines: readonly TextLine[], slot: Rect | undefined, style: LinesStyle): string;
+//# sourceMappingURL=bottom.d.ts.map

package/dist/templates/bottom.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bottom.d.ts","sourceRoot":"","sources":["../../src/templates/bottom.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAC;AACrE,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAE3E,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,YAAY,CAAC;AAKxC;;;;;;;;GAQG;AACH,wBAAgB,UAAU,CACxB,MAAM,EAAE,cAAc,EACtB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,MAAM,EAClB,MAAM,EAAE,UAAU,GAAG,SAAS,EAC9B,OAAO,EAAE,WAAW,EACpB,KAAK,GAAE,OAAO,GAAG,QAAkB,EACnC,OAAO,GAAE,MAAuB,GAC/B,MAAM,CAiBR;AAED;;;;;;;GAOG;AACH,wBAAgB,QAAQ,CACtB,KAAK,EAAE,SAAS,QAAQ,EAAE,EAC1B,IAAI,EAAE,IAAI,GAAG,SAAS,EACtB,KAAK,EAAE,UAAU,GAChB,MAAM,CAER"}

package/dist/templates/bottom.js

@@ -0,0 +1,37 @@
+import { drawLines } from "../layout/index.js";
+import { attribution } from "./attribution.js";
+/** How faint the footer is against the image's own text. */
+const defaultOpacity = 0.75;
+/**
+ * The footer line as most templates want it: on the bottom margin, across the
+ * content width, with the post's avatar before it where there is one.
+ *
+ * Every template ends with the same dozen lines of placement, which is a dozen
+ * chances for one of them to drift from the rest. A template wanting something
+ * else, such as the `article` with its byline at the other end of the same
+ * line, still calls `attribution` itself.
+ */
+export function footerLine(config, frame, imageWidth, avatar, measure, align = "start", opacity = defaultOpacity) {
+    const { pad } = frame;
+    return attribution(config, {
+        x: align === "middle" ? Math.round(imageWidth / 2) : pad,
+        y: frame.footerY,
+        fontSize: frame.footerFontSize,
+        opacity,
+        ...(align === "middle" && { anchor: "middle" }),
+        left: pad,
+        width: imageWidth - pad * 2,
+    }, avatar, measure);
+}
+/**
+ * Draw a block of lines in a slot a `stack` handed back, or nothing where
+ * there was no slot to draw it in.
+ *
+ * A stack returns one rectangle per item, so the missing case never happens;
+ * it is the type that says otherwise, and every template that stacks its text
+ * would otherwise carry the same conditional to prove it.
+ */
+export function drawSlot(lines, slot, style) {
+    return slot === undefined ? "" : drawLines(lines, slot, style);
+}
+//# sourceMappingURL=bottom.js.map

package/dist/templates/bottom.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"bottom.js","sourceRoot":"","sources":["../../src/templates/bottom.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG/C,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAG/C,4DAA4D;AAC5D,MAAM,cAAc,GAAG,IAAI,CAAC;AAE5B;;;;;;;;GAQG;AACH,MAAM,UAAU,UAAU,CACxB,MAAsB,EACtB,KAAY,EACZ,UAAkB,EAClB,MAA8B,EAC9B,OAAoB,EACpB,KAAK,GAAuB,OAAO,EACnC,OAAO,GAAW,cAAc;IAEhC,MAAM,EAAE,GAAG,EAAE,GAAG,KAAK,CAAC;IAEtB,OAAO,WAAW,CAChB,MAAM,EACN;QACE,CAAC,EAAE,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG;QACxD,CAAC,EAAE,KAAK,CAAC,OAAO;QAChB,QAAQ,EAAE,KAAK,CAAC,cAAc;QAC9B,OAAO;QACP,GAAG,CAAC,KAAK,KAAK,QAAQ,IAAI,EAAE,MAAM,EAAE,QAAiB,EAAE,CAAC;QACxD,IAAI,EAAE,GAAG;QACT,KAAK,EAAE,UAAU,GAAG,GAAG,GAAG,CAAC;KAC5B,EACD,MAAM,EACN,OAAO,CACR,CAAC;AACJ,CAAC;AAED;;;;;;;GAOG;AACH,MAAM,UAAU,QAAQ,CACtB,KAA0B,EAC1B,IAAsB,EACtB,KAAiB;IAEjB,OAAO,IAAI,KAAK,SAAS,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,CAAC;AACjE,CAAC"}

package/dist/templates/byline.d.ts

@@ -0,0 +1,19 @@
+import type { ImageAsset, MeasureText } from "../types.js";
+import type { PortraitPlacement } from "./portrait.js";
+/** How a byline is set, which is the part the footer takes from config. */
+export interface BylineStyle {
+    readonly fontFamily: string;
+    readonly fontWeight: number;
+    readonly fill: string;
+}
+/**
+ * A line of the template's own words with the post's avatar before it: an
+ * author and a date on an article, the person a quotation is from.
+ *
+ * This is `attribution` with the text opened up. The footer says who published
+ * the site and is the same on every image; a byline says who wrote this one,
+ * so it comes from the props. Both are a picture and a line of type on one
+ * baseline, and both are drawn by {@link portraitRow}.
+ */
+export declare function byline(text: string, placement: PortraitPlacement, style: BylineStyle, avatar: ImageAsset | undefined, measure: MeasureText): string;
+//# sourceMappingURL=byline.d.ts.map

package/dist/templates/byline.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"byline.d.ts","sourceRoot":"","sources":["../../src/templates/byline.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAC3D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AAMvD,2EAA2E;AAC3E,MAAM,WAAW,WAAW;IAC1B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,UAAU,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;CACvB;AAED;;;;;;;;GAQG;AACH,wBAAgB,MAAM,CACpB,IAAI,EAAE,MAAM,EACZ,SAAS,EAAE,iBAAiB,EAC5B,KAAK,EAAE,WAAW,EAClB,MAAM,EAAE,UAAU,GAAG,SAAS,EAC9B,OAAO,EAAE,WAAW,GACnB,MAAM,CAyCR"}