@quario/layout 0.1.0 → 0.2.0

package/lib/page.js

@@ -49,12 +49,6 @@ let marginOf = (margin = 54, width, height, path) => {
   return margin;
 };
 
-// This layout's baseline type size. Not a host option: a document's type size
-// is the document's own, so it is `style.size` on the report and the number
-// here is only what text renders at when nothing declares one. The XLSX target
-// carries the same 10 for the same reason (docs/adr/0014, docs/adr/0033).
-let BASE = 10;
-
 // Size is settled at the factory; margin may come from the document's
 // `report-start`, so a render peeks that event before opening a canvas.
 /** @type {(page: any) => any} */
@@ -95,5 +89,5 @@ export let pageBox = (page, at = "page") => {
 export let geometry = (page = {}, opening) => {
   let { width, height } = pageBox(page, "options.page");
   let chosen = marginChoice(opening, page, "options.page");
-  return frame(width, height, marginOf(chosen.value, width, height, chosen.path), BASE);
+  return frame(width, height, marginOf(chosen.value, width, height, chosen.path));
 };

package/lib/paint.js

@@ -183,9 +183,6 @@ let paintText = (ctx, op) => {
   }
 };
 
-/** @type {(ctx: CanvasRenderingContext2D, op: any, bitmap: ImageBitmap) => void} */
-let paintImage = (ctx, op, bitmap) => ctx.drawImage(bitmap, op.x, op.y, op.w, op.h);
-
 // The marking, as the PDF draws it: translucent grey along the page diagonal,
 // turned counter-clockwise by the list's angle. The canvas reads down, so the
 // turn is negative here.
