autokap 1.0.7 → 1.0.8

package/dist/svg-text.d.ts

@@ -0,0 +1,61 @@
+/**
+ * SVG text rendering via fontkit.
+ *
+ * Converts text strings to native SVG `<path>` elements by laying out glyphs
+ * with fontkit and serializing each glyph's vector path. This avoids depending
+ * on a system font installation or any HTML rendering layer (no Playwright).
+ *
+ * Coordinate system:
+ *   - SVG uses Y-down. Font glyphs use Y-up with the baseline at y=0.
+ *   - We flip Y while serializing each glyph's path commands.
+ *   - The caller passes a baseline Y position; glyphs are placed relative to it.
+ *
+ * Vertical alignment helper:
+ *   - Use `baselineForCenteredText` to compute the baseline Y so the cap-height
+ *     visual centroid lines up with the parent box's vertical centre. This
+ *     matches what `display:flex; align-items:center; line-height:1` produces
+ *     in CSS for the SF Pro status bar layouts.
+ */
+import { type SfFontId } from './fonts-loader.js';
+export interface MeasuredText {
+    /** SVG path data string for the entire run, ready for `<path d="...">`. */
+    pathData: string;
+    /** Visual width in CSS pixels (includes glyph advances + kerning). */
+    width: number;
+    /** Cap height in CSS pixels at this font size. */
+    capHeight: number;
+    /** Ascent in CSS pixels at this font size. */
+    ascent: number;
+    /** Descent in CSS pixels at this font size (positive). */
+    descent: number;
+}
+export interface TextRunOptions {
+    text: string;
+    fontId: SfFontId;
+    fontSize: number;
+    /** Optional letter-spacing in CSS pixels (positive widens, negative tightens). */
+    letterSpacing?: number;
+    /** Origin X (left of the first glyph's pen position). Defaults to 0. */
+    x?: number;
+    /** Baseline Y for the run. Defaults to `fontSize` (top-aligned). */
+    baselineY?: number;
+}
+/**
+ * Lay out a text run and serialize each glyph's vector path into a single
+ * SVG path data string. Y is flipped on the fly so the result is ready to
+ * embed in an SVG document with the standard top-left origin.
+ */
+export declare function layoutText(opts: TextRunOptions): MeasuredText;
+/** Measure a text run without producing path data. */
+export declare function measureText(opts: TextRunOptions): {
+    width: number;
+    capHeight: number;
+};
+/**
+ * Compute the baseline Y so the cap-height visual centroid sits at parentY +
+ * parentH/2. This is what `align-items:center; line-height:1` does for short
+ * runs of digits / latin in SF Pro at status-bar sizes.
+ */
+export declare function baselineForCenteredText(parentY: number, parentH: number, fontId: SfFontId, fontSize: number): number;
+/** Default font id for SF Pro at status-bar sizes. */
+export declare function pickStatusBarFontId(weight?: 'regular' | 'semibold'): SfFontId;

package/dist/svg-text.js

