svger-cli 3.1.0 → 4.0.0

package/dist/optimizers/transform-optimizer.js

@@ -0,0 +1,320 @@
+/**
+ * Phase 3: Transform Optimizer
+ *
+ * Responsibilities:
+ * 1. Parse transform attribute lists (translate, rotate, scale, skew, matrix)
+ * 2. Consolidate multiple transforms into single matrix
+ * 3. Decompose matrix back to simpler transforms only if shorter
+ * 4. Round matrix/transform values to configured precision
+ */
+/**
+ * Identity matrix
+ */
+const IDENTITY_MATRIX = [1, 0, 0, 1, 0, 0];
+/**
+ * Parse a single transform command
+ */
+function parseTransformCommand(command) {
+    const match = command.match(/^(\w+)\s*\(([^)]+)\)/);
+    if (!match)
+        return null;
+    const type = match[1];
+    const valueStr = match[2].trim();
+    const values = valueStr
+        .split(/[\s,]+/)
+        .map(v => parseFloat(v))
+        .filter(v => !isNaN(v));
+    if (values.length === 0)
+        return null;
+    return { type, values };
+}
+/**
+ * Parse transform attribute into list of commands
+ */
+export function parseTransformList(transformStr) {
+    const transforms = [];
+    const regex = /(\w+)\s*\([^)]+\)/g;
+    let match;
+    while ((match = regex.exec(transformStr)) !== null) {
+        const cmd = parseTransformCommand(match[0]);
+        if (cmd) {
+            transforms.push(cmd);
+        }
+    }
+    return transforms;
+}
+/**
+ * Multiply two matrices: result = m1 × m2
+ */
+function multiplyMatrices(m1, m2) {
+    const [a1, b1, c1, d1, e1, f1] = m1;
+    const [a2, b2, c2, d2, e2, f2] = m2;
+    return [
+        a1 * a2 + c1 * b2,
+        b1 * a2 + d1 * b2,
+        a1 * c2 + c1 * d2,
+        b1 * c2 + d1 * d2,
+        a1 * e2 + c1 * f2 + e1,
+        b1 * e2 + d1 * f2 + f1,
+    ];
+}
+/**
+ * Convert transform command to matrix
+ */
+function transformToMatrix(transform) {
+    const { type, values } = transform;
+    switch (type) {
+        case 'matrix':
+            if (values.length === 6) {
+                return values;
+            }
+            return IDENTITY_MATRIX;
+        case 'translate': {
+            const tx = values[0] || 0;
+            const ty = values[1] || 0;
+            return [1, 0, 0, 1, tx, ty];
+        }
+        case 'scale': {
+            const sx = values[0] || 1;
+            const sy = values[1] !== undefined ? values[1] : sx;
+            return [sx, 0, 0, sy, 0, 0];
+        }
+        case 'rotate': {
+            const angle = values[0] || 0;
+            const rad = (angle * Math.PI) / 180;
+            const cos = Math.cos(rad);
+            const sin = Math.sin(rad);
+            // Rotate around point (cx, cy) if provided
+            if (values.length === 3) {
+                const cx = values[1];
+                const cy = values[2];
+                // translate(-cx, -cy) × rotate(angle) × translate(cx, cy)
+                return [
+                    cos,
+                    sin,
+                    -sin,
+                    cos,
+                    -cx * cos + cy * sin + cx,
+                    -cx * sin - cy * cos + cy,
+                ];
+            }
+            return [cos, sin, -sin, cos, 0, 0];
+        }
+        case 'skewX': {
+            const angle = values[0] || 0;
+            const rad = (angle * Math.PI) / 180;
+            const tan = Math.tan(rad);
+            return [1, 0, tan, 1, 0, 0];
+        }
+        case 'skewY': {
+            const angle = values[0] || 0;
+            const rad = (angle * Math.PI) / 180;
+            const tan = Math.tan(rad);
+            return [1, tan, 0, 1, 0, 0];
+        }
+        default:
+            return IDENTITY_MATRIX;
+    }
+}
+/**
+ * Consolidate transform list into single matrix
+ */
+export function consolidateTransforms(transforms) {
+    let result = IDENTITY_MATRIX;
+    for (const transform of transforms) {
+        const matrix = transformToMatrix(transform);
+        result = multiplyMatrices(result, matrix);
+    }
+    return result;
+}
+/**
+ * Round number with precision
+ */
+function roundNum(value, precision) {
+    if (Math.abs(value) < 1e-10)
+        return 0;
+    const multiplier = Math.pow(10, precision);
+    const rounded = Math.round(value * multiplier) / multiplier;
+    return Object.is(rounded, -0) ? 0 : rounded;
+}
+/**
+ * Check if matrix is identity
+ */
+export function isIdentityMatrix(m) {
+    const [a, b, c, d, e, f] = m;
+    return (Math.abs(a - 1) < 1e-10 &&
+        Math.abs(b) < 1e-10 &&
+        Math.abs(c) < 1e-10 &&
+        Math.abs(d - 1) < 1e-10 &&
+        Math.abs(e) < 1e-10 &&
+        Math.abs(f) < 1e-10);
+}
+/**
+ * Decompose matrix to simpler transforms if possible
+ * Returns shortest representation between:
+ * - matrix(a, b, c, d, e, f)
+ * - translate(tx, ty)
+ * - scale(sx, sy)
+ * - rotate(angle)
+ * - combinations
+ */
+export function decomposeMatrix(m, precision = 3) {
+    const [a, b, c, d, e, f] = m.map(v => roundNum(v, precision));
+    // Identity: remove transform entirely
+    if (isIdentityMatrix([a, b, c, d, e, f])) {
+        return '';
+    }
+    // Pure translate: translate(tx, ty) or translate(tx)
+    if (Math.abs(a - 1) < 1e-10 &&
+        Math.abs(b) < 1e-10 &&
+        Math.abs(c) < 1e-10 &&
+        Math.abs(d - 1) < 1e-10) {
+        if (Math.abs(f) < 1e-10) {
+            return `translate(${e})`;
+        }
+        return `translate(${e} ${f})`;
+    }
+    // Pure scale: scale(sx, sy) or scale(sx)
+    if (Math.abs(b) < 1e-10 &&
+        Math.abs(c) < 1e-10 &&
+        Math.abs(e) < 1e-10 &&
+        Math.abs(f) < 1e-10 &&
+        Math.abs(a - d) < 1e-10) {
+        return `scale(${a})`;
+    }
+    if (Math.abs(b) < 1e-10 &&
+        Math.abs(c) < 1e-10 &&
+        Math.abs(e) < 1e-10 &&
+        Math.abs(f) < 1e-10) {
+        return `scale(${a} ${d})`;
+    }
+    // Pure rotate (no translation): rotate(angle)
+    if (Math.abs(e) < 1e-10 &&
+        Math.abs(f) < 1e-10 &&
+        Math.abs(Math.sqrt(a * a + b * b) - 1) < 1e-10 &&
+        Math.abs(a - d) < 1e-10 &&
+        Math.abs(b + c) < 1e-10) {
+        const angle = roundNum((Math.atan2(b, a) * 180) / Math.PI, precision);
+        return `rotate(${angle})`;
+    }
+    // Matrix form as fallback
+    const matrixStr = `matrix(${a} ${b} ${c} ${d} ${e} ${f})`;
+    // Try to decompose into translate + rotate/scale if shorter
+    // translate(tx, ty) + rotate(angle)
+    if (Math.abs(Math.sqrt(a * a + b * b) - 1) < 1e-10 &&
+        Math.abs(a - d) < 1e-10 &&
+        Math.abs(b + c) < 1e-10) {
+        const angle = roundNum((Math.atan2(b, a) * 180) / Math.PI, precision);
+        const translateStr = Math.abs(f) < 1e-10 ? `translate(${e})` : `translate(${e} ${f})`;
+        const combined = `${translateStr} rotate(${angle})`;
+        if (combined.length < matrixStr.length) {
+            return combined;
+        }
+    }
+    return matrixStr;
+}
+/**
+ * Optimize transform attribute on a node
+ */
+function optimizeTransform(node, precision) {
+    const transformAttr = node.attrs.get('transform');
+    if (!transformAttr)
+        return false;
+    const transforms = parseTransformList(transformAttr);
+    if (transforms.length === 0) {
+        node.attrs.delete('transform');
+        return true;
+    }
+    // If only one transform, check for identity and round values
+    if (transforms.length === 1) {
+        const t = transforms[0];
+        const roundedValues = t.values.map(v => roundNum(v, precision));
+        // Convert to matrix to check for identity
+        const matrix = transformToMatrix({ type: t.type, values: roundedValues });
+        // Check if identity
+        if (isIdentityMatrix(matrix)) {
+            node.attrs.delete('transform');
+            return true;
+        }
+        // For matrix type, try to decompose to simpler form
+        if (t.type === 'matrix') {
+            const optimized = decomposeMatrix(matrix, precision);
+            if (optimized === '') {
+                node.attrs.delete('transform');
+                return true;
+            }
+            if (optimized.length < transformAttr.length) {
+                node.attrs.set('transform', optimized);
+                return true;
+            }
+            return false;
+        }
+        // Reconstruct single transform with rounded values
+        const valueStr = roundedValues.join(' ');
+        const newTransform = `${t.type}(${valueStr})`;
+        if (newTransform !== transformAttr) {
+            node.attrs.set('transform', newTransform);
+            return true;
+        }
+        return false;
+    }
+    // Multiple transforms: consolidate
+    const matrix = consolidateTransforms(transforms);
+    const optimized = decomposeMatrix(matrix, precision);
+    if (optimized === '') {
+        // Identity matrix - remove transform
+        node.attrs.delete('transform');
+        return true;
+    }
+    // Use optimized if shorter
+    if (optimized.length < transformAttr.length) {
+        node.attrs.set('transform', optimized);
+        return true;
+    }
+    return false;
+}
+/**
+ * Optimize transforms in the tree
+ */
+export function optimizeTransforms(root, config) {
+    let optimizedTransforms = 0;
+    let removedIdentity = 0;
+    const precision = config.floatPrecision || 3;
+    const traverse = (node) => {
+        if (!node)
+            return;
+        if (node.type === 'element' && node.attrs.has('transform')) {
+            const hadTransform = node.attrs.has('transform');
+            const wasOptimized = optimizeTransform(node, precision);
+            if (wasOptimized) {
+                if (!node.attrs.has('transform') && hadTransform) {
+                    removedIdentity++;
+                }
+                else {
+                    optimizedTransforms++;
+                }
+            }
+        }
+        // Recurse
+        for (const child of node.children) {
+            if (child.type === 'element') {
+                traverse(child);
+            }
+        }
+    };
+    traverse(root);
+    return {
+        optimizedTransforms,
+        removedIdentity,
+    };
+}
+/**
+ * Transform optimization stage for pipeline
+ */
+export function transformOptimizationStage(root, config) {
+    const stats = optimizeTransforms(root, config);
+    return {
+        modified: stats.optimizedTransforms > 0 || stats.removedIdentity > 0,
+        stats,
+    };
+}

