@emasoft/svg-matrix 1.2.1 → 1.3.1

package/src/index.js

@@ -5,7 +5,7 @@
  * SVG path conversion, and 2D/3D affine transformations using Decimal.js.
  *
  * @module @emasoft/svg-matrix
- * @version 1.2.1
+ * @version 1.3.1
  * @license MIT
  *
  * @example
@@ -135,7 +135,7 @@ Decimal.set({ precision: 80 });
  * Library version
  * @constant {string}
  */
-export const VERSION = '1.2.1';
+export const VERSION = "1.3.1";
 
 /**
  * Default precision for path output (decimal places)

package/src/inkscape-support.js

@@ -215,8 +215,8 @@ export function getNodeTypes(element) {
   const nodeTypes = element.getAttribute("sodipodi:nodetypes");
   if (!nodeTypes) return null;
 
-  // Validate format: should only contain c, s, z, a characters
-  if (!/^[csza]+$/i.test(nodeTypes)) return null;
+  // Validate format: should only contain c, s, z, a characters (case-sensitive)
+  if (!/^[csza]+$/.test(nodeTypes)) return null;
 
   return nodeTypes;
 }

package/src/mask-resolver.js

@@ -44,8 +44,6 @@
  */
 
 import Decimal from "decimal.js";
-import { Matrix as _Matrix } from "./matrix.js";
-import * as _Transforms2D from "./transforms2d.js";
 import * as PolygonClip from "./polygon-clip.js";
 import * as ClipPathResolver from "./clip-path-resolver.js";
 import * as MeshGradient from "./mesh-gradient.js";
@@ -1721,10 +1719,15 @@ export function clipWithMeshGradientShape(
   }
 
   // Union all patch polygons to get the complete mesh shape
