paper 0.12.19 → 0.13.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (51) hide show
  1. package/CHANGELOG.md +250 -0
  2. package/README.md +34 -27
  3. package/dist/docs/assets/js/paper.js +791 -366
  4. package/dist/docs/classes/Color.html +63 -47
  5. package/dist/docs/classes/CompoundPath.html +162 -59
  6. package/dist/docs/classes/Curve.html +9 -7
  7. package/dist/docs/classes/CurveLocation.html +1 -1
  8. package/dist/docs/classes/Event.html +1 -1
  9. package/dist/docs/classes/Gradient.html +1 -1
  10. package/dist/docs/classes/GradientStop.html +1 -1
  11. package/dist/docs/classes/Group.html +63 -24
  12. package/dist/docs/classes/HitResult.html +1 -1
  13. package/dist/docs/classes/Item.html +63 -24
  14. package/dist/docs/classes/Key.html +1 -1
  15. package/dist/docs/classes/KeyEvent.html +1 -1
  16. package/dist/docs/classes/Layer.html +63 -24
  17. package/dist/docs/classes/Matrix.html +1 -1
  18. package/dist/docs/classes/MouseEvent.html +1 -1
  19. package/dist/docs/classes/PaperScope.html +87 -1
  20. package/dist/docs/classes/PaperScript.html +1 -1
  21. package/dist/docs/classes/Path.html +174 -68
  22. package/dist/docs/classes/PathItem.html +280 -177
  23. package/dist/docs/classes/Point.html +143 -21
  24. package/dist/docs/classes/PointText.html +94 -24
  25. package/dist/docs/classes/Project.html +14 -8
  26. package/dist/docs/classes/Raster.html +93 -35
  27. package/dist/docs/classes/Rectangle.html +12 -11
  28. package/dist/docs/classes/Segment.html +1 -1
  29. package/dist/docs/classes/Shape.html +63 -24
  30. package/dist/docs/classes/Size.html +81 -21
  31. package/dist/docs/classes/Style.html +34 -2
  32. package/dist/docs/classes/SymbolDefinition.html +1 -1
  33. package/dist/docs/classes/SymbolItem.html +64 -25
  34. package/dist/docs/classes/TextItem.html +94 -24
  35. package/dist/docs/classes/Tool.html +2 -1
  36. package/dist/docs/classes/ToolEvent.html +27 -1
  37. package/dist/docs/classes/Tween.html +1 -1
  38. package/dist/docs/classes/View.html +203 -10
  39. package/dist/docs/classes/global.html +1 -1
  40. package/dist/docs/classes/index.html +2 -2
  41. package/dist/docs/index.html +1 -1
  42. package/dist/node/canvas.js +10 -8
  43. package/dist/node/self.js +13 -4
  44. package/dist/paper-core.js +772 -355
  45. package/dist/paper-core.min.js +3 -3
  46. package/dist/paper-full.js +791 -366
  47. package/dist/paper-full.min.js +3 -3
  48. package/dist/paper.d.ts +324 -73
  49. package/examples/Rasters/Smoothing.html +1 -1
  50. package/package.json +5 -11
  51. package/dist/node/xml.js +0 -40
@@ -354,7 +354,8 @@ console.log(point); // { x: 100, y: 50 }</code></pre>
354
354
 
355
355
 
356
356
  <pre><code>var point = new Point(5, 10);
357
- var result = point + 20;
357
+ var result = point + 20; // PaperScript
358
+ var result = point.add(20); // JavaScript
358
359
  console.log(result); // {x: 25, y: 30}</code></pre>
359
360
 
360
361
  </div>
@@ -395,7 +396,8 @@ console.log(result); // {x: 25, y: 30}</code></pre>
395
396
 
396
397
  <pre><code>var point1 = new Point(5, 10);
397
398
  var point2 = new Point(10, 20);
398
- var result = point1 + point2;
399
+ var result = point1 + point2; // PaperScript
400
+ var result = point1.add(point2); // JavaScript
399
401
  console.log(result); // {x: 15, y: 30}</code></pre>
400
402
 
401
403
  </div>
@@ -445,7 +447,8 @@ console.log(result); // {x: 15, y: 30}</code></pre>
445
447
 
446
448
 
447
449
  <pre><code>var point = new Point(10, 20);
448
- var result = point - 5;
450
+ var result = point - 5; // PaperScript
451
+ var result = point.subtract(5); // JavaScript
449
452
  console.log(result); // {x: 5, y: 15}</code></pre>
450
453
 
451
454
  </div>
@@ -486,7 +489,8 @@ console.log(result); // {x: 5, y: 15}</code></pre>
486
489
 
487
490
  <pre><code>var firstPoint = new Point(10, 20);
488
491
  var secondPoint = new Point(5, 5);
489
- var result = firstPoint - secondPoint;
492
+ var result = firstPoint - secondPoint; // PaperScript
493
+ var result = firstPoint.subtract(secondPoint); // JavaScript
490
494
  console.log(result); // {x: 5, y: 15}</code></pre>
491
495
 
492
496
  </div>