package/dist/optimizers/tree-serializer.d.ts

@@ -0,0 +1,46 @@
+/**
+ * SVG Tree Serializer
+ * Convert tree structure back to minified string
+ * Optimized for small output size
+ */
+import type { SVGNode } from './svg-tree-parser.js';
+/**
+ * Serializer options
+ */
+export interface SerializerOptions {
+    /** Minify output (remove whitespace, newlines) */
+    minify: boolean;
+    /** Sort attributes alphabetically */
+    sortAttributes: boolean;
+    /** Use self-closing tags for void elements */
+    selfClosing: boolean;
+    /** Pretty print with indentation (for debugging) */
+    prettyPrint: boolean;
+    /** Indentation string (only used if prettyPrint is true) */
+    indent: string;
+}
+/**
+ * Serialize SVG node to string
+ */
+export declare function serializeNode(node: SVGNode, options?: Partial<SerializerOptions>, depth?: number): string;
+/**
+ * Serialize SVG tree to string (minified by default)
+ */
+export declare function serializeSVG(node: SVGNode | null, options?: Partial<SerializerOptions>): string;
+/**
+ * Serialize SVG tree to pretty-printed string (for debugging)
+ */
+export declare function serializeSVGPretty(node: SVGNode | null): string;
+/**
+ * Serialize SVG tree to minified string (for production)
+ */
+export declare function serializeSVGMinified(node: SVGNode | null): string;
+/**
+ * Calculate size reduction from serialization
+ */
+export declare function calculateReduction(original: string, serialized: string): {
+    originalSize: number;
+    serializedSize: number;
+    reduction: number;
+    reductionPercent: number;
+};