-  let meshShape = meshPolygons[0].polygon;
-  if (!meshShape || meshShape.length < 3) {
+  // Validate first polygon before use
+  if (
+    !meshPolygons[0] ||
+    !meshPolygons[0].polygon ||
+    meshPolygons[0].polygon.length < 3
+  ) {
     return [];
   }
+  let meshShape = meshPolygons[0].polygon;
 
   for (let i = 1; i < meshPolygons.length; i++) {
     if (
@@ -1817,10 +1820,15 @@ export function meshGradientToClipPath(meshData, options = {}) {
   }
 
   // Union all patches into one shape
-  let result = meshPolygons[0].polygon;
-  if (!result || result.length < 3) {
+  // Validate first polygon before use
+  if (
+    !meshPolygons[0] ||
+    !meshPolygons[0].polygon ||
+    meshPolygons[0].polygon.length < 3
+  ) {
     return [];
   }
+  let result = meshPolygons[0].polygon;
 
   for (let i = 1; i < meshPolygons.length; i++) {
     if (!meshPolygons[i] || !meshPolygons[i].polygon) continue; // Skip invalid polygons

package/src/matrix.js

@@ -96,7 +96,7 @@ export class Matrix {
       throw new Error("size must be a positive integer");
     const out = Array.from({ length: n }, (_, i) =>
       Array.from({ length: n }, (_, j) =>
-        i === j ? new Decimal(1) : new Decimal(0),
+        (i === j ? new Decimal(1) : new Decimal(0)),
       ),
     );
     return new Matrix(out);
@@ -400,11 +400,11 @@ export class Matrix {
     // Create augmented matrix [A | I]
     const aug = Array.from({ length: n }, (_, i) =>
       Array.from({ length: 2 * n }, (_, j) =>
-        j < n
+        (j < n
           ? new Decimal(this.data[i][j])
           : j - n === i
             ? new Decimal(1)
-            : new Decimal(0),
+            : new Decimal(0)),
       ),
     );
     // Gauss-Jordan elimination

package/src/mesh-gradient.js

@@ -8,8 +8,6 @@
  */
 
 import Decimal from "decimal.js";
-import { Matrix as _Matrix } from "./matrix.js";
-import * as _Transforms2D from "./transforms2d.js";
 import * as PolygonClip from "./polygon-clip.js";
 
 Decimal.set({ precision: 80 });
@@ -501,6 +499,49 @@ export function splitBezier(curve) {
   ];
 }
 
+/**
+ * Sample a cubic Bezier curve at regular intervals to generate an array of points.
+ *
+ * Evaluates the curve at `samples` evenly-spaced t values from 0 to 1,
+ * producing a polyline approximation of the curve. This is useful for
+ * converting bezier curves to polygon representations for clipping operations.
+ *
+ * @param {Array<{x: Decimal, y: Decimal}>} curve - Array of 4 control points [p0, p1, p2, p3]
+ * @param {number} [samples=20] - Number of sample points to generate (minimum 2)
+ * @returns {Array<{x: Decimal, y: Decimal}>} Array of points sampled along the curve
+ *
+ * @example
+ * // Sample a curve with 10 points
+ * const curve = [point(0,0), point(100,200), point(200,200), point(300,0)];
+ * const points = sampleBezierCurve(curve, 10);
+ * // Returns: 10 points evenly distributed along the curve from t=0 to t=1
+ *
+ * @example
+ * // High-resolution sampling for smooth approximation
+ * const points = sampleBezierCurve(curve, 50);
+ * // Returns: 50 points for a smoother polyline representation
+ */
+export function sampleBezierCurve(curve, samples = 20) {
+  if (!Array.isArray(curve))
+    throw new Error("sampleBezierCurve: curve must be an array");
+  if (curve.length !== 4)
+    throw new Error(
+      `sampleBezierCurve: curve must have exactly 4 points, got ${curve.length}`,
+    );
+  if (typeof samples !== "number" || samples < 2)
+    throw new Error("sampleBezierCurve: samples must be a number >= 2");
+
+  const [p0, p1, p2, p3] = curve;
+  const points = [];
+
+  for (let i = 0; i < samples; i++) {
+    const t = i / (samples - 1); // t goes from 0 to 1 inclusive
+    points.push(evalCubicBezier(p0, p1, p2, p3, t));
+  }
+
+  return points;
+}
+
 // ============================================================================
 // Coons Patch Evaluation
 // ============================================================================

package/src/off-canvas-detection.js

@@ -795,7 +795,7 @@ export function pathBoundingBox(pathCommands) {
         }
         break;
 
-      case "A": // Arc (proper extrema calculation)
+      case "A": // Arc (conservative bounding box using extrema bounds)
         {
           // Validate required properties (WHY: prevent accessing undefined properties)
           if (
@@ -825,30 +825,22 @@ export function pathBoundingBox(pathCommands) {
             maxY = Decimal.max(maxY, currentY, y);
             samplePoints.push({ x: currentX, y: currentY }, { x, y });
           } else {
-            // For proper arc bounding box, include start, end, and potential extrema
-            // Start and end points
-            minX = Decimal.min(minX, currentX, x);
-            minY = Decimal.min(minY, currentY, y);
-            maxX = Decimal.max(maxX, currentX, x);
-            maxY = Decimal.max(maxY, currentY, y);
-
-            // For a complete solution, we'd need to:
-            // 1. Convert to center parameterization (complex for arbitrary precision)
-            // 2. Check if extrema angles (0°, 90°, 180°, 270°) fall within arc sweep
-            // 3. Include those extrema in bbox
-            // For now, conservatively expand bbox by radii to ensure containment
-            // This may overestimate slightly but guarantees correctness
-            const centerX = currentX.plus(x).div(2);
-            const centerY = currentY.plus(y).div(2);
-            minX = Decimal.min(minX, centerX.minus(rx));
-            minY = Decimal.min(minY, centerY.minus(ry));
-            maxX = Decimal.max(maxX, centerX.plus(rx));
-            maxY = Decimal.max(maxY, centerY.plus(ry));
-
-            // Sample arc for verification points
+            // FIX: Use conservative bounds that guarantee containment (WHY: exact arc center requires complex calculations)
+            // The tightest conservative bound without full arc parameterization is to
+            // consider all possible extrema within a box of size 2*rx by 2*ry centered at each endpoint
+            // This ensures we never underestimate the bbox, though we may slightly overestimate
+            minX = Decimal.min(minX, currentX, x, currentX.minus(rx), x.minus(rx));
+            minY = Decimal.min(minY, currentY, y, currentY.minus(ry), y.minus(ry));
+            maxX = Decimal.max(maxX, currentX, x, currentX.plus(rx), x.plus(rx));
+            maxY = Decimal.max(maxY, currentY, y, currentY.plus(ry), y.plus(ry));
+
+            // Sample arc for verification: use parametric sampling along the arc
+            // Note: This is still an approximation, but better than linear interpolation
             const samples = 20;
             for (let i = 0; i <= samples; i++) {
               const t = D(i).div(samples);
+              // Simple parametric interpolation (approximation)
+              // For exact results, we'd need to convert to center parameterization
               const px = currentX.plus(x.minus(currentX).mul(t));
               const py = currentY.plus(y.minus(currentY).mul(t));
               samplePoints.push({ x: px, y: py });

package/src/pattern-resolver.js

@@ -19,6 +19,7 @@ import { Matrix } from "./matrix.js";
 import * as Transforms2D from "./transforms2d.js";
 import * as PolygonClip from "./polygon-clip.js";
 import * as ClipPathResolver from "./clip-path-resolver.js";
+import { parseTransformAttribute } from "./svg-flatten.js";
 
 Decimal.set({ precision: 80 });
 
@@ -1229,8 +1230,8 @@ export function parsePatternTransform(transformStr) {
     return Matrix.identity(3);
   }
 
-  // Use ClipPathResolver's transform parser
-  return ClipPathResolver.parseTransform(transformStr);
+  // Use svg-flatten's transform parser (parseTransformAttribute)
+  return parseTransformAttribute(transformStr);
 }
 
 export default {

package/src/svg-boolean-ops.js

@@ -23,15 +23,10 @@ const EPSILON = new Decimal("1e-40");
 
 const {
   point,
-  pointsEqual: _pointsEqual,
   cross,
-  polygonArea: _polygonArea,
   polygonIntersection,
   polygonUnion,
   polygonDifference,
-  isCounterClockwise: _isCounterClockwise,
-  ensureCCW: _ensureCCW,
-  segmentIntersection: _segmentIntersection,
 } = PolygonClip;
 
 // ============================================================================

package/src/svg-collections.js

@@ -459,6 +459,7 @@ export const colorsProps = new Set([
 
 /**
  * Complete list of known SVG elements
+ * Includes both canonical names and lowercase variants for case-insensitive matching
  */
 export const knownElements = new Set([
   // Structural elements
@@ -487,8 +488,13 @@ export const knownElements = new Set([
   "glyphRef",
   // Gradient elements
   "linearGradient",
+  "lineargradient", // lowercase variant for case-insensitive matching
   "radialGradient",
+  "radialgradient", // lowercase variant for case-insensitive matching
   "meshGradient",
+  "meshgradient", // lowercase variant for case-insensitive matching
+  "meshrow", // SVG 2.0 mesh gradient row
+  "meshpatch", // SVG 2.0 mesh gradient patch
   "stop",
   // Container elements
   "a",
@@ -496,6 +502,7 @@ export const knownElements = new Set([
   "mask",
   "pattern",
   "clipPath",
+  "clippath", // lowercase variant for case-insensitive matching
   "switch",
   // Filter elements
   "filter",
@@ -531,8 +538,11 @@ export const knownElements = new Set([
   // Animation elements
   "animate",
   "animateColor",
+  "animatecolor", // lowercase variant for case-insensitive matching
   "animateMotion",
+  "animatemotion", // lowercase variant for case-insensitive matching
   "animateTransform",
+  "animatetransform", // lowercase variant for case-insensitive matching
   "set",
   "mpath",
   // Other elements
@@ -542,6 +552,7 @@ export const knownElements = new Set([
   "style",
   "script",
   "solidColor",
+  "solidcolor", // lowercase variant for case-insensitive matching
   "hatch",
   "hatchpath",
 ]);

package/src/svg-matrix-lib.js

@@ -5,7 +5,7 @@
  * Works in both Node.js and browser environments.
  *
  * @module svg-matrix-lib
- * @version 1.2.1
+ * @version 1.3.1
  * @license MIT
  *
  * @example Browser usage:
@@ -32,7 +32,7 @@ Decimal.set({ precision: 80 });
 /**
  * Library version
  */
-export const VERSION = "1.2.1";
+export const VERSION = "1.3.1";
 
 // Export core classes
 export { Decimal, Matrix, Vector };
@@ -56,7 +56,8 @@ export const scale3D = Transforms3D.scale;
 export const applyTransform3D = Transforms3D.applyTransform;
 
 /**
- * Default export for browser global (window.SVGMatrix)
+ * Default export for browser global (window.SVGMatrixLib)
+ * Note: Named SVGMatrixLib to avoid conflict with native browser SVGMatrix
  */
 const SVGMatrix = {
   VERSION,

package/src/svg-parser.js

@@ -7,10 +7,6 @@
  * @module svg-parser
  */
 
-import Decimal from "decimal.js";
-
-Decimal.set({ precision: 80 });
-
 /**
  * Recursively set ownerDocument on an element and all its descendants.
  * @param {SVGElement} el - Element to set ownerDocument on
@@ -666,30 +662,6 @@ export class SVGElement {
 // INTERNAL PARSING FUNCTIONS
 // ============================================================================
 
-/**
- * Check if whitespace should be preserved based on xml:space attribute.
- * BUG FIX 2: Helper function to check xml:space="preserve" on element or ancestors
- * @private
- * @param {SVGElement} element - Element to check for xml:space attribute
- * @returns {boolean} True if whitespace should be preserved, false otherwise
- */
-function _shouldPreserveWhitespace(element) {
-  // Validation: Ensure element is not null/undefined
-  if (!element) {
-    throw new Error(
-      "_shouldPreserveWhitespace: element cannot be null or undefined",
-    );
-  }
-  let current = element;
-  while (current) {
-    const xmlSpace = current.getAttribute("xml:space");
-    if (xmlSpace === "preserve") return true;
-    if (xmlSpace === "default") return false;
-    current = current.parentNode;
-  }
-  return false;
-}
-
 /**
  * Parse a single element from SVG string.
  * @private

package/src/svg-rendering-context.js

@@ -31,10 +31,8 @@ import Decimal from "decimal.js";
 import {
   FillRule,
   pointInPolygonWithRule,
-  offsetPolygon as _offsetPolygon,
   strokeToFilledPolygon,
 } from "./svg-boolean-ops.js";
-import * as _PolygonClip from "./polygon-clip.js";
 
 Decimal.set({ precision: 80 });
 
@@ -353,9 +351,9 @@ export class SVGRenderingContext {
       extent = halfWidth.times(this.strokeMiterlimit);
     }
 
-    // Square linecaps extend by half stroke width beyond endpoints - Why: total extent is stroke radius + cap extension = strokeWidth
+    // Square linecaps extend strokeWidth/2 beyond endpoints - Why: total extent is base strokeWidth/2 + cap extension strokeWidth/2 = strokeWidth
     if (this.strokeLinecap === "square") {
-      const capExtent = halfWidth.times(2); // strokeWidth/2 + strokeWidth/2
+      const capExtent = halfWidth.times(2); // Total extent: strokeWidth (base halfWidth + cap halfWidth)
       if (capExtent.gt(extent)) {
         extent = capExtent;
       }

package/src/svg-toolbox-lib.js

@@ -5,7 +5,7 @@
  * Provides 69+ operations for cleaning, optimizing, and transforming SVG files.
  *
  * @module svg-toolbox-lib
- * @version 1.2.1
+ * @version 1.3.1
  * @license MIT
  *
  * @example Browser usage:
@@ -34,7 +34,7 @@ import * as SVGToolboxModule from "./svg-toolbox.js";
 /**
  * Library version
  */
-export const VERSION = "1.2.1";
+export const VERSION = "1.3.1";
 
 /**
  * Default export for browser global (window.SVGToolbox)

package/src/svg-validation-data.js

@@ -606,7 +606,7 @@ export const VALID_CHILDREN = {
     "set",
     "title",
   ],
-  font: ["desc", "glyph", "hkern", "metadata", "title", "vkern"],
+  font: ["desc", "font-face", "glyph", "hkern", "metadata", "missing-glyph", "title", "vkern"],
   "font-face": ["desc", "font-face-src", "metadata", "title"],
   "font-face-src": ["font-face-name", "font-face-uri"],
   "font-face-uri": ["font-face-format"],

package/src/svgm-lib.js

@@ -5,7 +5,7 @@
  * comprehensive SVG manipulation (SVGToolbox). Works in Node.js and browser.
  *
  * @module svgm-lib
- * @version 1.2.1
+ * @version 1.3.1
  * @license MIT
  *
  * @example Browser usage:
@@ -49,7 +49,7 @@ Decimal.set({ precision: 80 });
 /**
  * Library version
  */
-export const VERSION = "1.2.1";
+export const VERSION = "1.3.1";
 
 // Export math classes
 export { Decimal, Matrix, Vector };