@@ -207,7 +204,8 @@ let PAINTERS = { rect: paintRect, line: paintLine, text: paintText, mark: paintM
 
 /** @type {(ctx: CanvasRenderingContext2D, op: Op, bitmaps: Map<Op, ImageBitmap>) => void} */
 let paintOp = (ctx, op, bitmaps) => {
-  if (op.kind === "image") paintImage(ctx, op, /** @type {ImageBitmap} */ (bitmaps.get(op)));
+  if (op.kind === "image")
+    ctx.drawImage(/** @type {ImageBitmap} */ (bitmaps.get(op)), op.x, op.y, op.w, op.h);
   else PAINTERS[op.kind](ctx, op);
 };
 
@@ -225,6 +223,13 @@ let decode = async (page) => {
  * the canvas, so it knows. `fonts` is the host's font mapping, the same
  * record given to `layout()`, so a TrueType family draws in its own face.
  *
+ * It awaits its faces and images before it draws, and it draws whatever
+ * happened in between: a canvas re-sized under a call still in flight is
+ * filled at that call's own `scale`, not the size it now has. A caller that
+ * repaints one canvas at changing scales owns that, by not letting a
+ * superseded call reach a canvas still on screen — which is what the viewer's
+ * stage retires a page for (docs/adr/0046).
+ *
  * @param {CanvasRenderingContext2D} ctx The context to paint on.
  * @param {Page} page One page of a `Layout`.
  * @param {{ scale?: number, fonts?: any }} [options]

package/lib/style.js

@@ -44,6 +44,13 @@ let BLACK = { r: 0, g: 0, b: 0 };
 let SHIFT = { right: 1, center: 0.5 };
 /** @type {(align: any, extra: number) => number} */
 let shift = (align, extra) => (Object.hasOwn(SHIFT, align) ? SHIFT[align] : 0) * extra;
+// The same for the leftover height -- the slack a box has over its content,
+// which is the only place `valign` is legal (CONTEXT.md "Box"). Top keeps it,
+// bottom takes all of it, middle takes half; undeclared is top.
+/** @type {Record<string, number>} */
+let VSHIFT = { bottom: 1, middle: 0.5 };
+/** @type {(valign: any, extra: number) => number} */
+let vshift = (valign, extra) => (Object.hasOwn(VSHIFT, valign) ? VSHIFT[valign] : 0) * extra;
 
 // A declared colour as a `Color`, or null when the value is not one.
 /** @type {(value: any) => Color | null} */
@@ -62,7 +69,8 @@ let sizeOf = (style, base) => (Number.isFinite(style.size) && style.size > 0 ? s
 // Style blocks layer outward-in: row under cell, split under slot. Those are
 // the two innermost of the four layers; the outer two reach a node without
 // being merged into it -- the band-role default through `roled` below, and the
-// report default through the canvas, as `layout.js`'s `adoptDefault` explains.
+// report default through the render's settings, as `canvas.js`'s
+// `adoptSettings` explains.
 /** @type {(under: any, over: any) => any} */
 let merge = (under, over) => (under ? (over ? { ...under, ...over } : under) : over || {});
 
@@ -101,4 +109,19 @@ let dressed = (style) => !!(style && (style.underline || style.strikethrough));
 /** @type {(style: any) => boolean} */
 let upper = (style) => !!(style && style.uppercase);
 
-export { BAND, BLACK, GUTTER, LEAD, PADX, PADY, col, dressed, merge, roled, shift, sizeOf, upper };
+export {
+  BAND,
+  BLACK,
+  GUTTER,
+  LEAD,
+  PADX,
+  PADY,
+  col,
+  dressed,
+  merge,
+  roled,
+  shift,
+  sizeOf,
+  upper,
+  vshift,
+};

package/lib/text.js

@@ -7,15 +7,12 @@ import { display, format } from "quario";
 import { ascOf, face, printable, width } from "./fonts.js";
 import { LEAD, col, dressed, sizeOf, upper } from "./style.js";
 
-// What measuring needs and no more: the embedded faces to measure against, and
-// the base size and family a style falls back to — the report default's two
-// declarations, which the canvas carries for the whole render. A `Canvas`
-// satisfies it, so callers pass theirs straight in — but nothing here can
-// touch a page.
-/**
- * @typedef {{ fonts: import('./fonts.js').Fonts, base: number,
- *   family: string | null, locale?: string, currency?: string, timeZone?: string }} Metrics
- */
+// What measuring needs and no more, and it is exactly the render's settings:
+// the faces to measure against, the base size and family a style falls back to,
+// and the intl three a formatted value resolves in. Declared next door, in
+// `canvas.js`, where it is built and settled — nothing here can touch a page,
+// and a caller hands over `canvas.settings` rather than the canvas.
+/** @typedef {import('./canvas.js').Settings} Settings */
 
 /**
  * @typedef {{ text: string, font: any, size: number, color: any,
@@ -29,10 +26,10 @@ import { LEAD, col, dressed, sizeOf, upper } from "./style.js";
 
 /** @typedef {{ cur: Atom[], w: number, lines: Line[], base: number }} Wrap */
 
-/** @type {(token: any, style: any, metrics: Metrics) => string} */
-let rawOf = (token, style, metrics) => {
+/** @type {(token: any, style: any, settings: Settings) => string} */
+let rawOf = (token, style, settings) => {
   if ("literal" in token) return token.literal;
-  return format(token.value, style?.format, metrics) ?? display(token.value);
+  return format(token.value, style?.format, settings) ?? display(token.value);
 };
 
 // This layout has no text-transform to defer to, so `uppercase` is applied to
@@ -43,12 +40,9 @@ let rawOf = (token, style, metrics) => {
 /** @type {(text: string, style: any) => string} */
 let cased = (text, style) => (upper(style) ? text.toUpperCase() : text);
 
-/** @type {(font: any, line: string) => string[]} */
-let partsOf = (font, line) => printable(font, line).split(/( +)/).filter(Boolean);
-
 /** @type {(out: Atom[], font: any, size: number, color: any, line: string) => void} */
 let pushParts = (out, font, size, color, line) => {
-  for (let part of partsOf(font, line))
+  for (let part of printable(font, line).split(/( +)/).filter(Boolean))
     out.push({ text: part, font, size, color, space: part[0] === " ", hard: false });
 };
 
@@ -58,12 +52,12 @@ let pushLine = (out, font, size, color, i, line) => {
   pushParts(out, font, size, color, line);
 };
 
-/** @type {(metrics: Metrics, style: any) => { font: any, size: number, color: any }} */
-let look = (metrics, style) => {
+/** @type {(settings: Settings, style: any) => { font: any, size: number, color: any }} */
+let look = (settings, style) => {
   let resolved = style || {};
   return {
-    font: face(metrics.fonts, resolved, metrics.family),
-    size: sizeOf(resolved, metrics.base),
+    font: face(settings.fonts, resolved, settings.family),
+    size: sizeOf(resolved, settings.base),
     color: col(resolved.color),
   };
 };
@@ -71,12 +65,12 @@ let look = (metrics, style) => {
 // Flatten a cell's tokens to word/space atoms carrying the cell's resolved
 // typography — one face, size and colour for the whole cell. CR, LF, and
 // CRLF are one hard break each (SCHEMA.md, Cell values).
-/** @type {(metrics: Metrics, tokens: any[], style: any) => Atom[]} */
-let atoms = (metrics, tokens, style) => {
+/** @type {(settings: Settings, tokens: any[], style: any) => Atom[]} */
+let atoms = (settings, tokens, style) => {
   let out = /** @type {Atom[]} */ ([]);
-  let { font, size, color } = look(metrics, style);
+  let { font, size, color } = look(settings, style);
   for (let token of tokens)
-    for (let [i, line] of cased(rawOf(token, style, metrics), style)
+    for (let [i, line] of cased(rawOf(token, style, settings), style)
       .split(/\r\n|\r|\n/)
       .entries())
       pushLine(out, font, size, color, i, line);
@@ -228,8 +222,8 @@ let placeAtom = (state, atom, avail) => {
 // breaks by character, hard breaks always break. A cell's atoms share one
 // typography, so a line's atoms merge into a single draw piece. `size` is the
 // empty-run height — a blank item, a hard-break hole.
-/** @type {(metrics: Metrics, list: Atom[], avail: number, size: number) => Line[]} */
-let wrap = (metrics, list, avail, size) => {
+/** @type {(list: Atom[], avail: number, size: number) => Line[]} */
+let wrap = (list, avail, size) => {
   /** @type {Wrap} */
   let state = { cur: [], w: 0, lines: [], base: size };
   for (let atom of list) placeAtom(state, atom, avail);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quario/layout",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "The paged display list for quario — the layout the PDF target writes and the viewer paints — in the makings, not yet released",
   "homepage": "https://getquario.com",
   "license": "SEE LICENSE IN LICENSE",
@@ -40,18 +40,19 @@
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.3",
-    "@pdf-lib/fontkit": "^1.1.1",
     "@size-limit/preset-small-lib": "^13.0.3",
-    "quario": "^0.4.0",
+    "@types/fontkit": "^2.0.9",
+    "fontkit": "^2.0.4",
+    "quario": "^0.5.0",
     "size-limit": "^13.0.3",
     "typescript": "^7.0.2"
   },
   "peerDependencies": {
-    "@pdf-lib/fontkit": "^1.1.1",
-    "quario": "^0.4.0"
+    "fontkit": "^2.0.4",
+    "quario": "^0.5.0"
   },
   "peerDependenciesMeta": {
-    "@pdf-lib/fontkit": {
+    "fontkit": {
       "optional": true
     }
   },