@arraypress/covers 1.3.1 → 1.4.0

package/src/type/symbols.d.ts

@@ -1,7 +1,7 @@
 // Built-in symbols, drawn as shapes (the last glyph fallback).
 import type { LoadedFont } from '../fonts.js';
 
-/** The symbol face: ✺ ✦ ✶ ★ ☆ ♥ ♡ ▶ ◀ ● ◆ ■ ♪. */
+/** The symbol face: ✺ ✦ ✶ ★ ☆ ♥ ♡ ▶ ◀ ● ◆ ■ ♪ ≠. */
 export function symbolFace(): LoadedFont;
 /** The characters it draws. */
 export const SYMBOLS: string;

package/src/type/symbols.js

@@ -1,6 +1,6 @@
 /**
  * A built-in face of a few symbols type often wants and fonts often lack
- * (✺ ✦ ✶ ★ ☆ ♥ ♡ ▶ ◀ ● ◆ ■ ♪), drawn as shapes. The last fallback when a
+ * (✺ ✦ ✶ ★ ☆ ♥ ♡ ▶ ◀ ● ◆ ■ ♪ ≠), drawn as shapes. The last fallback when a
  * text layer's font has no glyph for a character.
  *
  * @module type/symbols
@@ -38,6 +38,23 @@ function heart(k) {
 /** @param {number} r @param {number} [n=48] @returns {[number, number][]} */
 const circle = (r, n = 48) => Array.from({ length: n }, (_, i) => /** @type {[number, number]} */ ([CX + r * Math.sin((i / n) * Math.PI * 2), CY + r * Math.cos((i / n) * Math.PI * 2)]));
 
+/**
+ * Not-equal, on a narrower advance (`NARROW`): two bars and a slash, one
+ * contour each, all wound alike so they fill as one.
+ *
+ * @returns {string}
+ */
+function notEqual() {
+  const cx = NARROW / 2;
+  const [half, bar, gap, lean, stem] = [230, 62, 112, 150, 31];
+  const rect = (/** @type {number} */ y) => poly([[cx - half, y + bar / 2], [cx + half, y + bar / 2], [cx + half, y - bar / 2], [cx - half, y - bar / 2]]);
+  const slash = poly([[cx + lean - stem, CY + 300], [cx + lean + stem, CY + 300], [cx - lean + stem, CY - 300], [cx - lean - stem, CY - 300]]);
+  return rect(CY + gap) + rect(CY - gap) + slash;
+}
+
+/** Advance of the narrow symbols (≠), font units. */
+const NARROW = 600;
+
 /** Outlines by character. An inner contour runs the other way (a hole). */
 const SHAPES = /** @type {Record<string, string>} */ ({
   '✺': poly(star(16, 0.5)),
@@ -53,6 +70,7 @@ const SHAPES = /** @type {Record<string, string>} */ ({
   '◆': poly([[CX, CY + R], [CX + R * 0.8, CY], [CX, CY - R], [CX - R * 0.8, CY]]),
   '■': poly([[CX - R * 0.75, CY + R * 0.75], [CX + R * 0.75, CY + R * 0.75], [CX + R * 0.75, CY - R * 0.75], [CX - R * 0.75, CY - R * 0.75]]),
   '♪': poly([[CX - 40, CY + R], [CX + 220, CY + R * 0.7], [CX + 220, CY + R * 0.45], [CX + 20, CY + R * 0.72], [CX + 20, CY - R * 0.55], [CX - 40, CY - R * 0.55]]) + poly(circle(110).map(([x, y]) => /** @type {[number, number]} */ ([x - 120, y - R * 0.6]))),
+  '≠': notEqual(),
 });
 
 const CHARS = Object.keys(SHAPES);
@@ -80,7 +98,7 @@ export function symbolFace() {
     variations: {},
     source: { name: 'symbols', src: 'covers:symbols', weight: 400 },
     glyphToPath: (/** @type {number} */ gid) => SHAPES[CHARS[gid - 1]] ?? '',
-    shapeRun: (/** @type {string} */ text) => Array.from(text).map((ch, i) => ({ gid: CHARS.indexOf(ch) + 1, cluster: i, xAdvance: ADV, xOffset: 0, yOffset: 0 })),
+    shapeRun: (/** @type {string} */ text) => Array.from(text).map((ch, i) => ({ gid: CHARS.indexOf(ch) + 1, cluster: i, xAdvance: ch === '≠' ? NARROW : ADV, xOffset: 0, yOffset: 0 })),
   };
   return face;
 }

package/src/type/typeset.js

@@ -24,7 +24,8 @@
  * - **Live text**: `render: 'live'` writes `<text>` with the font embedded
  *   by `@font-face` (or linked by URL), laid out the same way, for in-browser
  *   speed and selectable text.
- * - **Mixed runs**: `spans`, each with its own font, weight, size, colour.
+ * - **Mixed runs**: `spans`, each with its own font, weight, size, colour;
+ *   or `content` lines as span objects (`{ content, bold }`), one a line.
  * - **Per-glyph control**: `glyphs: { scale, dx, dy, rotate, color }` arrays.
  * - **Fallback**: characters the font lacks come from `fallback`, fonts
  *   registered with `fallback: true`, or the built-in symbols.
@@ -52,7 +53,7 @@ import { fontFace } from './live.js';
 import { autoColor } from './auto-color.js';
 import { fallbackFaces, shapeText } from './fallback.js';
 import { controlGlyphs, glyphCount } from './glyphs.js';
-import { loadSpans, spanLines, shapeSpans, spanText } from './spans.js';
+import { loadSpans, spanLines, shapeSpans, spanText, lineSpans } from './spans.js';
 import { recordLayout } from './layout-ref.js';
 import { marquee } from '../animate/marquee.js';
 
@@ -83,6 +84,9 @@ export function wantsType(layer) {
  * @returns {Promise<import('../layers.js').Markup>}
  */
 export async function typeset(layer, ctx) {
+  // Lines given as span objects (a headline whose lines change weight) are spans.
+  const perLine = lineSpans(layer.content);
+  if (perLine) layer = { ...layer, content: undefined, spans: perLine };
   const rawContent = Array.isArray(layer.content) ? layer.content.join('\n') : layer.content && typeof layer.content === 'object' ? layer.content.content : layer.content;
   const kase = layer.transform === 'uppercase' || layer.transform === 'lowercase' ? layer.transform : undefined;
   let content = layer.spans ? '' : caseText(String(rawContent ?? ''), kase);

package/src/version.js

@@ -1,4 +1,4 @@
 // Generated by scripts/generate.mjs from package.json. Do not edit.
 
 /** The package version, part of every cache key. */
-export const VERSION = '1.3.1';
+export const VERSION = '1.4.0';