paper 0.12.20 → 0.14.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 (54) hide show
  1. package/CHANGELOG.md +318 -0
  2. package/README.md +45 -26
  3. package/dist/docs/assets/js/paper.js +1210 -481
  4. package/dist/docs/classes/ChangeFlag.html +384 -0
  5. package/dist/docs/classes/Color.html +63 -47
  6. package/dist/docs/classes/CompoundPath.html +219 -62
  7. package/dist/docs/classes/Curve.html +9 -7
  8. package/dist/docs/classes/CurveLocation.html +1 -1
  9. package/dist/docs/classes/Event.html +1 -1
  10. package/dist/docs/classes/Gradient.html +1 -1
  11. package/dist/docs/classes/GradientStop.html +1 -1
  12. package/dist/docs/classes/Group.html +151 -27
  13. package/dist/docs/classes/HitResult.html +3 -2
  14. package/dist/docs/classes/HostItem.html +6721 -0
  15. package/dist/docs/classes/Item.html +120 -27
  16. package/dist/docs/classes/Key.html +1 -1
  17. package/dist/docs/classes/KeyEvent.html +1 -1
  18. package/dist/docs/classes/Layer.html +151 -27
  19. package/dist/docs/classes/Matrix.html +1 -1
  20. package/dist/docs/classes/MouseEvent.html +1 -1
  21. package/dist/docs/classes/PaperScope.html +88 -1
  22. package/dist/docs/classes/PaperScript.html +2 -1
  23. package/dist/docs/classes/Path.html +232 -72
  24. package/dist/docs/classes/PathItem.html +337 -180
  25. package/dist/docs/classes/Point.html +143 -21
  26. package/dist/docs/classes/PointText.html +151 -27
  27. package/dist/docs/classes/Project.html +201 -8
  28. package/dist/docs/classes/Raster.html +150 -38
  29. package/dist/docs/classes/Rectangle.html +12 -11
  30. package/dist/docs/classes/Segment.html +1 -1
  31. package/dist/docs/classes/Shape.html +120 -27
  32. package/dist/docs/classes/Size.html +81 -21
  33. package/dist/docs/classes/Style.html +35 -3
  34. package/dist/docs/classes/SymbolDefinition.html +1 -1
  35. package/dist/docs/classes/SymbolItem.html +121 -28
  36. package/dist/docs/classes/TextItem.html +151 -27
  37. package/dist/docs/classes/Tool.html +127 -1
  38. package/dist/docs/classes/ToolEvent.html +27 -1
  39. package/dist/docs/classes/Tween.html +1 -1
  40. package/dist/docs/classes/View.html +345 -10
  41. package/dist/docs/classes/global.html +1 -1
  42. package/dist/docs/classes/index.html +2 -2
  43. package/dist/docs/index.html +1 -1
  44. package/dist/node/canvas.js +1 -1
  45. package/dist/node/self.js +4 -3
  46. package/dist/paper-core.js +1182 -465
  47. package/dist/paper-core.min.js +3 -3
  48. package/dist/paper-full.js +1210 -481
  49. package/dist/paper-full.min.js +3 -3
  50. package/dist/paper-sourced.js +18631 -0
  51. package/dist/paper.d.ts +606 -78
  52. package/examples/Rasters/Smoothing.html +1 -1
  53. package/package.json +6 -17
  54. package/dist/node/xml.js +0 -40
@@ -620,6 +620,8 @@
620
620
  <div class="member-text">
621
621
  <p>The bounding rectangle of the curve including handles.</p>
622
622
 
623
+ <p>Read only.</p>
624
+
623
625
 
624
626
 
625
627
  <ul class="member-list">
@@ -1362,7 +1364,7 @@
1362
1364
  </div>
1363
1365
  <div class="member-description hidden">
1364
1366
  <div class="member-text">
1365
- <p>Calculates the curve location at the specified offset on the curve.</p>
1367
+ <p>Calculates the curve location at the specified offset on the curve, or <code>null</code> if the offset exceeds the length of the curve.</p>
1366
1368
 
1367
1369
 
1368
1370
  <ul class="member-list">