@@ -0,0 +1,118 @@
+/**
+ * SVG text rendering via fontkit.
+ *
+ * Converts text strings to native SVG `<path>` elements by laying out glyphs
+ * with fontkit and serializing each glyph's vector path. This avoids depending
+ * on a system font installation or any HTML rendering layer (no Playwright).
+ *
+ * Coordinate system:
+ *   - SVG uses Y-down. Font glyphs use Y-up with the baseline at y=0.
+ *   - We flip Y while serializing each glyph's path commands.
+ *   - The caller passes a baseline Y position; glyphs are placed relative to it.
+ *
+ * Vertical alignment helper:
+ *   - Use `baselineForCenteredText` to compute the baseline Y so the cap-height
+ *     visual centroid lines up with the parent box's vertical centre. This
+ *     matches what `display:flex; align-items:center; line-height:1` produces
+ *     in CSS for the SF Pro status bar layouts.
+ */
+import { getFont } from './fonts-loader.js';
+/**
+ * Lay out a text run and serialize each glyph's vector path into a single
+ * SVG path data string. Y is flipped on the fly so the result is ready to
+ * embed in an SVG document with the standard top-left origin.
+ */
+export function layoutText(opts) {
+    const font = getFont(opts.fontId);
+    const fontSize = opts.fontSize;
+    const scale = fontSize / font.unitsPerEm;
+    const x0 = opts.x ?? 0;
+    const baselineY = opts.baselineY ?? fontSize;
+    const letterSpacing = opts.letterSpacing ?? 0;
+    const run = font.layout(opts.text);
+    let cursorX = x0;
+    let pathData = '';
+    for (let i = 0; i < run.glyphs.length; i++) {
+        const glyph = run.glyphs[i];
+        const pos = run.positions[i];
+        const glyphX = cursorX + pos.xOffset * scale;
+        const glyphY = baselineY - pos.yOffset * scale; // flipped
+        pathData += pathToSvgData(glyph.path, scale, glyphX, glyphY);
+        cursorX += pos.xAdvance * scale + letterSpacing;
+    }
+    return {
+        pathData,
+        width: cursorX - x0,
+        capHeight: font.capHeight * scale,
+        ascent: font.ascent * scale,
+        descent: -font.descent * scale,
+    };
+}
+/** Measure a text run without producing path data. */
+export function measureText(opts) {
+    const font = getFont(opts.fontId);
+    const fontSize = opts.fontSize;
+    const scale = fontSize / font.unitsPerEm;
+    const letterSpacing = opts.letterSpacing ?? 0;
+    const run = font.layout(opts.text);
+    let width = 0;
+    for (let i = 0; i < run.positions.length; i++) {
+        width += run.positions[i].xAdvance * scale + letterSpacing;
+    }
+    return { width, capHeight: font.capHeight * scale };
+}
+/**
+ * Compute the baseline Y so the cap-height visual centroid sits at parentY +
+ * parentH/2. This is what `align-items:center; line-height:1` does for short
+ * runs of digits / latin in SF Pro at status-bar sizes.
+ */
+export function baselineForCenteredText(parentY, parentH, fontId, fontSize) {
+    const font = getFont(fontId);
+    const cap = font.capHeight * (fontSize / font.unitsPerEm);
+    return parentY + (parentH + cap) / 2;
+}
+/** Default font id for SF Pro at status-bar sizes. */
+export function pickStatusBarFontId(weight = 'regular') {
+    return weight === 'semibold' ? 'text-semibold' : 'text-regular';
+}
+// ── Internal: glyph path → SVG path data ──────────────────────────────
+/**
+ * Convert a fontkit Path to SVG path data, scaled by `scale` and translated
+ * to (dx, dy). Y is flipped on every coordinate (font Y-up → SVG Y-down).
+ *
+ * fontkit's Path.toSVG() returns the data in font units with Y-up; we'd then
+ * need a wrapping `<g transform="...">` to place each glyph. Doing the math
+ * inline produces a single flat path string with no nested groups, which Sharp
+ * (librsvg) handles slightly faster and which is easier to debug.
+ */
+function pathToSvgData(path, scale, dx, dy) {
+    let s = '';
+    for (const cmd of path.commands) {
+        const a = cmd.args;
+        switch (cmd.command) {
+            case 'moveTo':
+                s += `M${fmt(dx + a[0] * scale)},${fmt(dy - a[1] * scale)}`;
+                break;
+            case 'lineTo':
+                s += `L${fmt(dx + a[0] * scale)},${fmt(dy - a[1] * scale)}`;
+                break;
+            case 'quadraticCurveTo':
+                s += `Q${fmt(dx + a[0] * scale)},${fmt(dy - a[1] * scale)} ${fmt(dx + a[2] * scale)},${fmt(dy - a[3] * scale)}`;
+                break;
+            case 'bezierCurveTo':
+                s += `C${fmt(dx + a[0] * scale)},${fmt(dy - a[1] * scale)} ${fmt(dx + a[2] * scale)},${fmt(dy - a[3] * scale)} ${fmt(dx + a[4] * scale)},${fmt(dy - a[5] * scale)}`;
+                break;
+            case 'closePath':
+                s += 'Z';
+                break;
+        }
+    }
+    return s;
+}
+/** Round to 3 decimals to keep generated SVGs compact. */
+function fmt(n) {
+    return Number.isInteger(n) ? String(n) : (Math.round(n * 1000) / 1000).toString();
+}
+// Keep Font import side-effect free.
+void null;
+//# sourceMappingURL=svg-text.js.map