@m2c2kit/core 0.3.11 → 0.3.13

package/dist/index.js

@@ -5,6 +5,7 @@ var ActionType = /* @__PURE__ */ ((ActionType2) => {
   ActionType2["Custom"] = "Custom";
   ActionType2["Move"] = "Move";
   ActionType2["Scale"] = "Scale";
+  ActionType2["FadeAlpha"] = "FadeAlpha";
   return ActionType2;
 })(ActionType || {});
 
@@ -218,6 +219,21 @@ 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 array of actions that will be run in order.
    *
@@ -304,6 +320,15 @@ class Action {
         });
         break;
       }
+      case ActionType.FadeAlpha: {
+        const fadeAlpha = action;
+        cloned = Action.fadeAlpha({
+          alpha: fadeAlpha.alpha,
+          duration: fadeAlpha.duration,
+          runDuringTransition: fadeAlpha.runDuringTransition
+        });
+        break;
+      }
       case ActionType.Wait: {
         const wait = action;
         cloned = Action.wait({
@@ -391,6 +416,20 @@ 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;
+      }
+    }
   }
   /**
    * Calculates the duration of an action, including any children actions
@@ -572,6 +611,17 @@ class ScaleAction extends Action {
     this.isParent = false;
   }
 }
+class FadeAlphaAction extends Action {
+  constructor(alpha, duration, runDuringTransition = false) {
+    super(runDuringTransition);
+    __publicField$j(this, "type", ActionType.FadeAlpha);
+    __publicField$j(this, "alpha");
+    __publicField$j(this, "delta", 0);
+    this.duration = duration;
+    this.alpha = alpha;
+    this.isParent = false;
+  }
+}
 
 var ActivityType = /* @__PURE__ */ ((ActivityType2) => {
   ActivityType2["Game"] = "Game";
@@ -588,7 +638,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 == null ? void 0 : o.isDeleted())).forEach((o) => o == null ? void 0 : o.delete());
   }
   static makePaint(canvasKit, color, style, isAntialiased) {
     const paint = new canvasKit.Paint();
@@ -749,28 +799,28 @@ class Uuid {
   }
 }
 
-var EventType = /* @__PURE__ */ ((EventType2) => {
-  EventType2["SessionInitialize"] = "SessionInitialize";
-  EventType2["SessionStart"] = "SessionStart";
-  EventType2["SessionEnd"] = "SessionEnd";
-  EventType2["ActivityStart"] = "ActivityStart";
-  EventType2["ActivityEnd"] = "ActivityEnd";
-  EventType2["ActivityCancel"] = "ActivityCancel";
-  EventType2["ActivityData"] = "ActivityData";
-  EventType2["TapDown"] = "TapDown";
-  EventType2["TapUp"] = "TapUp";
-  EventType2["TapUpAny"] = "TapUpAny";
-  EventType2["TapLeave"] = "TapLeave";
-  EventType2["PointerDown"] = "PointerDown";
-  EventType2["PointerUp"] = "PointerUp";
-  EventType2["PointerMove"] = "PointerMove";
-  EventType2["Drag"] = "Drag";
-  EventType2["DragStart"] = "DragStart";
-  EventType2["DragEnd"] = "DragEnd";
-  EventType2["CompositeCustom"] = "CompositeCustom";
-  EventType2["FrameDidSimulatePhysics"] = "FrameDidSimulatePhysics";
-  return EventType2;
-})(EventType || {});
+const EventType = {
+  SessionInitialize: "SessionInitialize",
+  SessionStart: "SessionStart",
+  SessionEnd: "SessionEnd",
+  ActivityStart: "ActivityStart",
+  ActivityEnd: "ActivityEnd",
+  ActivityCancel: "ActivityCancel",
+  ActivityData: "ActivityData",
+  TapDown: "TapDown",
+  TapUp: "TapUp",
+  TapUpAny: "TapUpAny",
+  TapLeave: "TapLeave",
+  PointerDown: "PointerDown",
+  PointerUp: "PointerUp",
+  PointerMove: "PointerMove",
+  PointerLeave: "PointerLeave",
+  Drag: "Drag",
+  DragStart: "DragStart",
+  DragEnd: "DragEnd",
+  CompositeCustom: "CompositeCustom",
+  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;
@@ -782,21 +832,21 @@ 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;
   }
 }