@@ -536,7 +540,8 @@ console.log(result); // {x: 5, y: 15}</code></pre>
536
540
 
537
541
 
538
542
  <pre><code>var point = new Point(10, 20);
539
- var result = point * 2;
543
+ var result = point * 2; // PaperScript
544
+ var result = point.multiply(2); // JavaScript
540
545
  console.log(result); // {x: 20, y: 40}</code></pre>
541
546
 
542
547
  </div>
@@ -577,7 +582,8 @@ console.log(result); // {x: 20, y: 40}</code></pre>
577
582
 
578
583
  <pre><code>var firstPoint = new Point(5, 10);
579
584
  var secondPoint = new Point(4, 2);
580
- var result = firstPoint * secondPoint;
585
+ var result = firstPoint * secondPoint; // PaperScript
586
+ var result = firstPoint.multiply(secondPoint); // JavaScript
581
587
  console.log(result); // {x: 20, y: 20}</code></pre>
582
588
 
583
589
  </div>
@@ -627,7 +633,8 @@ console.log(result); // {x: 20, y: 20}</code></pre>
627
633
 
628
634
 
629
635
  <pre><code>var point = new Point(10, 20);
630
- var result = point / 2;
636
+ var result = point / 2; // PaperScript
637
+ var result = point.divide(2); // JavaScript
631
638
  console.log(result); // {x: 5, y: 10}</code></pre>
632
639
 
633
640
  </div>
@@ -668,7 +675,8 @@ console.log(result); // {x: 5, y: 10}</code></pre>
668
675
 
669
676
  <pre><code>var firstPoint = new Point(8, 10);
670
677
  var secondPoint = new Point(2, 5);
671
- var result = firstPoint / secondPoint;
678
+ var result = firstPoint / secondPoint; // PaperScript
679
+ var result = firstPoint.divide(secondPoint); // JavaScript
672
680
  console.log(result); // {x: 4, y: 2}</code></pre>
673
681
 
674
682
  </div>
@@ -718,7 +726,9 @@ console.log(result); // {x: 4, y: 2}</code></pre>
718
726
 
719
727
 
720
728
  <pre><code>var point = new Point(12, 6);
721
- console.log(point % 5); // {x: 2, y: 1}</code></pre>
729
+ var result = point % 5; // PaperScript
730
+ var result = point.modulo(5); // JavaScript
731
+ console.log(result); // {x: 2, y: 1}</code></pre>
722
732
 
723
733
  </div>
724
734
 
@@ -757,7 +767,9 @@ console.log(point % 5); // {x: 2, y: 1}</code></pre>
757
767
 
758
768
 
759
769
  <pre><code>var point = new Point(12, 6);
760
- console.log(point % new Point(5, 2)); // {x: 2, y: 0}</code></pre>
770
+ var result = point % new Point(5, 2); // PaperScript
771
+ var result = point.modulo(new Point(5, 2)); // JavaScript
772
+ console.log(result); // {x: 2, y: 0}</code></pre>
761
773
 
762
774
  </div>
763
775
 
@@ -1473,6 +1485,42 @@ point2.x = 1; // doesn't change point1.x</code></pre>
1473
1485
 
1474
1486
 
1475
1487
 
1488
+ </div>
1489
+ </div>
1490
+ </div>
1491
+
1492
+
1493
+ <div id="negate" class="member">
1494
+ <div class="member-link">
1495
+ <a name="negate" href="#negate"><tt><b>negate</b>()</tt></a>
1496
+ </div>
1497
+ <div class="member-description hidden">
1498
+ <div class="member-text">
1499
+ <p>Returns a new point with both coordinates negated. PaperScript uses it for the unary minus operator. The object itself is not modified!</p>
1500
+
1501
+
1502
+
1503
+ <ul class="member-list">
1504
+ <h4>Returns:</h4>
1505
+
1506
+ <li>
1507
+ <tt><a href="../classes/Point.html"><tt>Point</tt></a></tt>&nbsp;&mdash;&nbsp;the negation of the point as a new point
1508
+ </li>
1509
+
1510
+
1511
+ </ul>
1512
+
1513
+
1514
+
1515
+
1516
+ <h4>Example:</h4>
1517
+
1518
+
1519
+ <pre><code>var point = new Point(12, -6);
1520
+ var result = -point; // PaperScript
1521
+ var result = point.negate(); // JavaScript
1522
+ console.log(result); // {x: -12, y: 6}</code></pre>
1523
+
1476
1524
  </div>
1477
1525
  </div>
1478
1526
  </div>
@@ -2023,6 +2071,68 @@ console.log(absPoint); // {x: 5, y: 10}</code></pre>
2023
2071
  </div>
2024
2072
  </div>
2025
2073
 