@@ -1403,7 +1405,7 @@
1403
1405
  </div>
1404
1406
  <div class="member-description hidden">
1405
1407
  <div class="member-text">
1406
- <p>Calculates the curve location at the specified curve-time parameter on the curve.</p>
1408
+ <p>Calculates the curve location at the specified curve-time parameter on the curve, or <code>null</code> if the parameter lies outside of <code>0..1</code>.</p>
1407
1409
 
1408
1410
 
1409
1411
  <ul class="member-list">
@@ -1471,7 +1473,7 @@
1471
1473
  <h4>Returns:</h4>
1472
1474
 
1473
1475
  <li>
1474
- <tt><tt>Number</tt></tt>&nbsp;&mdash;&nbsp;the curve-time parameter at the specified location
1476
+ <tt><tt>Number</tt></tt>&nbsp;&mdash;&nbsp;the curve-time parameter at the specified location, or <code>null</code> if the offset exceeds the length of the curve
1475
1477
  </li>
1476
1478
 
1477
1479
 
@@ -1594,7 +1596,7 @@
1594
1596
  <h4>Returns:</h4>
1595
1597
 
1596
1598
  <li>
1597
- <tt><a href="../classes/CurveLocation.html"><tt>CurveLocation</tt></a></tt>&nbsp;&mdash;&nbsp;the curve location of the specified point
1599
+ <tt><a href="../classes/CurveLocation.html"><tt>CurveLocation</tt></a>⟋<tt>null</tt></tt>&nbsp;&mdash;&nbsp;the curve location of the specified point
1598
1600
  </li>
1599
1601
 
1600
1602
 
@@ -1635,7 +1637,7 @@
1635
1637
  <h4>Returns:</h4>
1636
1638
 
1637
1639
  <li>
1638
- <tt><tt>Number</tt></tt>&nbsp;&mdash;&nbsp;the length of the path up to the specified point
1640
+ <tt><tt>Number</tt>⟋<tt>null</tt></tt>&nbsp;&mdash;&nbsp;the length of the path up to the specified point
1639
1641
  </li>
1640
1642
 
1641
1643
 
@@ -1676,7 +1678,7 @@
1676
1678
  <h4>Returns:</h4>
1677
1679
 
1678
1680
  <li>
1679
- <tt><tt>Number</tt></tt>&nbsp;&mdash;&nbsp;the curve-time parameter of the specified point
1681
+ <tt><tt>Number</tt>⟋<tt>null</tt></tt>&nbsp;&mdash;&nbsp;the curve-time parameter of the specified point
1680
1682
  </li>
1681
1683
 
1682
1684
 
@@ -2314,7 +2316,7 @@
2314
2316
 
2315
2317
  <!-- =========================== copyright notice ========================== -->
2316
2318
  <p class="footer">
2317
- Paper.js v0.12.20<br>
2319
+ Paper.js v0.14.0<br>
2318
2320
  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>
2319
2321
  <div class="content-end"></div>
2320
2322
 
@@ -663,7 +663,7 @@
663
663
 
664
664
  <!-- =========================== copyright notice ========================== -->
665
665
  <p class="footer">
666
- Paper.js v0.12.20<br>
666
+ Paper.js v0.14.0<br>
667
667
  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>
668
668
  <div class="content-end"></div>
669
669
 
@@ -167,7 +167,7 @@
167
167
 
168
168
  <!-- =========================== copyright notice ========================== -->
169
169
  <p class="footer">
170
- Paper.js v0.12.20<br>
170
+ Paper.js v0.14.0<br>
171
171
  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>
172
172
  <div class="content-end"></div>
173
173
 