@@ -822,6 +872,7 @@ class Entity {
     __publicField$g(this, "position", { x: 0, y: 0 });
     // position of the entity in the parent coordinate system
     __publicField$g(this, "scale", 1);
+    __publicField$g(this, "alpha", 1);
     __publicField$g(this, "isUserInteractionEnabled", false);
     __publicField$g(this, "draggable", false);
     __publicField$g(this, "hidden", false);
@@ -833,6 +884,8 @@ class Entity {
     // position within the root coordinate system
     __publicField$g(this, "size", { width: 0, height: 0 });
     __publicField$g(this, "absoluteScale", 1);
+    __publicField$g(this, "absoluteAlpha", 1);
+    __publicField$g(this, "absoluteAlphaChange", 0);
     __publicField$g(this, "actions", new Array());
     __publicField$g(this, "queuedAction");
     __publicField$g(this, "originalActions", new Array());
@@ -846,6 +899,7 @@ class Entity {
     /** 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);
     /** 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
@@ -881,22 +935,25 @@ class Entity {
     } 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.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;
     }
   }
@@ -1130,17 +1187,13 @@ class Entity {
    * the bounds of the entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onTapDown(callback, callbackOptions) {
+  onTapDown(callback, options) {
     this.addEventListener(
       EventType.TapDown,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1152,17 +1205,13 @@ class Entity {
    * beyond the bounds of the entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}ue.
    */
-  onTapUp(callback, callbackOptions) {
+  onTapUp(callback, options) {
     this.addEventListener(
       EventType.TapUp,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1175,17 +1224,13 @@ class Entity {
    * release.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onTapUpAny(callback, callbackOptions) {
+  onTapUpAny(callback, options) {
     this.addEventListener(
       EventType.TapUpAny,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1197,17 +1242,13 @@ class Entity {
    * before the press release.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onTapLeave(callback, callbackOptions) {
+  onTapLeave(callback, options) {
     this.addEventListener(
       EventType.TapLeave,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1217,17 +1258,13 @@ class Entity {
    * the bounds of the entity. It occurs under the same conditions as TapDown.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onPointerDown(callback, callbackOptions) {
+  onPointerDown(callback, options) {
     this.addEventListener(
       EventType.PointerDown,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1239,17 +1276,13 @@ class Entity {
    * previous PointerDown on the entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onPointerUp(callback, callbackOptions) {
+  onPointerUp(callback, options) {
     this.addEventListener(
       EventType.PointerUp,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
@@ -1257,68 +1290,66 @@ class Entity {
    * within the bounds of the entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onPointerMove(callback, callbackOptions) {
+  onPointerMove(callback, options) {
     this.addEventListener(
       EventType.PointerMove,
       callback,
-      callbackOptions
+      options
+    );
+  }
+  /**
+   * Executes a callback when the user moves the pointer (mouse or touches)
+   * outside the bounds of the entity.
+   *
+   * @param callback - function to execute
+   * @param options - {@link CallbackOptions}
+   */
+  onPointerLeave(callback, options) {
+    this.addEventListener(
+      EventType.PointerLeave,
+      callback,
+      options
     );
   }
   /**
    * Executes a callback when the user begins dragging an entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onDragStart(callback, callbackOptions) {
+  onDragStart(callback, options) {
     this.addEventListener(
       EventType.DragStart,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
    * Executes a callback when the user continues dragging an entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onDrag(callback, callbackOptions) {
+  onDrag(callback, options) {
     this.addEventListener(
       EventType.Drag,
       callback,
-      callbackOptions
+      options
     );
   }
   /**
    * Executes a callback when the user stop dragging an entity.
    *
    * @param callback - function to execute
-   * @param replaceExistingCallback  - should the provided callback replace
-   * any existing callbacks of the same event type on this entity? Usually
-   * there should be only one callback defined, instead of chaining multiple
-   * ones. It is strongly recommended not to change this, unless you have a
-   * special use case. Default is true.
+   * @param options - {@link CallbackOptions}
    */
-  onDragEnd(callback, callbackOptions) {
+  onDragEnd(callback, options) {
     this.addEventListener(
       EventType.DragEnd,
       callback,
-      callbackOptions
+      options
     );
   }
   addEventListener(type, callback, callbackOptions) {
@@ -1408,12 +1439,30 @@ 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;
@@ -2368,8 +2417,9 @@ class Sprite extends Entity {
     __publicField$b(this, "_imageName", "");
     // public getter/setter is below
     __publicField$b(this, "loadedImage");
+    __publicField$b(this, "_paint");
     handleInterfaceOptions(this, options);
-    if (options.imageName) {
+    if (options.imageName !== void 0) {
       this.imageName = options.imageName;
     }
   }
@@ -2388,11 +2438,14 @@ 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([(_a = this.loadedImage) == null ? void 0 : _a.image, this._paint]);
   }
   set imageName(imageName) {
     this._imageName = imageName;
@@ -2401,6 +2454,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.
    *
@@ -2436,7 +2500,10 @@ class Sprite extends Entity {
         canvas.scale(1 / drawScale, 1 / drawScale);
         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);
@@ -2521,16 +2588,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() {
@@ -2607,6 +2673,9 @@ class Scene extends Entity {
   onAppear(callback) {
     this._appearCallback = callback;
   }
+  update() {
+    super.update();
+  }
   draw(canvas) {
     canvas.save();
     const drawScale = Globals.canvasScale / this.absoluteScale;
@@ -2614,6 +2683,9 @@ class Scene extends Entity {
     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,
@@ -5338,6 +5410,17 @@ class Game {
       domPointerEvent.offsetY
     )) {
       this.raiseM2PointerMoveEvent(entity, m2Event, domPointerEvent);
+      entity.withinHitArea = true;
+    }
+    if (!this.IsCanvasPointWithinEntityBounds(
+      entity,
+      domPointerEvent.offsetX,
+      domPointerEvent.offsetY
+    )) {
+      if (entity.withinHitArea) {
+        this.raiseM2PointerLeaveEvent(entity, m2Event, domPointerEvent);
+        entity.withinHitArea = false;
+      }
     }
     if (entity.children) {
       entity.children.filter((entity2) => !entity2.hidden).filter((entity2) => entity2.isDrawable).sort(
@@ -5410,6 +5493,15 @@ class Game {
       domPointerEvent
     );
   }
+  raiseM2PointerLeaveEvent(entity, m2Event, domPointerEvent) {
+    m2Event.target = entity;
+    m2Event.type = EventType.PointerLeave;
+    this.raiseEventOnListeningEntities(
+      entity,
+      m2Event,
+      domPointerEvent
+    );
+  }
   raiseM2DragStartEvent(entity, m2Event, domPointerEvent) {
     m2Event.target = entity;
     m2Event.type = EventType.DragStart;
@@ -5524,6 +5616,7 @@ class Game {
           case EventType.PointerDown:
           case EventType.PointerMove:
           case EventType.PointerUp:
+          case EventType.PointerLeave:
             m2Event.point = this.calculatePointWithinEntityFromDomPointerEvent(
               entity,
               domEvent
@@ -5582,11 +5675,14 @@ class Game {
       if (!radius) {
         throw "circleOfRadius is undefined";
       }
-      const center = { x: bb2.xMin + radius, y: bb2.yMin + radius };
+      const center = {
+        x: bb2.xMin + radius * entity.absoluteScale,
+        y: bb2.yMin + radius * entity.absoluteScale
+      };
       const distance = Math.sqrt(
         Math.pow(x - center.x, 2) + Math.pow(y - center.y, 2)
       );
-      return distance <= radius;
+      return distance <= radius * entity.absoluteScale;
     }
     if (entity.size.width === 0 || entity.size.height === 0) {
       return false;
@@ -6081,6 +6177,8 @@ class Label extends Entity {
     __publicField$4(this, "paragraph");
     __publicField$4(this, "paraStyle");
     __publicField$4(this, "builder");
+    __publicField$4(this, "_fontPaint");
+    __publicField$4(this, "_backgroundPaint");
     __publicField$4(this, "_translatedText", "");
     handleInterfaceOptions(this, options);
     if (options.horizontalAlignmentMode) {
@@ -6189,24 +6287,63 @@ 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;
@@ -6234,7 +6371,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;
@@ -6295,6 +6439,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.
    *
@@ -6323,6 +6485,9 @@ class Label extends Entity {
   }
   update() {
     super.update();
+    if (this.absoluteAlphaChange !== 0) {
+      this.initialize();
+    }
   }
   draw(canvas) {
     if (this.parent && this.text !== "") {
@@ -7104,7 +7269,7 @@ class Session {
     __publicField$2(this, "sessionDictionary", /* @__PURE__ */ new Map());
     __publicField$2(this, "canvasKit");
     __publicField$2(this, "initialized", false);
-    __publicField$2(this, "version", "0.3.11 (25099410)");
+    __publicField$2(this, "version", "0.3.13 (f05b4c6d)");
     this.options = options;
     for (const activity of this.options.activities) {
       if (this.options.activities.filter((a) => a === activity).length > 1) {
@@ -7621,7 +7786,6 @@ class Shape extends Entity {
    * @param options - {@link ShapeOptions}
    */
   constructor(options = {}) {
-    var _a;
     super(options);
     __publicField$1(this, "type", EntityType.Shape);
     __publicField$1(this, "isDrawable", true);
@@ -7638,7 +7802,6 @@ class Shape extends Entity {
     __publicField$1(this, "ckPath", null);
     __publicField$1(this, "ckPathWidth");
     __publicField$1(this, "ckPathHeight");
-    __publicField$1(this, "pathSvgString");
     __publicField$1(this, "cornerRadius", 0);
     __publicField$1(this, "_fillColor", Constants.DEFAULT_SHAPE_FILL_COLOR);
     __publicField$1(this, "_strokeColor");
@@ -7653,15 +7816,17 @@ class Shape extends Entity {
     __publicField$1(this, "svgPathScaleForResizing", 1);
     __publicField$1(this, "svgPathWidth", 0);
     __publicField$1(this, "svgPathHeight", 0);
-    __publicField$1(this, "svgPreviousAbsoluteScale", NaN);
     __publicField$1(this, "svgPreviousAbsoluteX", NaN);
     __publicField$1(this, "svgPreviousAbsoluteY", NaN);
-    __publicField$1(this, "pathIsSvgStringPath", false);
+    __publicField$1(this, "svgFirstPathDraw", true);
     handleInterfaceOptions(this, options);
-    if (((_a = options == null ? void 0 : options.path) == null ? void 0 : _a.svgPathString) !== void 0) {
+    if (options.path !== void 0) {
+      this.path = options.path;
       this.shapeType = ShapeType.Path;
-      this.pathIsSvgStringPath = true;
-      this.pathSvgString = options.path.svgPathString;
+      if (this.path.size !== void 0) {
+        this.size.height = this.path.size.height;
+        this.size.width = this.path.size.width;
+      }
       this.svgPathRequestedWidth = options.path.width;
       this.svgPathRequestedHeight = options.path.height;
       if (this.svgPathRequestedHeight !== void 0 && this.svgPathRequestedWidth !== void 0) {
@@ -7712,7 +7877,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) {
@@ -7727,9 +7892,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) {
@@ -7739,28 +7904,29 @@ class Shape extends Entity {
     }
   }
   initialize() {
-    var _a, _b;
-    if (this.shapeType === ShapeType.Path && this.pathIsSvgStringPath) {
-      if (!this.pathSvgString) {
-        throw new Error("SVG Path string is null/undefined");
-      }
-      this.ckPath = this.canvasKit.Path.MakeFromSVGString(this.pathSvgString);
-      if (!this.ckPath) {
-        throw new Error("could not make CanvasKit Path from SVG string");
-      }
-      const bounds = this.ckPath.getBounds();
-      this.svgPathWidth = bounds[2] + (bounds[0] < 0 ? Math.abs(bounds[0]) : 0);
-      this.svgPathHeight = bounds[3] + (bounds[1] < 0 ? Math.abs(bounds[1]) : 0);
-      this.size.width = (_a = this.size.width) != null ? _a : this.svgPathWidth;
-      this.size.height = (_b = this.size.height) != null ? _b : this.svgPathHeight;
-      if (this.svgPathRequestedHeight !== void 0) {
-        this.svgPathScaleForResizing = this.svgPathRequestedHeight / this.svgPathHeight;
-      } else if (this.svgPathRequestedWidth !== void 0) {
-        this.svgPathScaleForResizing = this.svgPathRequestedWidth / this.svgPathWidth;
-      }
-      this.svgPreviousAbsoluteScale = 1;
-      this.svgPreviousAbsoluteX = 0;
-      this.svgPreviousAbsoluteY = 0;
+    if (this.shapeType === ShapeType.Path) {
+      if (this.shapeIsSvgStringPath()) {
+        const pathSvgString = this.path.svgPathString;
+        if (!pathSvgString) {
+          throw new Error("SVG Path string is null/undefined");
+        }
+        this.ckPath = this.canvasKit.Path.MakeFromSVGString(pathSvgString);
+        if (!this.ckPath) {
+          throw new Error("could not make CanvasKit Path from SVG string");
+        }
+        const bounds = this.ckPath.getBounds();
+        this.svgPathWidth = bounds[2] + (bounds[0] < 0 ? Math.abs(bounds[0]) : 0);
+        this.svgPathHeight = bounds[3] + (bounds[1] < 0 ? Math.abs(bounds[1]) : 0);
+        if (this.svgPathRequestedHeight !== void 0) {
+          this.svgPathScaleForResizing = this.svgPathRequestedHeight / this.svgPathHeight;
+        } else if (this.svgPathRequestedWidth !== void 0) {
+          this.svgPathScaleForResizing = this.svgPathRequestedWidth / this.svgPathWidth;
+        }
+        this.size.width = this.svgPathWidth * this.svgPathScaleForResizing;
+        this.size.height = this.svgPathHeight * this.svgPathScaleForResizing;
+        this.svgPreviousAbsoluteX = 0;
+        this.svgPreviousAbsoluteY = 0;
+      }
     }
     if (this.fillColor) {
       this.fillColorPaintAntialiased = CanvasKitHelpers.makePaint(
@@ -7790,10 +7956,12 @@ class Shape extends Entity {
         false
       );
     }
+    this.svgFirstPathDraw = true;
     this.needsInitialization = false;
   }
   dispose() {
     CanvasKitHelpers.Dispose([
+      // use backing fields, since paints may be undefined
       this._strokeColorPaintAntialiased,
       this._strokeColorPaintNotAntialiased,
       this._fillColorPaintAntialiased,
@@ -7838,10 +8006,18 @@ class Shape extends Entity {
     canvas.save();
     const drawScale = Globals.canvasScale / this.absoluteScale;
     canvas.scale(1 / drawScale, 1 / drawScale);
-    if (this.shapeType === ShapeType.Path && !this.pathIsSvgStringPath) {
+    if (this.absoluteAlphaChange !== 0) {
+      this.applyAlphaToPaints(this.absoluteAlpha, [
+        this._fillColorPaintAntialiased,
+        this._fillColorPaintNotAntialiased,
+        this._strokeColorPaintAntialiased,
+        this._strokeColorPaintNotAntialiased
+      ]);
+    }
+    if (this.shapeIsM2Path()) {
       this.drawPathFromM2Path(canvas);
     }
-    if (this.shapeType === ShapeType.Path && this.pathIsSvgStringPath) {
+    if (this.shapeIsSvgStringPath()) {
       this.drawPathFromSvgString(canvas);
     }
     if (this.shapeType === ShapeType.Circle) {
@@ -7853,23 +8029,28 @@ 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.strokeColor && this.strokeColorPaintAntialiased && this.lineWidth) {
-      this.strokeColorPaintAntialiased.setStrokeWidth(
-        this.lineWidth * drawScale
-      );
+      this.strokeColorPaintAntialiased.setStrokeWidth(this.lineWidth);
       const subpaths = this.path.subpaths;
       for (const subpath of subpaths) {
         const points = subpath.flat();
         for (let i = 0; i < points.length - 1; i++) {
           canvas.drawLine(
-            pathOriginX + points[i].x * drawScale,
-            pathOriginY + points[i].y * drawScale,
-            pathOriginX + points[i + 1].x * drawScale,
-            pathOriginY + points[i + 1].y * drawScale,
+            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,
             this.strokeColorPaintAntialiased
           );
         }
@@ -7882,12 +8063,12 @@ class Shape extends Entity {
     }
     const x = this.calculateSvgPathX();
     const y = this.calculateSvgPathY();
-    const drawScale = Globals.canvasScale / this.absoluteScale;
-    const pathScale = drawScale * this.svgPathScaleForResizing * Globals.rootScale;
-    if (this.pathNeedsTransform(pathScale, x, y)) {
+    if (this.pathNeedsTransform(x, y)) {
+      const drawScale = Globals.canvasScale / this.absoluteScale;
+      const pathScale = drawScale * this.svgPathScaleForResizing * Globals.rootScale;
       const matrix = this.calculateTransformationMatrix(pathScale, x, y);
       this.ckPath = this.ckPath.transform(matrix);
-      this.saveSvgPathDrawParameters(pathScale, x, y);
+      this.saveSvgPathAbsolutePosition(x, y);
     }
     if (this.fillColor) {
       const paint = this.getFillPaint();
@@ -7900,25 +8081,38 @@ class Shape extends Entity {
   }
   calculateSvgPathY() {
     const drawScale = Globals.canvasScale / this.absoluteScale;
-    return (this.absolutePosition.y + (this.size.height - this.svgPathHeight * this.svgPathScaleForResizing * Globals.rootScale) / 2 - this.anchorPoint.y * this.size.height) * drawScale;
+    return (this.absolutePosition.y - this.size.height * this.absoluteScale / 2) * drawScale;
   }
   calculateSvgPathX() {
     const drawScale = Globals.canvasScale / this.absoluteScale;
-    return (this.absolutePosition.x + (this.size.width - this.svgPathWidth * this.svgPathScaleForResizing * Globals.rootScale) / 2 - this.anchorPoint.x * this.size.width) * drawScale;
+    return (this.absolutePosition.x - this.size.width * this.absoluteScale / 2) * drawScale;
   }
-  saveSvgPathDrawParameters(pathScale, x, y) {
-    this.svgPreviousAbsoluteScale = pathScale;
+  saveSvgPathAbsolutePosition(x, y) {
     this.svgPreviousAbsoluteX = x;
     this.svgPreviousAbsoluteY = y;
   }
   calculateTransformationMatrix(pathScale, x, y) {
-    const dScale = pathScale / this.svgPreviousAbsoluteScale;
+    let dScale;
+    if (this.svgFirstPathDraw) {
+      dScale = pathScale;
+      this.svgFirstPathDraw = false;
+    } else {
+      dScale = 1;
+    }
     const dX = x - this.svgPreviousAbsoluteX;
     const dY = y - this.svgPreviousAbsoluteY;
     return [dScale, 0, dX, 0, dScale, dY, 0, 0, 1];
   }
-  pathNeedsTransform(pathScale, x, y) {
-    return pathScale !== this.svgPreviousAbsoluteScale || x !== this.svgPreviousAbsoluteX || y !== this.svgPreviousAbsoluteY;
+  pathNeedsTransform(x, y) {
+    return this.svgFirstPathDraw === true || x !== this.svgPreviousAbsoluteX || y !== this.svgPreviousAbsoluteY;
+  }
+  shapeIsSvgStringPath() {
+    var _a;
+    return ((_a = this.path) == null ? void 0 : _a.svgPathString) !== void 0;
+  }
+  shapeIsM2Path() {
+    var _a;
+    return ((_a = this.path) == null ? void 0 : _a.subpaths) !== void 0;
   }
   drawCircle(canvas) {
     if (!this.circleOfRadius) {
@@ -8215,6 +8409,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(
@@ -8254,6 +8451,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
@@ -8329,6 +8529,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();
     }
@@ -8345,5 +8548,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, 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, ScaleAction, Scene, SceneTransition, SequenceAction, Session, Shape, ShapeType, SlideTransition, Sprite, Story, TextLine, Timer, Transition, TransitionDirection, TransitionType, Uuid, WaitAction, WebColors, WebGlInfo, handleInterfaceOptions };
 //# sourceMappingURL=index.js.map