2074
+
2075
+ <div id="clamp-min-max" class="member">
2076
+ <div class="member-link">
2077
+ <a name="clamp-min-max" href="#clamp-min-max"><tt><b>clamp</b>(min, max)</tt></a>
2078
+ </div>
2079
+ <div class="member-description hidden">
2080
+ <div class="member-text">
2081
+ <p>Returns a new point with the <a href="../classes/Point.html#x"><tt>x</tt></a> and <a href="../classes/Point.html#y"><tt>y</tt></a> values clamped to the range between the given minimum and maximum points. The object itself is not modified!</p>
2082
+
2083
+
2084
+ <ul class="member-list">
2085
+ <h4>Parameters:</h4>
2086
+
2087
+ <li>
2088
+ <tt>min:</tt>
2089
+ <a href="../classes/Point.html"><tt>Point</tt></a>
2090
+ &mdash;&nbsp;the point with the smallest values
2091
+
2092
+ </li>
2093
+
2094
+ <li>
2095
+ <tt>max:</tt>
2096
+ <a href="../classes/Point.html"><tt>Point</tt></a>
2097
+ &mdash;&nbsp;the point with the largest values
2098
+
2099
+ </li>
2100
+
2101
+ </ul>
2102
+
2103
+
2104
+ <ul class="member-list">
2105
+ <h4>Returns:</h4>
2106
+
2107
+ <li>
2108
+ <tt><a href="../classes/Point.html"><tt>Point</tt></a></tt>&nbsp;&mdash;&nbsp;the clamped point as a new point
2109
+ </li>
2110
+
2111
+
2112
+ </ul>
2113
+
2114
+
2115
+
2116
+
2117
+ <h4>Example:</h4>
2118
+
2119
+
2120
+ <pre><code>var point = new Point(-5, 150);
2121
+ var clampPoint = point.clamp(new Point(0, 0), new Point(100, 100));
2122
+ console.log(clampPoint); // {x: 0, y: 100}</code></pre>
2123
+
2124
+ <h4>Example:<span class="description">Keep a point inside a rectangle:</span></h4>
2125
+
2126
+
2127
+ <pre><code>var rect = new Rectangle(10, 20, 100, 50);
2128
+ var point = new Point(200, 40);
2129
+ var clampPoint = point.clamp(rect.topLeft, rect.bottomRight);
2130
+ console.log(clampPoint); // {x: 110, y: 40}</code></pre>
2131
+
2132
+ </div>
2133
+ </div>
2134
+ </div>
2135
+
2026
2136
 
2027
2137
 
2028
2138
  <h3>Math Operator Functions</h3>
@@ -2068,7 +2178,8 @@ console.log(absPoint); // {x: 5, y: 10}</code></pre>
2068
2178
 
2069
2179
 
2070
2180
  <pre><code>var point = new Point(5, 10);
2071
- var result = point + 20;
2181
+ var result = point + 20; // PaperScript
2182
+ var result = point.add(20); // JavaScript
2072
2183
  console.log(result); // {x: 25, y: 30}</code></pre>
2073
2184
 
2074
2185
  </div>
@@ -2116,7 +2227,8 @@ console.log(result); // {x: 25, y: 30}</code></pre>
2116
2227
 
2117
2228
  <pre><code>var point1 = new Point(5, 10);
2118
2229
  var point2 = new Point(10, 20);
2119
- var result = point1 + point2;
2230
+ var result = point1 + point2; // PaperScript
2231
+ var result = point1.add(point2); // JavaScript
2120
2232
  console.log(result); // {x: 15, y: 30}</code></pre>
2121
2233
 
2122
2234
  </div>
@@ -2166,7 +2278,8 @@ console.log(result); // {x: 15, y: 30}</code></pre>
2166
2278
 
2167
2279
 
2168
2280
  <pre><code>var point = new Point(10, 20);
2169
- var result = point - 5;
2281
+ var result = point - 5; // PaperScript
2282
+ var result = point.subtract(5); // JavaScript
2170
2283
  console.log(result); // {x: 5, y: 15}</code></pre>
2171
2284
 
2172
2285
  </div>
@@ -2214,7 +2327,8 @@ console.log(result); // {x: 5, y: 15}</code></pre>
2214
2327
 
2215
2328
  <pre><code>var firstPoint = new Point(10, 20);
2216
2329
  var secondPoint = new Point(5, 5);
2217
- var result = firstPoint - secondPoint;
2330
+ var result = firstPoint - secondPoint; // PaperScript
2331
+ var result = firstPoint.subtract(secondPoint); // JavaScript
2218
2332
  console.log(result); // {x: 5, y: 15}</code></pre>
2219
2333
 
2220
2334
  </div>
@@ -2264,7 +2378,8 @@ console.log(result); // {x: 5, y: 15}</code></pre>
2264
2378
 
2265
2379
 
2266
2380
  <pre><code>var point = new Point(10, 20);
2267
- var result = point * 2;
2381
+ var result = point * 2; // PaperScript
2382
+ var result = point.multiply(2); // JavaScript
2268
2383
  console.log(result); // {x: 20, y: 40}</code></pre>
2269
2384
 
2270
2385
  </div>
@@ -2312,7 +2427,8 @@ console.log(result); // {x: 20, y: 40}</code></pre>
2312
2427
 
2313
2428
  <pre><code>var firstPoint = new Point(5, 10);
2314
2429
  var secondPoint = new Point(4, 2);
