paper 0.12.20 → 0.13.0

package/dist/docs/classes/Project.html

@@ -551,22 +551,22 @@ var path2 = new Path.Circle(new Point(175, 50), 20);
 <div class="member-description hidden">
 <div class="member-text">
 	<p>Performs a hit-test on the items contained within the project at the location of the specified point.</p>
-<p>The options object allows you to control the specifics of the hit-test and may contain a combination of the following values:</p>
+<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>
     <ul class="member-list">
 <h4>Options:</h4>
-<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>
+<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>
 <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>
 <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>
-<li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items &mdash;&nbsp;default: <tt>true</tt></li>
-<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>
-<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>
+<li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items</li>
+<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>
+<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>
 <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>
 <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>
 <li><tt>options.ends: <tt>Boolean</tt></tt> &mdash; only hit-test for the first or last  segment points of open path items</li>
 <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>
 <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>
 <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>
-<li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; hit-test items that have <tt>Item#guide</tt> set to <code>true</code></li>
+<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>
 <li><tt>options.selected: <tt>Boolean</tt></tt> &mdash; only hit selected items</li>
 </ul>
 	
@@ -700,7 +700,7 @@ var path2 = new Path.Circle(new Point(175, 50), 20);
 		<h4>Returns:</h4>
 		
 			<li>
-<tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching items contained in the project
+<tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching items contained in the project, in  their stacking order from bottom to top, with each item listed  before its own descendants
 </li>
 
 		