package/dist/optimizers/tree-serializer.js

@@ -0,0 +1,190 @@
+/**
+ * SVG Tree Serializer
+ * Convert tree structure back to minified string
+ * Optimized for small output size
+ */
+/**
+ * Default serializer options
+ */
+const DEFAULT_OPTIONS = {
+    minify: true,
+    sortAttributes: false,
+    selfClosing: true,
+    prettyPrint: false,
+    indent: '  ',
+};
+/**
+ * Self-closing elements
+ */
+const SELF_CLOSING_ELEMENTS = new Set([
+    'path',
+    'rect',
+    'circle',
+    'ellipse',
+    'line',
+    'polyline',
+    'polygon',
+    'use',
+    'stop',
+    'image',
+]);
+/**
+ * Elements that should preserve content as-is
+ */
+const PRESERVE_CONTENT_ELEMENTS = new Set(['style', 'script']);
+/**
+ * Escape attribute value for HTML
+ */
+function escapeAttributeValue(value) {
+    return value
+        .replace(/&/g, '&')
+        .replace(/"/g, '"')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;');
+}
+/**
+ * Escape text content for HTML
+ */
+function escapeTextContent(text) {
+    return text
+        .replace(/&/g, '&amp;')
+        .replace(/</g, '&lt;')
+        .replace(/>/g, '&gt;');
+}
+/**
+ * Serialize attributes to string
+ */
+function serializeAttributes(attrs, options) {
+    if (attrs.size === 0) {
+        return '';
+    }
+    let entries = Array.from(attrs.entries());
+    // Sort attributes if requested
+    if (options.sortAttributes) {
+        entries = entries.sort((a, b) => a[0].localeCompare(b[0]));
+    }
+    // Build attribute string
+    const attrStrings = entries.map(([name, value]) => `${name}="${escapeAttributeValue(value)}"`);
+    return ' ' + attrStrings.join(' ');
+}
+/**
+ * Serialize SVG node to string
+ */
+export function serializeNode(node, options = {}, depth = 0) {
+    const opts = { ...DEFAULT_OPTIONS, ...options };
+    // Handle root container
+    if (node.tag === 'root') {
+        return node.children
+            .map(child => serializeNode(child, opts, depth))
+            .join('');
+    }
+    // Handle comments
+    if (node.type === 'comment') {
+        if (opts.minify) {
+            return ''; // Skip comments in minified output
+        }
+        return `<!--${node.content || ''}-->`;
+    }
+    // Handle text nodes
+    if (node.type === 'text') {
+        const text = node.content || '';
+        if (opts.minify) {
+            return text.trim();
+        }
+        return escapeTextContent(text);
+    }
+    // Build opening tag
+    const indent = opts.prettyPrint ? opts.indent.repeat(depth) : '';
+    const newline = opts.prettyPrint ? '\n' : '';
+    let result = indent + '<' + node.tag;
+    // Add attributes
+    result += serializeAttributes(node.attrs, opts);
+    // Handle self-closing tags
+    const isSelfClosing = opts.selfClosing &&
+        (SELF_CLOSING_ELEMENTS.has(node.tag) ||
+            (node.children.length === 0 && !node.content));
+    if (isSelfClosing) {
+        result += '/>';
+        if (opts.prettyPrint) {
+            result += newline;
+        }
+        return result;
+    }
+    result += '>';
+    // Handle content
+    if (node.content) {
+        if (PRESERVE_CONTENT_ELEMENTS.has(node.tag)) {
+            // Preserve content as-is for style/script
+            result += node.content;
+        }
+        else {
+            // Escape and optionally trim content
+            const content = opts.minify ? node.content.trim() : node.content;
+            result += opts.minify ? content : escapeTextContent(content);
+        }
+    }
+    // Handle children
+    if (node.children.length > 0) {
+        if (opts.prettyPrint) {
+            result += newline;
+        }
+        for (const child of node.children) {
+            result += serializeNode(child, opts, depth + 1);
+        }
+        if (opts.prettyPrint) {
+            result += indent;
+        }
+    }
+    // Closing tag
+    result += '</' + node.tag + '>';
+    if (opts.prettyPrint) {
+        result += newline;
+    }
+    return result;
+}
+/**
+ * Serialize SVG tree to string (minified by default)
+ */
+export function serializeSVG(node, options = {}) {
+    if (!node) {
+        return '';
+    }
+    return serializeNode(node, options, 0);
+}
+/**
+ * Serialize SVG tree to pretty-printed string (for debugging)
+ */
+export function serializeSVGPretty(node) {
+    return serializeSVG(node, {
+        minify: false,
+        prettyPrint: true,
+        sortAttributes: false,
+        selfClosing: true,
+    });
+}
+/**
+ * Serialize SVG tree to minified string (for production)
+ */
+export function serializeSVGMinified(node) {
+    return serializeSVG(node, {
+        minify: true,
+        prettyPrint: false,
+        sortAttributes: false,
+        selfClosing: true,
+    });
+}
+/**
+ * Calculate size reduction from serialization
+ */
+export function calculateReduction(original, serialized) {
+    const originalSize = Buffer.byteLength(original, 'utf8');
+    const serializedSize = Buffer.byteLength(serialized, 'utf8');
+    const reduction = originalSize - serializedSize;
+    const reductionPercent = (reduction / originalSize) * 100;
+    return {
+        originalSize,
+        serializedSize,
+        reduction,
+        reductionPercent,
+    };
+}

package/dist/optimizers/tree-stages.d.ts

@@ -0,0 +1,27 @@
+/**
+ * Tree-Based Optimization Stages
+ * Wrapper for tree-based optimizations in the optimizer pipeline
+ * Handles parse → optimize → serialize cycle
+ */
+import type { OptConfig } from './types.js';
+/**
+ * Tree-based optimization stage: Remove unused defs
+ */
+export declare function treeRemoveUnusedDefsStage(svg: string, config: OptConfig): Promise<string>;
+/**
+ * Tree-based optimization stage: Collapse useless groups
+ */
+export declare function treeCollapseGroupsStage(svg: string, config: OptConfig): Promise<string>;
+/**
+ * Tree-based optimization stage: Move attributes to parent
+ */
+export declare function treeMoveAttributesToParentStage(svg: string, config: OptConfig): Promise<string>;
+/**
+ * Tree-based optimization stage: Remove hidden and empty elements
+ */
+export declare function treeRemoveHiddenEmptyStage(svg: string, config: OptConfig): Promise<string>;
+/**
+ * Combined tree-based optimization stage
+ * Applies all tree optimizations in one pass for efficiency
+ */
+export declare function treeOptimizationStage(svg: string, config: OptConfig): Promise<string>;