2315
- var result = firstPoint * secondPoint;
2430
+ var result = firstPoint * secondPoint; // PaperScript
2431
+ var result = firstPoint.multiply(secondPoint); // JavaScript
2316
2432
  console.log(result); // {x: 20, y: 20}</code></pre>
2317
2433
 
2318
2434
  </div>
@@ -2362,7 +2478,8 @@ console.log(result); // {x: 20, y: 20}</code></pre>
2362
2478
 
2363
2479
 
2364
2480
  <pre><code>var point = new Point(10, 20);
2365
- var result = point / 2;
2481
+ var result = point / 2; // PaperScript
2482
+ var result = point.divide(2); // JavaScript
2366
2483
  console.log(result); // {x: 5, y: 10}</code></pre>
2367
2484
 
2368
2485
  </div>
@@ -2410,7 +2527,8 @@ console.log(result); // {x: 5, y: 10}</code></pre>
2410
2527
 
2411
2528
  <pre><code>var firstPoint = new Point(8, 10);
2412
2529
  var secondPoint = new Point(2, 5);
2413
- var result = firstPoint / secondPoint;
2530
+ var result = firstPoint / secondPoint; // PaperScript
2531
+ var result = firstPoint.divide(secondPoint); // JavaScript
2414
2532
  console.log(result); // {x: 4, y: 2}</code></pre>
2415
2533
 
2416
2534
  </div>
@@ -2460,7 +2578,9 @@ console.log(result); // {x: 4, y: 2}</code></pre>
2460
2578
 
2461
2579
 
2462
2580
  <pre><code>var point = new Point(12, 6);
2463
- console.log(point % 5); // {x: 2, y: 1}</code></pre>
2581
+ var result = point % 5; // PaperScript
2582
+ var result = point.modulo(5); // JavaScript
2583
+ console.log(result); // {x: 2, y: 1}</code></pre>
2464
2584
 
2465
2585
  </div>
2466
2586
  </div>
@@ -2506,7 +2626,9 @@ console.log(point % 5); // {x: 2, y: 1}</code></pre>
2506
2626
 
2507
2627
 
2508
2628
  <pre><code>var point = new Point(12, 6);
2509
- console.log(point % new Point(5, 2)); // {x: 2, y: 0}</code></pre>
2629
+ var result = point % new Point(5, 2); // PaperScript
2630
+ var result = point.modulo(new Point(5, 2)); // JavaScript
2631
+ console.log(result); // {x: 2, y: 0}</code></pre>
2510
2632
 
2511
2633
  </div>
2512
2634
  </div>
@@ -2690,7 +2812,7 @@ var point = maxPoint * randomPoint;</code></pre>
2690
2812
 
2691
2813
  <!-- =========================== copyright notice ========================== -->
2692
2814
  <p class="footer">
2693
- Paper.js v0.12.19<br>
2815
+ Paper.js v0.13.0<br>
2694
2816
  Copyright &#169; 2011—2026 <a href="http://www.lehni.org" target="_blank">J&uuml;rg Lehni</a> &amp; <a href="http://www.jonathanpuckey.com" target="_blank">Jonathan Puckey</a>. All Rights Reserved.</p>
2695
2817
  <div class="content-end"></div>
2696
2818
 
@@ -313,6 +313,7 @@ group.children['example'].fillColor = 'red';
313
313
 
314
314
  <div class="member-text">
315
315
  <p>The path style of the item.</p>
316
+ <p>Styles set on a <a href="../classes/Group.html"><tt>Group</tt></a> or <a href="../classes/Layer.html"><tt>Layer</tt></a> are applied to the children that it contains at that moment. Items added to it later do not receive them.</p>
316
317
 
317
318
 
318
319
 
@@ -655,6 +656,37 @@ circle2.opacity = 0.5;
655
656
  </div>
656
657
 
657
658
 
659
+ </div>
660
+
661
+ </div>
662
+ </div>
663
+
664
+
665
+ <div id="guide" class="member">
666
+ <div class="member-link">
667
+ <a name="guide" href="#guide"><tt><b>guide</b></tt></a>
668
+ </div>
669
+ <div class="member-description hidden">
670
+
671
+ <div class="member-text">
672
+ <p>Specifies whether the item functions as a guide. When set to <code>true</code>, the item is drawn as usual, but left out of hit-tests and mouse interactions. Hit-tests only find guides when <code>options.guides</code> is set, and then only them, see <a href="../classes/Item.html#hittest-point"><tt>hitTest(point[, options])</tt></a>.</p>
673
+
674
+
675
+
676
+ <ul class="member-list">
677
+ <h4>Default:</h4>
678
+ <li><tt>false</tt></li>
679
+ </ul>
680
+
681
+ <ul class="member-list">
682
+ <h4>Type:</h4>
683
+ <li>
684
+ <tt>Boolean</tt>
685
+ </li>
686
+ </ul>
687
+
688
+
689
+
658
690
  </div>
659
691
 
660
692
  </div>
@@ -1358,6 +1390,7 @@ console.log(group.children[0] == path); // true</code></pre>
1358
1390
 
1359
1391
  <div class="member-text">
