@m2c2kit/core 0.3.11 → 0.3.12

package/dist/index.d.ts

@@ -1248,6 +1248,7 @@ declare class Game implements Activity {
     private raiseTapUpEvent;
     private raiseTapUpAny;
     private raiseM2PointerMoveEvent;
+    private raiseM2PointerLeaveEvent;
     private raiseM2DragStartEvent;
     private raiseM2DragEvent;
     private raiseM2DragEndEvent;
@@ -1681,39 +1682,41 @@ interface Activity {
  */
 interface EventBase {
     /** Type of event. */
-    type: EventType;
+    type: EventType | string;
     /** The object on which the event occurred. */
     target: Entity | Session | Activity;
     /** Has the event been taken care of by the listener and not be dispatched to other targets? */
     handled?: boolean;
 }
 /**
- * The different events that are dispatched by m2c2kit.
+ * The different events that are dispatched by m2c2kit core.
  */
-declare enum 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",
-    Drag = "Drag",
-    DragStart = "DragStart",
-    DragEnd = "DragEnd",
-    CompositeCustom = "CompositeCustom",
-    FrameDidSimulatePhysics = "FrameDidSimulatePhysics"
-}
+declare const EventType: {
+    readonly SessionInitialize: "SessionInitialize";
+    readonly SessionStart: "SessionStart";
+    readonly SessionEnd: "SessionEnd";
+    readonly ActivityStart: "ActivityStart";
+    readonly ActivityEnd: "ActivityEnd";
+    readonly ActivityCancel: "ActivityCancel";
+    readonly ActivityData: "ActivityData";
+    readonly TapDown: "TapDown";
+    readonly TapUp: "TapUp";
+    readonly TapUpAny: "TapUpAny";
+    readonly TapLeave: "TapLeave";
+    readonly PointerDown: "PointerDown";
+    readonly PointerUp: "PointerUp";
+    readonly PointerMove: "PointerMove";
+    readonly PointerLeave: "PointerLeave";
+    readonly Drag: "Drag";
+    readonly DragStart: "DragStart";
+    readonly DragEnd: "DragEnd";
+    readonly CompositeCustom: "CompositeCustom";
+    readonly FrameDidSimulatePhysics: "FrameDidSimulatePhysics";
+};
+type EventType = (typeof EventType)[keyof typeof EventType];
 
 interface EntityEventListener {
-    type: EventType;
+    type: EventType | string;
     /** For composites that raise events, type of the composite custom event. */
     compositeType?: string;
     entityUuid: string;
@@ -1810,6 +1813,7 @@ declare abstract class Entity implements EntityOptions {
     /** Is the entity in a pressed state? E.g., did the user put the pointer
      * down on the entity and not yet release it? */
     pressed: boolean;
+    withinHitArea: boolean;
     /** 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
@@ -1915,13 +1919,9 @@ declare abstract class Entity implements EntityOptions {
      * 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: (tapEvent: TapEvent) => void, callbackOptions?: CallbackOptions): void;
+    onTapDown(callback: (tapEvent: TapEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the user releases a press, that has been fully
      * within the entity, from the entity.
@@ -1931,13 +1931,9 @@ declare abstract class Entity implements EntityOptions {
      * 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: (tapEvent: TapEvent) => void, callbackOptions?: CallbackOptions): void;
+    onTapUp(callback: (tapEvent: TapEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the user releases a press from the entity within
      * the bounds of the entity.
@@ -1948,13 +1944,9 @@ declare abstract class Entity implements EntityOptions {
      * 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: (tapEvent: TapEvent) => void, callbackOptions?: CallbackOptions): void;
+    onTapUpAny(callback: (tapEvent: TapEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the user moves the pointer (mouse, touches) beyond
      * the bounds of the entity while the pointer is down.
@@ -1964,13 +1956,9 @@ declare abstract class Entity implements EntityOptions {
      * 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: (tapEvent: TapEvent) => void, callbackOptions?: CallbackOptions): void;
+    onTapLeave(callback: (tapEvent: TapEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the pointer first is down on the entity.
      *
@@ -1978,13 +1966,9 @@ declare abstract class Entity implements EntityOptions {
      * 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: (m2PointerEvent: M2PointerEvent) => void, callbackOptions?: CallbackOptions): void;
+    onPointerDown(callback: (m2PointerEvent: M2PointerEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the user releases a press from the entity within
      * the bounds of the entity.
@@ -1994,59 +1978,47 @@ declare abstract class Entity implements EntityOptions {
      * 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: (m2PointerEvent: M2PointerEvent) => void, callbackOptions?: CallbackOptions): void;
+    onPointerUp(callback: (m2PointerEvent: M2PointerEvent) => void, options?: CallbackOptions): void;
     /**
      * Executes a callback when the user moves the pointer (mouse or touches)
      * 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: (m2PointerEvent: M2PointerEvent) => void, callbackOptions?: CallbackOptions): void;
+    onPointerMove(callback: (m2PointerEvent: M2PointerEvent) => void, options?: CallbackOptions): void;
+    /**
+     * 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: (m2PointerEvent: M2PointerEvent) => void, options?: CallbackOptions): void;
     /**
      * 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: (m2DragEvent: M2DragEvent) => void, callbackOptions?: CallbackOptions): void;
+    onDragStart(callback: (m2DragEvent: M2DragEvent) => void, options?: CallbackOptions): void;
     /**
      * 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: (m2DragEvent: M2DragEvent) => void, callbackOptions?: CallbackOptions): void;
+    onDrag(callback: (m2DragEvent: M2DragEvent) => void, options?: CallbackOptions): void;
     /**
      * 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.
-     */
-    onDragEnd(callback: (m2DragEvent: M2DragEvent) => void, callbackOptions?: CallbackOptions): void;
-    addEventListener(type: EventType, callback: (ev: EntityEvent) => void, callbackOptions?: CallbackOptions): void;
+     * @param options - {@link CallbackOptions}
+     */
+    onDragEnd(callback: (m2DragEvent: M2DragEvent) => void, options?: CallbackOptions): void;
+    addEventListener(type: EventType | string, callback: (ev: EntityEvent) => void, callbackOptions?: CallbackOptions): void;
     private parseLayoutConstraints;
     private calculateYFromConstraint;
     private calculateXFromConstraint;
@@ -2685,7 +2657,6 @@ declare class Shape extends Entity implements IDrawable, ShapeOptions {
     ckPath: Path | null;
     ckPathWidth?: number;
     ckPathHeight?: number;
-    pathSvgString?: string;
     cornerRadius: number;
     private _fillColor;
     private _strokeColor?;
@@ -2700,10 +2671,9 @@ declare class Shape extends Entity implements IDrawable, ShapeOptions {
     private svgPathScaleForResizing;
     private svgPathWidth;
     private svgPathHeight;
-    private svgPreviousAbsoluteScale;
     private svgPreviousAbsoluteX;
     private svgPreviousAbsoluteY;
-    private pathIsSvgStringPath;
+    private svgFirstPathDraw;
     /**
      * Rectangular, circular, or path-based shape
      *
@@ -2729,9 +2699,11 @@ declare class Shape extends Entity implements IDrawable, ShapeOptions {
     private drawPathFromSvgString;
     private calculateSvgPathY;
     private calculateSvgPathX;
-    private saveSvgPathDrawParameters;
+    private saveSvgPathAbsolutePosition;
     private calculateTransformationMatrix;
     private pathNeedsTransform;
+    private shapeIsSvgStringPath;
+    private shapeIsM2Path;
     private drawCircle;
     private drawRectangle;
     private drawCircleWithCanvasKit;
@@ -3132,4 +3104,4 @@ declare class WebGlInfo {
     static dispose(): void;
 }
 
-export { Action, Activity, ActivityKeyValueData, ActivityLifecycleEvent, ActivityResultsEvent, ActivityType, BrowserImage, CallbackOptions, CanvasKitHelpers, Composite, CompositeOptions, Constants, ConstraintType, Constraints, CustomAction, CustomActionOptions, DefaultParameter, Dimensions, DrawableOptions, EasingFunction, Easings, Entity, EntityEvent, EntityEventListener, EntityOptions, EntityType, Equals, EventBase, EventListenerBase, EventType, FontData, FontManager, Game, GameData, GameOptions, GameParameters, GlobalVariables, GoToActivityOptions, GroupAction, I18n, IDataStore, IDrawable, IText, ImageManager, Label, LabelHorizontalAlignmentMode, LabelOptions, Layout, LayoutConstraint, LoadedImage, M2DragEvent, M2Path, MoveAction, MoveActionOptions, MutablePath, NoneTransition, Point, RandomDraws, RectOptions, RgbaColor, ScaleAction, ScaleActionOptions, Scene, SceneOptions, SceneTransition, SequenceAction, Session, SessionDictionaryValues, SessionLifecycleEvent, SessionOptions, Shape, ShapeOptions, ShapeType, Size, SlideTransition, SlideTransitionOptions, Sprite, SpriteOptions, Story, StoryOptions, TapEvent, TextLine, TextLineOptions, TextOptions, Timer, Transition, TransitionDirection, TransitionType, Translations, TrialData, TrialSchema, Uuid, WaitAction, WaitActionOptions, WebColors, WebGlInfo, handleInterfaceOptions };
+export { Action, Activity, ActivityKeyValueData, ActivityLifecycleEvent, ActivityResultsEvent, ActivityType, BrowserImage, CallbackOptions, CanvasKitHelpers, Composite, CompositeOptions, Constants, ConstraintType, Constraints, CustomAction, CustomActionOptions, DefaultParameter, Dimensions, DrawableOptions, EasingFunction, Easings, Entity, EntityEvent, EntityEventListener, EntityOptions, EntityType, Equals, EventBase, EventListenerBase, EventType, FontData, FontManager, Game, GameData, GameOptions, GameParameters, GlobalVariables, GoToActivityOptions, GroupAction, I18n, IDataStore, IDrawable, IText, ImageManager, Label, LabelHorizontalAlignmentMode, LabelOptions, Layout, LayoutConstraint, LoadedImage, M2DragEvent, M2Path, M2PointerEvent, MoveAction, MoveActionOptions, MutablePath, NoneTransition, Point, RandomDraws, RectOptions, RgbaColor, ScaleAction, ScaleActionOptions, Scene, SceneOptions, SceneTransition, SequenceAction, Session, SessionDictionaryValues, SessionLifecycleEvent, SessionOptions, Shape, ShapeOptions, ShapeType, Size, SlideTransition, SlideTransitionOptions, Sprite, SpriteOptions, Story, StoryOptions, TapEvent, TextLine, TextLineOptions, TextOptions, Timer, Transition, TransitionDirection, TransitionType, Translations, TrialData, TrialSchema, Uuid, WaitAction, WaitActionOptions, WebColors, WebGlInfo, handleInterfaceOptions };

package/dist/index.js

@@ -749,28 +749,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;
@@ -846,6 +846,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
@@ -1130,17 +1131,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 +1149,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 +1168,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 +1186,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 +1202,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 +1220,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 +1234,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) {
@@ -5338,6 +5313,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 +5396,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 +5519,7 @@ class Game {
           case EventType.PointerDown:
           case EventType.PointerMove:
           case EventType.PointerUp:
+          case EventType.PointerLeave:
             m2Event.point = this.calculatePointWithinEntityFromDomPointerEvent(
               entity,
               domEvent
@@ -5582,11 +5578,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;
@@ -7104,7 +7103,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.12 (291d0cee)");
     this.options = options;
     for (const activity of this.options.activities) {
       if (this.options.activities.filter((a) => a === activity).length > 1) {
@@ -7621,7 +7620,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 +7636,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 +7650,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) {
@@ -7739,28 +7738,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,6 +7790,7 @@ class Shape extends Entity {
         false
       );
     }
+    this.svgFirstPathDraw = true;
     this.needsInitialization = false;
   }
   dispose() {
@@ -7838,10 +7839,10 @@ 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.shapeIsM2Path()) {
       this.drawPathFromM2Path(canvas);
     }
-    if (this.shapeType === ShapeType.Path && this.pathIsSvgStringPath) {
+    if (this.shapeIsSvgStringPath()) {
       this.drawPathFromSvgString(canvas);
     }
     if (this.shapeType === ShapeType.Circle) {
@@ -7858,18 +7859,16 @@ class Shape extends Entity {
     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 +7881,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 +7899,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) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@m2c2kit/core",
-  "version": "0.3.11",
+  "version": "0.3.12",
   "description": "The m2c2kit core functionality",
   "main": "dist/index.js",
   "module": "dist/index.js",