@@ -1151,6 +1151,8 @@ for (var i = 0; i < items.length; i++) {
 <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>
 <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>
 <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>
+<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>
+<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>
 <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>
 </ul>
 	
@@ -1193,9 +1195,13 @@ for (var i = 0; i < items.length; i++) {
 <div class="member-description hidden">
 <div class="member-text">
 	<p>Converts the provided SVG content into Paper.js items and adds them to the active layer of this project. Note that the project is not cleared first. You can call <a href="../classes/Project.html#clear"><tt>project.clear</tt></a>() to do so.</p>
+<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>
     <ul class="member-list">
 <h4>Options:</h4>
 <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>
+<li>[options.crossOrigin] {String} the {@link Raster#crossOrigin}
+    value of the rasters created for `<image>` elements, to load their
+    images with CORS</li>
 <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>
 <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>
 <li><tt>options.insert: <tt>Boolean</tt></tt> &mdash; whether the imported items should  be added to the project that <code>importSVG()</code> is called on &mdash;&nbsp;default: <tt>true</tt></li>
@@ -1297,7 +1303,7 @@ for (var i = 0; i < items.length; i++) {
 
 <!-- =========================== copyright notice ========================== -->
 <p class="footer">
-Paper.js v0.12.20<br>
+Paper.js v0.13.0<br>
 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>
 <div class="content-end"></div>
 

package/dist/docs/classes/Raster.html

@@ -474,14 +474,14 @@ raster.rotate(10);
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The source of the raster, which can be set using a DOM Image, a Canvas, a data url, a string describing the URL to load the image from, or the ID of a DOM element to get the image from (either a DOM Image or a Canvas). Reading this property will return the url of the source image or a data-url. Note that for consistency, a <a href="../classes/Raster.html#onload"><tt>onLoad</tt></a> event will be triggered on the raster even if the image has already finished loading before.</p>
+	<p>The source of the raster, which can be set using a string describing the URL to load the image from, or a data url. Reading this property will return the url of the source image or a data-url. To set the raster to a DOM Image or a Canvas, use <a href="../classes/Raster.html#image"><tt>image</tt></a> or <a href="../classes/Raster.html#canvas"><tt>canvas</tt></a> instead. The ID of a DOM Image or Canvas element is only accepted by the constructor. Note that for consistency, a <a href="../classes/Raster.html#onload"><tt>onLoad</tt></a> event will be triggered on the raster even if the image has already finished loading before.</p>
 	
 	
 	
 	<ul class="member-list">
 		<h4>Type:</h4>
 		<li>
-			<tt>HTMLImageElement</tt>⟋<tt>HTMLCanvasElement</tt>⟋<tt>String</tt>
+			<tt>String</tt>
 		</li>
 	</ul>
     
@@ -788,19 +788,38 @@ raster.on('load', function() {
 	
 <div id="todataurl" class="member">
 <div class="member-link">
-<a name="todataurl" href="#todataurl"><tt><b>toDataURL</b>()</tt></a>
+<a name="todataurl" href="#todataurl"><tt><b>toDataURL</b>([type[, quality]])</tt></a>
 </div>
 <div class="member-description hidden">
 <div class="member-text">
-	<p>Returns a Base 64 encoded <code>data:</code> URL representation of the raster.</p>
+	<p>Returns a Base 64 encoded <code>data:</code> URL representation of the raster. If the raster shows an image that was loaded from a <code>data:</code> URL, that URL is returned unchanged. Otherwise, the arguments are passed on to <code>HTMLCanvasElement#toDataURL()</code> of the raster&rsquo;s <a href="../classes/Raster.html#canvas"><tt>canvas</tt></a>. In web-workers, where the canvas is an <code>OffscreenCanvas</code>, this is not supported, and neither are <a href="../classes/Raster.html#source"><tt>source</tt></a> and exporting the raster to JSON, which rely on it. Use the canvas&rsquo; asynchronous <code>convertToBlob()</code> there instead.</p>
     
 	
+<ul class="member-list">
+	<h4>Parameters:</h4>
+	
+	<li>
+<tt>type:</tt> 
+<tt>String</tt>
+&mdash;&nbsp;the image format to encode
+&mdash;&nbsp;optional, default: <tt>&lsquo;image/png&rsquo;</tt>
+</li>
+	
+	<li>
+<tt>quality:</tt> 
+<tt>Number</tt>
+&mdash;&nbsp;the image quality between <code>0</code> and <code>1</code>, for  formats that use lossy compression, such as <code>&#39;image/jpeg&#39;</code>
+&mdash;&nbsp;optional
+</li>
+	
+</ul>
+
 	
 	<ul class="member-list">
 		<h4>Returns:</h4>
 		
 			<li>
-<tt><tt>String</tt></tt>
+<tt><tt>String</tt></tt>&nbsp;&mdash;&nbsp;the <code>data:</code> URL of the raster
 </li>
 
 		
@@ -1130,13 +1149,13 @@ raster.on('load', function() {
 </div>
 
 	
-<div id="getimagedata-rect" class="member">
+<div id="getimagedata" class="member">
 <div class="member-link">
-<a name="getimagedata-rect" href="#getimagedata-rect"><tt><b>getImageData</b>(rect)</tt></a>
+<a name="getimagedata" href="#getimagedata"><tt><b>getImageData</b>([rect])</tt></a>
 </div>
 <div class="member-description hidden">
 <div class="member-text">
-	
+	<p>Returns the image data of the pixels within the specified rectangle, or of the whole raster if no rectangle or an empty one is passed.</p>
     
 	
 <ul class="member-list">
@@ -1145,8 +1164,8 @@ raster.on('load', function() {
 	<li>
 <tt>rect:</tt> 
 <a href="../classes/Rectangle.html"><tt>Rectangle</tt></a>
-
-
+&mdash;&nbsp;the area of the raster to get the image data  of, in pixel coordinates
+&mdash;&nbsp;optional
 </li>
 	
 </ul>
@@ -1156,7 +1175,7 @@ raster.on('load', function() {
 		<h4>Returns:</h4>
 		
 			<li>
-<tt><tt>ImageData</tt></tt>
+<tt><tt>ImageData</tt></tt>&nbsp;&mdash;&nbsp;the image data of the specified area
 </li>
 
 		
@@ -1369,6 +1388,7 @@ group.children['example'].fillColor = 'red';
 
 <div class="member-text">
 	<p>The path style of the item.</p>
+<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>
 	
 	
 	
@@ -1711,6 +1731,37 @@ circle2.opacity = 0.5;
 </div>
 
 
+</div>
+
+</div>
+</div>
+
+	
+<div id="guide" class="member">
+<div class="member-link">
+<a name="guide" href="#guide"><tt><b>guide</b></tt></a>
+</div>
+<div class="member-description hidden">
+
+<div class="member-text">
+	<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>
+	
+	
+	
+		<ul class="member-list">
+			<h4>Default:</h4>
+			<li><tt>false</tt></li>
+		</ul>
+	
+	<ul class="member-list">
+		<h4>Type:</h4>
+		<li>
+			<tt>Boolean</tt>
+		</li>
+	</ul>
+    
+	
+	
 </div>
 
 </div>
@@ -2414,6 +2465,7 @@ console.log(group.children[0] == path); // true</code></pre>
 
 <div class="member-text">
 	<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>
+<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>
 <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>
 	
 	
@@ -4354,22 +4406,22 @@ function onMouseDown(event) {
 <div class="member-description hidden">
 <div class="member-text">
 	<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>
-<p>The options object allows you to control the specifics of the hit- test and may contain a combination of the following values:</p>
+<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>
     <ul class="member-list">
 <h4>Options:</h4>
-<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>
+<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>
 <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>
 <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>
-<li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items &mdash;&nbsp;default: <tt>true</tt></li>
-<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>
-<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>
+<li><tt>options.fill: <tt>Boolean</tt></tt> &mdash; hit-test the fill of items</li>
+<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>
+<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>
 <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>
 <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>
 <li><tt>options.ends: <tt>Boolean</tt></tt> &mdash; only hit-test for the first or last  segment points of open path items</li>
 <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>
 <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>
 <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>
-<li><tt>options.guides: <tt>Boolean</tt></tt> &mdash; hit-test items that have <tt>Item#guide</tt> set to <code>true</code></li>
+<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>
 <li><tt>options.selected: <tt>Boolean</tt></tt> &mdash; only hit selected items</li>
 </ul>
 	
@@ -4608,7 +4660,7 @@ function onMouseDown(event) {
 		<h4>Returns:</h4>
 		
 			<li>
-<tt>Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects</tt>&nbsp;&mdash;&nbsp;the list of matching descendant items
+<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
 </li>
 
 		
@@ -4781,6 +4833,8 @@ function onMouseDown(event) {
 <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>
 <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>
 <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>
+<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>
+<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>
 <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>
 </ul>
 	
@@ -4823,9 +4877,13 @@ function onMouseDown(event) {
 <div class="member-description hidden">
 <div class="member-text">
 	<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>
+<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>
     <ul class="member-list">
 <h4>Options:</h4>
 <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>
+<li>[options.crossOrigin] {String} the {@link Raster#crossOrigin}
+    value of the rasters created for `<image>` elements, to load their
+    images with CORS</li>
 <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>
 <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>
 <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>
@@ -5301,9 +5359,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
 </div>
 
 	
-<div id="reduce-options" class="member">
+<div id="reduce" class="member">
 <div class="member-link">
-<a name="reduce-options" href="#reduce-options"><tt><b>reduce</b>(options)</tt></a>
+<a name="reduce" href="#reduce"><tt><b>reduce</b>([options])</tt></a>
 </div>
 <div class="member-description hidden">
 <div class="member-text">
@@ -5315,9 +5373,9 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
 	
 	<li>
 <tt>options:</tt> 
-
-
-
+<tt>Object</tt>
+&mdash;&nbsp;the options passed on to <a href="../classes/Path.html#reduce-options"><tt>path.reduce(options)</tt></a>
+&mdash;&nbsp;optional
 </li>
 	
 </ul>
@@ -5706,7 +5764,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
 </div>
 <div class="member-description hidden">
 <div class="member-text">
-	<p>Checks if this item is above the specified item in the stacking order of the project.</p>
+	<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>
     
 	
 <ul class="member-list">
@@ -5747,7 +5805,7 @@ Array of <a href="../classes/Item.html"><tt>Item</tt></a> objects
 </div>
 <div class="member-description hidden">
 <div class="member-text">
-	<p>Checks if the item is below the specified item in the stacking order of the project.</p>
+	<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>
     
 	
 <ul class="member-list">
@@ -6705,11 +6763,11 @@ circle.scale(3, 1);
 	
 <div id="fitbounds-rectangle" class="member">
 <div class="member-link">
-<a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fill])</tt></a>
+<a name="fitbounds-rectangle" href="#fitbounds-rectangle"><tt><b>fitBounds</b>(rectangle[, fit])</tt></a>
 </div>
 <div class="member-description hidden">
 <div class="member-text">
-	<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>
+	<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>
     
 	
 <ul class="member-list">
@@ -6723,10 +6781,10 @@ circle.scale(3, 1);
 </li>
 	
 	<li>
-<tt>fill:</tt> 
-<tt>Boolean</tt>
-
-&mdash;&nbsp;optional, default: <tt>false</tt>
+<tt>fit:</tt> 
+<tt>String</tt>⟋<tt>Boolean</tt>
+&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>.
+&mdash;&nbsp;optional, default: <tt>&lsquo;contain&rsquo;</tt>
 </li>
 	
 </ul>
@@ -6768,7 +6826,7 @@ circlePath.fitBounds(path.bounds);
 </div>
 
 
-<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>
+<h4>Example:<span class="description">Fitting an item to the bounding rectangle of another item's bounding rectangle, covering all of it:</span></h4>
 
 <div class="paperscript split">
 
@@ -6795,7 +6853,7 @@ var circlePath = new Path.Circle({
 
 // Fit the circlePath to the bounding rectangle of
 // the rectangular path:
-circlePath.fitBounds(path.bounds, true);
+circlePath.fitBounds(path.bounds, 'cover');
 </script>
 <div class="canvas"><canvas width="516" height="100" id="canvas-51"></canvas></div>
 </div>
@@ -7445,7 +7503,7 @@ function onMouseDown(event) {
     <ul class="member-list">
 <h4>Options:</h4>
 <li><tt>options.duration: <tt>Number</tt></tt> &mdash; the duration of the tweening</li>
-<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>
+<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>
 <li><tt>options.start: <tt>Boolean</tt></tt> &mdash; whether to start tweening automatically &mdash;&nbsp;default: <tt>true</tt></li>
 </ul>
 	
@@ -7833,7 +7891,7 @@ path.tweenFrom({ fillColor: 'red' }, { duration: 1000 });
 
 <!-- =========================== copyright notice ========================== -->
 <p class="footer">
-Paper.js v0.12.20<br>
+Paper.js v0.13.0<br>
 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>
 <div class="content-end"></div>
 

package/dist/docs/classes/Rectangle.html

@@ -400,7 +400,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The top-left point of the rectangle</p>
+	<p>The top-left point of the rectangle. Setting it moves the whole rectangle, unlike <a href="../classes/Rectangle.html#topleft"><tt>topLeft</tt></a>.</p>
 	
 	
 	
@@ -560,7 +560,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The center point of the rectangle.</p>
+	<p>The center point of the rectangle. Setting it moves the whole rectangle.</p>
 	
 	
 	
@@ -586,7 +586,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The top-left point of the rectangle.</p>
+	<p>The top-left point of the rectangle. Note that this doesn&rsquo;t move the whole rectangle; the bottom-right corner stays where it was.</p>
 	
 	
 	
@@ -612,7 +612,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The top-right point of the rectangle.</p>
+	<p>The top-right point of the rectangle. Note that this doesn&rsquo;t move the whole rectangle; the bottom-left corner stays where it was.</p>
 	
 	
 	
@@ -638,7 +638,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The bottom-left point of the rectangle.</p>
+	<p>The bottom-left point of the rectangle. Note that this doesn&rsquo;t move the whole rectangle; the top-right corner stays where it was.</p>
 	
 	
 	
@@ -664,7 +664,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The bottom-right point of the rectangle.</p>
+	<p>The bottom-right point of the rectangle. Note that this doesn&rsquo;t move the whole rectangle; the top-left corner stays where it was.</p>
 	
 	
 	
@@ -690,7 +690,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The left-center point of the rectangle.</p>
+	<p>The left-center point of the rectangle. Setting it moves the left hand side while the right hand side stays where it was, and moves the whole rectangle vertically.</p>
 	
 	
 	
@@ -716,7 +716,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The top-center point of the rectangle.</p>
+	<p>The top-center point of the rectangle. Setting it moves the top while the bottom stays where it was, and moves the whole rectangle horizontally.</p>
 	
 	
 	
@@ -742,7 +742,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The right-center point of the rectangle.</p>
+	<p>The right-center point of the rectangle. Setting it moves the right hand side while the left hand side stays where it was, and moves the whole rectangle vertically.</p>
 	
 	
 	
@@ -768,7 +768,7 @@
 <div class="member-description hidden">
 
 <div class="member-text">
-	<p>The bottom-center point of the rectangle.</p>
+	<p>The bottom-center point of the rectangle. Setting it moves the bottom while the top stays where it was, and moves the whole rectangle horizontally.</p>
 	
 	
 	
@@ -826,6 +826,7 @@
 <div class="member-text">
 	<p>Specifies whether an item&rsquo;s bounds are to appear as selected.</p>
 <p>Paper.js draws the bounds of items with selected bounds on top of your project. This is very useful when debugging.</p>
+<p>This property is only available on the rectangle returned by <a href="../classes/Item.html#bounds"><tt>item.bounds</tt></a>, and the selection always shows these bounds. Rectangles returned by other getters such as <a href="../classes/Item.html#strokebounds"><tt>item.strokeBounds</tt></a> don&rsquo;t have it.</p>
 	
 	
 	
@@ -1645,7 +1646,7 @@ intersectionPath.fillColor = 'red';
 
 <!-- =========================== copyright notice ========================== -->
 <p class="footer">
-Paper.js v0.12.20<br>
+Paper.js v0.13.0<br>
 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>
 <div class="content-end"></div>
 

package/dist/docs/classes/Segment.html

@@ -930,7 +930,7 @@ path.segments[2].selected = true;
 
 <!-- =========================== copyright notice ========================== -->
 <p class="footer">
-Paper.js v0.12.20<br>
+Paper.js v0.13.0<br>
 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>
 <div class="content-end"></div>