1360
1392
  <p>The children items contained within this item. Items that define a <a href="../classes/Item.html#name"><tt>name</tt></a> can also be accessed by name.</p>
1393
+ <p>Only <a href="../classes/Group.html"><tt>Group</tt></a>, <a href="../classes/Layer.html"><tt>Layer</tt></a> and <a href="../classes/CompoundPath.html"><tt>CompoundPath</tt></a> items can have children. On all other items, such as <a href="../classes/Path.html"><tt>Path</tt></a>, <a href="../classes/Shape.html"><tt>Shape</tt></a>, <a href="../classes/Raster.html"><tt>Raster</tt></a>, <a href="../classes/SymbolItem.html"><tt>SymbolItem</tt></a> and <a href="../classes/PointText.html"><tt>PointText</tt></a>, <code>children</code> is <code>undefined</code>.</p>
1361
1394
  <p><b>Please note:</b> The children array should not be modified directly using array functions. To remove single items from the children list, use <a href="../classes/Item.html#remove"><tt>item.remove</tt></a>(), to remove all items from the children list, use <a href="../classes/Item.html#removechildren"><tt>item.removeChildren</tt></a>(). To add items to the children list, use <a href="../classes/Item.html#addchild-item"><tt>item.addChild(item)</tt></a> or <a href="../classes/Item.html#insertchild-index-item"><tt>item.insertChild(index, item)</tt></a>.</p>
1362
1395
 
1363
1396
 
