@m2c2kit/core 0.3.12 → 0.3.14

package/dist/index.js

@@ -5,15 +5,11 @@ var ActionType = /* @__PURE__ */ ((ActionType2) => {
   ActionType2["Custom"] = "Custom";
   ActionType2["Move"] = "Move";
   ActionType2["Scale"] = "Scale";
+  ActionType2["FadeAlpha"] = "FadeAlpha";
+  ActionType2["Rotate"] = "Rotate";
   return ActionType2;
 })(ActionType || {});
 
-var __defProp$k = Object.defineProperty;
-var __defNormalProp$k = (obj, key, value) => key in obj ? __defProp$k(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$k = (obj, key, value) => {
-  __defNormalProp$k(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Easings {
 }
 // These easing functions are adapted from work by Robert Penner
@@ -32,134 +28,369 @@ class Easings {
 // Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
 // Neither the name of the author nor the names of contributors may be used to endorse or promote products derived from this software without specific prior written permission.
 // THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
-__publicField$k(Easings, "none", (t, b, c, d) => {
+Easings.none = (t, b, c, d) => {
   return c + b;
-});
-__publicField$k(Easings, "linear", (t, b, c, d) => {
+};
+Easings.linear = (t, b, c, d) => {
   return c * t / d + b;
-});
-__publicField$k(Easings, "quadraticIn", (t, b, c, d) => {
+};
+Easings.quadraticIn = (t, b, c, d) => {
   t /= d;
   return c * t * t + b;
-});
-__publicField$k(Easings, "quadraticOut", (t, b, c, d) => {
+};
+Easings.quadraticOut = (t, b, c, d) => {
   t /= d;
   return -c * t * (t - 2) + b;
-});
-__publicField$k(Easings, "quadraticInOut", (t, b, c, d) => {
+};
+Easings.quadraticInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return c / 2 * t * t + b;
   t--;
   return -c / 2 * (t * (t - 2) - 1) + b;
-});
-__publicField$k(Easings, "cubicIn", (t, b, c, d) => {
+};
+Easings.cubicIn = (t, b, c, d) => {
   t /= d;
   return c * t * t * t + b;
-});
-__publicField$k(Easings, "cubicOut", (t, b, c, d) => {
+};
+Easings.cubicOut = (t, b, c, d) => {
   t /= d;
   t--;
   return c * (t * t * t + 1) + b;
-});
-__publicField$k(Easings, "cubicInOut", (t, b, c, d) => {
+};
+Easings.cubicInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return c / 2 * t * t * t + b;
   t -= 2;
   return c / 2 * (t * t * t + 2) + b;
-});
-__publicField$k(Easings, "quarticIn", (t, b, c, d) => {
+};
+Easings.quarticIn = (t, b, c, d) => {
   t /= d;
   return c * t * t * t * t + b;
-});
-__publicField$k(Easings, "quarticOut", (t, b, c, d) => {
+};
+Easings.quarticOut = (t, b, c, d) => {
   t /= d;
   t--;
   return -c * (t * t * t * t - 1) + b;
-});
-__publicField$k(Easings, "quarticInOut", (t, b, c, d) => {
+};
+Easings.quarticInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return c / 2 * t * t * t * t + b;
   t -= 2;
   return -c / 2 * (t * t * t * t - 2) + b;
-});
-__publicField$k(Easings, "quinticIn", (t, b, c, d) => {
+};
+Easings.quinticIn = (t, b, c, d) => {
   t /= d;
   return c * t * t * t * t * t + b;
-});
-__publicField$k(Easings, "quinticOut", (t, b, c, d) => {
+};
+Easings.quinticOut = (t, b, c, d) => {
   t /= d;
   t--;
   return c * (t * t * t * t * t + 1) + b;
-});
-__publicField$k(Easings, "quinticInOut", (t, b, c, d) => {
+};
+Easings.quinticInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return c / 2 * t * t * t * t * t + b;
   t -= 2;
   return c / 2 * (t * t * t * t * t + 2) + b;
-});
-__publicField$k(Easings, "sinusoidalIn", (t, b, c, d) => {
+};
+Easings.sinusoidalIn = (t, b, c, d) => {
   return -c * Math.cos(t / d * (Math.PI / 2)) + c + b;
-});
-__publicField$k(Easings, "sinusoidalOut", (t, b, c, d) => {
+};
+Easings.sinusoidalOut = (t, b, c, d) => {
   return c * Math.sin(t / d * (Math.PI / 2)) + b;
-});
-__publicField$k(Easings, "sinusoidalInOut", (t, b, c, d) => {
+};
+Easings.sinusoidalInOut = (t, b, c, d) => {
   return -c / 2 * (Math.cos(Math.PI * t / d) - 1) + b;
-});
-__publicField$k(Easings, "exponentialIn", (t, b, c, d) => {
+};
+Easings.exponentialIn = (t, b, c, d) => {
   return c * Math.pow(2, 10 * (t / d - 1)) + b;
-});
-__publicField$k(Easings, "exponentialOut", (t, b, c, d) => {
+};
+Easings.exponentialOut = (t, b, c, d) => {
   return c * (-Math.pow(2, -10 * t / d) + 1) + b;
-});
-__publicField$k(Easings, "exponentialInOut", (t, b, c, d) => {
+};
+Easings.exponentialInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return c / 2 * Math.pow(2, 10 * (t - 1)) + b;
   t--;
   return c / 2 * (-Math.pow(2, -10 * t) + 2) + b;
-});
-__publicField$k(Easings, "circularIn", (t, b, c, d) => {
+};
+Easings.circularIn = (t, b, c, d) => {
   t /= d;
   return -c * (Math.sqrt(1 - t * t) - 1) + b;
-});
-__publicField$k(Easings, "circularOut", (t, b, c, d) => {
+};
+Easings.circularOut = (t, b, c, d) => {
   t /= d;
   t--;
   return c * Math.sqrt(1 - t * t) + b;
-});
-__publicField$k(Easings, "circularInOut", (t, b, c, d) => {
+};
+Easings.circularInOut = (t, b, c, d) => {
   t /= d / 2;
   if (t < 1)
     return -c / 2 * (Math.sqrt(1 - t * t) - 1) + b;
   t -= 2;
   return c / 2 * (Math.sqrt(1 - t * t) + 1) + b;
-});
-
-var __defProp$j = Object.defineProperty;
-var __defNormalProp$j = (obj, key, value) => key in obj ? __defProp$j(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$j = (obj, key, value) => {
-  __defNormalProp$j(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
 };
+
+var EntityType = /* @__PURE__ */ ((EntityType2) => {
+  EntityType2["Entity"] = "Entity";
+  EntityType2["Scene"] = "Scene";
+  EntityType2["Sprite"] = "Sprite";
+  EntityType2["Label"] = "Label";
+  EntityType2["TextLine"] = "TextLine";
+  EntityType2["Shape"] = "Shape";
+  EntityType2["Composite"] = "Composite";
+  return EntityType2;
+})(EntityType || {});
+
+var ShapeType = /* @__PURE__ */ ((ShapeType2) => {
+  ShapeType2["Undefined"] = "Undefined";
+  ShapeType2["Rectangle"] = "Rectangle";
+  ShapeType2["Circle"] = "Circle";
+  ShapeType2["Path"] = "Path";
+  return ShapeType2;
+})(ShapeType || {});
+
+class M2c2KitHelpers {
+  /**
+   * Calculates the four points of the bounding box of the entity, taking
+   * into account the entity's rotation (as well as the rotation of its
+   * ancestors).
+   *
+   * @remarks This method is used to calculate the rotated bounding box of an
+   * entity when in order to determine if a point is inside the entity in
+   * response to DOM pointer events. This method is NOT used to prepare the
+   * CanvasKit canvas for drawing the entity.
+   *
+   * @param drawableEntity
+   * @returns array of points representing the rotated entity
+   */
+  static calculateRotatedPoints(drawableEntity) {
+    const entities = drawableEntity.ancestors;
+    entities.reverse();
+    entities.push(drawableEntity);
+    const entityPointsArray = entities.map((entity) => {
+      const boundingBox = M2c2KitHelpers.calculateEntityAbsoluteBoundingBox(entity);
+      return boundingBoxToPoints(boundingBox);
+    });
+    for (let i = 0; i < entityPointsArray.length; i++) {
+      if (!entityNeedsRotation(entities[i])) {
+        continue;
+      }
+      const entityPoints = entityPointsArray[i];
+      const radians = entities[i].zRotation;
+      const center = findCentroid(entityPoints);
+      for (let j = i; j < entities.length; j++) {
+        entityPointsArray[j] = rotateRectangle(
+          entityPointsArray[j],
+          radians,
+          center
+        );
+      }
+    }
+    return entityPointsArray[entityPointsArray.length - 1];
+  }
+  /**
+   * Rotates the canvas so the entity appears rotated when drawn.
+   *
+   * @remarks Entities inherit rotations from their ancestors. Each ancestor,
+   * however, rotates around its own anchor point. Thus, we must rotate the
+   * canvas around the anchor point of each ancestor as well as the entity's
+   * anchor point.
+   *
+   * @param canvas - CanvasKit canvas to rotate
+   * @param drawableEntity - Entity to rotate the canvas for
+   */
+  static rotateCanvasForDrawableEntity(canvas, drawableEntity) {
+    const rotationTransforms = calculateRotationTransforms(drawableEntity);
+    if (rotationTransforms.length === 0) {
+      return;
+    }
+    const drawScale = Globals.canvasScale / drawableEntity.absoluteScale;
+    applyRotationTransformsToCanvas(rotationTransforms, drawScale, canvas);
+  }
+  /**
+   * Calculates the absolute bounding box of the entity before any rotation
+   * is applied.
+   *
+   * @remarks The absolute bounding box is the bounding box of the entity
+   * relative to the scene's origin (0, 0).
+   *
+   * @param entity
+   * @returns the bounding box of the entity
+   */
+  static calculateEntityAbsoluteBoundingBox(entity) {
+    const anchorPoint = entity.anchorPoint;
+    const scale = entity.absoluteScale;
+    let width = entity.size.width;
+    let height = entity.size.height;
+    if (entity.type === EntityType.Shape && entity.shapeType === ShapeType.Circle) {
+      const radius = entity.circleOfRadius;
+      if (!radius) {
+        throw "circleOfRadius is undefined";
+      }
+      width = radius * 2;
+      height = radius * 2;
+    }
+    const xMin = entity.absolutePosition.x - width * anchorPoint.x * scale;
+    const xMax = entity.absolutePosition.x + width * (1 - anchorPoint.x) * scale;
+    const yMin = entity.absolutePosition.y - height * anchorPoint.y * scale;
+    const yMax = entity.absolutePosition.y + height * (1 - anchorPoint.y) * scale;
+    return { xMin, xMax, yMin, yMax };
+  }
+  /**
+   * Converts an angle from radians to degrees.
+   *
+   * @remarks In m2c2kit, radians are counter clockwise from the positive
+   * x-axis, but the rotate method in CanvasKit uses degrees clockwise. Thus
+   * we negate after conversion from radians to degrees.
+   *
+   * @param radians - The angle in radians
+   * @returns The angle in degrees
+   */
+  static radiansToDegrees(radians) {
+    return -M2c2KitHelpers.normalizeAngleRadians(radians) * (180 / Math.PI);
+  }
+  /**
+   * Normalizes an angle in radians to the range [0, 2*Math.PI)
+   *
+   * @param radians - angle in radians
+   * @returns normalized angle in radians
+   */
+  static normalizeAngleRadians(radians) {
+    const quotient = Math.floor(radians / (2 * Math.PI));
+    let normalized = radians - quotient * (2 * Math.PI);
+    if (normalized < 0) {
+      normalized += 2 * Math.PI;
+    }
+    return normalized;
+  }
+  /**
+   * Checks if a point is inside a rectangle.
+   *
+   * @param point - The Point to check
+   * @param rect - An array of four Points representing the vertices of the
+   * rectangle in clockwise order
+   * @returns true if the Point is inside the rectangle
+   */
+  static isPointInsideRectangle(point, rect) {
+    for (let i = 0; i < 4; i++) {
+      const p1 = rect[i];
+      const p2 = rect[(i + 1) % 4];
+      const cross = (p2.x - p1.x) * (point.y - p1.y) - (p2.y - p1.y) * (point.x - p1.x);
+      if (cross > 0) {
+        return false;
+      }
+    }
+    return true;
+  }
+}
+function applyRotationTransformsToCanvas(rotationTransforms, scale, canvas) {
+  rotationTransforms.forEach((transform) => {
+    canvas.rotate(
+      M2c2KitHelpers.radiansToDegrees(transform.radians),
+      transform.center.x * scale,
+      transform.center.y * scale
+    );
+  });
+}
+function calculateRotationTransforms(drawableEntity) {
+  const rotationTransforms = [];
+  const entities = drawableEntity.ancestors;
+  entities.reverse();
+  entities.push(drawableEntity);
+  entities.forEach((entity) => {
+    if (entityNeedsRotation(entity)) {
+      const drawable = entity;
+      if (drawable.type === EntityType.Scene) {
+        const center2 = {
+          x: drawable.absolutePosition.x + drawable.size.width * 0.5,
+          y: drawable.absolutePosition.y + drawable.size.height * 0.5
+        };
+        rotationTransforms.push({
+          radians: drawable.zRotation,
+          center: center2
+        });
+        return;
+      }
+      const boundingBox = M2c2KitHelpers.calculateEntityAbsoluteBoundingBox(drawable);
+      const points = boundingBoxToPoints(boundingBox);
+      const center = findCentroid(points);
+      rotationTransforms.push({
+        radians: drawable.zRotation,
+        center
+      });
+    }
+  });
+  return rotationTransforms;
+}
+function entityNeedsRotation(entity) {
+  return M2c2KitHelpers.normalizeAngleRadians(entity.zRotation) !== 0 && entity.isDrawable;
+}
+function boundingBoxToPoints(boundingBox) {
+  const { xMin, xMax, yMin, yMax } = boundingBox;
+  const points = [
+    { x: xMin, y: yMin },
+    // Top left
+    { x: xMin, y: yMax },
+    // Bottom left
+    { x: xMax, y: yMax },
+    // Bottom right
+    { x: xMax, y: yMin }
+    // Top right
+  ];
+  return points;
+}
+function findCentroid(points) {
+  if (points.length !== 4) {
+    throw new Error("Invalid input: expected an array of four points");
+  }
+  let xSum = 0;
+  let ySum = 0;
+  for (const point of points) {
+    xSum += point.x;
+    ySum += point.y;
+  }
+  const xAvg = xSum / 4;
+  const yAvg = ySum / 4;
+  return { x: xAvg, y: yAvg };
+}
+function rotatePoint(point, radians, center) {
+  const dx = point.x - center.x;
+  const dy = point.y - center.y;
+  const x = dx * Math.cos(-radians) - dy * Math.sin(-radians);
+  const y = dx * Math.sin(-radians) + dy * Math.cos(-radians);
+  return {
+    x: x + center.x,
+    y: y + center.y
+  };
+}
+function rotateRectangle(rect, radians, center) {
+  if (rect.length !== 4) {
+    throw new Error("Invalid input: expected an array of four points");
+  }
+  const rotated = [];
+  for (const p of rect) {
+    rotated.push(rotatePoint(p, radians, center));
+  }
+  return rotated;
+}
+
 class Action {
   constructor(runDuringTransition = false) {
-    __publicField$j(this, "startOffset", -1);
-    __publicField$j(this, "endOffset", -1);
-    __publicField$j(this, "started", false);
-    __publicField$j(this, "running", false);
-    __publicField$j(this, "completed", false);
-    __publicField$j(this, "runStartTime", -1);
-    __publicField$j(this, "duration", 0);
-    __publicField$j(this, "runDuringTransition");
-    __publicField$j(this, "parent");
-    __publicField$j(this, "isParent", false);
-    __publicField$j(this, "isChild", false);
-    __publicField$j(this, "key");
+    this.startOffset = -1;
+    this.endOffset = -1;
+    this.started = false;
+    this.running = false;
+    this.completed = false;
+    this.runStartTime = -1;
+    this.duration = 0;
+    this.isParent = false;
+    this.isChild = false;
     this.runDuringTransition = runDuringTransition;
   }
   /**
@@ -169,12 +400,11 @@ class Action {
    * @returns The move action
    */
   static move(options) {
-    var _a, _b;
     return new MoveAction(
       options.point,
       options.duration,
-      (_a = options.easing) != null ? _a : Easings.linear,
-      (_b = options.runDuringTransition) != null ? _b : false
+      options.easing ?? Easings.linear,
+      options.runDuringTransition ?? false
     );
   }
   /**
@@ -184,10 +414,9 @@ class Action {
    * @returns The wait action
    */
   static wait(options) {
-    var _a;
     return new WaitAction(
       options.duration,
-      (_a = options.runDuringTransition) != null ? _a : false
+      options.runDuringTransition ?? false
     );
   }
   /**
@@ -197,10 +426,9 @@ class Action {
    * @returns The custom action
    */
   static custom(options) {
-    var _a;
     return new CustomAction(
       options.callback,
-      (_a = options.runDuringTransition) != null ? _a : false
+      options.runDuringTransition ?? false
     );
   }
   /**
@@ -218,6 +446,52 @@ class Action {
       options.runDuringTransition
     );
   }
+  /**
+   * Creates an action that will change the entity's alpha (opacity).
+   *
+   * @remarks Alpha has multiplicative inheritance. For example, if the entity's parent is alpha .5 and this entity's action fades alpha to .4, then the entity will appear with alpha .2.
+   *
+   * @param options - {@link FadeAlphaActionOptions}
+   * @returns The fadeAlpha action
+   */
+  static fadeAlpha(options) {
+    return new FadeAlphaAction(
+      options.alpha,
+      options.duration,
+      options.runDuringTransition
+    );
+  }
+  /**
+   * Creates an action that will rotate the entity.
+   *
+   * @remarks Rotate actions are applied to their children. In addition to this entity's rotate action, all ancestors' rotate actions will also be applied.
+   *
+   * @param options - {@link RotateActionOptions}
+   * @returns The rotate action
+   */
+  static rotate(options) {
+    if (options.byAngle !== void 0 && options.toAngle !== void 0) {
+      throw new Error("rotate Action: cannot specify both byAngle and toAngle");
+    }
+    if (options.byAngle === void 0 && options.toAngle === void 0) {
+      throw new Error("rotate Action: must specify either byAngle or toAngle");
+    }
+    if (options.toAngle === void 0 && options.shortestUnitArc !== void 0) {
+      throw new Error(
+        "rotate Action: shortestUnitArc can only be specified when toAngle is provided"
+      );
+    }
+    if (options.toAngle !== void 0 && options.shortestUnitArc === void 0) {
+      options.shortestUnitArc = true;
+    }
+    return new RotateAction(
+      options.byAngle,
+      options.toAngle,
+      options.shortestUnitArc,
+      options.duration,
+      options.runDuringTransition
+    );
+  }
   /**
    * Creates an array of actions that will be run in order.
    *
@@ -304,6 +578,26 @@ class Action {
         });
         break;
       }
+      case ActionType.FadeAlpha: {
+        const fadeAlpha = action;
+        cloned = Action.fadeAlpha({
+          alpha: fadeAlpha.alpha,
+          duration: fadeAlpha.duration,
+          runDuringTransition: fadeAlpha.runDuringTransition
+        });
+        break;
+      }
+      case ActionType.Rotate: {
+        const rotate = action;
+        cloned = Action.rotate({
+          byAngle: rotate.byAngle,
+          toAngle: rotate.toAngle,
+          shortestUnitArc: rotate.shortestUnitArc,
+          duration: rotate.duration,
+          runDuringTransition: rotate.runDuringTransition
+        });
+        break;
+      }
       case ActionType.Wait: {
         const wait = action;
         cloned = Action.wait({
@@ -391,6 +685,55 @@ class Action {
         scaleAction.completed = true;
       }
     }
+    if (action.type === ActionType.FadeAlpha) {
+      const fadeAlphaAction = action;
+      if (!fadeAlphaAction.started) {
+        fadeAlphaAction.delta = fadeAlphaAction.alpha - entity.alpha;
+        fadeAlphaAction.started = true;
+      }
+      if (elapsed < fadeAlphaAction.duration) {
+        entity.alpha = entity.alpha + fadeAlphaAction.delta * (dt / fadeAlphaAction.duration);
+      } else {
+        entity.alpha = fadeAlphaAction.alpha;
+        fadeAlphaAction.running = false;
+        fadeAlphaAction.completed = true;
+      }
+    }
+    if (action.type === ActionType.Rotate) {
+      const rotateAction = action;
+      if (!rotateAction.started) {
+        if (rotateAction.byAngle !== void 0) {
+          rotateAction.delta = rotateAction.byAngle;
+        }
+        if (rotateAction.toAngle !== void 0) {
+          rotateAction.toAngle = M2c2KitHelpers.normalizeAngleRadians(
+            rotateAction.toAngle
+          );
+          entity.zRotation = M2c2KitHelpers.normalizeAngleRadians(
+            entity.zRotation
+          );
+          rotateAction.delta = rotateAction.toAngle - entity.zRotation;
+          if (rotateAction.shortestUnitArc === true && Math.abs(rotateAction.delta) > Math.PI) {
+            rotateAction.delta = 2 * Math.PI - Math.abs(rotateAction.delta);
+          }
+        }
+        rotateAction.started = true;
+        rotateAction.finalValue = entity.zRotation + rotateAction.delta;
+      }
+      if (elapsed < rotateAction.duration) {
+        entity.zRotation = entity.zRotation + rotateAction.delta * (dt / rotateAction.duration);
+        if (rotateAction.delta <= 0 && entity.zRotation < rotateAction.finalValue) {
+          entity.zRotation = rotateAction.finalValue;
+        }
+        if (rotateAction.delta > 0 && entity.zRotation > rotateAction.finalValue) {
+          entity.zRotation = rotateAction.finalValue;
+        }
+      } else {
+        entity.zRotation = rotateAction.finalValue;
+        rotateAction.running = false;
+        rotateAction.completed = true;
+      }
+    }
   }
   /**
    * Calculates the duration of an action, including any children actions
@@ -428,17 +771,16 @@ class Action {
    * @param action that needs assigning start and end offsets
    */
   calculateStartEndOffsets(action) {
-    var _a, _b, _c;
     let parentStartOffset;
     if (action.parent === void 0) {
       parentStartOffset = 0;
     } else {
       parentStartOffset = action.parent.startOffset;
     }
-    if (((_a = action.parent) == null ? void 0 : _a.type) === ActionType.Group) {
+    if (action.parent?.type === ActionType.Group) {
       action.startOffset = parentStartOffset;
       action.endOffset = action.startOffset + action.duration;
-    } else if (((_b = action.parent) == null ? void 0 : _b.type) === ActionType.Sequence) {
+    } else if (action.parent?.type === ActionType.Sequence) {
       const parent = action.parent;
       let dur = 0;
       for (const a of parent.children) {
@@ -454,7 +796,7 @@ class Action {
       action.endOffset = action.startOffset + action.duration;
     }
     if (action.isParent) {
-      (_c = action.children) == null ? void 0 : _c.forEach(
+      action.children?.forEach(
         (child) => this.calculateStartEndOffsets(child)
       );
     }
@@ -512,8 +854,7 @@ class Action {
 class SequenceAction extends Action {
   constructor(actions) {
     super();
-    __publicField$j(this, "type", ActionType.Sequence);
-    __publicField$j(this, "children");
+    this.type = ActionType.Sequence;
     this.children = actions;
     this.isParent = true;
   }
@@ -521,8 +862,8 @@ class SequenceAction extends Action {
 class GroupAction extends Action {
   constructor(actions) {
     super();
-    __publicField$j(this, "type", ActionType.Group);
-    __publicField$j(this, "children", new Array());
+    this.type = ActionType.Group;
+    this.children = new Array();
     this.children = actions;
     this.isParent = true;
   }
@@ -530,8 +871,7 @@ class GroupAction extends Action {
 class CustomAction extends Action {
   constructor(callback, runDuringTransition = false) {
     super(runDuringTransition);
-    __publicField$j(this, "type", ActionType.Custom);
-    __publicField$j(this, "callback");
+    this.type = ActionType.Custom;
     this.callback = callback;
     this.isParent = false;
     this.duration = 0;
@@ -540,7 +880,7 @@ class CustomAction extends Action {
 class WaitAction extends Action {
   constructor(duration, runDuringTransition) {
     super(runDuringTransition);
-    __publicField$j(this, "type", ActionType.Wait);
+    this.type = ActionType.Wait;
     this.duration = duration;
     this.isParent = false;
   }
@@ -548,12 +888,9 @@ class WaitAction extends Action {
 class MoveAction extends Action {
   constructor(point, duration, easing, runDuringTransition) {
     super(runDuringTransition);
-    __publicField$j(this, "type", ActionType.Move);
-    __publicField$j(this, "point");
-    __publicField$j(this, "startPoint");
-    __publicField$j(this, "dx", 0);
-    __publicField$j(this, "dy", 0);
-    __publicField$j(this, "easing");
+    this.type = ActionType.Move;
+    this.dx = 0;
+    this.dy = 0;
     this.duration = duration;
     this.point = point;
     this.isParent = false;
@@ -564,14 +901,36 @@ class MoveAction extends Action {
 class ScaleAction extends Action {
   constructor(scale, duration, runDuringTransition = false) {
     super(runDuringTransition);
-    __publicField$j(this, "type", ActionType.Scale);
-    __publicField$j(this, "scale");
-    __publicField$j(this, "delta", 0);
+    this.type = ActionType.Scale;
+    this.delta = 0;
     this.duration = duration;
     this.scale = scale;
     this.isParent = false;
   }
 }
+class FadeAlphaAction extends Action {
+  constructor(alpha, duration, runDuringTransition = false) {
+    super(runDuringTransition);
+    this.type = ActionType.FadeAlpha;
+    this.delta = 0;
+    this.duration = duration;
+    this.alpha = alpha;
+    this.isParent = false;
+  }
+}
+class RotateAction extends Action {
+  constructor(byAngle, toAngle, shortestUnitArc, duration, runDuringTransition = false) {
+    super(runDuringTransition);
+    this.type = ActionType.Rotate;
+    this.delta = 0;
+    this.finalValue = NaN;
+    this.duration = duration;
+    this.byAngle = byAngle;
+    this.toAngle = toAngle;
+    this.shortestUnitArc = shortestUnitArc;
+    this.isParent = false;
+  }
+}
 
 var ActivityType = /* @__PURE__ */ ((ActivityType2) => {
   ActivityType2["Game"] = "Game";
@@ -588,7 +947,7 @@ class CanvasKitHelpers {
    * free these wasm objects.
    */
   static Dispose(objects) {
-    objects.filter((o) => !(o == null ? void 0 : o.isDeleted)).forEach((o) => o == null ? void 0 : o.delete());
+    objects.filter((o) => !o?.isDeleted()).forEach((o) => o?.delete());
   }
   static makePaint(canvasKit, color, style, isAntialiased) {
     const paint = new canvasKit.Paint();
@@ -599,23 +958,316 @@ class CanvasKitHelpers {
   }
 }
 
-var __defProp$i = Object.defineProperty;
-var __defNormalProp$i = (obj, key, value) => key in obj ? __defProp$i(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$i = (obj, key, value) => {
-  __defNormalProp$i(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
+class MutablePath {
+  constructor() {
+    this._subpaths = new Array();
+    this.currentPath = new Array();
+  }
+  get subpaths() {
+    if (this.currentPath.length > 0) {
+      return [...this._subpaths, this.currentPath];
+    } else {
+      return this._subpaths;
+    }
+  }
+  /**
+   * Starts a new subpath at a given point.
+   *
+   * @param point - location at which to start the new subpath
+   */
+  move(point) {
+    if (this.currentPath.length > 0) {
+      this._subpaths.push(this.currentPath);
+    }
+    this.currentPath = new Array();
+    this.currentPath.push(point);
+  }
+  /**
+   * Adds a straight line to the current subpath.
+   *
+   * @remarks The line is added from the last point in the current subpath to
+   * the given point.
+   *
+   * @param point - location where the line will end
+   */
+  addLine(point) {
+    this.currentPath.push(point);
+  }
+  /**
+   * Removes all subpaths from the shape.
+   */
+  clear() {
+    this._subpaths = new Array();
+    this.currentPath = new Array();
+  }
+  /**
+   * Makes a deep copy.
+   *
+   * @returns a deep copy
+   */
+  duplicate() {
+    const newPath = new MutablePath();
+    newPath._subpaths = JSON.parse(JSON.stringify(this._subpaths));
+    newPath.currentPath = JSON.parse(JSON.stringify(this.currentPath));
+    return newPath;
+  }
+}
+
+class WebColors {
+}
+WebColors.Transparent = [0, 0, 0, 0];
+WebColors.MediumVioletRed = [199, 21, 133, 1];
+WebColors.DeepPink = [255, 20, 147, 1];
+WebColors.PaleVioletRed = [219, 112, 147, 1];
+WebColors.HotPink = [255, 105, 180, 1];
+WebColors.LightPink = [255, 182, 193, 1];
+WebColors.Pink = [255, 192, 203, 1];
+WebColors.DarkRed = [139, 0, 0, 1];
+WebColors.Red = [255, 0, 0, 1];
+WebColors.Firebrick = [178, 34, 34, 1];
+WebColors.Crimson = [220, 20, 60, 1];
+WebColors.IndianRed = [205, 92, 92, 1];
+WebColors.LightCoral = [240, 128, 128, 1];
+WebColors.Salmon = [250, 128, 114, 1];
+WebColors.DarkSalmon = [233, 150, 122, 1];
+WebColors.LightSalmon = [255, 160, 122, 1];
+WebColors.OrangeRed = [255, 69, 0, 1];
+WebColors.Tomato = [255, 99, 71, 1];
+WebColors.DarkOrange = [255, 140, 0, 1];
+WebColors.Coral = [255, 127, 80, 1];
+WebColors.Orange = [255, 165, 0, 1];
+WebColors.DarkKhaki = [189, 183, 107, 1];
+WebColors.Gold = [255, 215, 0, 1];
+WebColors.Khaki = [240, 230, 140, 1];
+WebColors.PeachPuff = [255, 218, 185, 1];
+WebColors.Yellow = [255, 255, 0, 1];
+WebColors.PaleGoldenrod = [238, 232, 170, 1];
+WebColors.Moccasin = [255, 228, 181, 1];
+WebColors.PapayaWhip = [255, 239, 213, 1];
+WebColors.LightGoldenrodYellow = [250, 250, 210, 1];
+WebColors.LemonChiffon = [255, 250, 205, 1];
+WebColors.LightYellow = [255, 255, 224, 1];
+WebColors.Maroon = [128, 0, 0, 1];
+WebColors.Brown = [165, 42, 42, 1];
+WebColors.SaddleBrown = [139, 69, 19, 1];
+WebColors.Sienna = [160, 82, 45, 1];
+WebColors.Chocolate = [210, 105, 30, 1];
+WebColors.DarkGoldenrod = [184, 134, 11, 1];
+WebColors.Peru = [205, 133, 63, 1];
+WebColors.RosyBrown = [188, 143, 143, 1];
+WebColors.Goldenrod = [218, 165, 32, 1];
+WebColors.SandyBrown = [244, 164, 96, 1];
+WebColors.Tan = [210, 180, 140, 1];
+WebColors.Burlywood = [222, 184, 135, 1];
+WebColors.Wheat = [245, 222, 179, 1];
+WebColors.NavajoWhite = [255, 222, 173, 1];
+WebColors.Bisque = [255, 228, 196, 1];
+WebColors.BlanchedAlmond = [255, 235, 205, 1];
+WebColors.Cornsilk = [255, 248, 220, 1];
+WebColors.DarkGreen = [0, 100, 0, 1];
+WebColors.Green = [0, 128, 0, 1];
+WebColors.DarkOliveGreen = [85, 107, 47, 1];
+WebColors.ForestGreen = [34, 139, 34, 1];
+WebColors.SeaGreen = [46, 139, 87, 1];
+WebColors.Olive = [128, 128, 0, 1];
+WebColors.OliveDrab = [107, 142, 35, 1];
+WebColors.MediumSeaGreen = [60, 179, 113, 1];
+WebColors.LimeGreen = [50, 205, 50, 1];
+WebColors.Lime = [0, 255, 0, 1];
+WebColors.SpringGreen = [0, 255, 127, 1];
+WebColors.MediumSpringGreen = [0, 250, 154, 1];
+WebColors.DarkSeaGreen = [143, 188, 143, 1];
+WebColors.MediumAquamarine = [102, 205, 170, 1];
+WebColors.YellowGreen = [154, 205, 50, 1];
+WebColors.LawnGreen = [124, 252, 0, 1];
+WebColors.Chartreuse = [127, 255, 0, 1];
+WebColors.LightGreen = [144, 238, 144, 1];
+WebColors.GreenYellow = [173, 255, 47, 1];
+WebColors.PaleGreen = [152, 251, 152, 1];
+WebColors.Teal = [0, 128, 128, 1];
+WebColors.DarkCyan = [0, 139, 139, 1];
+WebColors.LightSeaGreen = [32, 178, 170, 1];
+WebColors.CadetBlue = [95, 158, 160, 1];
+WebColors.DarkTurquoise = [0, 206, 209, 1];
+WebColors.MediumTurquoise = [72, 209, 204, 1];
+WebColors.Turquoise = [64, 224, 208, 1];
+WebColors.Aqua = [0, 255, 255, 1];
+WebColors.Cyan = [0, 255, 255, 1];
+WebColors.Aquamarine = [127, 255, 212, 1];
+WebColors.PaleTurquoise = [175, 238, 238, 1];
+WebColors.LightCyan = [224, 255, 255, 1];
+WebColors.Navy = [0, 0, 128, 1];
+WebColors.DarkBlue = [0, 0, 139, 1];
+WebColors.MediumBlue = [0, 0, 205, 1];
+WebColors.Blue = [0, 0, 255, 1];
+WebColors.MidnightBlue = [25, 25, 112, 1];
+WebColors.RoyalBlue = [65, 105, 225, 1];
+WebColors.SteelBlue = [70, 130, 180, 1];
+WebColors.DodgerBlue = [30, 144, 255, 1];
+WebColors.DeepSkyBlue = [0, 191, 255, 1];
+WebColors.CornflowerBlue = [100, 149, 237, 1];
+WebColors.SkyBlue = [135, 206, 235, 1];
+WebColors.LightSkyBlue = [135, 206, 250, 1];
+WebColors.LightSteelBlue = [176, 196, 222, 1];
+WebColors.LightBlue = [173, 216, 230, 1];
+WebColors.PowderBlue = [176, 224, 230, 1];
+WebColors.Indigo = [75, 0, 130, 1];
+WebColors.Purple = [128, 0, 128, 1];
+WebColors.DarkMagenta = [139, 0, 139, 1];
+WebColors.DarkViolet = [148, 0, 211, 1];
+WebColors.DarkSlateBlue = [72, 61, 139, 1];
+WebColors.BlueViolet = [138, 43, 226, 1];
+WebColors.DarkOrchid = [153, 50, 204, 1];
+WebColors.Fuchsia = [255, 0, 255, 1];
+WebColors.Magenta = [255, 0, 255, 1];
+WebColors.SlateBlue = [106, 90, 205, 1];
+WebColors.MediumSlateBlue = [123, 104, 238, 1];
+WebColors.MediumOrchid = [186, 85, 211, 1];
+WebColors.MediumPurple = [147, 112, 219, 1];
+WebColors.Orchid = [218, 112, 214, 1];
+WebColors.Violet = [238, 130, 238, 1];
+WebColors.Plum = [221, 160, 221, 1];
+WebColors.Thistle = [216, 191, 216, 1];
+WebColors.Lavender = [230, 230, 250, 1];
+WebColors.MistyRose = [255, 228, 225, 1];
+WebColors.AntiqueWhite = [250, 235, 215, 1];
+WebColors.Linen = [250, 240, 230, 1];
+WebColors.Beige = [245, 245, 220, 1];
+WebColors.WhiteSmoke = [245, 245, 245, 1];
+WebColors.LavenderBlush = [255, 240, 245, 1];
+WebColors.OldLace = [253, 245, 230, 1];
+WebColors.AliceBlue = [240, 248, 255, 1];
+WebColors.Seashell = [255, 245, 238, 1];
+WebColors.GhostWhite = [248, 248, 255, 1];
+WebColors.Honeydew = [240, 255, 240, 1];
+WebColors.FloralWhite = [255, 250, 240, 1];
+WebColors.Azure = [240, 255, 255, 1];
+WebColors.MintCream = [245, 255, 250, 1];
+WebColors.Snow = [255, 250, 250, 1];
+WebColors.Ivory = [255, 255, 240, 1];
+WebColors.White = [255, 255, 255, 1];
+WebColors.Black = [0, 0, 0, 1];
+WebColors.DarkSlateGray = [47, 79, 79, 1];
+WebColors.DimGray = [105, 105, 105, 1];
+WebColors.SlateGray = [112, 128, 144, 1];
+WebColors.Gray = [128, 128, 128, 1];
+WebColors.LightSlateGray = [119, 136, 153, 1];
+WebColors.DarkGray = [169, 169, 169, 1];
+WebColors.Silver = [192, 192, 192, 1];
+WebColors.LightGray = [211, 211, 211, 1];
+WebColors.Gainsboro = [220, 220, 220, 1];
+WebColors.RebeccaPurple = [102, 51, 153, 1];
+
+class Constants {
+}
+/** Size of the font showing frames per second */
+Constants.FPS_DISPLAY_TEXT_FONT_SIZE = 12;
+/** Color of the font showing frames per second */
+Constants.FPS_DISPLAY_TEXT_COLOR = [0, 0, 0, 0.5];
+/** Frequency, in milliseconds, at which to update frames per second metric shown on the screen */
+Constants.FPS_DISPLAY_UPDATE_INTERVAL = 1e3;
+/** Maximum number of activity metrics to log. */
+Constants.MAXIMUM_RECORDED_ACTIVITY_METRICS = 32;
+/** The frames per second will be logged in game metrics if the FPS is lower than this value */
+Constants.FPS_METRIC_REPORT_THRESHOLD = 59;
+/** Scene color, if none is specified. */
+Constants.DEFAULT_SCENE_BACKGROUND_COLOR = WebColors.White;
+/** Shape fill color, if none is specified. */
+Constants.DEFAULT_SHAPE_FILL_COLOR = WebColors.Red;
+/** Color of paths in a shape, if none is specified. */
+Constants.DEFAULT_PATH_STROKE_COLOR = WebColors.Red;
+/** Line width of paths in a shape, if none is specified. */
+Constants.DEFAULT_PATH_LINE_WIDTH = 2;
+/** Color of text in Label and TextLine, if none is specified. */
+Constants.DEFAULT_FONT_COLOR = WebColors.Black;
+/** Font size in Label and TextLine, if none is specified. */
+Constants.DEFAULT_FONT_SIZE = 16;
+Constants.LIMITED_FPS_RATE = 5;
+Constants.FREE_ENTITIES_SCENE_NAME = "__freeEntitiesScene";
+Constants.OUTGOING_SCENE_NAME = "__outgoingScene";
+Constants.OUTGOING_SCENE_SPRITE_NAME = "__outgoingSceneSprite";
+Constants.OUTGOING_SCENE_IMAGE_NAME = "__outgoingSceneSnapshot";
+Constants.SESSION_INITIALIZATION_POLLING_INTERVAL_MS = 50;
+
+class ColorfulMutablePath extends MutablePath {
+  constructor() {
+    super(...arguments);
+    /** Stroke color to be applied to subsequent lines. */
+    this.strokeColor = Constants.DEFAULT_PATH_STROKE_COLOR;
+    /** Line width to be applied to subsequent lines. */
+    this.lineWidth = Constants.DEFAULT_PATH_LINE_WIDTH;
+    /** Colors and widths of lines in the path. */
+    this.linePresentations = [];
+  }
+  /**
+   * Adds a straight line to the current subpath
+   *
+   * @remarks The line is added from the last point in the current subpath to
+   * the given point, with the current stroke color and line width.
+   *
+   * @param point - location where the line will end
+   */
+  addLine(point) {
+    if (this.isNewLinePresentation()) {
+      this.linePresentations.push({
+        strokeColor: this.strokeColor,
+        lineWidth: this.lineWidth,
+        subpathIndex: this._subpaths.length,
+        pointIndex: this.currentPath.length - 1
+      });
+    }
+    this.currentPath.push(point);
+  }
+  /**
+   * Checks if the current line presentation (stroke color and line width) is
+   * different from the last line presentation.
+   *
+   * @returns true if the current line presentation is different from the last
+   */
+  isNewLinePresentation() {
+    if (this.linePresentations.length === 0) {
+      return true;
+    }
+    const currentLinePresentation = this.linePresentations[this.linePresentations.length - 1];
+    return currentLinePresentation.strokeColor !== this.strokeColor || currentLinePresentation.lineWidth !== this.lineWidth;
+  }
+  /**
+   * Removes all subpaths from the shape and resets the stroke color and line
+   * width to their default values.
+   */
+  clear() {
+    super.clear();
+    this.linePresentations = [];
+    this.strokeColor = Constants.DEFAULT_PATH_STROKE_COLOR;
+    this.lineWidth = Constants.DEFAULT_PATH_LINE_WIDTH;
+  }
+  /**
+   * Makes a deep copy.
+   *
+   * @returns a deep copy
+   */
+  duplicate() {
+    const newPath = super.duplicate();
+    newPath.strokeColor = JSON.parse(JSON.stringify(this.strokeColor));
+    newPath.lineWidth = this.lineWidth;
+    newPath.linePresentations = JSON.parse(
+      JSON.stringify(this.linePresentations)
+    );
+    return newPath;
+  }
+}
+
 class GlobalVariables {
   constructor() {
-    __publicField$i(this, "now", NaN);
-    __publicField$i(this, "deltaTime", NaN);
-    __publicField$i(this, "canvasScale", NaN);
+    this.now = NaN;
+    this.deltaTime = NaN;
+    this.canvasScale = NaN;
     // _rootScale is the scaling factor to be applied to scenes to scale up or
     // down to fit the device's window while preserving the aspect ratio the
     // game was designed for
-    __publicField$i(this, "rootScale", 1);
-    __publicField$i(this, "canvasCssWidth", NaN);
-    __publicField$i(this, "canvasCssHeight", NaN);
+    this.rootScale = 1;
+    this.canvasCssWidth = NaN;
+    this.canvasCssHeight = NaN;
   }
 }
 
@@ -637,20 +1289,8 @@ var ConstraintType = /* @__PURE__ */ ((ConstraintType2) => {
   return ConstraintType2;
 })(ConstraintType || {});
 
-var __defProp$h = Object.defineProperty;
-var __defNormalProp$h = (obj, key, value) => key in obj ? __defProp$h(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$h = (obj, key, value) => {
-  __defNormalProp$h(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class LayoutConstraint {
   constructor(type, alterEntity) {
-    // the constraint, e.g., bottomToTopOf
-    __publicField$h(this, "type");
-    // alter is the other entity that the focal entity is constrained to.
-    // in the example above, A is the focal entity, B is the alter
-    // thus the alter entity property is B
-    __publicField$h(this, "alterEntity");
     // the below 3 properties are calculated from the constraint type
     // (we set them to false by default to avoid undefined warnings, but
     // they will be definitely assigned in the constructor logic)
@@ -658,37 +1298,37 @@ class LayoutConstraint {
     //
     // does the constraint affect the Y or X axis? If not, then it's
     // a horizontal constraint
-    __publicField$h(this, "verticalConstraint", false);
+    this.verticalConstraint = false;
     // does the constraint apply to the focal entity's "minimum" position
     // along its axis? That is, does the constraint reference the focal
     // entity's "top" or "start"? Top and start are considered minimums because
     // our origin (0, 0) in the upper left.
     // If not, then the constraint applies to the focal entity's "maximum"
     // position, e.g., its "bottom" or "end".
-    __publicField$h(this, "focalEntityMinimum", false);
+    this.focalEntityMinimum = false;
     // does the constraint apply to the alter entity's "minimum" position
     // along its axis?
-    __publicField$h(this, "alterEntityMinimum", false);
-    __publicField$h(this, "verticalTypes", [
+    this.alterEntityMinimum = false;
+    this.verticalTypes = [
       ConstraintType.topToTopOf,
       ConstraintType.topToBottomOf,
       ConstraintType.bottomToTopOf,
       ConstraintType.bottomToBottomOf
-    ]);
+    ];
     // e.g., entity A
-    __publicField$h(this, "focalEntityMinimumTypes", [
+    this.focalEntityMinimumTypes = [
       ConstraintType.topToTopOf,
       ConstraintType.topToBottomOf,
       ConstraintType.startToStartOf,
       ConstraintType.startToEndOf
-    ]);
+    ];
     // e.g., entity B
-    __publicField$h(this, "alterEntityMinimumTypes", [
+    this.alterEntityMinimumTypes = [
       ConstraintType.topToTopOf,
       ConstraintType.bottomToTopOf,
       ConstraintType.startToStartOf,
       ConstraintType.endToStartOf
-    ]);
+    ];
     this.type = type;
     this.alterEntity = alterEntity;
     if (this.verticalTypes.includes(type)) {
@@ -716,29 +1356,18 @@ class LayoutConstraint {
         this.alterEntityMinimum = false;
       }
     }
-  }
-}
-
-var EntityType = /* @__PURE__ */ ((EntityType2) => {
-  EntityType2["Entity"] = "Entity";
-  EntityType2["Scene"] = "Scene";
-  EntityType2["Sprite"] = "Sprite";
-  EntityType2["Label"] = "Label";
-  EntityType2["TextLine"] = "TextLine";
-  EntityType2["Shape"] = "Shape";
-  EntityType2["Composite"] = "Composite";
-  return EntityType2;
-})(EntityType || {});
+  }
+}
 
 class Uuid {
   static generate() {
     try {
       return crypto.randomUUID();
-    } catch (e) {
+    } catch {
       let randomValue;
       try {
         randomValue = () => crypto.getRandomValues(new Uint8Array(1))[0];
-      } catch (e2) {
+      } catch {
         randomValue = () => Math.floor(Math.random() * 256);
       }
       return (1e7.toString() + -1e3 + -4e3 + -8e3 + -1e11).replace(
@@ -772,31 +1401,25 @@ const EventType = {
   FrameDidSimulatePhysics: "FrameDidSimulatePhysics"
 };
 
-var __defProp$g = Object.defineProperty;
-var __defNormalProp$g = (obj, key, value) => key in obj ? __defProp$g(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$g = (obj, key, value) => {
-  __defNormalProp$g(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 function handleDrawableOptions(drawable, options) {
   if (options.anchorPoint) {
     drawable.anchorPoint = options.anchorPoint;
   }
-  if (options.zPosition) {
+  if (options.zPosition !== void 0) {
     drawable.zPosition = options.zPosition;
   }
 }
 function handleTextOptions(text, options) {
-  if (options.text) {
+  if (options.text !== void 0) {
     text.text = options.text;
   }
-  if (options.fontName) {
+  if (options.fontName !== void 0) {
     text.fontName = options.fontName;
   }
   if (options.fontColor) {
     text.fontColor = options.fontColor;
   }
-  if (options.fontSize) {
+  if (options.fontSize !== void 0) {
     text.fontSize = options.fontSize;
   }
 }
@@ -813,60 +1436,59 @@ function handleInterfaceOptions(entity, options) {
 }
 class Entity {
   constructor(options = {}) {
-    __publicField$g(this, "type", EntityType.Entity);
-    __publicField$g(this, "isDrawable", false);
-    __publicField$g(this, "isShape", false);
-    __publicField$g(this, "isText", false);
-    // Entity Options
-    __publicField$g(this, "name");
-    __publicField$g(this, "position", { x: 0, y: 0 });
+    this.type = EntityType.Entity;
+    this.isDrawable = false;
+    this.isShape = false;
+    this.isText = false;
+    this.position = { x: 0, y: 0 };
     // position of the entity in the parent coordinate system
-    __publicField$g(this, "scale", 1);
-    __publicField$g(this, "isUserInteractionEnabled", false);
-    __publicField$g(this, "draggable", false);
-    __publicField$g(this, "hidden", false);
-    __publicField$g(this, "layout", {});
-    __publicField$g(this, "_game");
-    __publicField$g(this, "parent");
-    __publicField$g(this, "children", new Array());
-    __publicField$g(this, "absolutePosition", { x: 0, y: 0 });
+    this.scale = 1;
+    this.alpha = 1;
+    this.zRotation = 0;
+    this.isUserInteractionEnabled = false;
+    this.draggable = false;
+    this.hidden = false;
+    this.layout = {};
+    this.children = new Array();
+    this.absolutePosition = { x: 0, y: 0 };
     // position within the root coordinate system
-    __publicField$g(this, "size", { width: 0, height: 0 });
-    __publicField$g(this, "absoluteScale", 1);
-    __publicField$g(this, "actions", new Array());
-    __publicField$g(this, "queuedAction");
-    __publicField$g(this, "originalActions", new Array());
-    __publicField$g(this, "eventListeners", new Array());
-    __publicField$g(this, "uuid", Uuid.generate());
-    __publicField$g(this, "needsInitialization", true);
+    this.size = { width: 0, height: 0 };
+    this.absoluteScale = 1;
+    this.absoluteAlpha = 1;
+    this.absoluteAlphaChange = 0;
+    this.actions = new Array();
+    this.originalActions = new Array();
+    this.eventListeners = new Array();
+    this.uuid = Uuid.generate();
+    this.needsInitialization = true;
     // library users might put anything in userData property
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    __publicField$g(this, "userData", {});
-    __publicField$g(this, "loopMessages", /* @__PURE__ */ new Set());
+    this.userData = {};
+    this.loopMessages = /* @__PURE__ */ new Set();
     /** Is the entity in a pressed state? E.g., did the user put the pointer
      * down on the entity and not yet release it? */
-    __publicField$g(this, "pressed", false);
-    __publicField$g(this, "withinHitArea", false);
+    this.pressed = false;
+    this.withinHitArea = false;
     /** Is the entity in a pressed state AND is the pointer within the entity's
      * hit area? For example, a user may put the pointer down on the entity, but
      * then move the pointer, while still down, beyond the entity's hit area. In
      * this case, pressed = true, but pressedAndWithinHitArea = false. */
-    __publicField$g(this, "pressedAndWithinHitArea", false);
+    this.pressedAndWithinHitArea = false;
     /** When the entity initially enters the pressed state, what is the pointer
      * offset? (offset from the canvas's origin to the pointer position). We
      * save this because it will be needed if this press then led to a drag. */
-    __publicField$g(this, "pressedInitialPointerOffset", { x: NaN, y: NaN });
+    this.pressedInitialPointerOffset = { x: NaN, y: NaN };
     /** What was the previous pointer offset when the entity was in a dragging
      * state? */
-    __publicField$g(this, "draggingLastPointerOffset", { x: NaN, y: NaN });
+    this.draggingLastPointerOffset = { x: NaN, y: NaN };
     /** Is the entity in a dragging state? */
-    __publicField$g(this, "dragging", false);
+    this.dragging = false;
     /**
      * Overrides toString() and returns a human-friendly description of the entity.
      *
      * @remarks Inspiration from https://stackoverflow.com/a/35361695
      */
-    __publicField$g(this, "toString", () => {
+    this.toString = () => {
       let type = this.type.toString();
       if (this.type == EntityType.Composite) {
         type = this.compositeType;
@@ -876,28 +1498,34 @@ class Entity {
       } else {
         return `${type} (${this.uuid})`;
       }
-    });
+    };
     if (options.name === void 0) {
       this.name = this.uuid;
     } else {
       this.name = options.name;
     }
-    if (options.position) {
+    if (options.position !== void 0) {
       this.position = options.position;
     }
-    if (options.scale) {
+    if (options.scale !== void 0) {
       this.scale = options.scale;
     }
-    if (options.isUserInteractionEnabled) {
+    if (options.alpha !== void 0) {
+      this.alpha = options.alpha;
+    }
+    if (options.zRotation !== void 0) {
+      this.zRotation = options.zRotation;
+    }
+    if (options.isUserInteractionEnabled !== void 0) {
       this.isUserInteractionEnabled = options.isUserInteractionEnabled;
     }
-    if (options.draggable) {
+    if (options.draggable !== void 0) {
       this.draggable = options.draggable;
     }
-    if (options.hidden) {
+    if (options.hidden !== void 0) {
       this.hidden = options.hidden;
     }
-    if (options.layout) {
+    if (options.layout !== void 0) {
       this.layout = options.layout;
     }
   }
@@ -928,7 +1556,6 @@ class Entity {
    * @returns true if entity has been added
    */
   isPartOfGame() {
-    var _a;
     if (this.type === EntityType.Scene && this._game === void 0) {
       return false;
     }
@@ -944,7 +1571,7 @@ class Entity {
         return findParentScene(entity.parent);
       }
     };
-    return ((_a = findParentScene(this)) == null ? void 0 : _a._game) !== void 0;
+    return findParentScene(this)?._game !== void 0;
   }
   /**
    * Adds a child to this parent entity. Throws exception if the child's name
@@ -977,10 +1604,7 @@ class Entity {
     } else {
       const descendants = this.descendants;
       if (descendants.includes(child)) {
-        otherParents = descendants.filter((d) => d.children.includes(child)).map((d) => {
-          var _a;
-          return (_a = d.parent) != null ? _a : void 0;
-        });
+        otherParents = descendants.filter((d) => d.children.includes(child)).map((d) => d.parent ?? void 0);
       }
     }
     if (otherParents.length === 0) {
@@ -995,7 +1619,7 @@ class Entity {
       );
     }
     throw new Error(
-      `Cannot add child entity ${child.toString()} to parent entity ${this.toString()}. This child already exists on other parent entity: ${firstOtherParent == null ? void 0 : firstOtherParent.toString()}}. Remove the child from the other parent first.`
+      `Cannot add child entity ${child.toString()} to parent entity ${this.toString()}. This child already exists on other parent entity: ${firstOtherParent?.toString()}}. Remove the child from the other parent first.`
     );
   }
   /**
@@ -1302,7 +1926,7 @@ class Entity {
       entityUuid: this.uuid,
       callback
     };
-    if (callbackOptions == null ? void 0 : callbackOptions.replaceExisting) {
+    if (callbackOptions?.replaceExisting) {
       this.eventListeners = this.eventListeners.filter(
         (listener) => !(listener.entityUuid === eventListener.entityUuid && listener.type === eventListener.type)
       );
@@ -1383,30 +2007,47 @@ class Entity {
     }
     return x;
   }
+  /**
+   * Calculates the absolute alpha of the entity, taking into account the
+   * alpha of all ancestor parent entities.
+   *
+   * @remarks Alpha has multiplicative inheritance from all ancestors.
+   *
+   * @param alpha - Opacity of the entity
+   * @param ancestors - Array of ancestor parent entities
+   * @returns
+   */
+  calculateAbsoluteAlpha(alpha, ancestors) {
+    const inheritedAlpha = ancestors.reduce((acc, ancestor) => {
+      return acc * ancestor.alpha;
+    }, 1);
+    return alpha * inheritedAlpha;
+  }
   update() {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
     if (this.needsInitialization) {
       this.initialize();
       this.needsInitialization = false;
     }
+    this.absoluteAlphaChange = this.calculateAbsoluteAlpha(this.alpha, this.ancestors) - this.absoluteAlpha;
+    this.absoluteAlpha += this.absoluteAlphaChange;
     if (this.parent === void 0) {
       this.absolutePosition.x = this.position.x * this.scale;
       this.absolutePosition.y = this.position.y * this.scale;
       this.absoluteScale = this.scale;
     } else {
       this.absoluteScale = this.parent.absoluteScale * this.scale;
-      if (((_a = this.layout) == null ? void 0 : _a.constraints) === void 0) {
+      if (this.layout?.constraints === void 0) {
         this.absolutePosition.x = this.parent.absolutePosition.x + this.position.x * this.parent.absoluteScale;
         this.absolutePosition.y = this.parent.absolutePosition.y + this.position.y * this.parent.absoluteScale;
       } else {
-        const horizontalBias = (_d = (_c = (_b = this.layout) == null ? void 0 : _b.constraints) == null ? void 0 : _c.horizontalBias) != null ? _d : 0.5;
-        const verticalBias = (_g = (_f = (_e = this.layout) == null ? void 0 : _e.constraints) == null ? void 0 : _f.verticalBias) != null ? _g : 0.5;
-        const marginTop = (_i = (_h = this.layout) == null ? void 0 : _h.marginTop) != null ? _i : 0;
-        const marginBottom = (_k = (_j = this.layout) == null ? void 0 : _j.marginBottom) != null ? _k : 0;
-        const marginStart = (_m = (_l = this.layout) == null ? void 0 : _l.marginStart) != null ? _m : 0;
-        const marginEnd = (_o = (_n = this.layout) == null ? void 0 : _n.marginEnd) != null ? _o : 0;
+        const horizontalBias = this.layout?.constraints?.horizontalBias ?? 0.5;
+        const verticalBias = this.layout?.constraints?.verticalBias ?? 0.5;
+        const marginTop = this.layout?.marginTop ?? 0;
+        const marginBottom = this.layout?.marginBottom ?? 0;
+        const marginStart = this.layout?.marginStart ?? 0;
+        const marginEnd = this.layout?.marginEnd ?? 0;
         const layoutConstraints = this.parseLayoutConstraints(
-          (_p = this.layout) == null ? void 0 : _p.constraints,
+          this.layout?.constraints,
           //this.parentScene.game.entities
           this.parentSceneAsEntity.descendants
         );
@@ -1504,10 +2145,9 @@ class Entity {
     }
     const adjList = /* @__PURE__ */ new Map();
     this.children.forEach((child) => {
-      var _a2;
       adjList.set(
         child.uuid,
-        getSiblingConstraintUuids(this, (_a2 = child.layout) == null ? void 0 : _a2.constraints)
+        getSiblingConstraintUuids(this, child.layout?.constraints)
       );
     });
     const sortedUuids = this.findTopologicalSort(adjList);
@@ -1643,7 +2283,6 @@ class Entity {
    * @param adjList Adjacency List that represent a graph with vertices and edges
    */
   findTopologicalSort(adjList) {
-    var _a;
     const tSort = [];
     const inDegree = /* @__PURE__ */ new Map();
     adjList.forEach((edges, vertex) => {
@@ -1671,7 +2310,7 @@ class Entity {
       }
       tSort.push(current);
       if (adjList.has(current)) {
-        (_a = adjList.get(current)) == null ? void 0 : _a.forEach((edge) => {
+        adjList.get(current)?.forEach((edge) => {
           if (inDegree.has(edge) && inDegree.get(edge) > 0) {
             const newDegree = inDegree.get(edge) - 1;
             inDegree.set(edge, newDegree);
@@ -1686,12 +2325,6 @@ class Entity {
   }
 }
 
-var __defProp$f = Object.defineProperty;
-var __defNormalProp$f = (obj, key, value) => key in obj ? __defProp$f(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$f = (obj, key, value) => {
-  __defNormalProp$f(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Composite extends Entity {
   /**
    * Base Drawable object for creating custom entities ("composites") composed of primitive entities.
@@ -1700,12 +2333,12 @@ class Composite extends Entity {
    */
   constructor(options = {}) {
     super(options);
-    __publicField$f(this, "type", EntityType.Composite);
-    __publicField$f(this, "compositeType", "<compositeType>");
-    __publicField$f(this, "isDrawable", true);
+    this.type = EntityType.Composite;
+    this.compositeType = "<compositeType>";
+    this.isDrawable = true;
     // Drawable options
-    __publicField$f(this, "anchorPoint", { x: 0.5, y: 0.5 });
-    __publicField$f(this, "zPosition", 0);
+    this.anchorPoint = { x: 0.5, y: 0.5 };
+    this.zPosition = 0;
     handleInterfaceOptions(this, options);
   }
   // eslint-disable-next-line @typescript-eslint/no-empty-function
@@ -1722,194 +2355,6 @@ class Composite extends Entity {
   }
 }
 
-var __defProp$e = Object.defineProperty;
-var __defNormalProp$e = (obj, key, value) => key in obj ? __defProp$e(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$e = (obj, key, value) => {
-  __defNormalProp$e(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class WebColors {
-}
-__publicField$e(WebColors, "Transparent", [0, 0, 0, 0]);
-__publicField$e(WebColors, "MediumVioletRed", [199, 21, 133, 1]);
-__publicField$e(WebColors, "DeepPink", [255, 20, 147, 1]);
-__publicField$e(WebColors, "PaleVioletRed", [219, 112, 147, 1]);
-__publicField$e(WebColors, "HotPink", [255, 105, 180, 1]);
-__publicField$e(WebColors, "LightPink", [255, 182, 193, 1]);
-__publicField$e(WebColors, "Pink", [255, 192, 203, 1]);
-__publicField$e(WebColors, "DarkRed", [139, 0, 0, 1]);
-__publicField$e(WebColors, "Red", [255, 0, 0, 1]);
-__publicField$e(WebColors, "Firebrick", [178, 34, 34, 1]);
-__publicField$e(WebColors, "Crimson", [220, 20, 60, 1]);
-__publicField$e(WebColors, "IndianRed", [205, 92, 92, 1]);
-__publicField$e(WebColors, "LightCoral", [240, 128, 128, 1]);
-__publicField$e(WebColors, "Salmon", [250, 128, 114, 1]);
-__publicField$e(WebColors, "DarkSalmon", [233, 150, 122, 1]);
-__publicField$e(WebColors, "LightSalmon", [255, 160, 122, 1]);
-__publicField$e(WebColors, "OrangeRed", [255, 69, 0, 1]);
-__publicField$e(WebColors, "Tomato", [255, 99, 71, 1]);
-__publicField$e(WebColors, "DarkOrange", [255, 140, 0, 1]);
-__publicField$e(WebColors, "Coral", [255, 127, 80, 1]);
-__publicField$e(WebColors, "Orange", [255, 165, 0, 1]);
-__publicField$e(WebColors, "DarkKhaki", [189, 183, 107, 1]);
-__publicField$e(WebColors, "Gold", [255, 215, 0, 1]);
-__publicField$e(WebColors, "Khaki", [240, 230, 140, 1]);
-__publicField$e(WebColors, "PeachPuff", [255, 218, 185, 1]);
-__publicField$e(WebColors, "Yellow", [255, 255, 0, 1]);
-__publicField$e(WebColors, "PaleGoldenrod", [238, 232, 170, 1]);
-__publicField$e(WebColors, "Moccasin", [255, 228, 181, 1]);
-__publicField$e(WebColors, "PapayaWhip", [255, 239, 213, 1]);
-__publicField$e(WebColors, "LightGoldenrodYellow", [250, 250, 210, 1]);
-__publicField$e(WebColors, "LemonChiffon", [255, 250, 205, 1]);
-__publicField$e(WebColors, "LightYellow", [255, 255, 224, 1]);
-__publicField$e(WebColors, "Maroon", [128, 0, 0, 1]);
-__publicField$e(WebColors, "Brown", [165, 42, 42, 1]);
-__publicField$e(WebColors, "SaddleBrown", [139, 69, 19, 1]);
-__publicField$e(WebColors, "Sienna", [160, 82, 45, 1]);
-__publicField$e(WebColors, "Chocolate", [210, 105, 30, 1]);
-__publicField$e(WebColors, "DarkGoldenrod", [184, 134, 11, 1]);
-__publicField$e(WebColors, "Peru", [205, 133, 63, 1]);
-__publicField$e(WebColors, "RosyBrown", [188, 143, 143, 1]);
-__publicField$e(WebColors, "Goldenrod", [218, 165, 32, 1]);
-__publicField$e(WebColors, "SandyBrown", [244, 164, 96, 1]);
-__publicField$e(WebColors, "Tan", [210, 180, 140, 1]);
-__publicField$e(WebColors, "Burlywood", [222, 184, 135, 1]);
-__publicField$e(WebColors, "Wheat", [245, 222, 179, 1]);
-__publicField$e(WebColors, "NavajoWhite", [255, 222, 173, 1]);
-__publicField$e(WebColors, "Bisque", [255, 228, 196, 1]);
-__publicField$e(WebColors, "BlanchedAlmond", [255, 235, 205, 1]);
-__publicField$e(WebColors, "Cornsilk", [255, 248, 220, 1]);
-__publicField$e(WebColors, "DarkGreen", [0, 100, 0, 1]);
-__publicField$e(WebColors, "Green", [0, 128, 0, 1]);
-__publicField$e(WebColors, "DarkOliveGreen", [85, 107, 47, 1]);
-__publicField$e(WebColors, "ForestGreen", [34, 139, 34, 1]);
-__publicField$e(WebColors, "SeaGreen", [46, 139, 87, 1]);
-__publicField$e(WebColors, "Olive", [128, 128, 0, 1]);
-__publicField$e(WebColors, "OliveDrab", [107, 142, 35, 1]);
-__publicField$e(WebColors, "MediumSeaGreen", [60, 179, 113, 1]);
-__publicField$e(WebColors, "LimeGreen", [50, 205, 50, 1]);
-__publicField$e(WebColors, "Lime", [0, 255, 0, 1]);
-__publicField$e(WebColors, "SpringGreen", [0, 255, 127, 1]);
-__publicField$e(WebColors, "MediumSpringGreen", [0, 250, 154, 1]);
-__publicField$e(WebColors, "DarkSeaGreen", [143, 188, 143, 1]);
-__publicField$e(WebColors, "MediumAquamarine", [102, 205, 170, 1]);
-__publicField$e(WebColors, "YellowGreen", [154, 205, 50, 1]);
-__publicField$e(WebColors, "LawnGreen", [124, 252, 0, 1]);
-__publicField$e(WebColors, "Chartreuse", [127, 255, 0, 1]);
-__publicField$e(WebColors, "LightGreen", [144, 238, 144, 1]);
-__publicField$e(WebColors, "GreenYellow", [173, 255, 47, 1]);
-__publicField$e(WebColors, "PaleGreen", [152, 251, 152, 1]);
-__publicField$e(WebColors, "Teal", [0, 128, 128, 1]);
-__publicField$e(WebColors, "DarkCyan", [0, 139, 139, 1]);
-__publicField$e(WebColors, "LightSeaGreen", [32, 178, 170, 1]);
-__publicField$e(WebColors, "CadetBlue", [95, 158, 160, 1]);
-__publicField$e(WebColors, "DarkTurquoise", [0, 206, 209, 1]);
-__publicField$e(WebColors, "MediumTurquoise", [72, 209, 204, 1]);
-__publicField$e(WebColors, "Turquoise", [64, 224, 208, 1]);
-__publicField$e(WebColors, "Aqua", [0, 255, 255, 1]);
-__publicField$e(WebColors, "Cyan", [0, 255, 255, 1]);
-__publicField$e(WebColors, "Aquamarine", [127, 255, 212, 1]);
-__publicField$e(WebColors, "PaleTurquoise", [175, 238, 238, 1]);
-__publicField$e(WebColors, "LightCyan", [224, 255, 255, 1]);
-__publicField$e(WebColors, "Navy", [0, 0, 128, 1]);
-__publicField$e(WebColors, "DarkBlue", [0, 0, 139, 1]);
-__publicField$e(WebColors, "MediumBlue", [0, 0, 205, 1]);
-__publicField$e(WebColors, "Blue", [0, 0, 255, 1]);
-__publicField$e(WebColors, "MidnightBlue", [25, 25, 112, 1]);
-__publicField$e(WebColors, "RoyalBlue", [65, 105, 225, 1]);
-__publicField$e(WebColors, "SteelBlue", [70, 130, 180, 1]);
-__publicField$e(WebColors, "DodgerBlue", [30, 144, 255, 1]);
-__publicField$e(WebColors, "DeepSkyBlue", [0, 191, 255, 1]);
-__publicField$e(WebColors, "CornflowerBlue", [100, 149, 237, 1]);
-__publicField$e(WebColors, "SkyBlue", [135, 206, 235, 1]);
-__publicField$e(WebColors, "LightSkyBlue", [135, 206, 250, 1]);
-__publicField$e(WebColors, "LightSteelBlue", [176, 196, 222, 1]);
-__publicField$e(WebColors, "LightBlue", [173, 216, 230, 1]);
-__publicField$e(WebColors, "PowderBlue", [176, 224, 230, 1]);
-__publicField$e(WebColors, "Indigo", [75, 0, 130, 1]);
-__publicField$e(WebColors, "Purple", [128, 0, 128, 1]);
-__publicField$e(WebColors, "DarkMagenta", [139, 0, 139, 1]);
-__publicField$e(WebColors, "DarkViolet", [148, 0, 211, 1]);
-__publicField$e(WebColors, "DarkSlateBlue", [72, 61, 139, 1]);
-__publicField$e(WebColors, "BlueViolet", [138, 43, 226, 1]);
-__publicField$e(WebColors, "DarkOrchid", [153, 50, 204, 1]);
-__publicField$e(WebColors, "Fuchsia", [255, 0, 255, 1]);
-__publicField$e(WebColors, "Magenta", [255, 0, 255, 1]);
-__publicField$e(WebColors, "SlateBlue", [106, 90, 205, 1]);
-__publicField$e(WebColors, "MediumSlateBlue", [123, 104, 238, 1]);
-__publicField$e(WebColors, "MediumOrchid", [186, 85, 211, 1]);
-__publicField$e(WebColors, "MediumPurple", [147, 112, 219, 1]);
-__publicField$e(WebColors, "Orchid", [218, 112, 214, 1]);
-__publicField$e(WebColors, "Violet", [238, 130, 238, 1]);
-__publicField$e(WebColors, "Plum", [221, 160, 221, 1]);
-__publicField$e(WebColors, "Thistle", [216, 191, 216, 1]);
-__publicField$e(WebColors, "Lavender", [230, 230, 250, 1]);
-__publicField$e(WebColors, "MistyRose", [255, 228, 225, 1]);
-__publicField$e(WebColors, "AntiqueWhite", [250, 235, 215, 1]);
-__publicField$e(WebColors, "Linen", [250, 240, 230, 1]);
-__publicField$e(WebColors, "Beige", [245, 245, 220, 1]);
-__publicField$e(WebColors, "WhiteSmoke", [245, 245, 245, 1]);
-__publicField$e(WebColors, "LavenderBlush", [255, 240, 245, 1]);
-__publicField$e(WebColors, "OldLace", [253, 245, 230, 1]);
-__publicField$e(WebColors, "AliceBlue", [240, 248, 255, 1]);
-__publicField$e(WebColors, "Seashell", [255, 245, 238, 1]);
-__publicField$e(WebColors, "GhostWhite", [248, 248, 255, 1]);
-__publicField$e(WebColors, "Honeydew", [240, 255, 240, 1]);
-__publicField$e(WebColors, "FloralWhite", [255, 250, 240, 1]);
-__publicField$e(WebColors, "Azure", [240, 255, 255, 1]);
-__publicField$e(WebColors, "MintCream", [245, 255, 250, 1]);
-__publicField$e(WebColors, "Snow", [255, 250, 250, 1]);
-__publicField$e(WebColors, "Ivory", [255, 255, 240, 1]);
-__publicField$e(WebColors, "White", [255, 255, 255, 1]);
-__publicField$e(WebColors, "Black", [0, 0, 0, 1]);
-__publicField$e(WebColors, "DarkSlateGray", [47, 79, 79, 1]);
-__publicField$e(WebColors, "DimGray", [105, 105, 105, 1]);
-__publicField$e(WebColors, "SlateGray", [112, 128, 144, 1]);
-__publicField$e(WebColors, "Gray", [128, 128, 128, 1]);
-__publicField$e(WebColors, "LightSlateGray", [119, 136, 153, 1]);
-__publicField$e(WebColors, "DarkGray", [169, 169, 169, 1]);
-__publicField$e(WebColors, "Silver", [192, 192, 192, 1]);
-__publicField$e(WebColors, "LightGray", [211, 211, 211, 1]);
-__publicField$e(WebColors, "Gainsboro", [220, 220, 220, 1]);
-__publicField$e(WebColors, "RebeccaPurple", [102, 51, 153, 1]);
-
-var __defProp$d = Object.defineProperty;
-var __defNormalProp$d = (obj, key, value) => key in obj ? __defProp$d(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$d = (obj, key, value) => {
-  __defNormalProp$d(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class Constants {
-}
-/** Size of the font showing frames per second */
-__publicField$d(Constants, "FPS_DISPLAY_TEXT_FONT_SIZE", 12);
-/** Color of the font showing frames per second */
-__publicField$d(Constants, "FPS_DISPLAY_TEXT_COLOR", [0, 0, 0, 0.5]);
-/** Frequency, in milliseconds, at which to update frames per second metric shown on the screen */
-__publicField$d(Constants, "FPS_DISPLAY_UPDATE_INTERVAL", 1e3);
-/** Maximum number of activity metrics to log. */
-__publicField$d(Constants, "MAXIMUM_RECORDED_ACTIVITY_METRICS", 32);
-/** The frames per second will be logged in game metrics if the FPS is lower than this value */
-__publicField$d(Constants, "FPS_METRIC_REPORT_THRESHOLD", 59);
-/** Scene color, if none is specified. */
-__publicField$d(Constants, "DEFAULT_SCENE_BACKGROUND_COLOR", WebColors.White);
-/** Shape fill color, if none is specified. */
-__publicField$d(Constants, "DEFAULT_SHAPE_FILL_COLOR", WebColors.Red);
-/** Color of paths in a shape, if none is specified. */
-__publicField$d(Constants, "DEFAULT_PATH_STROKE_COLOR", WebColors.Red);
-/** Line width of paths in a shape, if none is specified. */
-__publicField$d(Constants, "DEFAULT_PATH_LINE_WIDTH", 2);
-/** Color of text in Label and TextLine, if none is specified. */
-__publicField$d(Constants, "DEFAULT_FONT_COLOR", WebColors.Black);
-/** Font size in Label and TextLine, if none is specified. */
-__publicField$d(Constants, "DEFAULT_FONT_SIZE", 16);
-__publicField$d(Constants, "LIMITED_FPS_RATE", 5);
-__publicField$d(Constants, "FREE_ENTITIES_SCENE_NAME", "__freeEntitiesScene");
-__publicField$d(Constants, "OUTGOING_SCENE_NAME", "__outgoingScene");
-__publicField$d(Constants, "OUTGOING_SCENE_SPRITE_NAME", "__outgoingSceneSprite");
-__publicField$d(Constants, "OUTGOING_SCENE_IMAGE_NAME", "__outgoingSceneSnapshot");
-__publicField$d(Constants, "SESSION_INITIALIZATION_POLLING_INTERVAL_MS", 50);
-
 var Dimensions = /* @__PURE__ */ ((Dimensions2) => {
   Dimensions2[Dimensions2["MatchConstraint"] = 0] = "MatchConstraint";
   return Dimensions2;
@@ -2154,22 +2599,12 @@ function property(e) {
   return meta;
 }
 
-var __defProp$c = Object.defineProperty;
-var __defNormalProp$c = (obj, key, value) => key in obj ? __defProp$c(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$c = (obj, key, value) => {
-  __defNormalProp$c(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class GameTypefaces {
 }
 class FontManager {
   constructor(session) {
-    __publicField$c(this, "canvasKit");
-    __publicField$c(this, "fontMgr");
-    __publicField$c(this, "gameTypefaces", new GameTypefaces());
-    __publicField$c(this, "fontData", new Array());
-    __publicField$c(this, "session");
-    __publicField$c(this, "games");
+    this.gameTypefaces = new GameTypefaces();
+    this.fontData = new Array();
     this.session = session;
   }
   /**
@@ -2203,20 +2638,17 @@ class FontManager {
   fetchFonts(games) {
     this.games = games;
     const fontsToFetch = games.flatMap(
-      (game) => {
-        var _a;
-        return (
-          // no fonts in game if game.options.fonts is undefined
-          (_a = game.options.fonts) == null ? void 0 : _a.map((font, i) => {
-            return {
-              gameUuid: game.uuid,
-              fontUrl: font.url,
-              fontName: font.fontName,
-              isDefault: i === 0
-            };
-          })
-        );
-      }
+      (game) => (
+        // no fonts in game if game.options.fonts is undefined
+        game.options.fonts?.map((font, i) => {
+          return {
+            gameUuid: game.uuid,
+            fontUrl: font.url,
+            fontName: font.fontName,
+            isDefault: i === 0
+          };
+        })
+      )
     ).filter((f) => f !== void 0);
     if (fontsToFetch.length === 0) {
       return Promise.all([Promise.resolve()]);
@@ -2249,23 +2681,21 @@ class FontManager {
    * to our engine by creating canvaskit Typefaces.
    */
   loadAllGamesFontData() {
-    var _a;
     if (this.fontData.length === 0) {
       return;
     }
     if (!this.canvasKit) {
       throw new Error("canvasKit undefined");
     }
-    this.fontMgr = (_a = this.canvasKit.FontMgr.FromData(
+    this.fontMgr = this.canvasKit.FontMgr.FromData(
       ...this.fontData.map((f) => f.fontArrayBuffer)
-    )) != null ? _a : void 0;
+    ) ?? void 0;
     if (!this.fontMgr) {
       throw new Error("error creating FontMgr while loading fonts");
     }
     this.fontData.forEach((font) => {
-      var _a2, _b, _c;
       const result = ttfInfo(new DataView(font.fontArrayBuffer));
-      const fontFamilyUtf16Be = (_a2 = result.meta.property.filter((p) => p.name === "font-family").find(Boolean)) == null ? void 0 : _a2.text;
+      const fontFamilyUtf16Be = result.meta.property.filter((p) => p.name === "font-family").find(Boolean)?.text;
       if (fontFamilyUtf16Be === void 0) {
         throw new Error(
           `error loading fonts. could not get font-family name from font at ${font.fontUrl}`
@@ -2285,7 +2715,7 @@ class FontManager {
       if (!typeface) {
         throw new Error("cannot make typeface from font array buffer");
       }
-      const gameId = (_c = (_b = this.games) == null ? void 0 : _b.find((g) => g.uuid === font.gameUuid)) == null ? void 0 : _c.id;
+      const gameId = this.games?.find((g) => g.uuid === font.gameUuid)?.id;
       console.log(
         `\u26AA typeface ${font.fontName} ${font.isDefault ? "(default) " : ""}created from font-family ${fontFamily} for game ${gameId}`
       );
@@ -2301,29 +2731,6 @@ class FontManager {
   }
 }
 
-var __defProp$b = Object.defineProperty;
-var __defProps$5 = Object.defineProperties;
-var __getOwnPropDescs$5 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$7 = Object.getOwnPropertySymbols;
-var __hasOwnProp$7 = Object.prototype.hasOwnProperty;
-var __propIsEnum$7 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$b = (obj, key, value) => key in obj ? __defProp$b(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$7 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$7.call(b, prop))
-      __defNormalProp$b(a, prop, b[prop]);
-  if (__getOwnPropSymbols$7)
-    for (var prop of __getOwnPropSymbols$7(b)) {
-      if (__propIsEnum$7.call(b, prop))
-        __defNormalProp$b(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$5 = (a, b) => __defProps$5(a, __getOwnPropDescs$5(b));
-var __publicField$b = (obj, key, value) => {
-  __defNormalProp$b(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Sprite extends Entity {
   /**
    * Visual image displayed on the screen.
@@ -2334,17 +2741,15 @@ class Sprite extends Entity {
    */
   constructor(options = {}) {
     super(options);
-    __publicField$b(this, "type", EntityType.Sprite);
-    __publicField$b(this, "isDrawable", true);
+    this.type = EntityType.Sprite;
+    this.isDrawable = true;
     // Drawable options
-    __publicField$b(this, "anchorPoint", { x: 0.5, y: 0.5 });
-    __publicField$b(this, "zPosition", 0);
+    this.anchorPoint = { x: 0.5, y: 0.5 };
+    this.zPosition = 0;
     // Sprite options
-    __publicField$b(this, "_imageName", "");
-    // public getter/setter is below
-    __publicField$b(this, "loadedImage");
+    this._imageName = "";
     handleInterfaceOptions(this, options);
-    if (options.imageName) {
+    if (options.imageName !== void 0) {
       this.imageName = options.imageName;
     }
   }
@@ -2363,11 +2768,13 @@ class Sprite extends Entity {
     }
     this.size.width = this.loadedImage.width;
     this.size.height = this.loadedImage.height;
+    if (!this._paint) {
+      this.paint = new this.canvasKit.Paint();
+    }
     this.needsInitialization = false;
   }
   dispose() {
-    var _a;
-    CanvasKitHelpers.Dispose([(_a = this.loadedImage) == null ? void 0 : _a.image]);
+    CanvasKitHelpers.Dispose([this.loadedImage?.image, this._paint]);
   }
   set imageName(imageName) {
     this._imageName = imageName;
@@ -2376,6 +2783,17 @@ class Sprite extends Entity {
   get imageName() {
     return this._imageName;
   }
+  set paint(paint) {
+    this._paint = paint;
+  }
+  get paint() {
+    if (!this._paint) {
+      throw new Error(
+        `in paint getter: Sprite entity ${this.toString()} paint is undefined.`
+      );
+    }
+    return this._paint;
+  }
   /**
    * Duplicates an entity using deep copy.
    *
@@ -2387,10 +2805,12 @@ class Sprite extends Entity {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Sprite(__spreadProps$5(__spreadValues$7(__spreadValues$7({}, this.getEntityOptions()), this.getDrawableOptions()), {
+    const dest = new Sprite({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
       imageName: this.imageName,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -2409,9 +2829,13 @@ class Sprite extends Entity {
         canvas.save();
         const drawScale = Globals.canvasScale / this.absoluteScale;
         canvas.scale(1 / drawScale, 1 / drawScale);
+        M2c2KitHelpers.rotateCanvasForDrawableEntity(canvas, this);
         const x = (this.absolutePosition.x - this.size.width * this.anchorPoint.x * this.absoluteScale) * drawScale;
         const y = (this.absolutePosition.y - this.size.height * this.anchorPoint.y * this.absoluteScale) * drawScale;
-        canvas.drawImage(this.loadedImage.image, x, y);
+        if (this.absoluteAlphaChange !== 0) {
+          this.paint.setAlphaf(this.absoluteAlpha);
+        }
+        canvas.drawImage(this.loadedImage.image, x, y, this.paint);
         canvas.restore();
       }
       super.drawChildren(canvas);
@@ -2442,29 +2866,6 @@ class LoadedImage {
   }
 }
 
-var __defProp$a = Object.defineProperty;
-var __defProps$4 = Object.defineProperties;
-var __getOwnPropDescs$4 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$6 = Object.getOwnPropertySymbols;
-var __hasOwnProp$6 = Object.prototype.hasOwnProperty;
-var __propIsEnum$6 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$a = (obj, key, value) => key in obj ? __defProp$a(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$6 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$6.call(b, prop))
-      __defNormalProp$a(a, prop, b[prop]);
-  if (__getOwnPropSymbols$6)
-    for (var prop of __getOwnPropSymbols$6(b)) {
-      if (__propIsEnum$6.call(b, prop))
-        __defNormalProp$a(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$4 = (a, b) => __defProps$4(a, __getOwnPropDescs$4(b));
-var __publicField$a = (obj, key, value) => {
-  __defNormalProp$a(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Scene extends Entity {
   /**
    * Top-level entity that holds all other entities, such as sprites, rectangles, or labels, that will be displayed on the screen
@@ -2475,18 +2876,15 @@ class Scene extends Entity {
    */
   constructor(options = {}) {
     super(options);
-    __publicField$a(this, "type", EntityType.Scene);
-    __publicField$a(this, "isDrawable", true);
+    this.type = EntityType.Scene;
+    this.isDrawable = true;
     // Drawable options
-    __publicField$a(this, "anchorPoint", { x: 0, y: 0 });
-    __publicField$a(this, "zPosition", 0);
+    this.anchorPoint = { x: 0, y: 0 };
+    this.zPosition = 0;
     // Scene options
-    __publicField$a(this, "_backgroundColor", Constants.DEFAULT_SCENE_BACKGROUND_COLOR);
-    __publicField$a(this, "_active", false);
-    __publicField$a(this, "_transitioning", false);
-    __publicField$a(this, "_setupCallback");
-    __publicField$a(this, "_appearCallback");
-    __publicField$a(this, "backgroundPaint");
+    this._backgroundColor = Constants.DEFAULT_SCENE_BACKGROUND_COLOR;
+    this._active = false;
+    this._transitioning = false;
     handleInterfaceOptions(this, options);
     if (options.backgroundColor) {
       this.backgroundColor = options.backgroundColor;
@@ -2496,16 +2894,15 @@ class Scene extends Entity {
     this.scale = Globals.rootScale;
     this.size.width = this.game.canvasCssWidth;
     this.size.height = this.game.canvasCssHeight;
-    this.backgroundPaint = new this.canvasKit.Paint();
-    this.backgroundPaint.setColor(
-      this.canvasKit.Color(
-        this.backgroundColor[0],
-        this.backgroundColor[1],
-        this.backgroundColor[2],
-        this.backgroundColor[3]
-      )
+    if (this.backgroundPaint) {
+      this.backgroundPaint.delete();
+    }
+    this.backgroundPaint = CanvasKitHelpers.makePaint(
+      this.canvasKit,
+      this.backgroundColor,
+      this.canvasKit.PaintStyle.Fill,
+      false
     );
-    this.backgroundPaint.setStyle(this.canvasKit.PaintStyle.Fill);
     this.needsInitialization = false;
   }
   dispose() {
@@ -2543,10 +2940,12 @@ class Scene extends Entity {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Scene(__spreadProps$4(__spreadValues$6(__spreadValues$6({}, this.getEntityOptions()), this.getDrawableOptions()), {
+    const dest = new Scene({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
       backgroundColor: this.backgroundColor,
       name: newName
-    }));
+    });
     dest.game = this.game;
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
@@ -2582,13 +2981,20 @@ class Scene extends Entity {
   onAppear(callback) {
     this._appearCallback = callback;
   }
+  update() {
+    super.update();
+  }
   draw(canvas) {
     canvas.save();
     const drawScale = Globals.canvasScale / this.absoluteScale;
     canvas.scale(1 / drawScale, 1 / drawScale);
+    M2c2KitHelpers.rotateCanvasForDrawableEntity(canvas, this);
     if (!this.backgroundPaint) {
       throw new Error(`in Scene ${this}, background paint is undefined.`);
     }
+    if (this.absoluteAlphaChange !== 0) {
+      this.backgroundPaint.setAlphaf(this.absoluteAlpha);
+    }
     canvas.drawRect(
       [
         this.position.x * drawScale * Globals.rootScale,
@@ -2627,12 +3033,6 @@ class Scene extends Entity {
   }
 }
 
-var __defProp$9 = Object.defineProperty;
-var __defNormalProp$9 = (obj, key, value) => key in obj ? __defProp$9(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$9 = (obj, key, value) => {
-  __defNormalProp$9(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Transition {
   /**
    * Creates a scene transition in which the outgoing scene slides out and the incoming scene slides in, as if the incoming scene pushes it.
@@ -2641,11 +3041,10 @@ class Transition {
    * @returns
    */
   static slide(options) {
-    var _a;
     return new SlideTransition(
       options.direction,
       options.duration,
-      (_a = options.easing) != null ? _a : Easings.linear
+      options.easing ?? Easings.linear
     );
   }
   /**
@@ -2658,9 +3057,7 @@ class Transition {
 class NoneTransition extends Transition {
   constructor() {
     super();
-    __publicField$9(this, "type", "None" /* None */);
-    __publicField$9(this, "easing");
-    __publicField$9(this, "duration");
+    this.type = "None" /* None */;
     this.duration = NaN;
     this.easing = Easings.none;
   }
@@ -2668,10 +3065,7 @@ class NoneTransition extends Transition {
 class SlideTransition extends Transition {
   constructor(direction, duration, easing) {
     super();
-    __publicField$9(this, "type", "Slide" /* Slide */);
-    __publicField$9(this, "easing");
-    __publicField$9(this, "duration");
-    __publicField$9(this, "direction");
+    this.type = "Slide" /* Slide */;
     this.direction = direction;
     this.duration = duration;
     this.easing = easing;
@@ -2696,25 +3090,18 @@ class SceneTransition {
   }
 }
 
-var __defProp$8 = Object.defineProperty;
-var __defNormalProp$8 = (obj, key, value) => key in obj ? __defProp$8(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$8 = (obj, key, value) => {
-  __defNormalProp$8(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 const _Timer = class _Timer {
   constructor(name) {
     // startTime is the timestamp of the current active run
-    __publicField$8(this, "startTime", NaN);
-    __publicField$8(this, "stopTime", NaN);
-    __publicField$8(this, "stopped", true);
+    this.startTime = NaN;
+    this.stopTime = NaN;
+    this.stopped = true;
     /**
      * cumulativeElapsed is a cumulative total of elapsed time while the timer
      * was in previous started (running) states, NOT INCLUDING the possibly
      * active run's duration
      */
-    __publicField$8(this, "cumulativeElapsed", NaN);
-    __publicField$8(this, "name");
+    this.cumulativeElapsed = NaN;
     this.name = name;
   }
   /**
@@ -2866,7 +3253,7 @@ const _Timer = class _Timer {
     return this._timers.some((t) => t.name === name);
   }
 };
-__publicField$8(_Timer, "_timers", new Array());
+_Timer._timers = new Array();
 let Timer = _Timer;
 
 const deviceMetadataSchema = {
@@ -2976,39 +3363,16 @@ class WebGlInfo {
   }
 }
 
-var __defProp$7 = Object.defineProperty;
-var __getOwnPropSymbols$5 = Object.getOwnPropertySymbols;
-var __hasOwnProp$5 = Object.prototype.hasOwnProperty;
-var __propIsEnum$5 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$7 = (obj, key, value) => key in obj ? __defProp$7(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$5 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$5.call(b, prop))
-      __defNormalProp$7(a, prop, b[prop]);
-  if (__getOwnPropSymbols$5)
-    for (var prop of __getOwnPropSymbols$5(b)) {
-      if (__propIsEnum$5.call(b, prop))
-        __defNormalProp$7(a, prop, b[prop]);
-    }
-  return a;
-};
-var __publicField$7 = (obj, key, value) => {
-  __defNormalProp$7(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class I18n {
   constructor(options) {
-    __publicField$7(this, "_translations");
-    __publicField$7(this, "locale", "");
-    __publicField$7(this, "fallbackLocale", "en");
-    __publicField$7(this, "environmentLocale", this.getEnvironmentLocale());
-    __publicField$7(this, "options");
-    var _a;
+    this.locale = "";
+    this.fallbackLocale = "en";
+    this.environmentLocale = this.getEnvironmentLocale();
     this.options = options;
-    this._translations = (_a = this.mergeAdditionalTranslations(
+    this._translations = this.mergeAdditionalTranslations(
       options.translations,
       options.additionalTranslations
-    )) != null ? _a : {};
+    ) ?? {};
     if (options.locale.toLowerCase() === "auto") {
       this.locale = this.environmentLocale;
       if (!this.locale) {
@@ -3061,11 +3425,10 @@ class I18n {
     return localizationParameters;
   }
   t(key, useFallback = false) {
-    var _a, _b;
     if (useFallback) {
-      return (_a = this._translations[this.fallbackLocale]) == null ? void 0 : _a[key];
+      return this._translations[this.fallbackLocale]?.[key];
     }
-    return (_b = this._translations[this.locale]) == null ? void 0 : _b[key];
+    return this._translations[this.locale]?.[key];
   }
   get translations() {
     return this._translations;
@@ -3090,7 +3453,10 @@ class I18n {
     const processedLocales = new Array();
     for (const locale in baseTranslations) {
       processedLocales.push(locale);
-      result[locale] = __spreadValues$5(__spreadValues$5({}, baseTranslations[locale]), additionalTranslations[locale]);
+      result[locale] = {
+        ...baseTranslations[locale],
+        ...additionalTranslations[locale]
+      };
     }
     for (const locale in additionalTranslations) {
       if (processedLocales.includes(locale)) {
@@ -3212,49 +3578,6 @@ class DomHelpers {
   }
 }
 
-var ShapeType = /* @__PURE__ */ ((ShapeType2) => {
-  ShapeType2["Undefined"] = "Undefined";
-  ShapeType2["Rectangle"] = "Rectangle";
-  ShapeType2["Circle"] = "Circle";
-  ShapeType2["Path"] = "Path";
-  return ShapeType2;
-})(ShapeType || {});
-
-var __defProp$6 = Object.defineProperty;
-var __defProps$3 = Object.defineProperties;
-var __getOwnPropDescs$3 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$4 = Object.getOwnPropertySymbols;
-var __hasOwnProp$4 = Object.prototype.hasOwnProperty;
-var __propIsEnum$4 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$6 = (obj, key, value) => key in obj ? __defProp$6(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$4 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$4.call(b, prop))
-      __defNormalProp$6(a, prop, b[prop]);
-  if (__getOwnPropSymbols$4)
-    for (var prop of __getOwnPropSymbols$4(b)) {
-      if (__propIsEnum$4.call(b, prop))
-        __defNormalProp$6(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$3 = (a, b) => __defProps$3(a, __getOwnPropDescs$3(b));
-var __objRest = (source, exclude) => {
-  var target = {};
-  for (var prop in source)
-    if (__hasOwnProp$4.call(source, prop) && exclude.indexOf(prop) < 0)
-      target[prop] = source[prop];
-  if (source != null && __getOwnPropSymbols$4)
-    for (var prop of __getOwnPropSymbols$4(source)) {
-      if (exclude.indexOf(prop) < 0 && __propIsEnum$4.call(source, prop))
-        target[prop] = source[prop];
-    }
-  return target;
-};
-var __publicField$6 = (obj, key, value) => {
-  __defNormalProp$6(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Game {
   /**
    * The base class for all games. New games should extend this class.
@@ -3262,66 +3585,44 @@ class Game {
    * @param options - {@link GameOptions}
    */
   constructor(options) {
-    __publicField$6(this, "type", ActivityType.Game);
-    __publicField$6(this, "_canvasKit");
-    __publicField$6(this, "_session");
-    __publicField$6(this, "uuid", Uuid.generate());
-    __publicField$6(this, "name");
-    __publicField$6(this, "id");
-    __publicField$6(this, "options");
-    __publicField$6(this, "beginTimestamp", NaN);
-    __publicField$6(this, "beginIso8601Timestamp", "");
-    __publicField$6(this, "eventListeners", new Array());
-    __publicField$6(this, "gameMetrics", new Array());
-    __publicField$6(this, "fpsMetricReportThreshold");
-    __publicField$6(this, "maximumRecordedActivityMetrics");
-    __publicField$6(this, "stepCount", 0);
-    __publicField$6(this, "steppingNow", 0);
-    __publicField$6(this, "i18n");
-    __publicField$6(this, "warmupFunctionQueue", new Array());
-    __publicField$6(this, "loaderElementsRemoved", false);
-    __publicField$6(this, "_dataStores");
-    __publicField$6(this, "additionalParameters");
-    __publicField$6(this, "staticTrialSchema", {});
-    /** The scene, or its name as a string, to be presented when the game is started. If this is undefined, the game will start with the first scene that has been added */
-    __publicField$6(this, "entryScene");
-    __publicField$6(this, "data", {
+    this.type = ActivityType.Game;
+    this.uuid = Uuid.generate();
+    this.beginTimestamp = NaN;
+    this.beginIso8601Timestamp = "";
+    this.eventListeners = new Array();
+    this.gameMetrics = new Array();
+    this.stepCount = 0;
+    this.steppingNow = 0;
+    this.warmupFunctionQueue = new Array();
+    this.loaderElementsRemoved = false;
+    this.staticTrialSchema = {};
+    this.data = {
       trials: new Array()
-    });
+    };
     /** The 0-based index of the current trial */
-    __publicField$6(this, "trialIndex", 0);
-    __publicField$6(this, "htmlCanvas");
-    __publicField$6(this, "surface");
-    __publicField$6(this, "showFps");
-    __publicField$6(this, "bodyBackgroundColor");
-    __publicField$6(this, "currentScene");
-    __publicField$6(this, "priorUpdateTime");
-    __publicField$6(this, "fpsTextFont");
-    __publicField$6(this, "fpsTextPaint");
-    __publicField$6(this, "drawnFrames", 0);
-    __publicField$6(this, "lastFpsUpdate", 0);
-    __publicField$6(this, "nextFpsUpdate", 0);
-    __publicField$6(this, "fpsRate", 0);
-    __publicField$6(this, "animationFramesRequested", 0);
-    __publicField$6(this, "limitFps", false);
-    __publicField$6(this, "unitTesting", false);
-    __publicField$6(this, "gameStopRequested", false);
-    __publicField$6(this, "webGlRendererInfo", "");
-    __publicField$6(this, "canvasCssWidth", 0);
-    __publicField$6(this, "canvasCssHeight", 0);
-    __publicField$6(this, "scenes", new Array());
-    __publicField$6(this, "freeEntitiesScene", new Scene({
+    this.trialIndex = 0;
+    this.drawnFrames = 0;
+    this.lastFpsUpdate = 0;
+    this.nextFpsUpdate = 0;
+    this.fpsRate = 0;
+    this.animationFramesRequested = 0;
+    this.limitFps = false;
+    this.unitTesting = false;
+    this.gameStopRequested = false;
+    this.webGlRendererInfo = "";
+    this.canvasCssWidth = 0;
+    this.canvasCssHeight = 0;
+    this.scenes = new Array();
+    this.freeEntitiesScene = new Scene({
       name: Constants.FREE_ENTITIES_SCENE_NAME,
       backgroundColor: [255, 255, 255, 0]
-    }));
-    __publicField$6(this, "incomingSceneTransitions", new Array());
-    __publicField$6(this, "currentSceneSnapshot");
-    __publicField$6(this, "pendingScreenshot");
+    });
+    this.incomingSceneTransitions = new Array();
     /**
      * The m2c2kit engine will automatically include these schema and their
      * values in the trial data.
      */
-    __publicField$6(this, "automaticTrialSchema", {
+    this.automaticTrialSchema = {
       document_uuid: {
         type: "string",
         format: "uuid",
@@ -3353,9 +3654,8 @@ class Game {
         type: "integer",
         description: "Difference in minutes between UTC and device timezone. Calculated from Date.getTimezoneOffset()."
       }
-    });
-    __publicField$6(this, "snapshots", new Array());
-    var _a, _b;
+    };
+    this.snapshots = new Array();
     if (!options.id || options.id.trim() === "") {
       throw new Error("id is required in GameOptions");
     }
@@ -3364,31 +3664,33 @@ class Game {
     this.id = options.id;
     this.freeEntitiesScene.game = this;
     this.freeEntitiesScene.needsInitialization = true;
-    this.fpsMetricReportThreshold = (_a = options.fpsMetricReportThreshold) != null ? _a : Constants.FPS_METRIC_REPORT_THRESHOLD;
-    this.maximumRecordedActivityMetrics = (_b = options.maximumRecordedActivityMetrics) != null ? _b : Constants.MAXIMUM_RECORDED_ACTIVITY_METRICS;
+    this.fpsMetricReportThreshold = options.fpsMetricReportThreshold ?? Constants.FPS_METRIC_REPORT_THRESHOLD;
+    this.maximumRecordedActivityMetrics = options.maximumRecordedActivityMetrics ?? Constants.MAXIMUM_RECORDED_ACTIVITY_METRICS;
     this.addLocalizationParametersToGameParameters();
     if (!this.options.trialSchema) {
       this.options.trialSchema = {};
     }
   }
   addLocalizationParametersToGameParameters() {
-    this.options.parameters = __spreadValues$4(__spreadValues$4({}, this.options.parameters), I18n.makeLocalizationParameters());
+    this.options.parameters = {
+      ...this.options.parameters,
+      ...I18n.makeLocalizationParameters()
+    };
   }
   async init() {
     return this.initialize();
   }
   async initialize() {
-    var _a, _b;
     if (this.isLocalizationRequested()) {
       const options = this.getLocalizationOptionsFromGameParameters();
       this.i18n = new I18n(options);
     }
-    if ((_a = this.session.options.activityCallbacks) == null ? void 0 : _a.onActivityLifecycle) {
+    if (this.session.options.activityCallbacks?.onActivityLifecycle) {
       this.onStart(this.session.options.activityCallbacks.onActivityLifecycle);
       this.onCancel(this.session.options.activityCallbacks.onActivityLifecycle);
       this.onEnd(this.session.options.activityCallbacks.onActivityLifecycle);
     }
-    if ((_b = this.session.options.activityCallbacks) == null ? void 0 : _b.onActivityResults) {
+    if (this.session.options.activityCallbacks?.onActivityResults) {
       this.onData(this.session.options.activityCallbacks.onActivityResults);
     }
   }
@@ -3777,16 +4079,15 @@ class Game {
    * @param entryScene - The scene (Scene object or its string name) to display when the game starts
    */
   async start(entryScene) {
-    var _a, _b;
     const gameInitOptions = this.options;
-    this.unitTesting = (_a = gameInitOptions._unitTesting) != null ? _a : false;
+    this.unitTesting = gameInitOptions._unitTesting ?? false;
     this.setupHtmlCanvases(
       gameInitOptions.canvasId,
       gameInitOptions.width,
       gameInitOptions.height,
       gameInitOptions.stretch
     );
-    this.showFps = (_b = gameInitOptions.showFps) != null ? _b : false;
+    this.showFps = gameInitOptions.showFps ?? false;
     this.bodyBackgroundColor = gameInitOptions.bodyBackgroundColor;
     this.initData();
     this.setupCanvasKitSurface();
@@ -3898,11 +4199,10 @@ class Game {
     }
   }
   advanceStepsHandler(mouseEvent) {
-    var _a, _b;
-    if (((_a = mouseEvent == null ? void 0 : mouseEvent.target) == null ? void 0 : _a.id) === "1-step-advance") {
+    if (mouseEvent?.target?.id === "1-step-advance") {
       this.steppingNow = this.steppingNow + 16.66666666666667;
       this.stepCount = this.stepCount + 1;
-    } else if (((_b = mouseEvent == null ? void 0 : mouseEvent.target) == null ? void 0 : _b.id) === "55-step-advance") {
+    } else if (mouseEvent?.target?.id === "55-step-advance") {
       this.steppingNow = this.steppingNow + 16.66666666666667 * 55;
       this.stepCount = this.stepCount + 55;
     }
@@ -4072,12 +4372,11 @@ class Game {
     this.entities.filter((e) => e.isDrawable).forEach((e) => e.dispose());
   }
   initData() {
-    var _a;
     this.trialIndex = 0;
     this.data = {
       trials: new Array()
     };
-    const trialSchema = (_a = this.options.trialSchema) != null ? _a : {};
+    const trialSchema = this.options.trialSchema ?? {};
     const variables = Object.entries(trialSchema);
     for (const [variableName, propertySchema] of variables) {
       if (propertySchema.type !== void 0 && !this.propertySchemaDataTypeIsValid(propertySchema.type)) {
@@ -4159,7 +4458,6 @@ class Game {
    * @param value - value of the variable to set
    */
   addTrialData(variableName, value) {
-    var _a, _b, _c;
     if (!this.options.trialSchema) {
       throw new Error(
         "no trial schema were provided in GameOptions. cannot add trial data"
@@ -4171,17 +4469,17 @@ class Game {
       for (const [variableName2] of variables) {
         emptyTrial[variableName2] = null;
       }
-      this.data.trials.push(__spreadProps$3(__spreadValues$4({
+      this.data.trials.push({
         document_uuid: Uuid.generate(),
         session_uuid: this.session.uuid,
         activity_uuid: this.uuid,
         activity_id: this.options.id,
         activity_version: this.options.version,
-        device_timezone: (_c = (_b = (_a = Intl == null ? void 0 : Intl.DateTimeFormat()) == null ? void 0 : _a.resolvedOptions()) == null ? void 0 : _b.timeZone) != null ? _c : "",
-        device_timezone_offset_minutes: (/* @__PURE__ */ new Date()).getTimezoneOffset()
-      }, emptyTrial), {
+        device_timezone: Intl?.DateTimeFormat()?.resolvedOptions()?.timeZone ?? "",
+        device_timezone_offset_minutes: (/* @__PURE__ */ new Date()).getTimezoneOffset(),
+        ...emptyTrial,
         device_metadata: this.getDeviceMetadata()
-      }));
+      });
     }
     if (!(variableName in this.options.trialSchema)) {
       throw new Error(`trial variable ${variableName} not defined in schema`);
@@ -4240,12 +4538,12 @@ class Game {
    * Rather than modify the source code for the game, you can do the following
    * to ensure that the participant ID is saved for each trial:
    *
-   *   game.addTrialSchema({
-   *     participant_id: {
+   *   game.addTrialSchema(&#123
+   *     participant_id: &#123
    *       type: "string",
    *       description: "ID of the participant",
-   *     }
-   *   });
+   *     &#125;
+   *   &#125;);
    *   game.addStaticTrialData("participant_id", "12345");
    *
    *  When Game.trialComplete() is called, the participant_id variable will
@@ -4274,9 +4572,11 @@ class Game {
    * the appropriate time. It is not triggered automatically.
    */
   trialComplete() {
-    var _a, _b;
     if (Object.keys(this.staticTrialSchema).length > 0) {
-      this.data.trials[this.trialIndex] = __spreadValues$4(__spreadValues$4({}, this.data.trials[this.trialIndex]), this.staticTrialSchema);
+      this.data.trials[this.trialIndex] = {
+        ...this.data.trials[this.trialIndex],
+        ...this.staticTrialSchema
+      };
     }
     this.trialIndex++;
     const resultsEvent = {
@@ -4290,10 +4590,10 @@ class Game {
       data: this.data,
       dataSchema: this.makeGameDataSchema(),
       activityConfiguration: this.makeGameActivityConfiguration(
-        (_a = this.options.parameters) != null ? _a : {}
+        this.options.parameters ?? {}
       ),
       activityConfigurationSchema: this.makeGameActivityConfigurationSchema(
-        (_b = this.options.parameters) != null ? _b : {}
+        this.options.parameters ?? {}
       ),
       activityMetrics: this.gameMetrics
     };
@@ -4305,9 +4605,11 @@ class Game {
       $comment: `Activity identifier: ${this.options.id}, version: ${this.options.version}.`,
       $schema: "https://json-schema.org/draft/2019-09/schema",
       type: "object",
-      properties: __spreadProps$3(__spreadValues$4(__spreadValues$4({}, this.automaticTrialSchema), this.options.trialSchema), {
+      properties: {
+        ...this.automaticTrialSchema,
+        ...this.options.trialSchema,
         device_metadata: deviceMetadataSchema
-      })
+      }
     };
     return newDataSchema;
   }
@@ -4328,9 +4630,11 @@ class Game {
       $defs: {
         trial: {
           type: "object",
-          properties: __spreadProps$3(__spreadValues$4(__spreadValues$4({}, this.automaticTrialSchema), this.options.trialSchema), {
+          properties: {
+            ...this.automaticTrialSchema,
+            ...this.options.trialSchema,
             device_metadata: deviceMetadataSchema
-          })
+          }
         }
       }
     };
@@ -4345,15 +4649,17 @@ class Game {
    */
   makeGameActivityConfiguration(parameters) {
     const gameParams = JSON.parse(JSON.stringify(parameters));
-    const _a = gameParams, result = __objRest(_a, [
-      "locale",
+    const {
+      locale,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "fallback_locale",
+      fallback_locale,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "missing_translation_font_color",
+      missing_translation_font_color,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "translations"
-    ]);
+      translations,
+      // eslint-disable-line @typescript-eslint/no-unused-vars
+      ...result
+    } = gameParams;
     for (const prop in result) {
       for (const subProp in result[prop]) {
         if (subProp == "default") {
@@ -4365,15 +4671,17 @@ class Game {
   }
   makeGameActivityConfigurationSchema(parameters) {
     const gameParams = JSON.parse(JSON.stringify(parameters));
-    const _a = gameParams, result = __objRest(_a, [
-      "locale",
+    const {
+      locale,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "fallback_locale",
+      fallback_locale,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "missing_translation_font_color",
+      missing_translation_font_color,
       // eslint-disable-line @typescript-eslint/no-unused-vars
-      "translations"
-    ]);
+      translations,
+      // eslint-disable-line @typescript-eslint/no-unused-vars
+      ...result
+    } = gameParams;
     for (const prop in result) {
       if (!("type" in result[prop]) && "value" in result[prop]) {
         const valueType = typeof result[prop]["default"];
@@ -4404,7 +4712,6 @@ class Game {
    * appropriate time. It is not triggered automatically.
    */
   end() {
-    var _a, _b;
     const activityEndEvent = {
       target: this,
       type: EventType.ActivityEnd
@@ -4413,10 +4720,10 @@ class Game {
       data: this.data,
       dataSchema: this.makeGameDataSchema(),
       activityConfiguration: this.makeGameActivityConfiguration(
-        (_a = this.options.parameters) != null ? _a : {}
+        this.options.parameters ?? {}
       ),
       activityConfigurationSchema: this.makeGameActivityConfigurationSchema(
-        (_b = this.options.parameters) != null ? _b : {}
+        this.options.parameters ?? {}
       ),
       activityMetrics: this.gameMetrics
     };
@@ -4433,7 +4740,6 @@ class Game {
    * appropriate time. It is not triggered automatically.
    */
   cancel() {
-    var _a, _b;
     const activityCancelEvent = {
       target: this,
       type: EventType.ActivityCancel
@@ -4442,10 +4748,10 @@ class Game {
       data: this.data,
       dataSchema: this.makeGameDataSchema(),
       activityConfiguration: this.makeGameActivityConfiguration(
-        (_a = this.options.parameters) != null ? _a : {}
+        this.options.parameters ?? {}
       ),
       activityConfigurationSchema: this.makeGameActivityConfigurationSchema(
-        (_b = this.options.parameters) != null ? _b : {}
+        this.options.parameters ?? {}
       ),
       activityMetrics: this.gameMetrics
     };
@@ -4517,7 +4823,7 @@ class Game {
     this.interceptWebGlCalls();
     try {
       this.webGlRendererInfo = WebGlInfo.getRendererString();
-    } catch (e) {
+    } catch {
       this.webGlRendererInfo = "err";
       WebGlInfo.dispose();
     }
@@ -4604,13 +4910,12 @@ class Game {
     );
   }
   loop(canvas) {
-    var _a;
     if (!this.surface) {
       throw new Error("surface is undefined");
     }
     if (this.warmupFunctionQueue.length > 0) {
       const warmup = this.warmupFunctionQueue.shift();
-      warmup == null ? void 0 : warmup.warmupFunction.call(this, canvas, warmup.positionOffset);
+      warmup?.warmupFunction.call(this, canvas, warmup.positionOffset);
       this.surface.requestAnimationFrame(this.loop.bind(this));
       return;
     }
@@ -4635,7 +4940,7 @@ class Game {
       this.update();
       this.draw(canvas);
       while (this.snapshots.length > 0) {
-        (_a = this.snapshots.shift()) == null ? void 0 : _a.delete();
+        this.snapshots.shift()?.delete();
       }
       this.snapshots.push(this.takeCurrentSceneSnapshot());
       this.freeEntitiesScene.draw(canvas);
@@ -5445,7 +5750,7 @@ class Game {
     }
     const x = domPointerEvent.offsetX;
     const y = domPointerEvent.offsetY;
-    const bb = this.calculateEntityAbsoluteBoundingBox(entity);
+    const bb = M2c2KitHelpers.calculateEntityAbsoluteBoundingBox(entity);
     const relativeX = (x - bb.xMin) / (bb.xMax - bb.xMin) * width;
     const relativeY = (y - bb.yMin) / (bb.yMax - bb.yMin) * height;
     return { x: relativeX, y: relativeY };
@@ -5496,7 +5801,7 @@ class Game {
       activityUuid: this.uuid,
       callback
     };
-    if (options == null ? void 0 : options.replaceExisting) {
+    if (options?.replaceExisting) {
       this.eventListeners = this.eventListeners.filter(
         (listener) => !(listener.activityUuid === eventListener.activityUuid && listener.type === eventListener.type)
       );
@@ -5505,7 +5810,11 @@ class Game {
   }
   raiseActivityEventOnListeners(activityEvent, extra) {
     if (extra) {
-      activityEvent = __spreadValues$4(__spreadValues$4({}, activityEvent), extra);
+      activityEvent = {
+        ...activityEvent,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        ...extra
+      };
     }
     this.eventListeners.filter((listener) => listener.type === activityEvent.type).forEach((listener) => {
       listener.callback(activityEvent);
@@ -5553,8 +5862,7 @@ class Game {
     });
   }
   sceneCanReceiveUserInteraction(scene) {
-    var _a;
-    if (scene.game === ((_a = scene.game.session) == null ? void 0 : _a.currentActivity) && scene._transitioning === false) {
+    if (scene.game === scene.game.session?.currentActivity && scene._transitioning === false) {
       return true;
     }
     return false;
@@ -5573,14 +5881,14 @@ class Game {
       throw "only drawable entities can receive pointer events";
     }
     if (entity.type === EntityType.Shape && entity.shapeType === ShapeType.Circle) {
-      const bb2 = this.calculateEntityAbsoluteBoundingBox(entity);
+      const bb = M2c2KitHelpers.calculateEntityAbsoluteBoundingBox(entity);
       const radius = entity.circleOfRadius;
       if (!radius) {
         throw "circleOfRadius is undefined";
       }
       const center = {
-        x: bb2.xMin + radius * entity.absoluteScale,
-        y: bb2.yMin + radius * entity.absoluteScale
+        x: bb.xMin + radius * entity.absoluteScale,
+        y: bb.yMin + radius * entity.absoluteScale
       };
       const distance = Math.sqrt(
         Math.pow(x - center.x, 2) + Math.pow(y - center.y, 2)
@@ -5593,30 +5901,10 @@ class Game {
     if (entity.type === EntityType.TextLine && isNaN(entity.size.width)) {
       return false;
     }
-    const bb = this.calculateEntityAbsoluteBoundingBox(entity);
-    if (entity.isUserInteractionEnabled && x >= bb.xMin && x <= bb.xMax && y >= bb.yMin && y <= bb.yMax) {
-      return true;
-    }
-    return false;
-  }
-  calculateEntityAbsoluteBoundingBox(entity) {
-    const anchorPoint = entity.anchorPoint;
-    const scale = entity.absoluteScale;
-    let width = entity.size.width;
-    let height = entity.size.height;
-    if (entity.type === EntityType.Shape && entity.shapeType === ShapeType.Circle) {
-      const radius = entity.circleOfRadius;
-      if (!radius) {
-        throw "circleOfRadius is undefined";
-      }
-      width = radius * 2;
-      height = radius * 2;
-    }
-    const xMin = entity.absolutePosition.x - width * anchorPoint.x * scale;
-    const xMax = entity.absolutePosition.x + width * (1 - anchorPoint.x) * scale;
-    const yMin = entity.absolutePosition.y - height * anchorPoint.y * scale;
-    const yMax = entity.absolutePosition.y + height * (1 - anchorPoint.y) * scale;
-    return { xMin, xMax, yMin, yMax };
+    const points = M2c2KitHelpers.calculateRotatedPoints(
+      entity
+    );
+    return entity.isUserInteractionEnabled && M2c2KitHelpers.isPointInsideRectangle({ x, y }, points);
   }
   prependAssetsGameIdUrl(url) {
     function hasUrlScheme(str) {
@@ -5641,25 +5929,14 @@ class RenderedDataUrlImage {
   }
 }
 
-var __defProp$5 = Object.defineProperty;
-var __defNormalProp$5 = (obj, key, value) => key in obj ? __defProp$5(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$5 = (obj, key, value) => {
-  __defNormalProp$5(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class RenderedImages {
 }
 class LoadedImages {
 }
 class ImageManager {
   constructor(session) {
-    __publicField$5(this, "canvasKit");
-    __publicField$5(this, "renderedImages", new RenderedImages());
-    __publicField$5(this, "loadedImages", new LoadedImages());
-    __publicField$5(this, "_scratchCanvas");
-    __publicField$5(this, "ctx");
-    __publicField$5(this, "scale");
-    __publicField$5(this, "session");
+    this.renderedImages = new RenderedImages();
+    this.loadedImages = new LoadedImages();
     this.session = session;
   }
   /**
@@ -5933,10 +6210,9 @@ class ImageManager {
     return window.btoa(binary);
   }
   inferImageSubtypeFromUrl(url) {
-    var _a, _b;
     let subtype = "jpeg";
-    if (url == null ? void 0 : url.includes(".")) {
-      subtype = (_b = (_a = url.split(".").pop()) == null ? void 0 : _a.toLowerCase()) != null ? _b : "jpeg";
+    if (url?.includes(".")) {
+      subtype = url.split(".").pop()?.toLowerCase() ?? "jpeg";
       if (subtype === "") {
         subtype = "jpeg";
       }
@@ -5955,7 +6231,7 @@ class ImageManager {
       img = this.canvasKit.MakeImageFromEncoded(
         this.dataURLtoArrayBuffer(loadedDataUrlImage.dataUrlImage)
       );
-    } catch (e) {
+    } catch {
       throw new Error(
         `could not create image with name "${loadedDataUrlImage.name}."`
       );
@@ -6007,9 +6283,8 @@ class ImageManager {
     return u8arr.buffer;
   }
   removeScratchCanvas() {
-    var _a;
     this.ctx = void 0;
-    (_a = this._scratchCanvas) == null ? void 0 : _a.remove();
+    this._scratchCanvas?.remove();
   }
 }
 
@@ -6020,29 +6295,6 @@ var LabelHorizontalAlignmentMode = /* @__PURE__ */ ((LabelHorizontalAlignmentMod
   return LabelHorizontalAlignmentMode2;
 })(LabelHorizontalAlignmentMode || {});
 
-var __defProp$4 = Object.defineProperty;
-var __defProps$2 = Object.defineProperties;
-var __getOwnPropDescs$2 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$3 = Object.getOwnPropertySymbols;
-var __hasOwnProp$3 = Object.prototype.hasOwnProperty;
-var __propIsEnum$3 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$4 = (obj, key, value) => key in obj ? __defProp$4(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$3 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$3.call(b, prop))
-      __defNormalProp$4(a, prop, b[prop]);
-  if (__getOwnPropSymbols$3)
-    for (var prop of __getOwnPropSymbols$3(b)) {
-      if (__propIsEnum$3.call(b, prop))
-        __defNormalProp$4(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$2 = (a, b) => __defProps$2(a, __getOwnPropDescs$2(b));
-var __publicField$4 = (obj, key, value) => {
-  __defNormalProp$4(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Label extends Entity {
   /**
    * Single or multi-line text formatted and rendered on the screen.
@@ -6053,34 +6305,22 @@ class Label extends Entity {
    */
   constructor(options = {}) {
     super(options);
-    __publicField$4(this, "type", EntityType.Label);
-    __publicField$4(this, "isDrawable", true);
-    __publicField$4(this, "isText", true);
+    this.type = EntityType.Label;
+    this.isDrawable = true;
+    this.isText = true;
     // Drawable options
-    __publicField$4(this, "anchorPoint", { x: 0.5, y: 0.5 });
-    __publicField$4(this, "zPosition", 0);
+    this.anchorPoint = { x: 0.5, y: 0.5 };
+    this.zPosition = 0;
     // Text options
-    __publicField$4(this, "_text", "");
+    this._text = "";
     // public getter/setter is below
-    __publicField$4(this, "_fontName");
+    this._fontColor = Constants.DEFAULT_FONT_COLOR;
     // public getter/setter is below
-    __publicField$4(this, "_fontNames");
-    // public getter/setter is below
-    __publicField$4(this, "_fontColor", Constants.DEFAULT_FONT_COLOR);
-    // public getter/setter is below
-    __publicField$4(this, "_fontSize", Constants.DEFAULT_FONT_SIZE);
+    this._fontSize = Constants.DEFAULT_FONT_SIZE;
     // public getter/setter is below
     // Label options
-    __publicField$4(this, "_horizontalAlignmentMode", LabelHorizontalAlignmentMode.Center);
-    // public getter/setter is below
-    __publicField$4(this, "_preferredMaxLayoutWidth");
-    // public getter/setter is below
-    __publicField$4(this, "_backgroundColor");
-    // public getter/setter is below
-    __publicField$4(this, "paragraph");
-    __publicField$4(this, "paraStyle");
-    __publicField$4(this, "builder");
-    __publicField$4(this, "_translatedText", "");
+    this._horizontalAlignmentMode = LabelHorizontalAlignmentMode.Center;
+    this._translatedText = "";
     handleInterfaceOptions(this, options);
     if (options.horizontalAlignmentMode) {
       this.horizontalAlignmentMode = options.horizontalAlignmentMode;
@@ -6096,7 +6336,6 @@ class Label extends Entity {
     }
   }
   initialize() {
-    var _a, _b, _c;
     let ckTextAlign = this.canvasKit.TextAlign.Center;
     switch (this.horizontalAlignmentMode) {
       case LabelHorizontalAlignmentMode.Center:
@@ -6188,28 +6427,67 @@ class Label extends Entity {
       fontFamilies.push(defaultTypeface.fontFamily);
     }
     this.paraStyle = new this.canvasKit.ParagraphStyle({
-      textStyle: {
-        color: textColor,
-        backgroundColor: this.backgroundColor ? this.canvasKit.Color(
-          this.backgroundColor[0],
-          this.backgroundColor[1],
-          this.backgroundColor[2],
-          this.backgroundColor[3]
-        ) : void 0,
-        fontFamilies,
-        fontSize: this.fontSize * Globals.canvasScale
-      },
+      textStyle: {},
       textAlign: ckTextAlign
     });
+    if (this.builder) {
+      this.builder.delete();
+    }
     this.builder = this.canvasKit.ParagraphBuilder.Make(
       this.paraStyle,
       fontManager.fontMgr
     );
+    if (!this._backgroundPaint) {
+      this._backgroundPaint = new this.canvasKit.Paint();
+    }
+    if (!this._fontPaint) {
+      this._fontPaint = new this.canvasKit.Paint();
+    }
+    this.fontPaint.setColor(textColor);
+    this.fontPaint.setAlphaf(this.absoluteAlpha);
+    if (this.backgroundColor) {
+      this.backgroundPaint.setColor(this.backgroundColor);
+      this.backgroundPaint.setAlphaf(this.absoluteAlpha);
+    } else {
+      this.backgroundPaint.setColor(this.canvasKit.Color(0, 0, 0, 0));
+    }
+    this.builder.pushPaintStyle(
+      {
+        fontFamilies,
+        fontSize: this.fontSize * Globals.canvasScale,
+        // set default values for below properties as well.
+        fontStyle: {
+          weight: this.canvasKit.FontWeight.Normal,
+          width: this.canvasKit.FontWidth.Normal,
+          slant: this.canvasKit.FontSlant.Oblique
+        },
+        // Normal font style
+        decoration: 0,
+        // No decoration
+        decorationThickness: 1,
+        // Default decoration thickness
+        decorationStyle: this.canvasKit.DecorationStyle.Solid,
+        // Solid decoration style
+        heightMultiplier: -1,
+        // Providing -1, rather than 1.0, gives default height multiplier
+        halfLeading: false,
+        // Default half leading
+        letterSpacing: 0,
+        // Default letter spacing
+        wordSpacing: 0
+        // Default word spacing
+      },
+      this.fontPaint,
+      this.backgroundPaint
+    );
     this.builder.addText(textForParagraph);
+    if (this.paragraph) {
+      this.paragraph.delete();
+    }
     this.paragraph = this.builder.build();
     const preferredWidth = (
       //this.preferredMaxLayoutWidth ?? this.parentScene.game.canvasCssWidth;
-      (_a = this.preferredMaxLayoutWidth) != null ? _a : Globals.canvasCssWidth
+      this.preferredMaxLayoutWidth ?? Globals.canvasCssWidth
     );
     let calculatedWidth = preferredWidth;
     if (preferredWidth === 0 || this.layout.width === 0) {
@@ -6218,8 +6496,8 @@ class Label extends Entity {
           "width is set to match parent, but entity has no parent"
         );
       }
-      const marginStart = (_b = this.layout.marginStart) != null ? _b : 0;
-      const marginEnd = (_c = this.layout.marginEnd) != null ? _c : 0;
+      const marginStart = this.layout.marginStart ?? 0;
+      const marginEnd = this.layout.marginEnd ?? 0;
       calculatedWidth = this.parent.size.width - (marginStart + marginEnd);
     }
     this.paragraph.layout(calculatedWidth * Globals.canvasScale);
@@ -6233,7 +6511,14 @@ class Label extends Entity {
     this.needsInitialization = false;
   }
   dispose() {
-    CanvasKitHelpers.Dispose([this.paragraph, this.builder]);
+    CanvasKitHelpers.Dispose([
+      this.paragraph,
+      this.builder,
+      this._fontPaint,
+      // use backing field since it may be undefined
+      this._backgroundPaint
+      // use backing field since it may be undefined
+    ]);
   }
   get text() {
     return this._text;
@@ -6294,6 +6579,24 @@ class Label extends Entity {
     this._backgroundColor = backgroundColor;
     this.needsInitialization = true;
   }
+  get backgroundPaint() {
+    if (!this._backgroundPaint) {
+      throw new Error("backgroundPaint cannot be undefined");
+    }
+    return this._backgroundPaint;
+  }
+  set backgroundPaint(backgroundPaint) {
+    this._backgroundPaint = backgroundPaint;
+  }
+  get fontPaint() {
+    if (!this._fontPaint) {
+      throw new Error("fontPaint cannot be undefined");
+    }
+    return this._fontPaint;
+  }
+  set fontPaint(fontPaint) {
+    this._fontPaint = fontPaint;
+  }
   /**
    * Duplicates an entity using deep copy.
    *
@@ -6305,12 +6608,15 @@ class Label extends Entity {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Label(__spreadProps$2(__spreadValues$3(__spreadValues$3(__spreadValues$3({}, this.getEntityOptions()), this.getDrawableOptions()), this.getTextOptions()), {
+    const dest = new Label({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
+      ...this.getTextOptions(),
       horizontalAlignmentMode: this.horizontalAlignmentMode,
       preferredMaxLayoutWidth: this.preferredMaxLayoutWidth,
       backgroundColor: this.backgroundColor,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -6322,12 +6628,16 @@ class Label extends Entity {
   }
   update() {
     super.update();
+    if (this.absoluteAlphaChange !== 0) {
+      this.initialize();
+    }
   }
   draw(canvas) {
     if (this.parent && this.text !== "") {
       canvas.save();
       const drawScale = Globals.canvasScale / this.absoluteScale;
       canvas.scale(1 / drawScale, 1 / drawScale);
+      M2c2KitHelpers.rotateCanvasForDrawableEntity(canvas, this);
       const x = (this.absolutePosition.x - this.size.width * this.anchorPoint.x * this.absoluteScale) * drawScale;
       const y = (this.absolutePosition.y - this.size.height * this.anchorPoint.y * this.absoluteScale) * drawScale;
       if (this.paragraph === void 0) {
@@ -6351,57 +6661,6 @@ class Label extends Entity {
   }
 }
 
-var __defProp$3 = Object.defineProperty;
-var __defNormalProp$3 = (obj, key, value) => key in obj ? __defProp$3(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __publicField$3 = (obj, key, value) => {
-  __defNormalProp$3(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
-class MutablePath {
-  constructor() {
-    __publicField$3(this, "size", { width: 0, height: 0 });
-    __publicField$3(this, "_subpaths", new Array());
-    __publicField$3(this, "currentPath", new Array());
-  }
-  get subpaths() {
-    if (this.currentPath.length > 0) {
-      return [...this._subpaths, this.currentPath];
-    } else {
-      return this._subpaths;
-    }
-  }
-  /**
-   * Starts a new subpath at a given point.
-   *
-   * @param point - location at which to start the new subpath
-   */
-  move(point) {
-    if (this.currentPath.length > 0) {
-      this._subpaths.push(this.currentPath);
-    }
-    this.currentPath = new Array();
-    this.currentPath.push(point);
-  }
-  /**
-   * Adds a straight line to the current subpath.
-   *
-   * @remarks The line is added from the last point in the current subpath to
-   * the given point.
-   *
-   * @param point - location where the line will end
-   */
-  addLine(point) {
-    this.currentPath.push(point);
-  }
-  clear() {
-    this._subpaths = new Array();
-    this.currentPath = new Array();
-  }
-  duplicate(newName) {
-    throw new Error("Method not implemented.");
-  }
-}
-
 class RandomDraws {
   /**
    * Draws a single random integer from a uniform distribution of integers in
@@ -6454,7 +6713,7 @@ class RandomDraws {
    * grid location to be along the diagonal, the predicate would be:
    * (row, column) => row === column
    * @returns Array of grid cells. Each cell is object in form of:
-   * \{ row: number, column: number \}. Grid cell locations are zero-based
+   * &#123 row: number, column: number &#125;. Grid cell locations are zero-based
    */
   static FromGridWithoutReplacement(n, rows, columns, predicate) {
     const result = new Array();
@@ -6495,10 +6754,7 @@ function getAugmentedNamespace(n) {
 	if (typeof f == "function") {
 		var a = function a () {
 			if (this instanceof a) {
-				var args = [null];
-				args.push.apply(args, arguments);
-				var Ctor = Function.bind.apply(f, args);
-				return new Ctor();
+        return Reflect.construct(f, arguments, this.constructor);
 			}
 			return f.apply(this, arguments);
 		};
@@ -7065,26 +7321,6 @@ var w;w||(w=typeof CanvasKitInit !== 'undefined' ? CanvasKitInit : {});var da,ea
 var canvaskitExports = canvaskit.exports;
 var CanvasKitInit = /*@__PURE__*/getDefaultExportFromCjs(canvaskitExports);
 
-var __defProp$2 = Object.defineProperty;
-var __getOwnPropSymbols$2 = Object.getOwnPropertySymbols;
-var __hasOwnProp$2 = Object.prototype.hasOwnProperty;
-var __propIsEnum$2 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$2 = (obj, key, value) => key in obj ? __defProp$2(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$2 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$2.call(b, prop))
-      __defNormalProp$2(a, prop, b[prop]);
-  if (__getOwnPropSymbols$2)
-    for (var prop of __getOwnPropSymbols$2(b)) {
-      if (__propIsEnum$2.call(b, prop))
-        __defNormalProp$2(a, prop, b[prop]);
-    }
-  return a;
-};
-var __publicField$2 = (obj, key, value) => {
-  __defNormalProp$2(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Session {
   /**
    * A Session contains one or more activities. The session manages the start
@@ -7093,17 +7329,10 @@ class Session {
    * @param options
    */
   constructor(options) {
-    __publicField$2(this, "options");
-    __publicField$2(this, "fontManager");
-    __publicField$2(this, "imageManager");
-    __publicField$2(this, "currentActivity");
-    __publicField$2(this, "uuid");
-    __publicField$2(this, "dataStores");
-    __publicField$2(this, "eventListeners", new Array());
-    __publicField$2(this, "sessionDictionary", /* @__PURE__ */ new Map());
-    __publicField$2(this, "canvasKit");
-    __publicField$2(this, "initialized", false);
-    __publicField$2(this, "version", "0.3.12 (291d0cee)");
+    this.eventListeners = new Array();
+    this.sessionDictionary = /* @__PURE__ */ new Map();
+    this.initialized = false;
+    this.version = "0.3.14 (60325bea)";
     this.options = options;
     for (const activity of this.options.activities) {
       if (this.options.activities.filter((a) => a === activity).length > 1) {
@@ -7177,9 +7406,9 @@ class Session {
     const eventListener = {
       type,
       callback,
-      key: options == null ? void 0 : options.key
+      key: options?.key
     };
-    if (options == null ? void 0 : options.replaceExisting) {
+    if (options?.replaceExisting) {
       this.eventListeners = this.eventListeners.filter(
         (listener) => !(listener.type === eventListener.type)
       );
@@ -7188,7 +7417,11 @@ class Session {
   }
   raiseEventOnListeners(event, extra) {
     if (extra) {
-      event = __spreadValues$2(__spreadValues$2({}, event), extra);
+      event = {
+        ...event,
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        ...extra
+      };
     }
     this.eventListeners.filter((listener) => listener.type === event.type).forEach((listener) => {
       listener.callback(event);
@@ -7264,13 +7497,12 @@ class Session {
     }
     const activityPrototype = Object.getPrototypeOf(activity);
     const gamePrototype = Object.getPrototypeOf(activityPrototype);
-    return (activityPrototype == null ? void 0 : activityPrototype.init) !== (gamePrototype == null ? void 0 : gamePrototype.init);
+    return activityPrototype?.init !== gamePrototype?.init;
   }
   /**
    * Asynchronously initializes the m2c2kit engine and loads assets
    */
   async initialize() {
-    var _a;
     console.log(`\u26AA @m2c2kit/core version ${this.version}`);
     Timer.start("sessionInitialize");
     const sessionInitializeEvent = {
@@ -7282,7 +7514,7 @@ class Session {
     DomHelpers.setSpinnerVisibility(true);
     DomHelpers.setCanvasOverlayVisibility(true);
     this.dataStores = this.options.dataStores;
-    if (((_a = this.dataStores) == null ? void 0 : _a.length) === 0) {
+    if (this.dataStores?.length === 0) {
       throw new Error(
         "Session.initialize(): dataStores must be undefined or a non-zero array of datastores."
       );
@@ -7571,9 +7803,8 @@ class Session {
   }
   getImagesConfigurationFromGames() {
     return this.options.activities.filter((activity) => activity.type == ActivityType.Game).map((activity) => {
-      var _a;
       const game = activity;
-      return { uuid: game.uuid, images: (_a = game.options.images) != null ? _a : [] };
+      return { uuid: game.uuid, images: game.options.images ?? [] };
     });
   }
   prependAssetsUrl(url) {
@@ -7590,29 +7821,6 @@ class Session {
   }
 }
 
-var __defProp$1 = Object.defineProperty;
-var __defProps$1 = Object.defineProperties;
-var __getOwnPropDescs$1 = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols$1 = Object.getOwnPropertySymbols;
-var __hasOwnProp$1 = Object.prototype.hasOwnProperty;
-var __propIsEnum$1 = Object.prototype.propertyIsEnumerable;
-var __defNormalProp$1 = (obj, key, value) => key in obj ? __defProp$1(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues$1 = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp$1.call(b, prop))
-      __defNormalProp$1(a, prop, b[prop]);
-  if (__getOwnPropSymbols$1)
-    for (var prop of __getOwnPropSymbols$1(b)) {
-      if (__propIsEnum$1.call(b, prop))
-        __defNormalProp$1(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps$1 = (a, b) => __defProps$1(a, __getOwnPropDescs$1(b));
-var __publicField$1 = (obj, key, value) => {
-  __defNormalProp$1(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class Shape extends Entity {
   /**
    * Rectangular, circular, or path-based shape
@@ -7621,45 +7829,41 @@ class Shape extends Entity {
    */
   constructor(options = {}) {
     super(options);
-    __publicField$1(this, "type", EntityType.Shape);
-    __publicField$1(this, "isDrawable", true);
-    __publicField$1(this, "isShape", true);
+    this.type = EntityType.Shape;
+    this.isDrawable = true;
+    this.isShape = true;
     // Drawable options
-    __publicField$1(this, "anchorPoint", { x: 0.5, y: 0.5 });
-    __publicField$1(this, "zPosition", 0);
+    this.anchorPoint = { x: 0.5, y: 0.5 };
+    this.zPosition = 0;
     // Shape options
     // TODO: fix the Size issue; should be readonly (calculated value) in all entities, but Rectangle
-    __publicField$1(this, "shapeType", ShapeType.Undefined);
-    __publicField$1(this, "circleOfRadius");
-    __publicField$1(this, "rect");
-    __publicField$1(this, "path");
-    __publicField$1(this, "ckPath", null);
-    __publicField$1(this, "ckPathWidth");
-    __publicField$1(this, "ckPathHeight");
-    __publicField$1(this, "cornerRadius", 0);
-    __publicField$1(this, "_fillColor", Constants.DEFAULT_SHAPE_FILL_COLOR);
-    __publicField$1(this, "_strokeColor");
-    __publicField$1(this, "lineWidth");
-    __publicField$1(this, "_isAntialiased", true);
-    __publicField$1(this, "_fillColorPaintAntialiased");
-    __publicField$1(this, "_strokeColorPaintAntialiased");
-    __publicField$1(this, "_fillColorPaintNotAntialiased");
-    __publicField$1(this, "_strokeColorPaintNotAntialiased");
-    __publicField$1(this, "svgPathRequestedWidth");
-    __publicField$1(this, "svgPathRequestedHeight");
-    __publicField$1(this, "svgPathScaleForResizing", 1);
-    __publicField$1(this, "svgPathWidth", 0);
-    __publicField$1(this, "svgPathHeight", 0);
-    __publicField$1(this, "svgPreviousAbsoluteX", NaN);
-    __publicField$1(this, "svgPreviousAbsoluteY", NaN);
-    __publicField$1(this, "svgFirstPathDraw", true);
+    this.shapeType = ShapeType.Undefined;
+    this.ckPath = null;
+    this.cornerRadius = 0;
+    this._fillColor = Constants.DEFAULT_SHAPE_FILL_COLOR;
+    this._isAntialiased = true;
+    this.svgPathScaleForResizing = 1;
+    this.svgPathWidth = 0;
+    this.svgPathHeight = 0;
+    this.svgPreviousAbsoluteX = NaN;
+    this.svgPreviousAbsoluteY = NaN;
+    this.svgFirstPathDraw = true;
+    this.colorfulPathPaints = /* @__PURE__ */ new Map();
     handleInterfaceOptions(this, options);
     if (options.path !== void 0) {
       this.path = options.path;
       this.shapeType = ShapeType.Path;
-      if (this.path.size !== void 0) {
-        this.size.height = this.path.size.height;
-        this.size.width = this.path.size.width;
+      if (this.shapeIsM2Path()) {
+        if (options.size !== void 0) {
+          this.size = options.size;
+        }
+      }
+      if (this.shapeIsSvgStringPath()) {
+        if (options.size !== void 0) {
+          throw new Error(
+            "Size cannot be specified when path is SVG string path"
+          );
+        }
       }
       this.svgPathRequestedWidth = options.path.width;
       this.svgPathRequestedHeight = options.path.height;
@@ -7711,7 +7915,7 @@ class Shape extends Entity {
         throw new Error("Size cannot be specified for rectangle shape");
       }
     }
-    if (options.cornerRadius) {
+    if (options.cornerRadius !== void 0) {
       this.cornerRadius = options.cornerRadius;
     }
     if (options.fillColor) {
@@ -7726,9 +7930,9 @@ class Shape extends Entity {
     if (options.isAntialiased !== void 0) {
       this.isAntialiased = options.isAntialiased;
     }
-    if (options.strokeColor && options.lineWidth === void 0) {
+    if (options.strokeColor && !options.lineWidth) {
       console.warn(
-        `warning: for entity ${this}, strokeColor = ${options.strokeColor} but lineWidth is undefined. In normal usage, both would be set or both would be undefined.`
+        `warning: for entity ${this}, strokeColor = ${options.strokeColor} but lineWidth is non-zero. In normal usage, both would be set or both would be undefined.`
       );
     }
     if (options.strokeColor === void 0 && options.lineWidth) {
@@ -7740,11 +7944,16 @@ class Shape extends Entity {
   initialize() {
     if (this.shapeType === ShapeType.Path) {
       if (this.shapeIsSvgStringPath()) {
-        const pathSvgString = this.path.svgPathString;
-        if (!pathSvgString) {
+        const pathString = this.path.pathString ?? this.path.svgPathString;
+        if (!pathString) {
           throw new Error("SVG Path string is null/undefined");
         }
-        this.ckPath = this.canvasKit.Path.MakeFromSVGString(pathSvgString);
+        if (this.path.svgPathString !== void 0) {
+          console.warn(
+            `warning: svgPathString is deprecated. Use pathString instead.`
+          );
+        }
+        this.ckPath = this.canvasKit.Path.MakeFromSVGString(pathString);
         if (!this.ckPath) {
           throw new Error("could not make CanvasKit Path from SVG string");
         }
@@ -7762,6 +7971,13 @@ class Shape extends Entity {
         this.svgPreviousAbsoluteY = 0;
       }
     }
+    if (this.shapeIsM2Path()) {
+      if (this.size.width === 0 || this.size.height === 0 || this.size.width === void 0 || this.size.height === void 0) {
+        throw new Error(
+          "Size of shape must have non-zero height and width when path is M2Path"
+        );
+      }
+    }
     if (this.fillColor) {
       this.fillColorPaintAntialiased = CanvasKitHelpers.makePaint(
         this.canvasKit,
@@ -7795,11 +8011,13 @@ class Shape extends Entity {
   }
   dispose() {
     CanvasKitHelpers.Dispose([
+      // use backing fields, since paints may be undefined
       this._strokeColorPaintAntialiased,
       this._strokeColorPaintNotAntialiased,
       this._fillColorPaintAntialiased,
       this._fillColorPaintNotAntialiased,
-      this.ckPath
+      this.ckPath,
+      ...Array.from(this.colorfulPathPaints.values())
     ]);
   }
   /**
@@ -7813,7 +8031,9 @@ class Shape extends Entity {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new Shape(__spreadProps$1(__spreadValues$1(__spreadValues$1({}, this.getEntityOptions()), this.getDrawableOptions()), {
+    const dest = new Shape({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
       shapeType: this.shapeType,
       circleOfRadius: this.circleOfRadius,
       rect: this.rect,
@@ -7822,7 +8042,7 @@ class Shape extends Entity {
       strokeColor: this.strokeColor,
       lineWidth: this.lineWidth,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -7839,6 +8059,15 @@ class Shape extends Entity {
     canvas.save();
     const drawScale = Globals.canvasScale / this.absoluteScale;
     canvas.scale(1 / drawScale, 1 / drawScale);
+    M2c2KitHelpers.rotateCanvasForDrawableEntity(canvas, this);
+    if (this.absoluteAlphaChange !== 0) {
+      this.applyAlphaToPaints(this.absoluteAlpha, [
+        this._fillColorPaintAntialiased,
+        this._fillColorPaintNotAntialiased,
+        this._strokeColorPaintAntialiased,
+        this._strokeColorPaintNotAntialiased
+      ]);
+    }
     if (this.shapeIsM2Path()) {
       this.drawPathFromM2Path(canvas);
     }
@@ -7854,12 +8083,63 @@ class Shape extends Entity {
     canvas.restore();
     super.drawChildren(canvas);
   }
+  applyAlphaToPaints(alpha, paints) {
+    paints.forEach((paint) => {
+      if (paint) {
+        paint.setAlphaf(alpha);
+      }
+    });
+  }
   drawPathFromM2Path(canvas) {
     const drawScale = Globals.canvasScale / this.absoluteScale;
     const pathOriginX = (this.absolutePosition.x - this.anchorPoint.x * this.size.width * this.absoluteScale) * drawScale;
     const pathOriginY = (this.absolutePosition.y - this.anchorPoint.y * this.size.height * this.absoluteScale) * drawScale;
+    if (this.pathIsM2ColorfulPath(this.path)) {
+      const linePresentations = this.path.linePresentations;
+      let lp = 0;
+      const subpaths = this.path.subpaths;
+      let paint;
+      for (let s = 0; s < subpaths.length; s++) {
+        const subpath = subpaths[s];
+        const points = subpath.flat();
+        for (let i = 0; i < points.length - 1; i++) {
+          if (linePresentations[lp].subpathIndex === s && linePresentations[lp].pointIndex === i) {
+            const strokeColor = linePresentations[lp].strokeColor;
+            const lineWidth = linePresentations[lp].lineWidth;
+            const paintKey = [...strokeColor, lineWidth].toString();
+            paint = this.colorfulPathPaints.get(paintKey);
+            if (paint === void 0) {
+              paint = CanvasKitHelpers.makePaint(
+                this.canvasKit,
+                strokeColor,
+                this.canvasKit.PaintStyle.Stroke,
+                true
+              );
+              paint.setStrokeWidth(lineWidth * Globals.canvasScale);
+              this.colorfulPathPaints.set(paintKey, paint);
+            }
+            if (lp < linePresentations.length - 1) {
+              lp++;
+            }
+          }
+          if (paint === void 0) {
+            throw new Error("paint is undefined");
+          }
+          canvas.drawLine(
+            pathOriginX + points[i].x * Globals.canvasScale,
+            pathOriginY + points[i].y * Globals.canvasScale,
+            pathOriginX + points[i + 1].x * Globals.canvasScale,
+            pathOriginY + points[i + 1].y * Globals.canvasScale,
+            paint
+          );
+        }
+      }
+      return;
+    }
     if (this.strokeColor && this.strokeColorPaintAntialiased && this.lineWidth) {
-      this.strokeColorPaintAntialiased.setStrokeWidth(this.lineWidth);
+      this.strokeColorPaintAntialiased.setStrokeWidth(
+        this.lineWidth * Globals.canvasScale
+      );
       const subpaths = this.path.subpaths;
       for (const subpath of subpaths) {
         const points = subpath.flat();
@@ -7925,12 +8205,13 @@ class Shape extends Entity {
     return this.svgFirstPathDraw === true || x !== this.svgPreviousAbsoluteX || y !== this.svgPreviousAbsoluteY;
   }
   shapeIsSvgStringPath() {
-    var _a;
-    return ((_a = this.path) == null ? void 0 : _a.svgPathString) !== void 0;
+    return this.path?.pathString !== void 0 || this.path?.svgPathString !== void 0;
   }
   shapeIsM2Path() {
-    var _a;
-    return ((_a = this.path) == null ? void 0 : _a.subpaths) !== void 0;
+    return this.path?.subpaths !== void 0;
+  }
+  pathIsM2ColorfulPath(path) {
+    return path !== void 0 && "linePresentations" in path;
   }
   drawCircle(canvas) {
     if (!this.circleOfRadius) {
@@ -8132,29 +8413,6 @@ class Story {
   }
 }
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-var __publicField = (obj, key, value) => {
-  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
-  return value;
-};
 class TextLine extends Entity {
   /**
    * Single-line text rendered on the screen.
@@ -8164,33 +8422,26 @@ class TextLine extends Entity {
    * @param options - {@link TextLineOptions}
    */
   constructor(options = {}) {
-    var _a;
     super(options);
-    __publicField(this, "type", EntityType.TextLine);
-    __publicField(this, "isDrawable", true);
-    __publicField(this, "isText", true);
+    this.type = EntityType.TextLine;
+    this.isDrawable = true;
+    this.isText = true;
     // Drawable options
-    __publicField(this, "zPosition", 0);
+    this.zPosition = 0;
     //   We don't know TextLine width in advance, so we must text align left,
     //   and so anchorPoint is (0, .5). (we do know height, which is fontSize)
-    __publicField(this, "anchorPoint", { x: 0, y: 0.5 });
+    this.anchorPoint = { x: 0, y: 0.5 };
     // Text options
-    __publicField(this, "_text", "");
-    // public getter/setter is below
-    __publicField(this, "_fontName");
-    // public getter/setter is below
-    __publicField(this, "_fontColor", Constants.DEFAULT_FONT_COLOR);
+    this._text = "";
     // public getter/setter is below
-    __publicField(this, "_fontSize", Constants.DEFAULT_FONT_SIZE);
+    this._fontColor = Constants.DEFAULT_FONT_COLOR;
     // public getter/setter is below
-    __publicField(this, "paint");
-    __publicField(this, "font");
-    __publicField(this, "typeface", null);
-    __publicField(this, "_translatedText", "");
-    __publicField(this, "missingTranslationPaint");
+    this._fontSize = Constants.DEFAULT_FONT_SIZE;
+    this.typeface = null;
+    this._translatedText = "";
     handleInterfaceOptions(this, options);
     this.size.height = this.fontSize;
-    this.size.width = (_a = options.width) != null ? _a : NaN;
+    this.size.width = options.width ?? NaN;
   }
   get text() {
     return this._text;
@@ -8227,6 +8478,9 @@ class TextLine extends Entity {
     super.update();
   }
   initialize() {
+    if (this.paint) {
+      this.paint.delete();
+    }
     this.paint = new this.canvasKit.Paint();
     this.paint.setColor(
       this.canvasKit.Color(
@@ -8266,6 +8520,9 @@ class TextLine extends Entity {
         this.typeface = fontManager.getTypeface(gameUuid, fontNames[0]);
       }
     }
+    if (this.font) {
+      this.font.delete();
+    }
     this.font = new this.canvasKit.Font(
       this.typeface,
       this.fontSize * Globals.canvasScale
@@ -8286,10 +8543,13 @@ class TextLine extends Entity {
    * provided, name will be the new uuid
    */
   duplicate(newName) {
-    const dest = new TextLine(__spreadProps(__spreadValues(__spreadValues(__spreadValues({}, this.getEntityOptions()), this.getDrawableOptions()), this.getTextOptions()), {
+    const dest = new TextLine({
+      ...this.getEntityOptions(),
+      ...this.getDrawableOptions(),
+      ...this.getTextOptions(),
       width: this.size.width,
       name: newName
-    }));
+    });
     if (this.children.length > 0) {
       dest.children = this.children.map((child) => {
         const clonedChild = child.duplicate();
@@ -8304,6 +8564,7 @@ class TextLine extends Entity {
       canvas.save();
       const drawScale = Globals.canvasScale / this.absoluteScale;
       canvas.scale(1 / drawScale, 1 / drawScale);
+      M2c2KitHelpers.rotateCanvasForDrawableEntity(canvas, this);
       const x = this.absolutePosition.x * drawScale;
       const y = (this.absolutePosition.y + this.size.height * this.anchorPoint.y * this.absoluteScale) * drawScale;
       let textForDraw;
@@ -8341,6 +8602,9 @@ class TextLine extends Entity {
           `in TextLine entity ${this}, Paint or Font is undefined.`
         );
       }
+      if (this.absoluteAlphaChange !== 0) {
+        paintForDraw.setAlphaf(this.absoluteAlpha);
+      }
       canvas.drawText(textForDraw, x, y, paintForDraw, this.font);
       canvas.restore();
     }
@@ -8357,5 +8621,5 @@ class TextLine extends Entity {
   }
 }
 
-export { Action, ActivityType, CanvasKitHelpers, Composite, Constants, ConstraintType, CustomAction, Dimensions, Easings, Entity, EntityType, Equals, EventType, FontManager, Game, GlobalVariables, GroupAction, I18n, ImageManager, Label, LabelHorizontalAlignmentMode, LayoutConstraint, LoadedImage, MoveAction, MutablePath, NoneTransition, RandomDraws, ScaleAction, Scene, SceneTransition, SequenceAction, Session, Shape, ShapeType, SlideTransition, Sprite, Story, TextLine, Timer, Transition, TransitionDirection, TransitionType, Uuid, WaitAction, WebColors, WebGlInfo, handleInterfaceOptions };
+export { Action, ActivityType, CanvasKitHelpers, ColorfulMutablePath, Composite, Constants, ConstraintType, CustomAction, Dimensions, Easings, Entity, EntityType, Equals, EventType, FadeAlphaAction, FontManager, Game, GlobalVariables, GroupAction, I18n, ImageManager, Label, LabelHorizontalAlignmentMode, LayoutConstraint, LoadedImage, MoveAction, MutablePath, NoneTransition, RandomDraws, RotateAction, ScaleAction, Scene, SceneTransition, SequenceAction, Session, Shape, ShapeType, SlideTransition, Sprite, Story, TextLine, Timer, Transition, TransitionDirection, TransitionType, Uuid, WaitAction, WebColors, WebGlInfo, handleInterfaceOptions };
 //# sourceMappingURL=index.js.map