pagyra-js 0.0.19 → 0.0.21

package/dist/playground/server.js

@@ -55,6 +55,7 @@ app.post("/render", async (req, res) => {
         const allowedLevels = ["trace", "debug", "info", "warn", "error"];
         let debugLevel = levelCandidate && allowedLevels.includes(levelCandidate) ? levelCandidate : "info";
         const debugCats = Array.isArray(body.debugCats) ? body.debugCats.map(String).filter(Boolean) : undefined;
+        const pagedBodyMargin = body.pagedBodyMargin === "zero" ? "zero" : "auto";
         const headerFooter = {};
         if (headerHtml) {
             headerFooter.headerHtml = headerHtml;
@@ -79,6 +80,7 @@ app.post("/render", async (req, res) => {
             margins: marginsPx,
             debugLevel,
             debugCats: debugCats?.length ? debugCats : undefined,
+            pagedBodyMargin,
             resourceBaseDir,
             assetRootDir: PUBLIC_DIR,
             headerFooter: Object.keys(headerFooter).length > 0 ? headerFooter : undefined,

package/dist/src/css/compute-style/base-options.d.ts

@@ -0,0 +1,7 @@
+import { FloatMode, type Display } from "../enums.js";
+import type { StyleAccumulator, StyleProperties } from "../style.js";
+import type { InheritedStyleProperties } from "../style-inheritance.js";
+import type { StyleDefaults } from "../ua-defaults/types.js";
+import type { FontComputationResult } from "./font.js";
+import type { CustomPropertiesMap } from "../custom-properties.js";
+export declare function createBaseStyleOptions(resolvedDefaults: Partial<StyleProperties>, inherited: InheritedStyleProperties, fontContext: FontComputationResult, mergedDefaults: StyleDefaults, styleInit: StyleAccumulator, display: Display, floatMode: FloatMode | undefined, customProperties: CustomPropertiesMap): Partial<StyleProperties>;

package/dist/src/css/compute-style/base-options.js

@@ -0,0 +1,24 @@
+import { FloatMode } from "../enums.js";
+import { normalizeFontWeight } from "../font-weight.js";
+import { cloneLineHeight } from "../line-height.js";
+export function createBaseStyleOptions(resolvedDefaults, inherited, fontContext, mergedDefaults, styleInit, display, floatMode, customProperties) {
+    return {
+        customProperties,
+        ...resolvedDefaults,
+        color: inherited.color,
+        fontSize: fontContext.computedFontSize,
+        lineHeight: cloneLineHeight(fontContext.lineHeightSource),
+        fontFamily: inherited.fontFamily,
+        fontStyle: fontContext.elementDefinesFontStyle ? mergedDefaults.fontStyle : inherited.fontStyle,
+        fontWeight: fontContext.elementDefinesFontWeight ? mergedDefaults.fontWeight : normalizeFontWeight(inherited.fontWeight),
+        overflowWrap: inherited.overflowWrap,
+        wordBreak: inherited.wordBreak,
+        textIndent: inherited.textIndent ?? mergedDefaults.textIndent ?? 0,
+        textTransform: inherited.textTransform ?? "none",
+        letterSpacing: inherited.letterSpacing ?? mergedDefaults.letterSpacing,
+        listStyleType: inherited.listStyleType ?? mergedDefaults.listStyleType ?? "disc",
+        display,
+        float: floatMode ?? FloatMode.None,
+        borderModel: styleInit.borderModel ?? mergedDefaults.borderModel,
+    };
+}

package/dist/src/css/compute-style/declarations.d.ts

@@ -0,0 +1,10 @@
+import type { CssRuleEntry } from "../../html/css/parse-css.js";
+import type { CssPseudoElement } from "../../html/css/parse-css.js";
+import type { SvgElement } from "../../types/core.js";
+import { CustomPropertiesMap } from "../custom-properties.js";
+export interface ResolvedDeclarationsResult {
+    resolvedDeclarations: Record<string, string>;
+    customProperties: CustomPropertiesMap;
+}
+export declare function resolveDeclarationsForElement(element: SvgElement, cssRules: CssRuleEntry[], parentCustomProperties?: CustomPropertiesMap): ResolvedDeclarationsResult;
+export declare function resolveDeclarationsForPseudoElement(element: SvgElement, cssRules: CssRuleEntry[], pseudoType: CssPseudoElement, parentCustomProperties?: CustomPropertiesMap): ResolvedDeclarationsResult;

package/dist/src/css/compute-style/declarations.js

@@ -0,0 +1,77 @@
+import { log } from "../../logging/debug.js";
+import { parseInlineStyle } from "../inline-style-parser.js";
+import { CustomPropertiesMap, extractCustomProperties, resolveDeclarationsWithVariables, } from "../custom-properties.js";
+function normalizeRuleDeclarations(declarations) {
+    const normalized = {};
+    for (const [property, value] of Object.entries(declarations)) {
+        if (property.startsWith("--")) {
+            normalized[property] = value;
+        }
+        else {
+            normalized[property.toLowerCase()] = value;
+        }
+    }
+    return normalized;
+}
+function collectAggregatedDeclarations(element, cssRules, options) {
+    const aggregated = {};
+    const targetPseudo = options?.pseudoElement;
+    const includeInlineStyle = options?.includeInlineStyle ?? true;
+    for (const rule of cssRules) {
+        if (targetPseudo) {
+            if (rule.pseudoElement !== targetPseudo) {
+                continue;
+            }
+        }
+        else if (rule.pseudoElement) {
+            continue;
+        }
+        if (!rule.match(element)) {
+            continue;
+        }
+        log("style", "debug", "CSS rule matched", { selector: rule.selector, declarations: rule.declarations });
+        if (rule.declarations.display) {
+            log("style", "debug", "Display declaration found", { selector: rule.selector, display: rule.declarations.display });
+        }
+        Object.assign(aggregated, normalizeRuleDeclarations(rule.declarations));
+    }
+    if (includeInlineStyle) {
+        const inlineStyle = parseInlineStyle(element.getAttribute("style") ?? "");
+        if (Object.keys(inlineStyle).length > 0) {
+            log("style", "debug", "inline style applied", { declarations: inlineStyle });
+        }
+        Object.assign(aggregated, inlineStyle);
+    }
+    return aggregated;
+}
+export function resolveDeclarationsForElement(element, cssRules, parentCustomProperties) {
+    const aggregated = collectAggregatedDeclarations(element, cssRules);
+    let customProperties = parentCustomProperties
+        ? parentCustomProperties.clone()
+        : new CustomPropertiesMap();
+    const elementCustomProps = extractCustomProperties(aggregated);
+    customProperties = elementCustomProps.inherit(customProperties);
+    log("style", "debug", "custom properties", {
+        count: customProperties.size,
+        keys: customProperties.keys(),
+    });
+    return {
+        resolvedDeclarations: resolveDeclarationsWithVariables(aggregated, customProperties),
+        customProperties,
+    };
+}
+export function resolveDeclarationsForPseudoElement(element, cssRules, pseudoType, parentCustomProperties) {
+    const aggregated = collectAggregatedDeclarations(element, cssRules, {
+        pseudoElement: pseudoType,
+        includeInlineStyle: false,
+    });
+    let customProperties = parentCustomProperties
+        ? parentCustomProperties.clone()
+        : new CustomPropertiesMap();
+    const pseudoCustomProps = extractCustomProperties(aggregated);
+    customProperties = pseudoCustomProps.inherit(customProperties);
+    return {
+        resolvedDeclarations: resolveDeclarationsWithVariables(aggregated, customProperties),
+        customProperties,
+    };
+}

package/dist/src/css/compute-style/decoration.d.ts

@@ -0,0 +1,8 @@
+import type { StyleAccumulator, StyleProperties } from "../style.js";
+import type { StyleDefaults } from "../ua-defaults/types.js";
+export declare function applyTextDecorationOptions(styleOptions: Partial<StyleProperties>, styleInit: StyleAccumulator, inherited: {
+    textDecorationLine?: string;
+    textDecorationColor?: string;
+    textDecorationStyle?: string;
+}, mergedDefaults: StyleDefaults, elementDefaults: StyleDefaults): void;
+export declare function normalizeTextDecorationColor(value: string | undefined): string | undefined;

package/dist/src/css/compute-style/decoration.js

@@ -0,0 +1,55 @@
+export function applyTextDecorationOptions(styleOptions, styleInit, inherited, mergedDefaults, elementDefaults) {
+    const defaultDecoration = mergedDefaults.textDecorationLine ?? "none";
+    let decoration = inherited.textDecorationLine ?? defaultDecoration;
+    if (elementDefaults.textDecorationLine !== undefined) {
+        decoration = elementDefaults.textDecorationLine;
+    }
+    if (styleInit.textDecorationLine !== undefined) {
+        decoration = styleInit.textDecorationLine;
+    }
+    styleOptions.textDecorationLine = decoration;
+    let decorationColor = styleInit.textDecorationColor !== undefined
+        ? normalizeTextDecorationColor(styleInit.textDecorationColor)
+        : undefined;
+    if (decorationColor === undefined) {
+        decorationColor =
+            elementDefaults.textDecorationColor !== undefined
+                ? normalizeTextDecorationColor(elementDefaults.textDecorationColor)
+                : undefined;
+    }
+    if (decorationColor === undefined && inherited.textDecorationColor !== undefined) {
+        decorationColor = inherited.textDecorationColor;
+    }
+    if (decorationColor !== undefined) {
+        styleOptions.textDecorationColor = decorationColor;
+    }
+    const defaultDecorationStyle = mergedDefaults.textDecorationStyle ?? "solid";
+    let decorationStyle = inherited.textDecorationStyle ?? defaultDecorationStyle;
+    if (elementDefaults.textDecorationStyle !== undefined) {
+        decorationStyle = elementDefaults.textDecorationStyle;
+    }
+    if (styleInit.textDecorationStyle !== undefined) {
+        decorationStyle = styleInit.textDecorationStyle;
+    }
+    styleOptions.textDecorationStyle = decorationStyle;
+}
+export function normalizeTextDecorationColor(value) {
+    if (value === undefined) {
+        return undefined;
+    }
+    const trimmed = value.trim();
+    if (!trimmed) {
+        return undefined;
+    }
+    const lower = trimmed.toLowerCase();
+    if (lower === "inherit") {
+        return undefined;
+    }
+    if (lower === "initial") {
+        return "currentcolor";
+    }
+    if (lower === "unset" || lower === "revert" || lower === "revert-layer") {
+        return undefined;
+    }
+    return lower === "currentcolor" ? "currentcolor" : trimmed;
+}

package/dist/src/css/compute-style/defaults.d.ts

@@ -0,0 +1,3 @@
+import type { StyleProperties } from "../style.js";
+import type { StyleDefaults } from "../ua-defaults/types.js";
+export declare function resolveDefaultsForComputedStyle(defaults: StyleDefaults, fontSize: number, rootFontSize: number): Partial<StyleProperties>;

package/dist/src/css/compute-style/defaults.js

@@ -0,0 +1,34 @@
+import { resolveNumberLike } from "../length.js";
+export function resolveDefaultsForComputedStyle(defaults, fontSize, rootFontSize) {
+    const { fontSize: defaultFontSize, marginTop, marginRight, marginBottom, marginLeft, paddingTop, paddingRight, paddingBottom, paddingLeft, borderTop, borderRight, borderBottom, borderLeft, ...rest } = defaults;
+    const resolved = { ...rest };
+    const resolveNumeric = (value) => resolveNumberLike(value, fontSize, rootFontSize);
+    if (defaultFontSize !== undefined) {
+        resolved.fontSize = resolveNumeric(defaultFontSize) ?? fontSize;
+    }
+    if (marginTop !== undefined)
+        resolved.marginTop = resolveNumeric(marginTop);
+    if (marginRight !== undefined)
+        resolved.marginRight = resolveNumeric(marginRight);
+    if (marginBottom !== undefined)
+        resolved.marginBottom = resolveNumeric(marginBottom);
+    if (marginLeft !== undefined)
+        resolved.marginLeft = resolveNumeric(marginLeft);
+    if (paddingTop !== undefined)
+        resolved.paddingTop = resolveNumeric(paddingTop);
+    if (paddingRight !== undefined)
+        resolved.paddingRight = resolveNumeric(paddingRight);
+    if (paddingBottom !== undefined)
+        resolved.paddingBottom = resolveNumeric(paddingBottom);
+    if (paddingLeft !== undefined)
+        resolved.paddingLeft = resolveNumeric(paddingLeft);
+    if (borderTop !== undefined)
+        resolved.borderTop = resolveNumeric(borderTop);
+    if (borderRight !== undefined)
+        resolved.borderRight = resolveNumeric(borderRight);
+    if (borderBottom !== undefined)
+        resolved.borderBottom = resolveNumeric(borderBottom);
+    if (borderLeft !== undefined)
+        resolved.borderLeft = resolveNumeric(borderLeft);
+    return resolved;
+}

package/dist/src/css/compute-style/display.d.ts

@@ -0,0 +1,3 @@
+import { Display } from "../enums.js";
+export declare function defaultDisplayForTag(tag: string): Display;
+export declare function resolveDisplayForElement(tagName: string, styleDisplay: Display | undefined, mergedDefaultDisplay: Display | undefined): Display;

package/dist/src/css/compute-style/display.js

@@ -0,0 +1,85 @@
+import { Display } from "../enums.js";
+import { log } from "../../logging/debug.js";
+const INLINE_TAGS = new Set([
+    "span",
+    "a",
+    "strong",
+    "em",
+    "b",
+    "s",
+    "strike",
+    "del",
+    "label",
+    "code",
+    "small",
+    "time",
+    "i",
+    "u",
+    "sub",
+    "sup",
+    "mark",
+    "abbr",
+    "cite",
+    "dfn",
+    "kbd",
+    "q",
+    "tt",
+]);
+const FORCED_DISPLAY_BY_TAG = {
+    table: Display.Table,
+    thead: Display.TableRowGroup,
+    tbody: Display.TableRowGroup,
+    tfoot: Display.TableRowGroup,
+    tr: Display.TableRow,
+    td: Display.TableCell,
+    th: Display.TableCell,
+};
+export function defaultDisplayForTag(tag) {
+    let display;
+    if (INLINE_TAGS.has(tag)) {
+        display = Display.Inline;
+    }
+    else {
+        switch (tag) {
+            case "table":
+                display = Display.Table;
+                break;
+            case "tbody":
+            case "thead":
+            case "tfoot":
+                display = Display.TableRowGroup;
+                break;
+            case "tr":
+                display = Display.TableRow;
+                break;
+            case "td":
+            case "th":
+                display = Display.TableCell;
+                break;
+            case "caption":
+                display = Display.TableCaption;
+                break;
+            default:
+                display = Display.Block;
+                break;
+        }
+    }
+    log("style", "trace", "defaultDisplayForTag", { tag, display });
+    return display;
+}
+export function resolveDisplayForElement(tagName, styleDisplay, mergedDefaultDisplay) {
+    const defaultDisplay = mergedDefaultDisplay ?? defaultDisplayForTag(tagName);
+    const computedDisplay = styleDisplay ?? defaultDisplay;
+    log("style", "debug", "computeStyleForElement display", {
+        tagName,
+        styleInitDisplay: styleDisplay,
+        defaultDisplay,
+        finalDisplay: computedDisplay,
+    });
+    const forcedDisplay = FORCED_DISPLAY_BY_TAG[tagName];
+    if (forcedDisplay !== undefined && computedDisplay !== forcedDisplay) {
+        log("style", "debug", "Forcing table display", { tagName, originalDisplay: computedDisplay });
+        return forcedDisplay;
+    }
+    return computedDisplay;
+}

package/dist/src/css/compute-style/float.d.ts

@@ -0,0 +1,2 @@
+import { FloatMode } from "../enums.js";
+export declare function mapFloatToMode(value: string | undefined): FloatMode | undefined;

package/dist/src/css/compute-style/float.js

@@ -0,0 +1,13 @@
+import { FloatMode } from "../enums.js";
+export function mapFloatToMode(value) {
+    switch (value) {
+        case "left":
+            return FloatMode.Left;
+        case "right":
+            return FloatMode.Right;
+        case "none":
+            return FloatMode.None;
+        default:
+            return undefined;
+    }
+}

package/dist/src/css/compute-style/font.d.ts

@@ -0,0 +1,12 @@
+import { type LineHeightValue } from "../line-height.js";
+import type { StyleAccumulator } from "../style.js";
+import type { InheritedStyleProperties } from "../style-inheritance.js";
+import type { StyleDefaults } from "../ua-defaults/types.js";
+export interface FontComputationResult {
+    rootFontReference: number;
+    computedFontSize: number;
+    lineHeightSource: LineHeightValue;
+    elementDefinesFontWeight: boolean;
+    elementDefinesFontStyle: boolean;
+}
+export declare function computeFontContext(tagName: string, styleInit: StyleAccumulator, inherited: InheritedStyleProperties, elementDefaults: StyleDefaults, baseDefaults: StyleDefaults, mergedDefaults: StyleDefaults, parentFontSize: number, rootFontSize?: number): FontComputationResult;

package/dist/src/css/compute-style/font.js

@@ -0,0 +1,57 @@
+import { createNormalLineHeight, lineHeightEquals } from "../line-height.js";
+import { resolveNumberLike, isClampNumericLength, resolveClampNumericLength } from "../length.js";
+const RELATIVE_FONT_SIZE_TAG_SCALE = {
+    small: 0.8,
+    big: 1.2,
+};
+function numericLengthEquals(a, b) {
+    if (a === undefined || b === undefined) {
+        return a === b;
+    }
+    if (typeof a === "number" || typeof b === "number") {
+        return a === b;
+    }
+    return a.kind === b.kind && a.unit === b.unit && a.value === b.value;
+}
+export function computeFontContext(tagName, styleInit, inherited, elementDefaults, baseDefaults, mergedDefaults, parentFontSize, rootFontSize) {
+    const elementDefinesFontWeight = elementDefaults.fontWeight !== undefined;
+    const elementDefinesFontStyle = elementDefaults.fontStyle !== undefined;
+    const elementDefinesFontSize = elementDefaults.fontSize !== undefined &&
+        !numericLengthEquals(elementDefaults.fontSize, baseDefaults.fontSize);
+    const baseLineHeight = baseDefaults.lineHeight ?? createNormalLineHeight();
+    const mergedLineHeight = mergedDefaults.lineHeight ?? baseLineHeight;
+    const elementDefinesLineHeight = !lineHeightEquals(mergedLineHeight, baseLineHeight);
+    const rootFontReference = rootFontSize ?? parentFontSize;
+    let computedFontSize = inherited.fontSize;
+    if (styleInit.fontSize !== undefined) {
+        let resolvedFontSize;
+        if (isClampNumericLength(styleInit.fontSize)) {
+            resolvedFontSize = resolveClampNumericLength(styleInit.fontSize, inherited.fontSize, rootFontReference);
+        }
+        else {
+            resolvedFontSize = resolveNumberLike(styleInit.fontSize, inherited.fontSize, rootFontReference);
+        }
+        if (resolvedFontSize !== undefined) {
+            computedFontSize = resolvedFontSize;
+        }
+    }
+    else {
+        if (elementDefinesFontSize) {
+            const resolvedFontSize = resolveNumberLike(mergedDefaults.fontSize, inherited.fontSize, rootFontReference);
+            if (resolvedFontSize !== undefined) {
+                computedFontSize = resolvedFontSize;
+            }
+        }
+        const relativeScale = RELATIVE_FONT_SIZE_TAG_SCALE[tagName];
+        if (relativeScale !== undefined) {
+            computedFontSize = (inherited.fontSize ?? 16) * relativeScale;
+        }
+    }
+    return {
+        rootFontReference,
+        computedFontSize,
+        lineHeightSource: elementDefinesLineHeight ? mergedLineHeight : inherited.lineHeight,
+        elementDefinesFontWeight,
+        elementDefinesFontStyle,
+    };
+}

package/dist/src/css/compute-style/overrides.d.ts

@@ -0,0 +1,3 @@
+import type { StyleAccumulator, StyleProperties } from "../style.js";
+import type { StyleDefaults } from "../ua-defaults/types.js";
+export declare function applyStyleInitOverrides(styleInit: StyleAccumulator, styleOptions: Partial<StyleProperties>, mergedDefaults: StyleDefaults, computedFontSize: number, rootFontReference: number): void;