@@ -3298,22 +3331,22 @@ function onMouseDown(event) {
3298
3331
  <div class="member-description hidden">
3299
3332
  <div class="member-text">
3300
3333
  <p>Performs a hit-test on the item and its children (if it is a <a href="../classes/Group.html"><tt>Group</tt></a> or <a href="../classes/Layer.html"><tt>Layer</tt></a>) at the location of the specified point, returning the first found hit.</p>
3301
- <p>The options object allows you to control the specifics of the hit- test and may contain a combination of the following values:</p>
3334
+ <p>The options object allows you to control the specifics of the hit-test. Without options, <code>fill</code>, <code>stroke</code> and <code>segments</code> are hit-tested. As soon as an options object is passed, only the hit-tests that it sets to <code>true</code> are performed. It may contain a combination of the following values:</p>
3302
3335
  <ul class="member-list">
3303
3336
  <h4>Options:</h4>
3304
- <li><tt>options.tolerance: <tt>Number</tt></tt> &mdash; the tolerance of the hit-test &mdash;&nbsp;default: <tt><a href="../classes/PaperScope.html#settings"><tt>paperScope.settings</tt></a>.hitTolerance</tt></li>
3337
+ <li><tt>options.tolerance: <tt>Number</tt></tt> &mdash; the tolerance of the hit-test, in project coordinates &mdash;&nbsp;default: <tt><a href="../classes/PaperScope.html#settings"><tt>paperScope.settings</tt></a>.hitTolerance</tt></li>
3305
3338
  <li><tt>options.class: <tt>Function</tt></tt> &mdash; only hit-test against a specific item class, or any of its sub-classes, by providing the constructor function against which an <code>instanceof</code> check is performed: <tt>Group</tt>, <tt>Layer</tt>, <tt>Path</tt>, <tt>CompoundPath</tt>, <tt>Shape</tt>, <tt>Raster</tt>, <tt>SymbolItem</tt>, <tt>PointText</tt>, &hellip;</li>
3306
3339
  <li><tt>options.match: <tt>Function</tt></tt> &mdash; a match function to be called for each found hit result: Return <code>true</code> to return the result, <code>false</code> to keep searching</li>
3307
- <li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items &mdash;&nbsp;default: <tt>true</tt></li>
3308
- <li><tt>options.stroke: <tt>Boolean</tt></tt> &mdash; hit-test the stroke of path items, taking into account the setting of stroke color and width &mdash;&nbsp;default: <tt>true</tt></li>
3309
- <li><tt>options.segments: <tt>Boolean</tt></tt> &mdash; hit-test for <a href="../classes/Segment.html#point"><tt>segment.point</tt></a> of <a href="../classes/Path.html"><tt>Path</tt></a> items &mdash;&nbsp;default: <tt>true</tt></li>
3340
+ <li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items</li>
3341
+ <li><tt>options.stroke: <tt>Boolean</tt></tt> &mdash; hit-test the stroke of path items, taking into account the setting of stroke color and width</li>
3342
+ <li><tt>options.segments: <tt>Boolean</tt></tt> &mdash; hit-test for <a href="../classes/Segment.html#point"><tt>segment.point</tt></a> of <a href="../classes/Path.html"><tt>Path</tt></a> items</li>
3310
3343
  <li><tt>options.curves: <tt>Boolean</tt></tt> &mdash; hit-test the curves of path items, without taking the stroke color or width into account</li>
3311
3344
  <li><tt>options.handles: <tt>Boolean</tt></tt> &mdash; hit-test for the handles (<a href="../classes/Segment.html#handlein"><tt>segment.handleIn</tt></a> / <a href="../classes/Segment.html#handleout"><tt>segment.handleOut</tt></a>) of path segments.</li>
3312
3345
  <li><tt>options.ends: <tt>Boolean</tt></tt> &mdash; only hit-test for the first or last segment points of open path items</li>
3313
3346
  <li><tt>options.position: <tt>Boolean</tt></tt> &mdash; hit-test the <a href="../classes/Item.html#position"><tt>item.position</tt></a> of of items, which depends on the setting of <a href="../classes/Item.html#pivot"><tt>item.pivot</tt></a></li>
3314
3347
  <li><tt>options.center: <tt>Boolean</tt></tt> &mdash; hit-test the <a href="../classes/Rectangle.html#center"><tt>rectangle.center</tt></a> of the bounding rectangle of items (<a href="../classes/Item.html#bounds"><tt>item.bounds</tt></a>)</li>
3315
3348
  <li><tt>options.bounds: <tt>Boolean</tt></tt> &mdash; hit-test the corners and side-centers of the bounding rectangle of items (<a href="../classes/Item.html#bounds"><tt>item.bounds</tt></a>)</li>
3316
- <li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; hit-test items that have <tt>Item#guide</tt> set to <code>true</code></li>
3349
+ <li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; only hit-test items that have <a href="../classes/Item.html#guide"><tt>item.guide</tt></a> set to <code>true</code></li>
3317
3350
  <li><tt>options.selected: <tt>Boolean</tt></tt> &mdash; only hit selected items</li>
3318
3351
  </ul>
3319
3352
 
@@ -3552,7 +3585,7 @@ function onMouseDown(event) {
3552
3585
  <h4>Returns:</h4>
3553
3586
 
3554
3587
  <li>
3555
- <tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching descendant items
3588
+ <tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching descendant items, in their stacking order from bottom to top, with each item listed before its own descendants
3556
3589
  </li>
3557
3590
 
3558
3591
 
@@ -3725,6 +3758,8 @@ function onMouseDown(event) {
3725
3758
  <li><tt>options.precision: <tt>Number</tt></tt> &mdash; the amount of fractional digits in numbers used in SVG data &mdash;&nbsp;default: <tt>5</tt></li>
3726
3759
  <li><tt>options.matchShapes: <tt>Boolean</tt></tt> &mdash; whether path items should tried to be converted to SVG shape items (rect, circle, ellipse, line, polyline, polygon), if their geometries match &mdash;&nbsp;default: <tt>false</tt></li>
3727
3760
  <li><tt>options.embedImages: <tt>Boolean</tt></tt> &mdash; whether raster images should be embedded as base64 data inlined in the xlink:href attribute, or kept as a link to their external URL. &mdash;&nbsp;default: <tt>true</tt></li>
3761
+ <li><tt>options.reuseImages: <tt>Boolean</tt></tt> &mdash; whether raster images with the same content should only be exported once into the <code>&lt;defs&gt;</code> element, and placed through <code>&lt;use&gt;</code> elements referencing it &mdash;&nbsp;default: <tt>false</tt></li>
3762
+ <li><tt>options.idPrefix: <tt>String</tt></tt> &mdash; a prefix for the ids generated for definitions such as gradients, clip paths and symbols, to keep them unique when several exported SVGs are placed in one document &mdash;&nbsp;default: <tt>&rsquo;&rsquo;</tt></li>
3728
3763
  <li><tt>options.reduceAttributes: <tt>Boolean</tt></tt> &mdash; wether to only include style attributes in the SVG output that differ from their parents, or to always include them (much faster but leading to redundancies). &mdash;&nbsp;default: <tt>true</tt></li>
3729
3764
  </ul>
3730
3765
 
@@ -3767,9 +3802,13 @@ function onMouseDown(event) {
3767
3802
  <div class="member-description hidden">
3768
3803
  <div class="member-text">
3769
3804
  <p>Converts the provided SVG content into Paper.js items and adds them to the this item&rsquo;s children list. Note that the item is not cleared first. You can call <a href="../classes/Item.html#removechildren"><tt>item.removeChildren</tt></a>() to do so.</p>
3805
+ <p><code>&lt;symbol&gt;</code> elements are imported as <a href="../classes/SymbolDefinition.html"><tt>SymbolDefinition</tt></a> items, and the <code>&lt;use&gt;</code> elements that place them as <a href="../classes/SymbolItem.html"><tt>SymbolItem</tt></a> items. The styles that <code>&lt;use&gt;</code> elements inherit don&rsquo;t reach the symbols&rsquo; content.</p>
3770
3806
  <ul class="member-list">
3771
3807
  <h4>Options:</h4>
3772
3808
  <li><tt>options.expandShapes: <tt>Boolean</tt></tt> &mdash; whether imported shape items should be expanded to path items &mdash;&nbsp;default: <tt>false</tt></li>
3809
+ <li>[options.crossOrigin] {String} the {@link Raster#crossOrigin}
3810
+ value of the rasters created for `<image>` elements, to load their
3811
+ images with CORS</li>
3773
3812
  <li><tt>options.onLoad: <tt>Function</tt></tt> &mdash; the callback function to call once the SVG content is loaded from the given URL receiving two arguments: the converted <code>item</code> and the original <code>svg</code> data as a string. Only required when loading from external resources.</li>
3774
3813
  <li><tt>options.onError: <tt>Function</tt></tt> &mdash; the callback function to call if an error occurs during loading. Only required when loading from external resources.</li>
3775
3814
  <li><tt>options.insert: <tt>Boolean</tt></tt> &mdash; whether the imported items should be added to the item that <code>importSVG()</code> is called on &mdash;&nbsp;default: <tt>true</tt></li>
@@ -4245,9 +4284,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4245
4284
  </div>
4246
4285
 
4247
4286
 
4248
- <div id="reduce-options" class="member">
4287
+ <div id="reduce" class="member">
4249
4288
  <div class="member-link">
4250
- <a name="reduce-options" href="#reduce-options"><tt><b>reduce</b>(options)</tt></a>
4289
+ <a name="reduce" href="#reduce"><tt><b>reduce</b>([options])</tt></a>
4251
4290
  </div>
4252
4291
  <div class="member-description hidden">
4253
4292
  <div class="member-text">
@@ -4259,9 +4298,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4259
4298
 
4260
4299
  <li>
4261
4300
  <tt>options:</tt>
4262
-
4263
-
4264
-
4301
+ <tt>Object</tt>
4302
+ &mdash;&nbsp;the options passed on to <a href="../classes/Path.html#reduce-options"><tt>path.reduce(options)</tt></a>
4303
+ &mdash;&nbsp;optional
4265
4304
  </li>
4266
4305
 
4267
4306
  </ul>
@@ -4650,7 +4689,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4650
4689
  </div>
4651
4690
  <div class="member-description hidden">
4652
4691
  <div class="member-text">
4653
- <p>Checks if this item is above the specified item in the stacking order of the project.</p>
4692
+ <p>Checks if this item is above the specified item in the stacking order of the project. If one item is a descendant of the other, neither is above the other and <code>false</code> is returned.</p>
4654
4693
 
4655
4694
 
4656
4695
  <ul class="member-list">
@@ -4691,7 +4730,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4691
4730
  </div>
4692
4731
  <div class="member-description hidden">
4693
4732
  <div class="member-text">
4694
- <p>Checks if the item is below the specified item in the stacking order of the project.</p>
4733
+ <p>Checks if the item is below the specified item in the stacking order of the project. If one item is a descendant of the other, neither is below the other and <code>false</code> is returned.</p>
4695
4734
 
4696
4735
 
4697
4736
  <ul class="member-list">
@@ -5649,11 +5688,11 @@ circle.scale(3, 1);
5649
5688
 
5650
5689
  <div id="fitbounds-rectangle" class="member">
5651
5690
  <div class="member-link">
5652
- <a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fill])</tt></a>
5691
+ <a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fit])</tt></a>
5653
5692
  </div>
5654
5693
  <div class="member-description hidden">
5655
5694
  <div class="member-text">
5656
- <p>Transform the item so that its <a href="../classes/Item.html#bounds"><tt>bounds</tt></a> fit within the specified rectangle, without changing its aspect ratio.</p>
5695
+ <p>Transform the item so that its <a href="../classes/Item.html#bounds"><tt>bounds</tt></a> are centered in the specified rectangle and fitted to it as described by <code>fit</code>.</p>
5657
5696
 
5658
5697
 
5659
5698
  <ul class="member-list">
@@ -5667,10 +5706,10 @@ circle.scale(3, 1);
5667
5706
  </li>
5668
5707
 
5669
5708
  <li>
5670
- <tt>fill:</tt>
5671
- <tt>Boolean</tt>
5672
-
5673
- &mdash;&nbsp;optional, default: <tt>false</tt>
5709
+ <tt>fit:</tt>
5710
+ <tt>String</tt>⟋<tt>Boolean</tt>
5711
+ &mdash;&nbsp;how to fit the item, as in CSS&rsquo;s <code>object-fit</code>: <code>&#39;contain&#39;</code> fits all of it within the rectangle, <code>&#39;cover&#39;</code> makes it cover the whole rectangle, and <code>&#39;fill&#39;</code> stretches it to the rectangle, changing its aspect ratio. The deprecated <code>true</code> and <code>false</code> stand for <code>&#39;cover&#39;</code> and <code>&#39;contain&#39;</code>.
5712
+ &mdash;&nbsp;optional, default: <tt>&lsquo;contain&rsquo;</tt>
5674
5713
  </li>
5675
5714
 
5676
5715
  </ul>
@@ -5712,7 +5751,7 @@ circlePath.fitBounds(path.bounds);
5712
5751
  </div>
5713
5752
 
5714
5753
 
5715
- <h4>Example:<span class="description">Fitting an item to the bounding rectangle of another item's bounding rectangle with the fill parameter set to true:</span></h4>
5754
+ <h4>Example:<span class="description">Fitting an item to the bounding rectangle of another item's bounding rectangle, covering all of it:</span></h4>
5716
5755
 
5717
5756
  <div class="paperscript split">
5718
5757
 
@@ -5739,7 +5778,7 @@ var circlePath = new Path.Circle({
5739
5778
 
5740
5779
  // Fit the circlePath to the bounding rectangle of
5741
5780
  // the rectangular path:
5742
- circlePath.fitBounds(path.bounds, true);
5781
+ circlePath.fitBounds(path.bounds, 'cover');
5743
5782
  </script>
5744
5783
  <div class="canvas"><canvas width="516" height="100" id="canvas-46"></canvas></div>
5745
5784
  </div>
@@ -6389,7 +6428,7 @@ function onMouseDown(event) {
6389
6428
  <ul class="member-list">
6390
6429
  <h4>Options:</h4>
6391
6430
  <li><tt>options.duration: <tt>Number</tt></tt> &mdash; the duration of the tweening</li>
6392
- <li><tt>options.easing: <tt>Function</tt>⟋<tt>String</tt></tt> &mdash; an easing function or the type of the easing: <tt>&lsquo;linear&rsquo; &lsquo;easeInQuad&rsquo; &lsquo;easeOutQuad&rsquo; &lsquo;easeInOutQuad&rsquo; &lsquo;easeInCubic&rsquo; &lsquo;easeOutCubic&rsquo; &lsquo;easeInOutCubic&rsquo; &lsquo;easeInQuart&rsquo; &lsquo;easeOutQuart&rsquo; &lsquo;easeInOutQuart&rsquo; &lsquo;easeInQuint&rsquo; &lsquo;easeOutQuint&rsquo; &lsquo;easeInOutQuint&rsquo;</tt> &mdash;&nbsp;default: <tt>&lsquo;linear&rsquo;</tt></li>
6431
+ <li><tt>options.easing: <tt>Function</tt>⟋<tt>String</tt></tt> &mdash; an easing function or the type of the easing: <tt>&lsquo;linear&rsquo; &lsquo;easeInQuad&rsquo; &lsquo;easeOutQuad&rsquo; &lsquo;easeInOutQuad&rsquo; &lsquo;easeInCubic&rsquo; &lsquo;easeOutCubic&rsquo; &lsquo;easeInOutCubic&rsquo; &lsquo;easeInQuart&rsquo; &lsquo;easeOutQuart&rsquo; &lsquo;easeInOutQuart&rsquo; &lsquo;easeInQuint&rsquo; &lsquo;easeOutQuint&rsquo; &lsquo;easeInOutQuint&rsquo; &lsquo;easeInSine&rsquo; &lsquo;easeOutSine&rsquo; &lsquo;easeInOutSine&rsquo; &lsquo;easeInExpo&rsquo; &lsquo;easeOutExpo&rsquo; &lsquo;easeInOutExpo&rsquo; &lsquo;easeInCirc&rsquo; &lsquo;easeOutCirc&rsquo; &lsquo;easeInOutCirc&rsquo;</tt> &mdash;&nbsp;default: <tt>&lsquo;linear&rsquo;</tt></li>
6393
6432
  <li><tt>options.start: <tt>Boolean</tt></tt> &mdash; whether to start tweening automatically &mdash;&nbsp;default: <tt>true</tt></li>
6394
6433
  </ul>
6395
6434
 
@@ -6969,6 +7008,37 @@ function onMouseMove(event) {
6969
7008
 
6970
7009
 
6971
7010
 
7011
+ </div>
7012
+
7013
+ </div>
7014
+ </div>
7015
+
7016
+
7017
+ <div id="tracking" class="member">
7018
+ <div class="member-link">
7019
+ <a name="tracking" href="#tracking"><tt><b>tracking</b></tt></a>
7020
+ </div>
7021
+ <div class="member-description hidden">
7022
+
7023
+ <div class="member-text">
7024
+ <p>The tracking of text content: the space added after each character, in thousandths of an em, as in Adobe Illustrator and InDesign. A tracking of 100 adds a tenth of the font size.</p>
7025
+
7026
+
7027
+
7028
+ <ul class="member-list">
7029
+ <h4>Default:</h4>
7030
+ <li><tt>0</tt></li>
7031
+ </ul>
7032
+
7033
+ <ul class="member-list">
7034
+ <h4>Type:</h4>
7035
+ <li>
7036
+ <tt>Number</tt>
7037
+ </li>
7038
+ </ul>
7039
+
7040
+
7041
+
6972
7042
  </div>
6973
7043
 
6974
7044
  </div>
@@ -7019,7 +7089,7 @@ function onMouseMove(event) {
7019
7089
 
7020
7090
  <!-- =========================== copyright notice ========================== -->
7021
7091
  <p class="footer">
7022
- Paper.js v0.12.19<br>
7092
+ Paper.js v0.13.0<br>
7023
7093
  Copyright &#169; 2011—2026 <a href="http://www.lehni.org" target="_blank">J&uuml;rg Lehni</a> &amp; <a href="http://www.jonathanpuckey.com" target="_blank">Jonathan Puckey</a>. All Rights Reserved.</p>
7024
7094
  <div class="content-end"></div>
7025
7095