@@ -231,7 +231,7 @@ path.fillColor = {
231
231
 
232
232
  <!-- =========================== copyright notice ========================== -->
233
233
  <p class="footer">
234
- Paper.js v0.12.20<br>
234
+ Paper.js v0.14.0<br>
235
235
  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>
236
236
  <div class="content-end"></div>
237
237
 
@@ -264,7 +264,7 @@ function onFrame(event) {
264
264
 
265
265
  <!-- =========================== copyright notice ========================== -->
266
266
  <p class="footer">
267
- Paper.js v0.12.20<br>
267
+ Paper.js v0.14.0<br>
268
268
  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>
269
269
  <div class="content-end"></div>
270
270
 
@@ -253,6 +253,37 @@ function onFrame(event) {
253
253
  </div>
254
254
 
255
255
 
256
+ </div>
257
+
258
+ </div>
259
+ </div>
260
+
261
+
262
+ <div id="isolated" class="member">
263
+ <div class="member-link">
264
+ <a name="isolated" href="#isolated"><tt><b>isolated</b></tt></a>
265
+ </div>
266
+ <div class="member-description hidden">
267
+
268
+ <div class="member-text">
269
+ <p>Specifies whether the group is isolated, drawn through a temporary canvas, so that the blend modes of its children only apply within it, like CSS&rsquo;s <code>isolation: isolate</code>. Without it, a compositing mode such as <code>&#39;destination-out&#39;</code> affects everything drawn below the group, also in other layers. Groups with an <a href="../classes/Item.html#opacity"><tt>item.opacity</tt></a> below 1 or a <a href="../classes/Item.html#blendmode"><tt>item.blendMode</tt></a> are isolated anyway.</p>
270
+
271
+
272
+
273
+ <ul class="member-list">
274
+ <h4>Default:</h4>
275
+ <li><tt>false</tt></li>
276
+ </ul>
277
+
278
+ <ul class="member-list">
279
+ <h4>Type:</h4>
280
+ <li>
281
+ <tt>Boolean</tt>
282
+ </li>
283
+ </ul>
284
+
285
+
286
+
256
287
  </div>
257
288
 
258
289
  </div>
@@ -271,6 +302,32 @@ function onFrame(event) {
271
302
  <div class="reference-members"><h2>Properties inherited from <a href="../classes/Item.html"><tt>Item</tt></a></h2>
272
303
 
273
304
 
305
+ <div id="key" class="member">
306
+ <div class="member-link">
307
+ <a name="key" href="#key"><tt><b>key</b></tt></a>
308
+ </div>
309
+ <div class="member-description hidden">
310
+
311
+ <div class="member-text">
312
+ <p>The key of the host&rsquo;s node that the item represents, in a project backed by a host document, see <a href="../classes/Project.html#source"><tt>project.source</tt></a>. It can only be set once, on an item created by a script, to register the key that the host gave its new node.</p>
313
+
314
+
315
+
316
+ <ul class="member-list">
317
+ <h4>Type:</h4>
318
+ <li>
319
+ <tt>Number</tt>
320
+ </li>
321
+ </ul>
322
+
323
+
324
+
325
+ </div>
326
+
327
+ </div>
328
+ </div>
329
+
330
+
274
331
  <div id="id" class="member">
275
332
  <div class="member-link">
276
333
  <a name="id" href="#id"><tt><b>id</b></tt></a>
@@ -390,6 +447,7 @@ group.children['example'].fillColor = 'red';
390
447
 
391
448
  <div class="member-text">
392
449
  <p>The path style of the item.</p>
450
+ <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>
393
451
 
394
452
 
395
453
 
@@ -732,6 +790,37 @@ circle2.opacity = 0.5;
732
790
  </div>
733
791
 
734
792
 
793
+ </div>
794
+
795
+ </div>
796
+ </div>
797
+
798
+
799
+ <div id="guide" class="member">
800
+ <div class="member-link">
801
+ <a name="guide" href="#guide"><tt><b>guide</b></tt></a>
802
+ </div>
803
+ <div class="member-description hidden">
804
+
805
+ <div class="member-text">
806
+ <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>
807
+
808
+
809
+
810
+ <ul class="member-list">
811
+ <h4>Default:</h4>
812
+ <li><tt>false</tt></li>
813
+ </ul>
814
+
815
+ <ul class="member-list">
816
+ <h4>Type:</h4>
817
+ <li>
818
+ <tt>Boolean</tt>
819
+ </li>
820
+ </ul>
821
+
822
+
823
+
735
824
  </div>
736
825
 
737
826
  </div>
@@ -1322,6 +1411,34 @@ circle.position.x += 100;
1322
1411
 
1323
1412
 
1324
1413
 
1414
+ </div>
1415
+
1416
+ </div>
1417
+ </div>
1418
+
1419
+
1420
+ <div id="scope" class="member">
1421
+ <div class="member-link">
1422
+ <a name="scope" href="#scope"><tt><b>scope</b></tt></a>
1423
+ </div>
1424
+ <div class="member-description hidden">
1425
+
1426
+ <div class="member-text">
1427
+ <p>The scope that this item belongs to, through its project.</p>
1428
+
1429
+ <p>Read only.</p>
1430
+
1431
+
1432
+
1433
+ <ul class="member-list">
1434
+ <h4>Type:</h4>
1435
+ <li>
1436
+ <a href="../classes/PaperScope.html"><tt>PaperScope</tt></a>
1437
+ </li>
1438
+ </ul>
1439
+
1440
+
1441
+
1325
1442
  </div>
1326
1443
 
1327
1444
  </div>
@@ -1435,6 +1552,7 @@ console.log(group.children[0] == path); // true</code></pre>
1435
1552
 
1436
1553
  <div class="member-text">
1437
1554
  <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>
1555
+ <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>
1438
1556
  <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>
1439
1557
 
1440
1558
 
@@ -1936,7 +2054,7 @@ path3.strokeJoin = 'bevel';
1936
2054
  <div class="member-description hidden">
1937
2055
 
1938
2056
  <div class="member-text">
1939
- <p>Specifies whether the stroke is to be drawn taking the current affine transformation into account (the default behavior), or whether it should appear as a non-scaling stroke.</p>
2057
+ <p>Specifies whether the stroke is to be drawn taking the current affine transformation into account (the default behavior), or whether it should appear as a non-scaling stroke. On text, non-scaling strokes are exact for uniform scaling only, as the glyphs are always stroked through the transformation.</p>
1940
2058
 
1941
2059
 
1942
2060
 
@@ -3375,22 +3493,22 @@ function onMouseDown(event) {
3375
3493
  <div class="member-description hidden">
3376
3494
  <div class="member-text">
3377
3495
  <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>
3378
- <p>The options object allows you to control the specifics of the hit- test and may contain a combination of the following values:</p>
3496
+ <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>
3379
3497
  <ul class="member-list">
3380
3498
  <h4>Options:</h4>
3381
- <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>
3499
+ <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>
3382
3500
  <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>
3383
3501
  <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>
3384
- <li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items &mdash;&nbsp;default: <tt>true</tt></li>
3385
- <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>
3386
- <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>
3502
+ <li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items</li>
3503
+ <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>
3504
+ <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>
3387
3505
  <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>
3388
3506
  <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>
3389
3507
  <li><tt>options.ends: <tt>Boolean</tt></tt> &mdash; only hit-test for the first or last segment points of open path items</li>
3390
3508
  <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>
3391
3509
  <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>
3392
3510
  <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>
3393
- <li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; hit-test items that have <tt>Item#guide</tt> set to <code>true</code></li>
3511
+ <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>
3394
3512
  <li><tt>options.selected: <tt>Boolean</tt></tt> &mdash; only hit selected items</li>
3395
3513
  </ul>
3396
3514
 
@@ -3629,7 +3747,7 @@ function onMouseDown(event) {
3629
3747
  <h4>Returns:</h4>
3630
3748
 
3631
3749
  <li>
3632
- <tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching descendant items
3750
+ <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
3633
3751
  </li>
3634
3752
 
3635
3753
 
@@ -3802,6 +3920,8 @@ function onMouseDown(event) {
3802
3920
  <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>
3803
3921
  <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>
3804
3922
  <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>
3923
+ <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>
3924
+ <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>
3805
3925
  <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>
3806
3926
  </ul>
3807
3927
 
@@ -3844,9 +3964,13 @@ function onMouseDown(event) {
3844
3964
  <div class="member-description hidden">
3845
3965
  <div class="member-text">
3846
3966
  <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>
3967
+ <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>
3847
3968
  <ul class="member-list">
3848
3969
  <h4>Options:</h4>
3849
3970
  <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>
3971
+ <li>[options.crossOrigin] {String} the {@link Raster#crossOrigin}
3972
+ value of the rasters created for `<image>` elements, to load their
3973
+ images with CORS</li>
3850
3974
  <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>
3851
3975
  <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>
3852
3976
  <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>
@@ -4322,9 +4446,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4322
4446
  </div>
4323
4447
 
4324
4448
 
4325
- <div id="reduce-options" class="member">
4449
+ <div id="reduce" class="member">
4326
4450
  <div class="member-link">
4327
- <a name="reduce-options" href="#reduce-options"><tt><b>reduce</b>(options)</tt></a>
4451
+ <a name="reduce" href="#reduce"><tt><b>reduce</b>([options])</tt></a>
4328
4452
  </div>
4329
4453
  <div class="member-description hidden">
4330
4454
  <div class="member-text">
@@ -4336,9 +4460,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4336
4460
 
4337
4461
  <li>
4338
4462
  <tt>options:</tt>
4339
-
4340
-
4341
-
4463
+ <tt>Object</tt>
4464
+ &mdash;&nbsp;the options passed on to <a href="../classes/Path.html#reduce-options"><tt>path.reduce(options)</tt></a>
4465
+ &mdash;&nbsp;optional
4342
4466
  </li>
4343
4467
 
4344
4468
  </ul>
@@ -4580,7 +4704,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4580
4704
  </div>
4581
4705
  <div class="member-description hidden">
4582
4706
  <div class="member-text">
4583
- <p>Checks whether the item has a fill.</p>
4707
+ <p>Checks whether the item has a visible fill, a fill color with an alpha above 0. Hit-tests also hit transparent fills, see <a href="../classes/Item.html#hittest"><tt>hitTest</tt></a>.</p>
4584
4708
 
4585
4709
 
4586
4710
 
@@ -4588,7 +4712,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4588
4712
  <h4>Returns:</h4>
4589
4713
 
4590
4714
  <li>
4591
- <tt><tt>Boolean</tt></tt>&nbsp;&mdash;&nbsp;<tt>true</tt> if the item has a fill, <tt>false</tt> otherwise
4715
+ <tt><tt>Boolean</tt></tt>&nbsp;&mdash;&nbsp;<tt>true</tt> if the item has a visible fill, <tt>false</tt> otherwise
4592
4716
  </li>
4593
4717
 
4594
4718
 
@@ -4727,7 +4851,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4727
4851
  </div>
4728
4852
  <div class="member-description hidden">
4729
4853
  <div class="member-text">
4730
- <p>Checks if this item is above the specified item in the stacking order of the project.</p>
4854
+ <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>
4731
4855
 
4732
4856
 
4733
4857
  <ul class="member-list">
@@ -4768,7 +4892,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
4768
4892
  </div>
4769
4893
  <div class="member-description hidden">
4770
4894
  <div class="member-text">
4771
- <p>Checks if the item is below the specified item in the stacking order of the project.</p>
4895
+ <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>
4772
4896
 
4773
4897
 
4774
4898
  <ul class="member-list">
@@ -5726,11 +5850,11 @@ circle.scale(3, 1);
5726
5850
 
5727
5851
  <div id="fitbounds-rectangle" class="member">
5728
5852
  <div class="member-link">
5729
- <a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fill])</tt></a>
5853
+ <a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fit])</tt></a>
5730
5854
  </div>
5731
5855
  <div class="member-description hidden">
5732
5856
  <div class="member-text">
5733
- <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>
5857
+ <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>
5734
5858
 
5735
5859
 
5736
5860
  <ul class="member-list">
@@ -5744,10 +5868,10 @@ circle.scale(3, 1);
5744
5868
  </li>
5745
5869
 
5746
5870
  <li>
5747
- <tt>fill:</tt>
5748
- <tt>Boolean</tt>
5749
-
5750
- &mdash;&nbsp;optional, default: <tt>false</tt>
5871
+ <tt>fit:</tt>
5872
+ <tt>String</tt>⟋<tt>Boolean</tt>
5873
+ &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>.
5874
+ &mdash;&nbsp;optional, default: <tt>&lsquo;contain&rsquo;</tt>
5751
5875
  </li>
5752
5876
 
5753
5877
  </ul>
@@ -5789,7 +5913,7 @@ circlePath.fitBounds(path.bounds);
5789
5913
  </div>
5790
5914
 
5791
5915
 
5792
- <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>
5916
+ <h4>Example:<span class="description">Fitting an item to the bounding rectangle of another item's bounding rectangle, covering all of it:</span></h4>
5793
5917
 
5794
5918
  <div class="paperscript split">
5795
5919
 
@@ -5816,7 +5940,7 @@ var circlePath = new Path.Circle({
5816
5940
 
5817
5941
  // Fit the circlePath to the bounding rectangle of
5818
5942
  // the rectangular path:
5819
- circlePath.fitBounds(path.bounds, true);
5943
+ circlePath.fitBounds(path.bounds, 'cover');
5820
5944
  </script>
5821
5945
  <div class="canvas"><canvas width="516" height="100" id="canvas-48"></canvas></div>
5822
5946
  </div>
@@ -6466,7 +6590,7 @@ function onMouseDown(event) {
6466
6590
  <ul class="member-list">
6467
6591
  <h4>Options:</h4>
6468
6592
  <li><tt>options.duration: <tt>Number</tt></tt> &mdash; the duration of the tweening</li>
6469
- <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>
6593
+ <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>
6470
6594
  <li><tt>options.start: <tt>Boolean</tt></tt> &mdash; whether to start tweening automatically &mdash;&nbsp;default: <tt>true</tt></li>
6471
6595
  </ul>
6472
6596
 
@@ -6854,7 +6978,7 @@ path.tweenFrom({ fillColor: 'red' }, { duration: 1000 });
6854
6978
 
6855
6979
  <!-- =========================== copyright notice ========================== -->
6856
6980
  <p class="footer">
6857
- Paper.js v0.12.20<br>
6981
+ Paper.js v0.14.0<br>
6858
6982
  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>
6859
6983
  <div class="content-end"></div>
6860
6984
 
@@ -67,11 +67,12 @@
67
67
 
68
68
  <div class="member-text">
69
69
  <p>If the HitResult has a <a href="../classes/HitResult.html#type"><tt>hitResult.type</tt></a> of <code>&#39;bounds&#39;</code>, this property describes which corner of the bounding rectangle was hit.</p>
70
+ <p>The names refer to the item&rsquo;s own bounding rectangle, transformed by its <a href="../classes/Item.html#matrix"><tt>item.matrix</tt></a>, which is the rectangle that the item&rsquo;s selection draws. On mirrored or rotated items, a handle can therefore appear elsewhere on screen than its name says, while its opposite handle and the rectangle&rsquo;s axes stay the ones to transform the item by. To choose a cursor, use the direction from the rectangle&rsquo;s center to <a href="../classes/HitResult.html#point"><tt>hitResult.point</tt></a>, both in project coordinates.</p>
70
71
 
71
72
 
72
73
  <ul class="member-list">
73
74
  <h4>Values:</h4>
74
- <li><tt>'top-left'</tt>, <tt>'top-right'</tt>, <tt>'bottom-left'</tt>, <tt>'bottom-right'</tt>, <tt>'left-center'</tt>, <tt>'top-center'</tt>, <tt>'right-center'</tt>, <tt>'bottom- center'</tt></li>
75
+ <li><tt>'top-left'</tt>, <tt>'top-right'</tt>, <tt>'bottom-left'</tt>, <tt>'bottom-right'</tt>, <tt>'left-center'</tt>, <tt>'top-center'</tt>, <tt>'right-center'</tt>, <tt>'bottom-center'</tt></li>
75
76
  </ul>
76
77
 
77
78
 
@@ -230,7 +231,7 @@
230
231
 
231
232
  <!-- =========================== copyright notice ========================== -->
232
233
  <p class="footer">
233
- Paper.js v0.12.20<br>
234
+ Paper.js v0.14.0<br>
234
235
  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>
235
236
  <div class="content-end"></div>
236
237