p5 2.2.1-rc.0 → 2.2.1

package/dist/core/environment.js

@@ -1,4 +1,4 @@
-import { j as ARROW, k as CROSS, l as HAND, m as MOVE, n as TEXT, o as WAIT, P as P2D } from '../constants-DEJVKr9Z.js';
+import { j as ARROW, k as CROSS, l as HAND, m as MOVE, n as TEXT, o as WAIT, P as P2D } from '../constants-DQyACdzq.js';
 
 /**
  * @module Environment
@@ -45,24 +45,19 @@ function environment(p5, fn, lifecycles){
    * @method print
    * @param {Any} contents content to print to the console.
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   // Prints "hello, world" to the console.
    *   print('hello, world');
    * }
-   * </code>
-   * </div>
    *
-   * <div class="norender">
-   * <code>
+   * @example
+   * // META:norender
    * function setup() {
    *   let name = 'ada';
    *   // Prints "hello, ada" to the console.
    *   print(`hello, ${name}`);
    * }
-   * </code>
-   * </div>
    */
   fn.print = function(...args) {
     if (!args.length) {
@@ -92,8 +87,6 @@ function environment(p5, fn, lifecycles){
    * @property {Integer} frameCount
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -107,11 +100,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The number 0 written in black in the middle of a gray square.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -131,8 +121,6 @@ function environment(p5, fn, lifecycles){
    *   // frameCount.
    *   text(frameCount, 50, 50);
    * }
-   * </code>
-   * </div>
    */
   fn.frameCount = 0;
 
@@ -147,8 +135,6 @@ function environment(p5, fn, lifecycles){
    * @property {Integer} deltaTime
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * let x = 0;
    * let speed = 0.05;
    *
@@ -181,8 +167,6 @@ function environment(p5, fn, lifecycles){
    *   // position.
    *   circle(x, 50, 20);
    * }
-   * </code>
-   * </div>
    */
   fn.deltaTime = 0;
 
@@ -195,8 +179,6 @@ function environment(p5, fn, lifecycles){
    * @property {Boolean} focused
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * // Open this example in two separate browser
    * // windows placed side-by-side to demonstrate.
    *
@@ -216,8 +198,6 @@ function environment(p5, fn, lifecycles){
    *     background(255, 0, 0);
    *   }
    * }
-   * </code>
-   * </div>
    */
   fn.focused = document.hasFocus();
 
@@ -244,8 +224,6 @@ function environment(p5, fn, lifecycles){
    * @param {Number}          [x]  horizontal active spot of the cursor.
    * @param {Number}          [y]  vertical active spot of the cursor.
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -258,11 +236,8 @@ function environment(p5, fn, lifecycles){
    *   // Set the cursor to crosshairs: +
    *   cursor(CROSS);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -287,11 +262,8 @@ function environment(p5, fn, lifecycles){
    *     cursor('grab');
    *   }
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -309,8 +281,6 @@ function environment(p5, fn, lifecycles){
    *     cursor('https://avatars0.githubusercontent.com/u/1617169?s=16');
    *   }
    * }
-   * </code>
-   * </div>
    */
   fn.cursor = function(type, x, y) {
     let cursor = 'auto';
@@ -360,8 +330,6 @@ function environment(p5, fn, lifecycles){
    * @chainable
    *
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -387,11 +355,8 @@ function environment(p5, fn, lifecycles){
    *   // position.
    *   circle(x, 50, 20);
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -414,8 +379,6 @@ function environment(p5, fn, lifecycles){
    *   let fps = frameRate();
    *   text(fps, 50, 50);
    * }
-   * </code>
-   * </div>
    */
   /**
    * @method frameRate
@@ -469,8 +432,6 @@ function environment(p5, fn, lifecycles){
    * @method getTargetFrameRate
    * @return {Number} _targetFrameRate
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -488,8 +449,6 @@ function environment(p5, fn, lifecycles){
    *   let fps = getTargetFrameRate();
    *   text(fps, 43, 54);
    * }
-   * </code>
-   * </div>
    */
   fn.getTargetFrameRate = function() {
     return this._targetFrameRate;
@@ -500,8 +459,6 @@ function environment(p5, fn, lifecycles){
    *
    * @method noCursor
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   // Hide the cursor.
    *   noCursor();
@@ -514,8 +471,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A white circle on a gray background. The circle follows the mouse as it moves. The cursor is hidden.');
    * }
-   * </code>
-   * </div>
    */
   fn.noCursor = function() {
     this._curElement.elt.style.cursor = 'none';
@@ -537,8 +492,6 @@ function environment(p5, fn, lifecycles){
    * @property {(WEBGL|WEBGL2)} webglVersion
    * @readOnly
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -547,11 +500,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The text "p2d" written in black on a gray background.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * let font;
    *
    * async function setup() {
@@ -569,11 +519,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The text "webgl2" written in black on a gray background.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * let font;
    *
    * async function setup() {
@@ -595,8 +542,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The text "webgl" written in black on a gray background.');
    * }
-   * </code>
-   * </div>
    */
   fn.webglVersion = P2D;
 
@@ -612,8 +557,7 @@ function environment(p5, fn, lifecycles){
    * @property {Number} displayWidth
    * @readOnly
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   // Set the canvas' width and height
    *   // using the display's dimensions.
@@ -623,8 +567,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A gray canvas that is the same size as the display.');
    * }
-   * </code>
-   * </div>
    *
    * @alt
    * This example does not render anything.
@@ -643,8 +585,7 @@ function environment(p5, fn, lifecycles){
    * @property {Number} displayHeight
    * @readOnly
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   // Set the canvas' width and height
    *   // using the display's dimensions.
@@ -654,8 +595,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A gray canvas that is the same size as the display.');
    * }
-   * </code>
-   * </div>
    *
    * @alt
    * This example does not render anything.
@@ -671,8 +610,7 @@ function environment(p5, fn, lifecycles){
    * @property {Number} windowWidth
    * @readOnly
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   // Set the canvas' width and height
    *   // using the browser's dimensions.
@@ -682,8 +620,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A gray canvas that takes up the entire browser window.');
    * }
-   * </code>
-   * </div>
    *
    * @alt
    * This example does not render anything.
@@ -699,8 +635,7 @@ function environment(p5, fn, lifecycles){
    * @property {Number} windowHeight
    * @readOnly
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   // Set the canvas' width and height
    *   // using the browser's dimensions.
@@ -710,8 +645,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A gray canvas that takes up the entire browser window.');
    * }
-   * </code>
-   * </div>
    *
    * @alt
    * This example does not render anything.
@@ -732,8 +665,7 @@ function environment(p5, fn, lifecycles){
    * @method windowResized
    * @param {Event} [event] optional resize Event.
    * @example
-   * <div class="norender">
-   * <code>
+   * // META:norender
    * function setup() {
    *   createCanvas(windowWidth, windowHeight);
    *
@@ -752,13 +684,12 @@ function environment(p5, fn, lifecycles){
    * function windowResized() {
    *   resizeCanvas(windowWidth, windowHeight);
    * }
-   * </code>
-   * </div>
+   *
    * @alt
    * This example does not render anything.
    *
-   * <div class="norender">
-   * <code>
+   * @example
+   * // META:norender
    * function setup() {
    *   createCanvas(windowWidth, windowHeight);
    * }
@@ -777,8 +708,7 @@ function environment(p5, fn, lifecycles){
    *   // Print the resize event to the console for debugging.
    *   print(event);
    * }
-   * </code>
-   * </div>
+   *
    * @alt
    * This example does not render anything.
    */
@@ -849,8 +779,6 @@ function environment(p5, fn, lifecycles){
    * @param  {Boolean} [val] whether the sketch should be in fullscreen mode.
    * @return {Boolean} current fullscreen state.
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -865,8 +793,6 @@ function environment(p5, fn, lifecycles){
    *     fullscreen(!fs);
    *   }
    * }
-   * </code>
-   * </div>
    */
   fn.fullscreen = function(val) {
     // p5._validateParameters('fullscreen', arguments);
@@ -907,8 +833,6 @@ function environment(p5, fn, lifecycles){
    * @param  {Number} [val] desired pixel density.
    * @chainable
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   // Set the pixel density to 1.
    *   pixelDensity(1);
@@ -921,11 +845,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A fuzzy white circle on a gray canvas.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   // Set the pixel density to 3.
    *   pixelDensity(3);
@@ -939,8 +860,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('A sharp white circle on a gray canvas.');
    * }
-   * </code>
-   * </div>
    */
   /**
    * @method pixelDensity
@@ -967,8 +886,6 @@ function environment(p5, fn, lifecycles){
    * @method displayDensity
    * @returns {Number} current pixel density of the display.
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   // Set the pixel density to 1.
    *   pixelDensity(1);
@@ -995,8 +912,6 @@ function environment(p5, fn, lifecycles){
    *   background(200);
    *   circle(50, 50, 70);
    * }
-   * </code>
-   * </div>
    */
   fn.displayDensity = () => window.devicePixelRatio;
 
@@ -1040,8 +955,6 @@ function environment(p5, fn, lifecycles){
    * @method getURL
    * @return {String} url
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -1053,8 +966,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The URL "https://p5js.org/reference/p5/getURL" written in black on a gray background.');
    * }
-   * </code>
-   * </div>
    */
   fn.getURL = () => location.href;
 
@@ -1072,8 +983,6 @@ function environment(p5, fn, lifecycles){
    * @method getURLPath
    * @return {String[]} path components.
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -1085,8 +994,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The word "reference" written in black on a gray background.');
    * }
-   * </code>
-   * </div>
    */
   fn.getURLPath = () =>
     location.pathname.split('/').filter(v => v !== '');
@@ -1103,8 +1010,7 @@ function environment(p5, fn, lifecycles){
    * @method getURLParams
    * @return {Object} URL params
    * @example
-   * <div class='norender notest'>
-   * <code>
+   * // META:norender
    * // Imagine this sketch is hosted at the following URL:
    * // https://p5js.org?year=2014&month=May&day=15
    *
@@ -1121,8 +1027,6 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The text "15", "May", and "2014" written in black on separate lines.');
    * }
-   * </code>
-   * </div>
    *
    * @alt
    * This example does not render anything.
@@ -1154,9 +1058,6 @@ function environment(p5, fn, lifecycles){
    * @param {Number} [z] The z coordinate in world space.
    * @return {p5.Vector} A vector containing the 2D screen coordinates.
    * @example
-   * <div>
-   * <code>
-   *
    * function setup() {
    *   createCanvas(150, 150);
    *   let vertices = [
@@ -1207,12 +1108,8 @@ function environment(p5, fn, lifecycles){
    *   describe('A rotating square is transformed and drawn using screen coordinates.');
    *
    * }
-   * </code>
-   * </div>
    *
    * @example
-   * <div>
-   * <code>
    * let vertices;
    *
    * function setup() {
@@ -1258,9 +1155,6 @@ function environment(p5, fn, lifecycles){
    *     ellipse(screenX, screenY, 3, 3);
    *   });
    * }
-   * </code>
-   * </div>
-   *
    */
   fn.worldToScreen = function(worldPosition) {
     if (typeof worldPosition === 'number') {
@@ -1272,6 +1166,7 @@ function environment(p5, fn, lifecycles){
     const screenPosition = matrix.multiplyAndNormalizePoint(worldPosition);
     return screenPosition;
   };
+
   /**
    * Converts 2D screen coordinates to 3D world coordinates.
    *
@@ -1288,9 +1183,6 @@ function environment(p5, fn, lifecycles){
    * @param {Number} [z] The z coordinate in screen space.
    * @return {p5.Vector} A vector containing the 3D world space coordinates.
    * @example
-   * <div>
-   * <code>
-   *
    * function setup() {
    *   createCanvas(100, 100);
    *   describe('A rotating square with a line passing through the mouse drawn across it.');
@@ -1310,10 +1202,6 @@ function environment(p5, fn, lifecycles){
    *   // Draw a line parallel to the local Y axis, passing through the mouse
    *   line(localMouse.x, -30, localMouse.x, 30);
    * }
-   *
-   * </code>
-   * </div>
-   *
    */
   fn.screenToWorld = function(screenPosition) {
     if (typeof screenPosition === 'number') {
@@ -1347,8 +1235,6 @@ function environment(p5, fn, lifecycles){
    * 0.
    *
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -1357,11 +1243,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The number 100 written in black on a gray square.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(50, 100);
    *
@@ -1372,11 +1255,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The number 50 written in black on a gray rectangle.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -1398,8 +1278,6 @@ function environment(p5, fn, lifecycles){
    *     text(width, 21, 54);
    *   }
    * }
-   * </code>
-   * </div>
    *
    * @property {Number} width
    * @readOnly
@@ -1415,8 +1293,6 @@ function environment(p5, fn, lifecycles){
    * 0.
    *
    * @example
-   * <div>
-   * <code>
    * function setup() {
    *   background(200);
    *
@@ -1425,11 +1301,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The number 100 written in black on a gray square.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 50);
    *
@@ -1440,11 +1313,8 @@ function environment(p5, fn, lifecycles){
    *
    *   describe('The number 50 written in black on a gray rectangle.');
    * }
-   * </code>
-   * </div>
    *
-   * <div>
-   * <code>
+   * @example
    * function setup() {
    *   createCanvas(100, 100);
    *
@@ -1466,8 +1336,6 @@ function environment(p5, fn, lifecycles){
    *     text(height, 42, 27);
    *   }
    * }
-   * </code>
-   * </div>
    *
    * @property {Number} height
    * @readOnly

package/dist/core/filterShaders.js

@@ -1,4 +1,4 @@
-import { ag as OPAQUE, ah as DILATE, ai as ERODE, ab as BLUR, af as POSTERIZE, ae as THRESHOLD, aj as INVERT, ak as GRAY } from '../constants-DEJVKr9Z.js';
+import { ag as OPAQUE, ah as DILATE, ai as ERODE, ab as BLUR, af as POSTERIZE, ae as THRESHOLD, aj as INVERT, ak as GRAY } from '../constants-DQyACdzq.js';
 
 /*
  * Creates p5.strands filter shaders for cross-platform compatibility.

package/dist/core/friendly_errors/fes_core.js

@@ -1,6 +1,6 @@
 import { translator } from '../internationalization.js';
 import strings from './browser_errors.js';
-import { a3 as constants } from '../../constants-DEJVKr9Z.js';
+import { a3 as constants } from '../../constants-DQyACdzq.js';
 import 'i18next';
 import 'i18next-browser-languagedetector';
 

package/dist/core/friendly_errors/file_errors.js

@@ -1,7 +1,7 @@
 import { translator } from '../internationalization.js';
 import 'i18next';
 import 'i18next-browser-languagedetector';
-import '../../constants-DEJVKr9Z.js';
+import '../../constants-DQyACdzq.js';
 
 /**
  * @for p5

package/dist/core/friendly_errors/index.js

@@ -6,7 +6,7 @@ import fileErrors from './file_errors.js';
 import '../internationalization.js';
 import 'i18next';
 import 'i18next-browser-languagedetector';
-import '../../constants-DEJVKr9Z.js';
+import '../../constants-DQyACdzq.js';
 import './browser_errors.js';
 import 'zod/v4';
 import 'acorn';

package/dist/core/friendly_errors/param_validator.js

@@ -1,4 +1,4 @@
-import { a3 as constants } from '../../constants-DEJVKr9Z.js';
+import { a3 as constants } from '../../constants-DQyACdzq.js';
 import { z } from 'zod/v4';
 
 var p5$1 = {

package/dist/core/friendly_errors/sketch_verifier.js

@@ -1,6 +1,6 @@
 import { parse } from 'acorn';
 import { simple } from 'acorn-walk';
-import { a3 as constants } from '../../constants-DEJVKr9Z.js';
+import { a3 as constants } from '../../constants-DQyACdzq.js';
 
 // List of functions to ignore as they either are meant to be re-defined or
 // generate false positive outputs.

package/dist/core/helpers.js

@@ -1,4 +1,4 @@
-import { p as CORNER, t as CORNERS, u as RADIUS, v as CENTER } from '../constants-DEJVKr9Z.js';
+import { p as CORNER, t as CORNERS, u as RADIUS, v as CENTER } from '../constants-DQyACdzq.js';
 
 /**
  * @requires constants

package/dist/core/init.js

@@ -1,23 +1,22 @@
-import { p as p5 } from '../main-_RXV5Lx8.js';
+import { p as p5 } from '../main-DvN69W3f.js';
 import { initialize } from './internationalization.js';
-import '../constants-DEJVKr9Z.js';
+import '../constants-DQyACdzq.js';
 import './transform.js';
 import './structure.js';
 import './environment.js';
-import '../rendering-CsICjEXA.js';
-import '../creating_reading-CgHCHxqN.js';
+import '../rendering-h9unX5K0.js';
+import '../creating_reading-ZXzcZEsb.js';
 import 'colorjs.io/fn';
 import '../color/color_spaces/hsb.js';
 import '../dom/p5.Element.js';
 import '../dom/p5.File.js';
 import '../io/p5.XML.js';
-import '../p5.Renderer-QoFcvj3f.js';
+import '../p5.Renderer-D-5LdCRz.js';
 import '../image/filters.js';
 import '../math/p5.Vector.js';
 import '../shape/custom_shapes.js';
 import './States.js';
 import '../io/utilities.js';
-import 'file-saver';
 import '../dom/p5.MediaElement.js';
 import '../shape/2d_primitives.js';
 import './helpers.js';