@drincs/pixi-vn 0.1.3 → 0.1.4

package/dist/index.js

@@ -82,14 +82,14 @@ __export(src_exports, {
   CanvasImage: () => CanvasImage,
   CanvasSprite: () => CanvasSprite,
   CanvasText: () => CanvasText,
-  CharacterModelBase: () => CharacterModelBase,
+  CharacterModelBase: () => CharacterModelBase2,
+  ChoiceMenuOptionLabel: () => ChoiceMenuOptionLabel,
   DialogueModelBase: () => DialogueModelBase,
   GameStepManager: () => GameStepManager,
   GameStorageManager: () => GameStorageManager,
   GameWindowManager: () => GameWindowManager,
   Label: () => Label,
   LabelRunModeEnum: () => LabelRunModeEnum,
-  MenuOptionLabel: () => MenuOptionLabel,
   Pause: () => Pause,
   PauseValueType: () => PauseValueType,
   Repeat: () => Repeat,
@@ -100,25 +100,25 @@ __export(src_exports, {
   addImage: () => addImage,
   canvasElementDecorator: () => canvasElementDecorator,
   clearAllGameDatas: () => clearAllGameDatas,
+  clearChoiceMenuOptions: () => clearChoiceMenuOptions,
   clearDialogue: () => clearDialogue,
-  clearMenuOptions: () => clearMenuOptions,
   eventDecorator: () => eventDecorator,
-  getCharacterByTag: () => getCharacterByTag,
+  getCharacterById: () => getCharacterById,
+  getChoiceMenuOptions: () => getChoiceMenuOptions,
   getDialogue: () => getDialogue,
   getDialogueHistory: () => getDialogueHistory,
-  getMenuOptions: () => getMenuOptions,
   getSaveData: () => getSaveData,
   getSaveJson: () => getSaveJson,
   getTexture: () => getTexture,
   labelDecorator: () => labelDecorator,
-  loadSave: () => loadSave,
-  loadSaveJsonString: () => loadSaveJsonString,
+  loadSaveData: () => loadSaveData,
+  loadSaveJson: () => loadSaveJson,
   removeCanvasElement: () => removeCanvasElement,
   saveCharacter: () => saveCharacter,
+  setChoiceMenuOptions: () => setChoiceMenuOptions,
   setDialogue: () => setDialogue,
-  setMenuOptions: () => setMenuOptions,
   showCanvasImages: () => showCanvasImages,
-  showImageWithDisolveEffect: () => showImageWithDisolveEffect,
+  showImageWithDissolveTransition: () => showImageWithDissolveTransition,
   tickerDecorator: () => tickerDecorator
 });
 module.exports = __toCommonJS(src_exports);
@@ -126,10 +126,13 @@ module.exports = __toCommonJS(src_exports);
 // src/classes/CanvasEvent.ts
 var CanvasEvent = class {
   fn(_event, _element) {
-    throw new Error("[Pixi'VM] The method CanvasEvent.fn() must be overridden");
+    throw new Error("[Pixi'VN] The method CanvasEvent.fn() must be overridden");
   }
 };
 
+// src/managers/StepManager.ts
+var import_deep_diff = require("deep-diff");
+
 // src/decorators/LabelDecorator.ts
 var registeredLabels = {};
 function labelDecorator(name) {
@@ -138,7 +141,7 @@ function labelDecorator(name) {
       name = target.name;
     }
     if (registeredLabels[name]) {
-      console.warn(`Label ${name} already exists, it will be overwritten`);
+      console.warn(`[Pixi'VN] Label ${name} already exists, it will be overwritten`);
     }
     registeredLabels[name] = target;
   };
@@ -147,13 +150,13 @@ function getLabelTypeByClassName(labelName) {
   try {
     let labelType = registeredLabels[labelName];
     if (!labelType) {
-      console.error(`Label ${labelName} not found`);
+      console.error(`[Pixi'VN] Label ${labelName} not found`);
       return;
     }
     new labelType();
     return labelType;
   } catch (e) {
-    console.error(e);
+    console.error(`[Pixi'VN] Error while getting Label ${labelName}`, e);
     return;
   }
 }
@@ -161,218 +164,244 @@ function getLabelInstanceByClassName(labelName) {
   try {
     let labelType = registeredLabels[labelName];
     if (!labelType) {
-      console.error(`Label ${labelName} not found`);
+      console.error(`[Pixi'VN] Label ${labelName} not found`);
       return;
     }
     let label = new labelType();
     let step = label.steps;
     if (step.length = 0) {
-      console.warn(`Label ${labelName} has no steps`);
+      console.warn(`[Pixi'VN] Label ${labelName} has no steps`);
     }
     return label;
   } catch (e) {
-    console.error(e);
+    console.error(`[Pixi'VN] Error while getting Label ${labelName}`, e);
     return;
   }
 }
 
-// src/functions/ExportUtility.ts
-function createExportElement(element) {
-  try {
-    let elementString = JSON.stringify(element);
-    return JSON.parse(elementString);
-  } catch (e) {
-    throw new Error("[Pixi'VM] The element could not be created");
+// src/functions/DialogueUtility.ts
+function setDialogue(props) {
+  let text = "";
+  let characterId = void 0;
+  if (typeof props === "string") {
+    text = props;
+  } else {
+    text = props.text;
+    if (props.character) {
+      if (typeof props.character === "string") {
+        characterId = props.character;
+      } else {
+        characterId = props.character.id;
+      }
+    }
   }
+  let dialogue = new DialogueModelBase(text, characterId);
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY, dialogue);
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY, GameStepManager.lastStepIndex);
 }
-
-// src/functions/StepLabelUtility.ts
-var import_sha1 = __toESM(require("crypto-js/sha1"));
-function getStepSha1(step) {
-  let sha1String = (0, import_sha1.default)(step.toString().toLocaleLowerCase());
-  return sha1String.toString();
+function getDialogue() {
+  return GameStorageManager.getVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY);
 }
-function checkIfStepsIsEqual(step1, step2) {
-  return step1 === step2;
+function clearDialogue() {
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY, void 0);
 }
-
-// src/managers/StorageManager.ts
-var _GameStorageManager = class _GameStorageManager {
-  constructor() {
-  }
-  static get keysSystem() {
-    return {
-      CURRENT_DIALOGUE_MEMORY_KEY: "current_dialogue_memory_key",
-      LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY: "last_dialogue_added_in_step_memory_key",
-      CURRENT_MENU_OPTIONS_MEMORY_KEY: "current_menu_options_memory_key"
-    };
-  }
-  /**
-   * Get a new oid that is not used yet
-   * @returns A new oid that is not used yet
-   */
-  static getNewOid() {
-    let oid = "";
-    do {
-      oid = Math.random().toString(36).substring(2, 15) + Math.random().toString(36).substring(2, 15);
-    } while (_GameStorageManager.oidsUsed.includes(oid));
-    _GameStorageManager.oidsUsed.push(oid);
-    return oid;
+function setChoiceMenuOptions(options) {
+  let value = options.map((option) => {
+    return __spreadProps(__spreadValues({}, option), {
+      label: option.label.name
+    });
+  });
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY, value);
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.LAST_MENU_OPTIONS_ADDED_IN_STEP_MEMORY_KEY, GameStepManager.lastStepIndex);
+}
+function getChoiceMenuOptions() {
+  let d = GameStorageManager.getVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY);
+  if (d) {
+    let options = [];
+    d.forEach((option) => {
+      let label = getLabelTypeByClassName(option.label);
+      if (label) {
+        options.push(__spreadProps(__spreadValues({}, option), {
+          label
+        }));
+      }
+    });
+    return options;
   }
-  /**
-   * Set a variable in the storage
-   * @param key The key of the variable
-   * @param value The value of the variable. If undefined, the variable will be removed
-   * @returns
-   */
-  static setVariable(key, value) {
-    key = key.toLowerCase();
-    if (value === void 0) {
-      if (_GameStorageManager.storage.hasOwnProperty(key)) {
-        delete _GameStorageManager.storage[key];
+  return void 0;
+}
+function clearChoiceMenuOptions() {
+  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY, void 0);
+}
+function getDialogueHistory() {
+  let list = [];
+  GameStepManager.stepsHistory.forEach((step) => {
+    let dialoge = step.dialoge;
+    let requiredChoices = step.choices;
+    if (list.length > 0 && list[list.length - 1].choices && !list[list.length - 1].choiceMade && step.currentLabel) {
+      let oldChoices = list[list.length - 1].choices;
+      if (oldChoices) {
+        list[list.length - 1].choiceMade = oldChoices.find((choice) => choice.label === step.currentLabel);
       }
-      return;
     }
-    _GameStorageManager.storage[key] = value;
-  }
-  /**
-   * Get a variable from the storage
-   * @param key The key of the variable
-   * @returns The value of the variable. If the variable does not exist, it will return undefined
-   */
-  static getVariable(key) {
-    key = key.toLowerCase();
-    if (_GameStorageManager.storage.hasOwnProperty(key)) {
-      return _GameStorageManager.storage[key];
+    if (dialoge || requiredChoices) {
+      list.push({
+        dialoge,
+        choiceMade: void 0,
+        choices: requiredChoices,
+        stepIndex: step.index
+      });
     }
-    return void 0;
-  }
+  });
+  return list;
+}
+
+// src/functions/GameUtility.ts
+function clearAllGameDatas() {
+  GameStorageManager.clear();
+  GameWindowManager.clear();
+  GameStepManager.clear();
+}
+
+// src/classes/canvas/CanvasBase.ts
+var import_pixi = require("pixi.js");
+var CanvasBase = class extends import_pixi.Container {
   /**
-   * Remove a variable from the storage
-   * @param key The key of the variable
-   * @returns
+   * This method return the memory of the canvas element.
    */
-  static removeVariable(key) {
-    key = key.toLowerCase();
-    if (_GameStorageManager.storage.hasOwnProperty(key)) {
-      delete _GameStorageManager.storage[key];
-    }
+  get memory() {
+    throw new Error("[Pixi'VN] The method CanvasBase.memory must be overridden");
   }
   /**
-   * Clear the storage and the oidsUsed
-   * @returns
+   * This method set the memory of the canvas element.
    */
-  static clear() {
-    _GameStorageManager.oidsUsed = [];
-    _GameStorageManager.storage = {};
-  }
-  static exportJson() {
-    return JSON.stringify(this.export());
-  }
-  static export() {
-    return {
-      storage: createExportElement(_GameStorageManager.storage),
-      stepOidUsedList: createExportElement(_GameStorageManager.oidsUsed)
-    };
-  }
-  static importJson(dataString) {
-    _GameStorageManager.import(JSON.parse(dataString));
-  }
-  static import(data) {
-    _GameStorageManager.clear();
-    try {
-      if (data.hasOwnProperty("storage")) {
-        _GameStorageManager.storage = data["storage"];
-      } else {
-        console.warn("[Pixi'VM] No storage data found");
-      }
-      if (data.hasOwnProperty("stepOidUsedList")) {
-        _GameStorageManager.oidsUsed = data["stepOidUsedList"];
-      } else {
-        console.warn("[Pixi'VM] No stepOidUsed data found");
-      }
-    } catch (e) {
-      console.error("[Pixi'VM] Error importing data", e);
-    }
+  set memory(_value) {
+    throw new Error("[Pixi'VN] The method CanvasBase.memory must be overridden");
   }
 };
-_GameStorageManager.oidsUsed = [];
-_GameStorageManager.storage = {};
-var GameStorageManager = _GameStorageManager;
 
-// src/managers/WindowManager.ts
-var import_pixi = require("pixi.js");
+// src/classes/canvas/CanvasContainer.ts
+var import_pixi2 = require("pixi.js");
 
-// src/classes/ticker/TickerBase.ts
-var TickerBase = class {
-  constructor(args, duration, priority) {
-    this.args = args;
-    this.duration = duration;
-    this.priority = priority;
+// src/decorators/CanvasElementDecorator.ts
+var registeredCanvasElement = {};
+function canvasElementDecorator(name) {
+  return function(target) {
+    if (!name) {
+      name = target.name;
+    }
+    if (registeredCanvasElement[name]) {
+      console.warn(`[Pixi'VN] CanvasElement ${name} already registered`);
+    }
+    registeredCanvasElement[name] = target;
+  };
+}
+function getCanvasElementInstanceByClassName(canvasName) {
+  try {
+    let eventType = registeredCanvasElement[canvasName];
+    if (!eventType) {
+      console.error(`[Pixi'VN] CanvasElement ${canvasName} not found`);
+      return;
+    }
+    let canvasElement = new eventType();
+    return canvasElement;
+  } catch (e) {
+    console.error(`[Pixi'VN] Error while getting CanvasElement ${canvasName}`, e);
+    return;
   }
-  /**
-   * The method that will be called every frame.
-   * This method should be overridden and you can use GameWindowManager.addCanvasElement() to get the canvas element of the canvas, and edit them.
-   * @param t The ticker that is calling this method
-   * @param args The arguments that you passed when you added the ticker
-   * @param tags The tags of the canvas elements that are connected to this ticker
-   */
-  fn(_t, _args, _tags) {
-    throw new Error("[Pixi'VM] The method TickerBase.fn() must be overridden");
+}
+
+// src/decorators/CharacterDecorator.ts
+var registeredCharacters = {};
+function saveCharacter(character) {
+  if (Array.isArray(character)) {
+    character.forEach((c) => saveCharacter(c));
+    return;
   }
-};
+  if (registeredCharacters[character.id]) {
+    console.warn(`[Pixi'VN] Character id ${character.id} already exists, it will be overwritten`);
+  }
+  registeredCharacters[character.id] = character;
+}
+function getCharacterById(id) {
+  try {
+    let character = registeredCharacters[id];
+    if (!character) {
+      console.error(`[Pixi'VN] Character ${id} not found`);
+      return;
+    }
+    return character;
+  } catch (e) {
+    console.error(`[Pixi'VN] Error while getting Character ${id}`, e);
+    return;
+  }
+}
 
-// src/decorators/TickerDecorator.ts
-var registeredTickers = {};
-function tickerDecorator(name) {
+// src/decorators/EventDecorator.ts
+var registeredEvents = {};
+function eventDecorator(name) {
   return function(target) {
     if (!name) {
       name = target.name;
     }
-    if (registeredTickers[name]) {
-      console.warn(`Ticker ${name} already exists, it will be overwritten`);
+    if (registeredEvents[name]) {
+      console.warn(`[Pixi'VN] Event ${name} already exists, it will be overwritten`);
     }
-    registeredTickers[name] = target;
+    registeredEvents[name] = target;
   };
 }
-function geTickerInstanceByClassName(tickerName, args, duration, priority) {
+function getEventTypeByClassName(eventName) {
   try {
-    let ticker = registeredTickers[tickerName];
-    if (!ticker) {
-      console.error(`Ticker ${tickerName} not found`);
+    let eventType = registeredEvents[eventName];
+    if (!eventType) {
+      console.error(`[Pixi'VN] Event ${eventName} not found`);
       return;
     }
-    return new ticker(args, duration, priority);
+    new eventType();
+    return eventType;
+  } catch (e) {
+    console.error(`[Pixi'VN] Error while getting Event ${eventName}`, e);
+    return;
+  }
+}
+function getEventInstanceByClassName(eventName) {
+  try {
+    let eventType = registeredEvents[eventName];
+    if (!eventType) {
+      console.error(`[Pixi'VN] Event ${eventName} not found`);
+      return;
+    }
+    let event = new eventType();
+    return event;
   } catch (e) {
-    console.error(e);
+    console.error(`[Pixi'VN] Error while getting Event ${eventName}`, e);
     return;
   }
 }
 
-// src/decorators/CanvasElementDecorator.ts
-var registeredCanvasElement = {};
-function canvasElementDecorator(name) {
+// src/decorators/TickerDecorator.ts
+var registeredTickers = {};
+function tickerDecorator(name) {
   return function(target) {
     if (!name) {
       name = target.name;
     }
-    if (registeredCanvasElement[name]) {
-      console.warn(`CanvasElement ${name} already registered`);
+    if (registeredTickers[name]) {
+      console.warn(`[Pixi'VN] Ticker ${name} already exists, it will be overwritten`);
     }
-    registeredCanvasElement[name] = target;
+    registeredTickers[name] = target;
   };
 }
-function getCanvasElementInstanceByClassName(canvasName) {
+function geTickerInstanceByClassName(tickerName, args, duration, priority) {
   try {
-    let eventType = registeredCanvasElement[canvasName];
-    if (!eventType) {
-      console.error(`CanvasElement ${canvasName} not found`);
+    let ticker = registeredTickers[tickerName];
+    if (!ticker) {
+      console.error(`[Pixi'VN] Ticker ${tickerName} not found`);
       return;
     }
-    let canvasElement = new eventType();
-    return canvasElement;
+    return new ticker(args, duration, priority);
   } catch (e) {
-    console.error(e);
+    console.error(`[Pixi'VN] Error while getting Ticker ${tickerName}`, e);
     return;
   }
 }
@@ -393,1856 +422,1953 @@ function importCanvasElement(memory) {
   if (element) {
     element.memory = memory;
   } else {
-    throw new Error("[Pixi'VM] The element could not be created");
+    throw new Error("[Pixi'VN] The element " + memory.className + "could not be created");
   }
   return element;
 }
 
-// src/types/PauseType.ts
-var PauseValueType = "Pause";
-function Pause(duration) {
+// src/classes/canvas/CanvasContainer.ts
+var CanvasContainer = class extends import_pixi2.Container {
+  get memory() {
+    let memory = getMemoryContainer(this);
+    this.children.forEach((child) => {
+      memory.elements.push(exportCanvasElement(child));
+    });
+    return memory;
+  }
+  set memory(value) {
+    setMemoryContainer(this, value);
+    value.elements.forEach((child) => {
+      this.addChild(importCanvasElement(child));
+    });
+  }
+};
+CanvasContainer = __decorateClass([
+  canvasElementDecorator()
+], CanvasContainer);
+function getMemoryContainer(element) {
   return {
-    type: PauseValueType,
-    duration
+    className: "CanvasContainer",
+    elements: [],
+    width: element.width,
+    height: element.height,
+    isRenderGroup: element.isRenderGroup,
+    blendMode: element.blendMode,
+    tint: element.tint,
+    alpha: element.alpha,
+    angle: element.angle,
+    renderable: element.renderable,
+    rotation: element.rotation,
+    scale: { x: element.scale.x, y: element.scale.y },
+    pivot: { x: element.pivot.x, y: element.pivot.y },
+    position: { x: element.position.x, y: element.position.y },
+    skew: { x: element.skew.x, y: element.skew.y },
+    visible: element.visible,
+    culled: element.culled,
+    x: element.x,
+    y: element.y,
+    boundsArea: element.boundsArea,
+    cursor: element.cursor,
+    eventMode: element.eventMode,
+    interactive: element.interactive,
+    interactiveChildren: element.interactiveChildren,
+    hitArea: element.hitArea
   };
 }
+function setMemoryContainer(element, memory) {
+  memory.width && (element.width = memory.width);
+  memory.height && (element.height = memory.height);
+  memory.isRenderGroup && (element.isRenderGroup = memory.isRenderGroup);
+  memory.blendMode && (element.blendMode = memory.blendMode);
+  memory.tint && (element.tint = memory.tint);
+  memory.alpha && (element.alpha = memory.alpha);
+  memory.angle && (element.angle = memory.angle);
+  memory.renderable && (element.renderable = memory.renderable);
+  memory.rotation && (element.rotation = memory.rotation);
+  if (memory.scale) {
+    if (typeof memory.scale === "number") {
+      element.scale.set(memory.scale, memory.scale);
+    } else {
+      element.scale.set(memory.scale.x, memory.scale.y);
+    }
+  }
+  if (memory.pivot) {
+    if (typeof memory.pivot === "number") {
+      element.pivot.set(memory.pivot, memory.pivot);
+    } else {
+      element.pivot.set(memory.pivot.x, memory.pivot.y);
+    }
+  }
+  memory.position && element.position.set(memory.position.x, memory.position.y);
+  memory.skew && element.skew.set(memory.skew.x, memory.skew.y);
+  memory.visible && (element.visible = memory.visible);
+  memory.culled && (element.culled = memory.culled);
+  memory.x && (element.x = memory.x);
+  memory.y && (element.y = memory.y);
+  memory.boundsArea && (element.boundsArea = memory.boundsArea);
+  memory.cursor && (element.cursor = memory.cursor);
+  memory.eventMode && (element.eventMode = memory.eventMode);
+  memory.interactive && (element.interactive = memory.interactive);
+  memory.interactiveChildren && (element.interactiveChildren = memory.interactiveChildren);
+  memory.hitArea && (element.hitArea = memory.hitArea);
+}
 
-// src/types/RepeatType.ts
-var Repeat = "Repeat";
+// src/classes/canvas/CanvasImage.ts
+var import_pixi5 = require("pixi.js");
 
-// src/managers/WindowManager.ts
-var _GameWindowManager = class _GameWindowManager {
+// src/functions/TextureUtility.ts
+var import_pixi3 = require("pixi.js");
+function getTexture(imageUrl) {
+  return __async(this, null, function* () {
+    if (import_pixi3.Assets.cache.has(imageUrl)) {
+      return import_pixi3.Assets.get(imageUrl);
+    }
+    return import_pixi3.Assets.load(imageUrl).then((texture) => {
+      if (!texture) {
+        console.error("[Pixi'VN] Texture not found", imageUrl);
+        return;
+      }
+      if (!(texture instanceof import_pixi3.Texture)) {
+        console.error("[Pixi'VN] File not is a image", imageUrl);
+        return;
+      }
+      return texture;
+    }).catch((e) => {
+      console.error("[Pixi'VN] Error loading image", e);
+      return;
+    });
+  });
+}
+function getTextStyle(style) {
+  let fill = style.fill;
+  if (fill instanceof Object) {
+    console.warn("[Pixi'VN] CanvasText.style.fill is a FillGradient or FillPattern, this is not supported yet.", fill);
+    fill = "#00FF00";
+  }
+  return {
+    align: style.align,
+    breakWords: style.breakWords,
+    dropShadow: style.dropShadow,
+    fill,
+    fontFamily: style.fontFamily,
+    fontSize: style.fontSize,
+    fontStyle: style.fontStyle,
+    fontVariant: style.fontVariant,
+    fontWeight: style.fontWeight,
+    leading: style.leading,
+    letterSpacing: style.letterSpacing,
+    lineHeight: style.lineHeight,
+    padding: style.padding,
+    stroke: style.stroke,
+    textBaseline: style.textBaseline,
+    trim: style.trim,
+    whiteSpace: style.whiteSpace,
+    wordWrap: style.wordWrap,
+    wordWrapWidth: style.wordWrapWidth
+  };
+}
+
+// src/classes/canvas/CanvasSprite.ts
+var import_pixi4 = require("pixi.js");
+var CanvasSprite = class extends import_pixi4.Sprite {
   constructor() {
+    super(...arguments);
+    this._onEvents = {};
   }
-  /**
-   * The PIXI Application instance.
-   * It not recommended to use this property directly.
-   */
-  static get app() {
-    if (!_GameWindowManager._app) {
-      throw new Error("[Pixi'VM] GameWindowManager.app is undefined");
-    }
-    return _GameWindowManager._app;
+  get memory() {
+    return getMemorySprite(this);
   }
-  /**
-   * If the manager is initialized.
-   */
-  static get isInitialized() {
-    return _GameWindowManager._isInitialized;
+  set memory(value) {
+    setMemorySprite(this, value);
   }
-  static get screen() {
-    return _GameWindowManager.app.screen;
+  get onEvents() {
+    return this._onEvents;
   }
   /**
-   * Initialize the PIXI Application and the interface div.
-   * This method should be called before any other method.
-   * @param element The html element where I will put the canvas. Example: document.body
-   * @param width The width of the canvas
-   * @param height The height of the canvas
-   * @param options The options of PIXI Application
+   * is same function as on(), but it keeps in memory the children.
+   * @param event The event type, e.g., 'click', 'mousedown', 'mouseup', 'pointerdown', etc.
+   * @param eventClass The class that extends CanvasEvent.
+   * @returns 
    * @example
    * ```typescript
-   * const body = document.body
-   * if (!body) {
-   *     throw new Error('body element not found')
+   * \@eventDecorator()
+   * export class EventTest extends CanvasEvent<CanvasSprite> {
+   *     override fn(event: CanvasEventNamesType, sprite: CanvasSprite): void {
+   *         if (event === 'pointerdown') {
+   *             sprite.scale.x *= 1.25;
+   *             sprite.scale.y *= 1.25;
+   *         }
+   *     }
    * }
-   * await GameWindowManager.initialize(body, 1920, 1080, {
-   *     backgroundColor: "#303030"
-   * })
+   * ```
+   * 
+   * ```typescript
+   * let sprite = addImage("alien", 'https://pixijs.com/assets/eggHead.png')
+   * await sprite.load()
+   *
+   * sprite.eventMode = 'static';
+   * sprite.cursor = 'pointer';
+   * sprite.onEvent('pointerdown', EventTest);
+   *
+   * GameWindowManager.addCanvasElement("bunny", sprite);
    * ```
    */
-  static initialize(element, width, height, options) {
-    return __async(this, null, function* () {
-      _GameWindowManager.canvasWidth = width;
-      _GameWindowManager.canvasHeight = height;
-      _GameWindowManager._app = new import_pixi.Application();
-      return _GameWindowManager.app.init(__spreadValues({
-        resolution: window.devicePixelRatio || 1,
-        autoDensity: true,
-        width,
-        height
-      }, options)).then(() => {
-        _GameWindowManager._isInitialized = true;
-        this.addCanvasIntoElement(element);
-        window.addEventListener("resize", _GameWindowManager.resize);
-        _GameWindowManager.resize();
+  onEvent(event, eventClass) {
+    let className = eventClass.name;
+    let instance = getEventInstanceByClassName(className);
+    this._onEvents[event] = className;
+    if (instance) {
+      super.on(event, () => {
+        instance.fn(event, this);
       });
-    });
-  }
-  /**
-   * Add the canvas into a html element.
-   * @param element it is the html element where I will put the canvas. Example: document.body
-   */
-  static addCanvasIntoElement(element) {
-    if (_GameWindowManager.isInitialized) {
-      element.appendChild(_GameWindowManager.app.canvas);
-    } else {
-      console.error("[Pixi'VM] GameWindowManager is not initialized");
     }
+    return this;
   }
   /**
-   * Initialize the interface div and add it into a html element.
-   * @param element it is the html element where I will put the interface div. Example: document.getElementById('root')
-   * @example
-   * ```typescript
-   * const root = document.getElementById('root')
-   * if (!root) {
-   *     throw new Error('root element not found')
-   * }
-   * GameWindowManager.initializeHTMLLayout(root)
-   * const reactRoot = createRoot(GameWindowManager.htmlLayout)
-   * reactRoot.render(
-   *     <App />
-   * )
-   * ```
+   * on() does not keep in memory the event class, use onEvent() instead
+   * @deprecated
+   * @private
+   * @param event 
+   * @param fn 
+   * @param context 
    */
-  static initializeHTMLLayout(element) {
-    let div = document.createElement("div");
-    div.style.position = "absolute";
-    div.style.pointerEvents = "none";
-    element.appendChild(div);
-    _GameWindowManager.htmlLayout = div;
-    _GameWindowManager.resize();
-  }
-  /* Resize Metods */
-  /**
-   * This method returns the scale of the screen.
-   */
-  static get screenScale() {
-    let screenWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
-    let screenHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
-    return Math.min(screenWidth / _GameWindowManager.canvasWidth, screenHeight / _GameWindowManager.canvasHeight);
-  }
-  /**
-   * This method returns the width of the screen enlarged by the scale.
-   */
-  static get screenWidth() {
-    return Math.floor(_GameWindowManager.screenScale * _GameWindowManager.canvasWidth);
-  }
-  /**
-   * This method returns the height of the screen enlarged by the scale.
-   */
-  static get screenHeight() {
-    return Math.floor(_GameWindowManager.screenScale * _GameWindowManager.canvasHeight);
-  }
-  /**
-   * This method returns the horizontal margin of the screen.
-   */
-  static get horizontalMargin() {
-    let screenWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
-    return (screenWidth - _GameWindowManager.screenWidth) / 2;
+  on(event, fn, context) {
+    return super.on(event, fn, context);
   }
-  /**
-   * This method returns the vertical margin of the screen.
-   */
-  static get verticalMargin() {
-    let screenHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
-    return (screenHeight - _GameWindowManager.screenHeight) / 2;
+  static from(source, skipCache) {
+    let sprite = import_pixi4.Sprite.from(source, skipCache);
+    let mySprite = new CanvasSprite();
+    mySprite.texture = sprite.texture;
+    return mySprite;
   }
-  /**
-   * This method is called when the screen is resized.
-   */
-  static resize() {
-    if (_GameWindowManager.isInitialized) {
-      let style = _GameWindowManager.app.canvas.style;
-      style.width = `${_GameWindowManager.screenWidth}px`;
-      style.height = `${_GameWindowManager.screenHeight}px`;
-      style.marginLeft = `${_GameWindowManager.horizontalMargin}px`;
-      style.marginRight = `${_GameWindowManager.horizontalMargin}px`;
-      style.marginTop = `${_GameWindowManager.verticalMargin}px`;
-      style.marginBottom = `${_GameWindowManager.verticalMargin}px`;
+};
+CanvasSprite = __decorateClass([
+  canvasElementDecorator()
+], CanvasSprite);
+function getMemorySprite(element) {
+  let temp = getMemoryContainer(element);
+  return __spreadProps(__spreadValues({}, temp), {
+    className: "CanvasSprite",
+    textureImage: getTextureMemory(element.texture),
+    anchor: { x: element.anchor.x, y: element.anchor.y },
+    roundPixels: element.roundPixels,
+    onEvents: element.onEvents
+  });
+}
+function setMemorySprite(element, memory) {
+  setMemoryContainer(element, memory);
+  getTexture(memory.textureImage.image).then((texture) => {
+    if (texture) {
+      element.texture = texture;
     }
-    if (_GameWindowManager.htmlLayout) {
-      _GameWindowManager.htmlLayout.style.width = `${_GameWindowManager.screenWidth}px`;
-      _GameWindowManager.htmlLayout.style.height = `${_GameWindowManager.screenHeight}px`;
-      _GameWindowManager.htmlLayout.style.marginLeft = `${_GameWindowManager.horizontalMargin}px`;
-      _GameWindowManager.htmlLayout.style.marginRight = `${_GameWindowManager.horizontalMargin}px`;
-      _GameWindowManager.htmlLayout.style.marginTop = `${_GameWindowManager.verticalMargin}px`;
-      _GameWindowManager.htmlLayout.style.marginBottom = `${_GameWindowManager.verticalMargin}px`;
+  });
+  if (memory.anchor) {
+    if (typeof memory.anchor === "number") {
+      element.anchor.set(memory.anchor, memory.anchor);
+    } else {
+      element.anchor.set(memory.anchor.x, memory.anchor.y);
     }
   }
-  /* Edit Canvas Elements Methods */
-  /**
-   * This is a dictionary that contains all Canvas Elements of Canvas, currently.
-   */
-  static get currentCanvasElements() {
-    return _GameWindowManager._children;
-  }
-  /**
-   * Add a canvas element to the canvas.
-   * If there is a canvas element with the same tag, it will be removed.
-   * @param tag The tag of the canvas element.
-   * @param canvasElement The canvas elements to be added.
-   * @example
-   * ```typescript
-   * const texture = await Assets.load('https://pixijs.com/assets/bunny.png');
-   * const sprite = CanvasSprite.from(texture);
-   * GameWindowManager.addCanvasElement("bunny", sprite);
-   * ```
-   */
-  static addCanvasElement(tag, canvasElement) {
-    if (_GameWindowManager._children[tag]) {
-      _GameWindowManager.removeCanvasElement(tag);
+  memory.roundPixels && (element.roundPixels = memory.roundPixels);
+  for (let event in memory.onEvents) {
+    let className = memory.onEvents[event];
+    let instance = getEventTypeByClassName(className);
+    if (instance) {
+      element.onEvent(event, instance);
     }
-    _GameWindowManager.app.stage.addChild(canvasElement);
-    _GameWindowManager._children[tag] = canvasElement;
-    _GameWindowManager.childrenTagsOrder.push(tag);
   }
-  /**
-   * Remove a canvas element from the canvas.
-   * And remove all tickers that are not connected to any canvas element.
-   * @param tag The tag of the canvas element to be removed.
-   * @returns 
-   * @example
-   * ```typescript
-   * GameWindowManager.removeCanvasElement("bunny");
-   * ```
-   */
-  static removeCanvasElement(tag) {
-    if (typeof tag === "string") {
-      tag = [tag];
-    }
-    tag.forEach((t) => {
-      if (_GameWindowManager._children[t]) {
-        _GameWindowManager.app.stage.removeChild(_GameWindowManager._children[t]);
-        delete _GameWindowManager._children[t];
-      }
+}
+
+// src/classes/canvas/CanvasImage.ts
+var CanvasImage = class extends CanvasSprite {
+  constructor() {
+    super(...arguments);
+    this.imageLink = "";
+  }
+  get memory() {
+    return __spreadProps(__spreadValues({}, getMemorySprite(this)), {
+      className: "CanvasImage",
+      textureImage: { image: this.imageLink }
     });
-    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
-    _GameWindowManager.childrenTagsOrder = _GameWindowManager.childrenTagsOrder.filter((t) => !tag.includes(t));
   }
-  /**
-   * Get a canvas element by the tag.
-   * @param tag The tag of the canvas element.
-   * @returns The canvas element.
-   * @example
-   * ```typescript
-   * const sprite = GameWindowManager.getCanvasElement<CanvasSprite>("bunny");
-   * ```
-   */
-  static getCanvasElement(tag) {
-    return _GameWindowManager._children[tag];
+  set memory(memory) {
+    setMemorySprite(this, memory);
   }
-  /**
-   * Check if a DisplayObject is on the canvas.
-   * @param pixiElement The DisplayObject to be checked.
-   * @returns If the DisplayObject is on the canvas.
-   */
-  static canvasElementIsOnCanvas(pixiElement) {
-    return _GameWindowManager.app.stage.children.includes(pixiElement);
+  static from(source, skipCache) {
+    let sprite = import_pixi5.Sprite.from(source, skipCache);
+    let mySprite = new CanvasImage();
+    mySprite.texture = sprite.texture;
+    return mySprite;
   }
   /**
-   * Remove all canvas elements from the canvas.
-   * And remove all tickers that are not connected to any canvas element.
+   * Load the image in the canvas.
+   * @returns a promise that resolves when the image is loaded.
    */
-  static removeCanvasElements() {
-    _GameWindowManager.app.stage.removeChildren();
-    _GameWindowManager._children = {};
-    _GameWindowManager.childrenTagsOrder = [];
-    _GameWindowManager.removeTickers();
+  load() {
+    return __async(this, null, function* () {
+      return getTexture(this.imageLink).then((texture) => {
+        if (texture) {
+          this.texture = texture;
+        }
+      }).catch((e) => {
+        console.error("[Pixi'VN] Error into CanvasImage.load()", e);
+      });
+    });
   }
-  /**
-   * Edit the tag of a canvas element.
-   * @param oldTag The old tag of the canvas element.
-   * @param newTag The new tag of the canvas element.
-   */
-  static editTagCanvasElement(oldTag, newTag) {
-    if (_GameWindowManager._children[oldTag]) {
-      _GameWindowManager._children[newTag] = _GameWindowManager._children[oldTag];
-      delete _GameWindowManager._children[oldTag];
-    }
+};
+CanvasImage = __decorateClass([
+  canvasElementDecorator()
+], CanvasImage);
+
+// src/classes/canvas/CanvasText.ts
+var import_pixi6 = require("pixi.js");
+var CanvasText = class extends import_pixi6.Text {
+  constructor() {
+    super(...arguments);
+    this._onEvents = {};
   }
-  /** Edit Tickers Methods */
-  /**
-   * Currently tickers that are running.
-   */
-  static get currentTickers() {
-    return _GameWindowManager._currentTickers;
+  get memory() {
+    return getMemoryText(this);
   }
-  /**
-   * The steps of the tickers
-   */
-  static get currentTickersSteps() {
-    return _GameWindowManager._currentTickersSteps;
+  set memory(value) {
+    setMemoryText(this, value);
+  }
+  get onEvents() {
+    return this._onEvents;
   }
   /**
-   * Run a ticker.
-   * @param canvasEslementTag The tag of the canvas element that will use the ticker.
-   * @param ticker The ticker class to be run.
-   * @param args The arguments to be used in the ticker.
-   * @param duration The time to be used in the ticker. This number is in milliseconds. If it is undefined, the ticker will run forever.
-   * @param priority The priority to be used in the ticker.
+   * is same function as on(), but it keeps in memory the children.
+   * @param event The event type, e.g., 'click', 'mousedown', 'mouseup', 'pointerdown', etc.
+   * @param eventClass The class that extends CanvasEvent.
    * @returns 
    * @example
    * ```typescript
-   * GameWindowManager.addTicker("alien", new TickerRotate({ speed: 0.2 }))
+   * \@eventDecorator()
+   * export class EventTest extends CanvasEvent<CanvasText> {
+   *     override fn(event: CanvasEventNamesType, text: CanvasText): void {
+   *         if (event === 'pointerdown') {
+   *             text.scale.x *= 1.25;
+   *             text.scale.y *= 1.25;
+   *         }
+   *     }
+   * }
    * ```
-   */
-  static addTicker(canvasElementTag, ticker) {
-    let tickerName = ticker.constructor.name;
-    if (typeof canvasElementTag === "string") {
-      canvasElementTag = [canvasElementTag];
-    }
-    let t = geTickerInstanceByClassName(tickerName, ticker.args, ticker.duration, ticker.priority);
-    if (!t) {
-      console.error(`[Pixi'VM] Ticker ${tickerName} not found`);
-      return;
-    }
-    _GameWindowManager.removeAssociationBetweenTickerCanvasElement(canvasElementTag, ticker);
-    let tickerHistory = {
-      fn: () => {
-      },
-      className: tickerName,
-      args: ticker.args,
-      canvasElementTags: canvasElementTag,
-      priority: ticker.priority,
-      duration: ticker.duration
-    };
-    _GameWindowManager.pushTicker(tickerHistory, t);
-    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
-    if (ticker.duration) {
-      let timeout = setTimeout(() => {
-        _GameWindowManager.removeTickerTimeoutInfo(timeout);
-        _GameWindowManager.nextTickerStep(canvasElementTag);
-      }, ticker.duration);
-      _GameWindowManager.addTickerTimeoutInfo(canvasElementTag, tickerName, timeout.toString());
-    }
-  }
-  static pushTicker(tickerData, ticker) {
-    _GameWindowManager.removeAssociationBetweenTickerCanvasElement(tickerData.canvasElementTags, tickerData);
-    _GameWindowManager._currentTickers.push(tickerData);
-    tickerData.fn = (t) => {
-      ticker == null ? void 0 : ticker.fn(t, tickerData.args, tickerData.canvasElementTags);
-    };
-    _GameWindowManager.app.ticker.add(tickerData.fn, void 0, tickerData.priority);
-  }
-  /**
-   * Run a sequence of tickers.
-   * @param tag The tag of canvas element that will use the tickers.
-   * @param steps The steps of the tickers.
-   * @returns
-   * @example
+   * 
    * ```typescript
-   * GameWindowManager.addTickersSteps("alien", [
-   *     new TickerRotate({ speed: 0.1, clockwise: true }, 2000),
-   *     Pause(500),
-   *     new TickerRotate({ speed: 0.2, clockwise: false }, 2000),
-   *     Repeat,
-   * ])
+   * const text = new CanvasText();
+   * text.text = "Hello World"
+   *
+   * text.eventMode = 'static';
+   * text.cursor = 'pointer';
+   * text.onEvent('pointerdown', EventTest);
+   *
+   * GameWindowManager.addCanvasElement("text", text);
    * ```
    */
-  static addTickersSteps(tag, steps) {
-    if (steps.length == 0) {
-      console.warn("[Pixi'VM] The steps of the tickers is empty");
-      return;
-    }
-    let alredyExists = _GameWindowManager._currentTickersSteps[tag] !== void 0;
-    _GameWindowManager._currentTickersSteps[tag] = {
-      currentStepNumber: 0,
-      steps: steps.map((s) => {
-        if (s === Repeat) {
-          return s;
-        }
-        if (!s.duration) {
-          console.warn("[Pixi'VM] Duration is not defined, so it will be set to 1000");
-          s.duration = 1e3;
-        }
-        if (s.hasOwnProperty("type") && s.type === PauseValueType) {
-          return s;
-        }
-        let tickerName = s.constructor.name;
-        return {
-          ticker: tickerName,
-          args: s.args,
-          duration: s.duration
-        };
-      })
-    };
-    if (!alredyExists) {
-      _GameWindowManager.runTickersSteps(tag);
-    }
-  }
-  static runTickersSteps(tag) {
-    let step = _GameWindowManager._currentTickersSteps[tag].steps[_GameWindowManager._currentTickersSteps[tag].currentStepNumber];
-    if (step === Repeat) {
-      step = _GameWindowManager._currentTickersSteps[tag].steps[0];
-      _GameWindowManager._currentTickersSteps[tag].currentStepNumber = 0;
-      if (step === Repeat) {
-        console.error("[Pixi'VM] TikersSteps has a RepeatType in the first step");
-        return;
-      }
-    }
-    if (step.hasOwnProperty("type") && step.type === PauseValueType) {
-      let timeout = setTimeout(() => {
-        _GameWindowManager.removeTickerTimeoutInfo(timeout);
-        _GameWindowManager.nextTickerStep(tag);
-      }, step.duration);
-      _GameWindowManager.addTickerTimeoutInfo(tag, "steps", timeout.toString());
-      return;
-    }
-    let ticker = geTickerInstanceByClassName(step.ticker, step.args, step.duration, step.priority);
-    if (!ticker) {
-      console.error(`[Pixi'VM] Ticker ${step.ticker} not found`);
-      return;
-    }
-    _GameWindowManager.addTicker(tag, ticker);
-  }
-  static nextTickerStep(tag) {
-    if (typeof tag === "string") {
-      tag = [tag];
+  onEvent(event, eventClass) {
+    let className = eventClass.name;
+    let instance = getEventInstanceByClassName(className);
+    this._onEvents[event] = className;
+    if (instance) {
+      super.on(event, () => {
+        instance.fn(event, this);
+      });
     }
-    tag.forEach((tag2) => {
-      if (_GameWindowManager._currentTickersSteps[tag2]) {
-        let steps = _GameWindowManager._currentTickersSteps[tag2];
-        if (steps.currentStepNumber + 1 < steps.steps.length) {
-          steps.currentStepNumber++;
-          _GameWindowManager._currentTickersSteps[tag2] = steps;
-          _GameWindowManager.runTickersSteps(tag2);
-        } else {
-          delete _GameWindowManager._currentTickersSteps[tag2];
-        }
-      }
-    });
+    return this;
   }
   /**
-   * Remove a connection between a canvas element and a ticker.
-   * And remove the ticker if there is no canvas element connected to it.
-   * @param tag The tag of the canvas element that will use the ticker.
-   * @param ticker The ticker class to be removed.
-   * @example
-   * ```typescript
-   * GameWindowManager.removeAssociationBetweenTickerCanvasElement("alien", TickerRotate)
-   * ```
+   * on() does not keep in memory the event class, use onEvent() instead
+   * @deprecated
+   * @private
+   * @param event 
+   * @param fn 
+   * @param context 
    */
-  static removeAssociationBetweenTickerCanvasElement(tag, ticker) {
-    let tickerName;
-    if (ticker instanceof TickerBase) {
-      tickerName = ticker.constructor.name;
-    } else {
-      tickerName = ticker.name;
-    }
-    if (typeof tag === "string") {
-      tag = [tag];
-    }
-    _GameWindowManager._currentTickers = _GameWindowManager._currentTickers.map((t) => {
-      if (t.className === tickerName) {
-        t.canvasElementTags = t.canvasElementTags.filter((e) => !tag.includes(e));
-      }
-      return t;
-    });
-    for (let timeout in _GameWindowManager.currentTickersTimeouts) {
-      let t = _GameWindowManager.currentTickersTimeouts[timeout].tags.filter((e) => !tag.includes(e));
-      if (t.length == 0) {
-        _GameWindowManager.removeTickerTimeoutInfo(timeout);
-      } else {
-        _GameWindowManager.currentTickersTimeouts[timeout].tags = t;
-      }
-    }
-    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
+  on(event, fn, context) {
+    return super.on(event, fn, context);
   }
-  /**
-   * Remove all tickers that are not connected to any existing canvas element.
-   */
-  static removeTickersWithoutAssociatedCanvasElement() {
-    let currentTickers = _GameWindowManager._currentTickers.map((t) => {
-      t.canvasElementTags = t.canvasElementTags.filter((e) => _GameWindowManager._children[e]);
-      return t;
-    });
-    currentTickers.filter((t) => t.canvasElementTags.length === 0).forEach((t) => {
-      _GameWindowManager.app.ticker.remove(t.fn);
-    });
-    currentTickers = currentTickers.filter((t) => t.canvasElementTags.length > 0);
-    _GameWindowManager._currentTickers = currentTickers;
-    for (let tag in _GameWindowManager._currentTickersSteps) {
-      if (_GameWindowManager._children[tag] === void 0) {
-        delete _GameWindowManager._currentTickersSteps[tag];
-      }
+};
+CanvasText = __decorateClass([
+  canvasElementDecorator()
+], CanvasText);
+function getMemoryText(element) {
+  let temp = getMemoryContainer(element);
+  return __spreadProps(__spreadValues({}, temp), {
+    className: "CanvasText",
+    anchor: { x: element.anchor.x, y: element.anchor.y },
+    text: element.text,
+    resolution: element.resolution,
+    style: getTextStyle(element.style),
+    roundPixels: element.roundPixels,
+    onEvents: element.onEvents
+  });
+}
+function setMemoryText(element, memory) {
+  setMemoryContainer(element, memory);
+  if (memory.anchor) {
+    if (typeof memory.anchor === "number") {
+      element.anchor.set(memory.anchor, memory.anchor);
+    } else {
+      element.anchor.set(memory.anchor.x, memory.anchor.y);
     }
   }
-  static addTickerTimeoutInfo(tags, ticker, timeout) {
-    if (typeof tags === "string") {
-      tags = [tags];
+  memory.text && (element.text = memory.text);
+  memory.resolution && (element.resolution = memory.resolution);
+  memory.style && (element.style = memory.style);
+  memory.roundPixels && (element.roundPixels = memory.roundPixels);
+  for (let event in memory.onEvents) {
+    let className = memory.onEvents[event];
+    let instance = getEventTypeByClassName(className);
+    if (instance) {
+      element.onEvent(event, instance);
     }
-    _GameWindowManager.currentTickersTimeouts[timeout] = {
-      tags,
-      ticker
-    };
   }
-  static removeTickerTimeoutInfo(timeout) {
-    if (typeof timeout !== "string") {
-      timeout = timeout.toString();
-    }
-    if (_GameWindowManager.currentTickersTimeouts[timeout]) {
-      delete _GameWindowManager.currentTickersTimeouts[timeout];
-    }
+}
+
+// src/classes/ticker/TickerBase.ts
+var TickerBase = class {
+  constructor(args, duration, priority) {
+    this.args = args;
+    this.duration = duration;
+    this.priority = priority;
   }
   /**
-   * Remove all tickers from the canvas.
+   * The method that will be called every frame.
+   * This method should be overridden and you can use GameWindowManager.addCanvasElement() to get the canvas element of the canvas, and edit them.
+   * @param t The ticker that is calling this method
+   * @param args The arguments that you passed when you added the ticker
+   * @param tags The tags of the canvas elements that are connected to this ticker
    */
-  static removeTickers() {
-    _GameWindowManager._currentTickersSteps = {};
-    _GameWindowManager._currentTickers.forEach((t) => {
-      _GameWindowManager.app.ticker.remove(t.fn);
-    });
-    _GameWindowManager._currentTickers = [];
-    for (let timeout in _GameWindowManager.currentTickersTimeouts) {
-      _GameWindowManager.removeTickerTimeoutInfo(timeout);
-    }
-  }
-  /**
-   * Clear the canvas and the tickers.
-   */
-  static clear() {
-    _GameWindowManager.removeCanvasElements();
-  }
-  /* Export and Import Methods */
-  /**
-   * Export the canvas and the tickers to a JSON string.
-   * @returns The JSON string.
-   */
-  static exportJson() {
-    return JSON.stringify(this.export());
+  fn(_t, _args, _tags) {
+    throw new Error("[Pixi'VN] The method TickerBase.fn() must be overridden");
   }
+};
+
+// src/classes/ticker/TickerFadeAlpha.ts
+var import_pixi7 = require("pixi.js");
+var TickerFadeAlpha = class extends TickerBase {
   /**
-   * Export the canvas and the tickers to an object.
-   * @returns The object.
+   * The method that will be called every frame to fade the alpha of the canvas element of the canvas.
+   * @param delta The delta time
+   * @param args The arguments that are passed to the ticker
+   * @param tags The tags of the canvas element that are connected to this ticker
    */
-  static export() {
-    let currentElements = {};
-    for (let tag in _GameWindowManager._children) {
-      currentElements[tag] = exportCanvasElement(_GameWindowManager._children[tag]);
+  fn(t, args, tags) {
+    let type = args.type === void 0 ? "hide" : args.type;
+    let speed = args.speed === void 0 ? 0.1 : args.speed;
+    let limit = args.limit === void 0 ? type === "hide" ? 0 : 1 : args.limit;
+    let removeElementAfter = args.tagToRemoveAfter || [];
+    if (typeof removeElementAfter === "string") {
+      removeElementAfter = [removeElementAfter];
     }
-    return {
-      currentTickers: createExportElement(_GameWindowManager._currentTickers),
-      currentElements: createExportElement(currentElements),
-      childrenTagsOrder: createExportElement(_GameWindowManager.childrenTagsOrder)
-    };
-  }
-  /**
-   * Import the canvas and the tickers from a JSON string.
-   * @param dataString The JSON string.
-   */
-  static importJson(dataString) {
-    _GameWindowManager.import(JSON.parse(dataString));
-  }
-  /**
-   * Import the canvas and the tickers from an object.
-   * @param data The object.
-   */
-  static import(data) {
-    _GameWindowManager.clear();
-    try {
-      if (data.hasOwnProperty("childrenTagsOrder") && data.hasOwnProperty("currentElements")) {
-        let currentElements = data["currentElements"];
-        let childrenTagsOrder = data["childrenTagsOrder"];
-        childrenTagsOrder.forEach((tag) => {
-          if (currentElements[tag]) {
-            let element = importCanvasElement(currentElements[tag]);
-            _GameWindowManager.addCanvasElement(tag, element);
-            _GameWindowManager.childrenTagsOrder.push(tag);
-          }
-        });
-      } else {
-        console.error("[Pixi'VM] The data does not have the properties childrenTagsOrder and currentElements");
-        return;
+    if (type === "hide" && limit < 0) {
+      limit = 0;
+    }
+    if (type === "show" && limit > 1) {
+      limit = 1;
+    }
+    tags.filter((tag) => {
+      var _a;
+      let element = GameWindowManager.getCanvasElement(tag);
+      if (args.startOnlyIfHaveTexture) {
+        if (element && element instanceof import_pixi7.Sprite && ((_a = element.texture) == null ? void 0 : _a.label) == "EMPTY") {
+          return false;
+        }
       }
-      if (data.hasOwnProperty("currentTickers")) {
-        let currentTickers = data["currentTickers"];
-        currentTickers.forEach((t) => {
-          let tags = t.canvasElementTags;
-          let ticker = geTickerInstanceByClassName(t.className, t.args, t.duration, t.priority);
-          if (ticker) {
-            _GameWindowManager.addTicker(tags, ticker);
-          } else {
-            console.error(`[Pixi'VM] Ticker ${t.className} not found`);
-          }
-        });
+      return true;
+    }).forEach((tag) => {
+      let element = GameWindowManager.getCanvasElement(tag);
+      if (element && element instanceof import_pixi7.Container) {
+        if (type === "show" && element.alpha < limit) {
+          element.alpha += speed * t.deltaTime;
+        } else if (type === "hide" && element.alpha > limit) {
+          element.alpha -= speed * t.deltaTime;
+        } else {
+          element.alpha = limit;
+          GameWindowManager.removeAssociationBetweenTickerCanvasElement(tag, this);
+          GameWindowManager.removeCanvasElement(removeElementAfter);
+        }
       }
-    } catch (e) {
-      console.error("[Pixi'VM] Error importing data", e);
-    }
+    });
   }
 };
-_GameWindowManager._app = void 0;
-_GameWindowManager._isInitialized = false;
-_GameWindowManager._children = {};
-/**
- * The order of the children tags.
- */
-_GameWindowManager.childrenTagsOrder = [];
-_GameWindowManager._currentTickers = [];
-_GameWindowManager._currentTickersSteps = {};
-_GameWindowManager.currentTickersTimeouts = {};
-var GameWindowManager = _GameWindowManager;
+TickerFadeAlpha = __decorateClass([
+  tickerDecorator()
+], TickerFadeAlpha);
 
-// src/managers/StepManager.ts
-var _GameStepManager = class _GameStepManager {
-  constructor() {
-  }
-  static get stepsHistory() {
-    return _GameStepManager._stepsHistory;
-  }
-  static get lastStepIndex() {
-    return _GameStepManager.stepsHistory.length;
-  }
-  static get openedLabels() {
-    return _GameStepManager._openedLabels;
-  }
-  /**
-   * currentLabel is the current label that occurred during the progression of the steps.
-   */
-  static get currentLabel() {
-    if (_GameStepManager._openedLabels.length > 0) {
-      let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
-      return item.label;
-    }
-    return null;
-  }
-  /**
-   * currentLabelStepIndex is the current step index of the current label that occurred during the progression of the steps.
-   */
-  static get currentLabelStepIndex() {
-    if (_GameStepManager._openedLabels.length > 0) {
-      let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
-      return item.currentStepIndex;
-    }
-    return null;
-  }
-  /**
-   * lastHistoryStep is the last history step that occurred during the progression of the steps.
-   */
-  static get lastHistoryStep() {
-    if (_GameStepManager._stepsHistory.length > 0) {
-      return _GameStepManager._stepsHistory[_GameStepManager._stepsHistory.length - 1];
-    }
-    return null;
+// src/classes/ticker/TickerRotate.ts
+var import_pixi8 = require("pixi.js");
+
+// src/functions/TickerUtility.ts
+function updateTickerProgression(args, propertyName, progression) {
+  if (args.hasOwnProperty(propertyName) && typeof args[propertyName] !== "number") {
+    return;
   }
-  /* Edit History Methods */
-  /**
-   * Add a label to the history.
-   * @param label The label to add to the history.
-   */
-  static addStepHistory(step) {
-    let stepHistory = getStepSha1(step);
-    let historyStep = {
-      path: window.location.pathname,
-      storage: GameStorageManager.export(),
-      stepSha1: stepHistory,
-      canvas: GameWindowManager.export(),
-      stepIndex: _GameStepManager.currentLabelStepIndex || 0,
-      openedLabels: createExportElement(_GameStepManager._openedLabels)
-    };
-    let lastStepData = _GameStepManager.lastHistoryStep;
-    if (lastStepData) {
-      if (lastStepData.openedLabels.length === historyStep.openedLabels.length) {
-        try {
-          let lastStepDataOpenedLabelsString = JSON.stringify(lastStepData.openedLabels);
-          let historyStepOpenedLabelsString = JSON.stringify(historyStep.openedLabels);
-          if (lastStepDataOpenedLabelsString === historyStepOpenedLabelsString) {
-            return;
-          }
-        } catch (e) {
-          console.error("[Pixi'VM] Error comparing openedLabels", e);
+  if (args[propertyName] !== void 0 && progression && args[propertyName] !== progression.limit) {
+    if (progression.type === "linear") {
+      args[propertyName] += progression.amt;
+      if (progression.limit !== void 0) {
+        if (args[propertyName] > progression.limit && progression.amt > 0) {
+          args[propertyName] = progression.limit;
+        } else if (args[propertyName] < progression.limit && progression.amt < 0) {
+          args[propertyName] = progression.limit;
+        }
+      }
+    } else if (progression.type === "exponential") {
+      args[propertyName] += args[propertyName] * progression.percentage;
+      if (progression.limit !== void 0) {
+        if (args[propertyName] > progression.limit && progression.percentage > 0) {
+          args[propertyName] = progression.limit;
+        } else if (args[propertyName] < progression.limit && progression.percentage < 0) {
+          args[propertyName] = progression.limit;
         }
       }
     }
-    _GameStepManager._stepsHistory.push(historyStep);
   }
+}
+
+// src/classes/ticker/TickerRotate.ts
+var TickerRotate = class extends TickerBase {
   /**
-   * Add a label to the history.
-   * @param label The label to add to the history.
+   * The method that will be called every frame to rotate the canvas element of the canvas.
+   * @param delta The delta time
+   * @param args The arguments that are passed to the ticker
+   * @param tags The tags of the canvas element that are connected to this ticker
    */
-  static pushNewLabel(label) {
-    let currentLabel = getLabelInstanceByClassName(label);
-    if (!currentLabel) {
-      throw new Error("[Pixi'VM] Label not found");
-    }
-    _GameStepManager._openedLabels.push({
-      label,
-      currentStepIndex: 0
+  fn(t, args, tags) {
+    let speed = args.speed === void 0 ? 0.1 : args.speed;
+    let clockwise = args.clockwise === void 0 ? true : args.clockwise;
+    tags.filter((tag) => {
+      var _a;
+      let element = GameWindowManager.getCanvasElement(tag);
+      if (args.startOnlyIfHaveTexture) {
+        if (element && element instanceof import_pixi8.Sprite && ((_a = element.texture) == null ? void 0 : _a.label) == "EMPTY") {
+          return false;
+        }
+      }
+      return true;
+    }).forEach((tag) => {
+      let element = GameWindowManager.getCanvasElement(tag);
+      if (element && element instanceof import_pixi8.Container) {
+        if (clockwise)
+          element.rotation += speed * t.deltaTime;
+        else
+          element.rotation -= speed * t.deltaTime;
+      }
     });
+    if (args.speedProgression)
+      updateTickerProgression(args, "speed", args.speedProgression);
   }
-  /**
-   * Close the current label and add it to the history.
-   * @returns 
-   */
-  static closeLabel() {
-    if (!_GameStepManager.currentLabel) {
-      console.warn("[Pixi'VM] No label to close");
-      return;
+};
+TickerRotate = __decorateClass([
+  tickerDecorator()
+], TickerRotate);
+
+// src/functions/ImageUtility.ts
+function addImage(tag, imageUrl) {
+  let image = new CanvasImage();
+  image.imageLink = imageUrl;
+  GameWindowManager.addCanvasElement(tag, image);
+  return image;
+}
+function showCanvasImages(canvasImages) {
+  return __async(this, null, function* () {
+    if (!Array.isArray(canvasImages)) {
+      return [canvasImages];
     }
-    let currentLabel = getLabelInstanceByClassName(_GameStepManager.currentLabel);
-    if (!currentLabel) {
-      console.error("[Pixi'VM] Label not found");
-      return;
+    let promises = Array(canvasImages.length);
+    for (let i = 0; i < canvasImages.length; i++) {
+      promises[i] = getTexture(canvasImages[i].imageLink);
     }
-    _GameStepManager._openedLabels.pop();
+    return Promise.all(promises).then((textures) => {
+      return textures.map((texture, index) => {
+        if (texture) {
+          canvasImages[index].texture = texture;
+          return canvasImages[index];
+        }
+        canvasImages[index].load();
+        return canvasImages[index];
+      });
+    });
+  });
+}
+function removeCanvasElement(tag) {
+  GameWindowManager.removeCanvasElement(tag);
+}
+function showImageWithDissolveTransition(tag, imageUrl, speed, priority) {
+  return __async(this, null, function* () {
+    if (!GameWindowManager.getCanvasElement(tag)) {
+      let image2 = addImage(tag, imageUrl);
+      image2.alpha = 0;
+      let effect2 = new TickerFadeAlpha({
+        speed,
+        type: "show",
+        startOnlyIfHaveTexture: true
+      }, 1e4, priority);
+      GameWindowManager.addTicker(tag, effect2);
+      return image2.load();
+    }
+    let specialTag = tag + "_temp_disolve";
+    let effect = new TickerFadeAlpha({
+      speed,
+      type: "show",
+      tagToRemoveAfter: specialTag,
+      startOnlyIfHaveTexture: true
+    }, 1e4, priority);
+    GameWindowManager.editTagCanvasElement(tag, specialTag);
+    let image = addImage(tag, imageUrl);
+    image.alpha = 0;
+    GameWindowManager.addTicker(tag, effect);
+    return image.load();
+  });
+}
+
+// src/constants.ts
+var PIXIVM_VERSION = "0.1.4";
+
+// src/functions/SavesUtility.ts
+function getSaveData() {
+  return {
+    version: PIXIVM_VERSION,
+    stepData: GameStepManager.export(),
+    storageData: GameStorageManager.export(),
+    canvasData: GameWindowManager.export(),
+    path: window.location.pathname
+  };
+}
+function getSaveJson() {
+  const saveData = getSaveData();
+  return JSON.stringify(saveData);
+}
+function loadSaveData(data, navigate) {
+  GameStepManager.import(data.stepData);
+  GameStorageManager.import(data.storageData);
+  GameWindowManager.import(data.canvasData);
+  navigate(data.path);
+}
+function loadSaveJson(dataString, navigate) {
+  loadSaveData(jsonToSaveData(dataString), navigate);
+}
+function jsonToSaveData(json) {
+  return JSON.parse(json);
+}
+
+// src/functions/ExportUtility.ts
+function createExportableElement(element) {
+  try {
+    let elementString = JSON.stringify(element);
+    return JSON.parse(elementString);
+  } catch (e) {
+    console.error("[Pixi'VN] Error creating exportable element", e);
+    throw new Error("[Pixi'VN] Error creating exportable element");
   }
-  /**
-   * Close all labels and add them to the history.
-   */
-  static closeAllLabels() {
-    while (_GameStepManager._openedLabels.length > 0) {
-      _GameStepManager.closeLabel();
+}
+
+// src/functions/DiffUtility.ts
+function restoreDeepDiffChanges(data, differences) {
+  let result = createExportableElement(data);
+  differences.forEach((diff2) => {
+    let dataToEdit = result;
+    if (diff2.path && diff2.path.length > 0) {
+      diff2.path.forEach((path, index) => {
+        if (diff2.path && index === diff2.path.length - 1) {
+          if (diff2.kind === "E" || diff2.kind === "D") {
+            dataToEdit[path] = diff2.lhs;
+          } else if (diff2.kind === "N") {
+            if (Number.isInteger(path)) {
+              if (Array.isArray(dataToEdit)) {
+                dataToEdit.splice(path, 1);
+              }
+            } else if (typeof path === "string") {
+              delete dataToEdit[path];
+            }
+          } else if (diff2.kind === "A") {
+            let index2 = diff2.index;
+            if (diff2.item.kind === "N") {
+              dataToEdit[path].splice(index2, 1);
+            } else if (diff2.item.kind === "E" || diff2.item.kind === "D") {
+              dataToEdit[path][index2] = diff2.item.lhs;
+            } else if (diff2.item.kind === "A") {
+              console.warn("[Pixi'VN] Nested array found, skipping diff", diff2);
+            } else {
+              console.warn("[Pixi'VN] No array found, skipping diff", diff2);
+            }
+          }
+        } else {
+          dataToEdit = dataToEdit[path];
+        }
+      });
+    } else {
+      console.warn("[Pixi'VN] No path found, skipping diff", diff2);
     }
+  });
+  return result;
+}
+
+// src/functions/StepLabelUtility.ts
+var import_sha1 = __toESM(require("crypto-js/sha1"));
+function getStepSha1(step) {
+  let sha1String = (0, import_sha1.default)(step.toString().toLocaleLowerCase());
+  return sha1String.toString();
+}
+function checkIfStepsIsEqual(step1, step2) {
+  return step1 === step2;
+}
+
+// src/managers/StorageManager.ts
+var _GameStorageManager = class _GameStorageManager {
+  constructor() {
   }
-  /**
-   * Increase the current step index of the current label.
-   */
-  static increaseCurrentStepIndex() {
-    let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
-    _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1] = __spreadProps(__spreadValues({}, item), {
-      currentStepIndex: item.currentStepIndex + 1
-    });
+  static get keysSystem() {
+    return {
+      CURRENT_DIALOGUE_MEMORY_KEY: "___current_dialogue_memory_key___",
+      LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY: "___last_dialogue_added_in_step_memory_key___",
+      CURRENT_MENU_OPTIONS_MEMORY_KEY: "___current_menu_options_memory_key___",
+      LAST_MENU_OPTIONS_ADDED_IN_STEP_MEMORY_KEY: "___last_menu_options_added_in_step_memory_key___",
+      CHARACTER_PREKEY: "___character___"
+    };
   }
-  /* Run Methods */
   /**
-   * Execute the next step and add it to the history.
+   * Set a variable in the storage
+   * @param key The key of the variable
+   * @param value The value of the variable. If undefined, the variable will be removed
    * @returns
-   * @example
-   * ```typescript
-   *     function nextOnClick() {
-   *     setLoading(true)
-   *     GameStepManager.runNextStep()
-   *         .then(() => {
-   *             setUpdate((p) => p + 1)
-   *             setLoading(false)
-   *         })
-   *         .catch((e) => {
-   *             setLoading(false)
-   *             console.error(e)
-   *         })
-   * }
-   * ```
    */
-  static runNextStep() {
-    return __async(this, null, function* () {
-      if (_GameStepManager._openedLabels.length === 0) {
-        console.warn("[Pixi'VM] There are no labels to run");
-        return;
+  static setVariable(key, value) {
+    key = key.toLowerCase();
+    if (value === void 0) {
+      if (_GameStorageManager.storage.hasOwnProperty(key)) {
+        delete _GameStorageManager.storage[key];
       }
-      _GameStepManager.increaseCurrentStepIndex();
-      return yield _GameStepManager.runCurrentStep();
-    });
+      return;
+    }
+    _GameStorageManager.storage[key] = value;
   }
   /**
-   * Execute the current step and add it to the history.
-   * @returns 
+   * Get a variable from the storage
+   * @param key The key of the variable
+   * @returns The value of the variable. If the variable does not exist, it will return undefined
    */
-  static runCurrentStep() {
-    return __async(this, null, function* () {
-      if (_GameStepManager.currentLabel) {
-        let lasteStepsLength = _GameStepManager.currentLabelStepIndex;
-        if (lasteStepsLength === null) {
-          console.error("[Pixi'VM] currentLabelStepIndex is null");
-          return;
-        }
-        let currentLabel = getLabelInstanceByClassName(_GameStepManager.currentLabel);
-        if (!currentLabel) {
-          console.error("[Pixi'VM] Label not found");
-          return;
-        }
-        let n = currentLabel.steps.length;
-        if (n > lasteStepsLength) {
-          let nextStep = currentLabel.steps[lasteStepsLength];
-          yield nextStep();
-          _GameStepManager.addStepHistory(nextStep);
-        } else if (n === lasteStepsLength) {
-          _GameStepManager.closeLabel();
-          yield _GameStepManager.runNextStep();
-        } else {
-          console.warn("[Pixi'VM] There are no steps to run");
-        }
-      }
-    });
+  static getVariable(key) {
+    key = key.toLowerCase();
+    if (_GameStorageManager.storage.hasOwnProperty(key)) {
+      return _GameStorageManager.storage[key];
+    }
+    return void 0;
   }
   /**
-   * Execute the label and add it to the history.
-   * Is a call function in Ren'Py.
-   * @param label The label to execute.
+   * Remove a variable from the storage
+   * @param key The key of the variable
    * @returns
-   * @example
-   * ```typescript
-   * GameStepManager.callLabel(StartLabel)
-   * ```
    */
-  static callLabel(label) {
-    return __async(this, null, function* () {
-      try {
-        if (label instanceof Label) {
-          label = label.constructor;
-        }
-        let labelName = label.name;
-        _GameStepManager.pushNewLabel(labelName);
-      } catch (e) {
-        console.error("[Pixi'VM] Error calling label", e);
-        return;
-      }
-      return yield _GameStepManager.runCurrentStep();
-    });
+  static removeVariable(key) {
+    key = key.toLowerCase();
+    if (_GameStorageManager.storage.hasOwnProperty(key)) {
+      delete _GameStorageManager.storage[key];
+    }
   }
   /**
-   * Execute the label, close all labels and add them to the history.
-   * Is a jump function in Ren'Py.
-   * @param label 
+   * Clear the storage and the oidsUsed
    * @returns
-   * @example
-   * ```typescript
-   * GameStepManager.jumpLabel(StartLabel)
-   * ```
    */
-  static jumpLabel(label) {
-    return __async(this, null, function* () {
-      _GameStepManager.closeAllLabels();
-      try {
-        if (label instanceof Label) {
-          label = label.constructor;
-        }
-        let labelName = label.name;
-        _GameStepManager.pushNewLabel(labelName);
-      } catch (e) {
-        console.error("[Pixi'VM] Error jumping label", e);
-        return;
+  static clear() {
+    _GameStorageManager.storage = {};
+  }
+  static exportJson() {
+    return JSON.stringify(this.export());
+  }
+  static export() {
+    return createExportableElement(_GameStorageManager.storage);
+  }
+  static importJson(dataString) {
+    _GameStorageManager.import(JSON.parse(dataString));
+  }
+  static import(data) {
+    _GameStorageManager.clear();
+    try {
+      if (data) {
+        _GameStorageManager.storage = data;
+      } else {
+        console.warn("[Pixi'VN] No storage data found");
       }
-      return yield _GameStepManager.runCurrentStep();
-    });
+    } catch (e) {
+      console.error("[Pixi'VN] Error importing data", e);
+    }
+  }
+};
+_GameStorageManager.storage = {};
+var GameStorageManager = _GameStorageManager;
+
+// src/managers/WindowManager.ts
+var import_pixi9 = require("pixi.js");
+
+// src/types/PauseType.ts
+var PauseValueType = "Pause";
+function Pause(duration) {
+  return {
+    type: PauseValueType,
+    duration
+  };
+}
+
+// src/types/RepeatType.ts
+var Repeat = "Repeat";
+
+// src/managers/WindowManager.ts
+var _GameWindowManager = class _GameWindowManager {
+  constructor() {
   }
-  /* After Update Methods */
-  // /**
-  //  * After the update or code edit, some steps or labels may no longer match.
-  //  * - In case of step mismatch, the game will be updated to the last matching step.
-  //  * - In case of label mismatch, the game gives an error.
-  //  * @returns 
-  //  */
-  // private static afterUpdate() {
-  //     // TODO: implement
-  //     if (!GameStepManager.currentLabel) {
-  //         // TODO: implement
-  //         return
-  //     }
-  //     let currentLabel = getLabelInstanceByClassName(GameStepManager.currentLabel)
-  //     if (!currentLabel) {
-  //         console.error("Label not found")
-  //         return
-  //     }
-  //     let oldSteps = GameStepManager.stepsAfterLastHistoryLabel
-  //     let currentStepIndex = currentLabel.getCorrespondingStepsNumber(oldSteps)
-  //     let stepToRemove = oldSteps.length - currentStepIndex
-  //     GameStepManager.removeLastHistoryNodes(stepToRemove)
-  //     GameStepManager.loadLastStep()
-  // }
-  // private static loadLastStep() {
-  //     // TODO: implement
-  // }
-  // /**
-  //  * Remove a number of items from the last of the history.
-  //  * @param itemNumber The number of items to remove from the last of the history.
-  //  */
-  // private static removeLastHistoryNodes(itemNumber: number) {
-  //     // TODO: implement
-  //     for (let i = 0; i < itemNumber; i++) {
-  //         GameStepManager._stepsHistory.pop()
-  //     }
-  // }
-  // /**
-  //  * stepsAfterLastHistoryLabel is a list of steps that occurred after the last history label.
-  //  */
-  // private static get stepsAfterLastHistoryLabel(): StepHistoryDataType[] {
-  //     let length = GameStepManager._stepsHistory.length
-  //     let steps: StepHistoryDataType[] = []
-  //     for (let i = length - 1; i >= 0; i--) {
-  //         let element = GameStepManager._stepsHistory[i]
-  //         if (typeof element === "object" && "stepSha1" in element) {
-  //             steps.push(element.stepSha1)
-  //         }
-  //         else {
-  //             break
-  //         }
-  //     }
-  //     steps = steps.reverse()
-  //     return steps
-  // }
-  /* Go Back & Refresh Methods */
   /**
-   * Go back to the last step and add it to the history.
-   * @param navigate The navigate function.
-   * @param steps The number of steps to go back.
-   * @returns 
+   * The PIXI Application instance.
+   * It not recommended to use this property directly.
+   */
+  static get app() {
+    if (!_GameWindowManager._app) {
+      throw new Error("[Pixi'VN] GameWindowManager.app is undefined");
+    }
+    return _GameWindowManager._app;
+  }
+  /**
+   * If the manager is initialized.
+   */
+  static get isInitialized() {
+    return _GameWindowManager._isInitialized;
+  }
+  static get screen() {
+    return _GameWindowManager.app.screen;
+  }
+  /**
+   * Initialize the PIXI Application and the interface div.
+   * This method should be called before any other method.
+   * @param element The html element where I will put the canvas. Example: document.body
+   * @param width The width of the canvas
+   * @param height The height of the canvas
+   * @param options The options of PIXI Application
    * @example
    * ```typescript
-   * export function goBack(navigate: (path: string) => void, afterBack?: () => void) {
-   *     GameStepManager.goBack(navigate)
-   *     afterBack && afterBack()
+   * const body = document.body
+   * if (!body) {
+   *     throw new Error('body element not found')
    * }
+   * await GameWindowManager.initialize(body, 1920, 1080, {
+   *     backgroundColor: "#303030"
+   * })
    * ```
    */
-  static goBack(navigate, steps = 1) {
-    if (steps <= 0) {
-      console.warn("[Pixi'VM] Steps must be greater than 0");
-      return;
-    }
-    if (_GameStepManager._stepsHistory.length <= 1) {
-      console.warn("[Pixi'VM] No steps to go back");
-      return;
-    }
-    _GameStepManager.goBackInstrnal(steps);
-    let lastHistoryStep = _GameStepManager.lastHistoryStep;
-    if (lastHistoryStep) {
-      _GameStepManager._openedLabels = createExportElement(lastHistoryStep.openedLabels);
-      GameStorageManager.import(createExportElement(lastHistoryStep.storage));
-      GameWindowManager.import(createExportElement(lastHistoryStep.canvas));
-      navigate(lastHistoryStep.path);
+  static initialize(element, width, height, options) {
+    return __async(this, null, function* () {
+      _GameWindowManager.canvasWidth = width;
+      _GameWindowManager.canvasHeight = height;
+      _GameWindowManager._app = new import_pixi9.Application();
+      return _GameWindowManager.app.init(__spreadValues({
+        resolution: window.devicePixelRatio || 1,
+        autoDensity: true,
+        width,
+        height
+      }, options)).then(() => {
+        _GameWindowManager._isInitialized = true;
+        this.addCanvasIntoElement(element);
+        window.addEventListener("resize", _GameWindowManager.resize);
+        _GameWindowManager.resize();
+      });
+    });
+  }
+  /**
+   * Add the canvas into a html element.
+   * @param element it is the html element where I will put the canvas. Example: document.body
+   */
+  static addCanvasIntoElement(element) {
+    if (_GameWindowManager.isInitialized) {
+      element.appendChild(_GameWindowManager.app.canvas);
     } else {
-      console.error("[Pixi'VM] Error going back");
+      console.error("[Pixi'VN] GameWindowManager is not initialized");
     }
   }
-  static goBackInstrnal(steps) {
-    if (steps <= 0) {
-      return;
-    }
-    if (_GameStepManager._stepsHistory.length == 0) {
-      return;
-    }
-    _GameStepManager._stepsHistory.pop();
-    _GameStepManager.goBackInstrnal(steps - 1);
+  /**
+   * Initialize the interface div and add it into a html element.
+   * @param element it is the html element where I will put the interface div. Example: document.getElementById('root')
+   * @example
+   * ```typescript
+   * const root = document.getElementById('root')
+   * if (!root) {
+   *     throw new Error('root element not found')
+   * }
+   * GameWindowManager.initializeHTMLLayout(root)
+   * const reactRoot = createRoot(GameWindowManager.htmlLayout)
+   * reactRoot.render(
+   *     <App />
+   * )
+   * ```
+   */
+  static initializeHTMLLayout(element) {
+    let div = document.createElement("div");
+    div.style.position = "absolute";
+    div.style.pointerEvents = "none";
+    element.appendChild(div);
+    _GameWindowManager.htmlLayout = div;
+    _GameWindowManager.resize();
   }
+  /* Resize Metods */
   /**
-   * Add a label to the history.
+   * This method returns the scale of the screen.
    */
-  static clear() {
-    _GameStepManager._stepsHistory = [];
-    _GameStepManager._openedLabels = [];
+  static get screenScale() {
+    let screenWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+    let screenHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+    return Math.min(screenWidth / _GameWindowManager.canvasWidth, screenHeight / _GameWindowManager.canvasHeight);
   }
-  /* Export and Import Methods */
   /**
-   * Export the history to a JSON string.
-   * @returns The history in a JSON string.
+   * This method returns the width of the screen enlarged by the scale.
    */
-  static exportJson() {
-    return JSON.stringify(this.export());
+  static get screenWidth() {
+    return Math.floor(_GameWindowManager.screenScale * _GameWindowManager.canvasWidth);
   }
   /**
-   * Export the history to an object.
-   * @returns The history in an object.
+   * This method returns the height of the screen enlarged by the scale.
    */
-  static export() {
-    return {
-      stepsHistory: _GameStepManager._stepsHistory,
-      openedLabels: _GameStepManager._openedLabels
-    };
+  static get screenHeight() {
+    return Math.floor(_GameWindowManager.screenScale * _GameWindowManager.canvasHeight);
   }
   /**
-   * Import the history from a JSON string.
-   * @param dataString The history in a JSON string.
+   * This method returns the horizontal margin of the screen.
    */
-  static importJson(dataString) {
-    _GameStepManager.import(JSON.parse(dataString));
+  static get horizontalMargin() {
+    let screenWidth = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
+    return (screenWidth - _GameWindowManager.screenWidth) / 2;
   }
   /**
-   * Import the history from an object.
-   * @param data The history in an object.
+   * This method returns the vertical margin of the screen.
    */
-  static import(data) {
-    _GameStepManager.clear();
-    try {
-      if (data.hasOwnProperty("stepsHistory")) {
-        _GameStepManager._stepsHistory = data["stepsHistory"];
-      } else {
-        console.warn("[Pixi'VM] No stepsHistory data found");
-      }
-      if (data.hasOwnProperty("openedLabels")) {
-        _GameStepManager._openedLabels = data["openedLabels"];
-      } else {
-        console.warn("[Pixi'VM] No openedLabels data found");
-      }
-    } catch (e) {
-      console.error("[Pixi'VM] Error importing data", e);
+  static get verticalMargin() {
+    let screenHeight = Math.max(document.documentElement.clientHeight, window.innerHeight || 0);
+    return (screenHeight - _GameWindowManager.screenHeight) / 2;
+  }
+  /**
+   * This method is called when the screen is resized.
+   */
+  static resize() {
+    if (_GameWindowManager.isInitialized) {
+      let style = _GameWindowManager.app.canvas.style;
+      style.width = `${_GameWindowManager.screenWidth}px`;
+      style.height = `${_GameWindowManager.screenHeight}px`;
+      style.marginLeft = `${_GameWindowManager.horizontalMargin}px`;
+      style.marginRight = `${_GameWindowManager.horizontalMargin}px`;
+      style.marginTop = `${_GameWindowManager.verticalMargin}px`;
+      style.marginBottom = `${_GameWindowManager.verticalMargin}px`;
+    }
+    if (_GameWindowManager.htmlLayout) {
+      _GameWindowManager.htmlLayout.style.width = `${_GameWindowManager.screenWidth}px`;
+      _GameWindowManager.htmlLayout.style.height = `${_GameWindowManager.screenHeight}px`;
+      _GameWindowManager.htmlLayout.style.marginLeft = `${_GameWindowManager.horizontalMargin}px`;
+      _GameWindowManager.htmlLayout.style.marginRight = `${_GameWindowManager.horizontalMargin}px`;
+      _GameWindowManager.htmlLayout.style.marginTop = `${_GameWindowManager.verticalMargin}px`;
+      _GameWindowManager.htmlLayout.style.marginBottom = `${_GameWindowManager.verticalMargin}px`;
     }
   }
-};
-/**
- * stepHistory is a list of label events and steps that occurred during the progression of the steps.
- */
-_GameStepManager._stepsHistory = [];
-_GameStepManager._openedLabels = [];
-var GameStepManager = _GameStepManager;
-
-// src/classes/StoredClassModel.ts
-var StoredClassModel = class {
-  constructor(id) {
-    this.id = id;
-  }
-  get nameClass() {
-    return this.constructor.name + "Storage";
-  }
-  updateStorage(value) {
-    let storage = GameStorageManager.getVariable(this.nameClass);
-    if (!storage) {
-      storage = {};
-    }
-    storage[this.id] = value;
-    GameStorageManager.setVariable(this.nameClass, storage);
-  }
-  getStorageProperty(key) {
-    let storage = GameStorageManager.getVariable(this.nameClass);
-    if (!storage) {
-      return void 0;
-    }
-    if (storage[this.id].hasOwnProperty(key)) {
-      return storage[this.id][key];
-    }
-    return void 0;
-  }
-};
-
-// src/classes/CharacterModelBase.ts
-var CharacterModelBase = class extends StoredClassModel {
-  constructor(tag, props) {
-    super(tag);
-    this.defaultName = "";
-    this.defaultName = props.name;
-    this.defaultSurname = props.surname;
-    this.defaultAge = props.age;
-    this.icon = props.icon;
-    this.color = props.color;
-  }
-  get name() {
-    return this.getStorageProperty("name") || this.defaultName;
-  }
-  set name(value) {
-    this.updateStorage(__spreadProps(__spreadValues({}, this), { name: value }));
-  }
-  get surname() {
-    return this.getStorageProperty("surname") || this.defaultSurname;
-  }
-  set surname(value) {
-    this.updateStorage(__spreadProps(__spreadValues({}, this), { surname: value }));
-  }
-  get age() {
-    return this.getStorageProperty("age") || this.defaultAge;
-  }
-  set age(value) {
-    this.updateStorage(__spreadProps(__spreadValues({}, this), { age: value }));
-  }
-};
-
-// src/classes/DialogueModelBase.ts
-var DialogueModelBase = class {
-  constructor(text, characterTag) {
-    /**
-     * The text of the dialogue.
-     */
-    this.text = "";
-    this.text = text;
-    this.characterTag = characterTag;
+  /* Edit Canvas Elements Methods */
+  /**
+   * This is a dictionary that contains all Canvas Elements of Canvas, currently.
+   */
+  static get currentCanvasElements() {
+    return _GameWindowManager._children;
   }
-};
-
-// src/classes/Label.ts
-var Label = class {
   /**
-   * Get the steps of the label.
-   * This class should be extended and the steps method should be overridden.
-   * Every time you update this list will also be updated when the other game versions load.
+   * Add a canvas element to the canvas.
+   * If there is a canvas element with the same tag, it will be removed.
+   * @param tag The tag of the canvas element.
+   * @param canvasElement The canvas elements to be added.
+   * @example
+   * ```typescript
+   * const texture = await Assets.load('https://pixijs.com/assets/bunny.png');
+   * const sprite = CanvasSprite.from(texture);
+   * GameWindowManager.addCanvasElement("bunny", sprite);
+   * ```
    */
-  get steps() {
-    throw new Error("[Pixi'VM] The method Label.steps must be overridden");
+  static addCanvasElement(tag, canvasElement) {
+    if (_GameWindowManager._children[tag]) {
+      _GameWindowManager.removeCanvasElement(tag);
+    }
+    _GameWindowManager.app.stage.addChild(canvasElement);
+    _GameWindowManager._children[tag] = canvasElement;
+    _GameWindowManager.childrenTagsOrder.push(tag);
   }
   /**
-   * Get the corresponding steps number
-   * @param externalSteps
-   * @returns Numer of corresponding steps, for example, if externalSteps is [ABC, DEF, GHI] and the steps of the label is [ABC, GHT], the result will be 1
+   * Remove a canvas element from the canvas.
+   * And remove all tickers that are not connected to any canvas element.
+   * @param tag The tag of the canvas element to be removed.
+   * @returns 
+   * @example
+   * ```typescript
+   * GameWindowManager.removeCanvasElement("bunny");
+   * ```
    */
-  getCorrespondingStepsNumber(externalSteps) {
-    if (externalSteps.length === 0) {
-      return 0;
+  static removeCanvasElement(tag) {
+    if (typeof tag === "string") {
+      tag = [tag];
     }
-    let res = 0;
-    externalSteps.forEach((step, index) => {
-      if (checkIfStepsIsEqual(step, this.steps[index])) {
-        res = index;
+    tag.forEach((t) => {
+      if (_GameWindowManager._children[t]) {
+        _GameWindowManager.app.stage.removeChild(_GameWindowManager._children[t]);
+        delete _GameWindowManager._children[t];
       }
     });
-    return res;
+    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
+    _GameWindowManager.childrenTagsOrder = _GameWindowManager.childrenTagsOrder.filter((t) => !tag.includes(t));
   }
-};
-
-// src/enums/LabelRunModeEnum.ts
-var LabelRunModeEnum = /* @__PURE__ */ ((LabelRunModeEnum2) => {
-  LabelRunModeEnum2["OpenByCall"] = "openbycall";
-  LabelRunModeEnum2["OpenByJump"] = "openbyjump";
-  return LabelRunModeEnum2;
-})(LabelRunModeEnum || {});
-
-// src/classes/MenuOptionLabel.ts
-var MenuOptionLabel = class {
-  constructor(text, label, type = "openbycall" /* OpenByCall */) {
-    this.text = text;
-    this.label = label;
-    this.type = type;
+  /**
+   * Get a canvas element by the tag.
+   * @param tag The tag of the canvas element.
+   * @returns The canvas element.
+   * @example
+   * ```typescript
+   * const sprite = GameWindowManager.getCanvasElement<CanvasSprite>("bunny");
+   * ```
+   */
+  static getCanvasElement(tag) {
+    return _GameWindowManager._children[tag];
   }
-};
-
-// src/classes/canvas/CanvasBase.ts
-var import_pixi2 = require("pixi.js");
-var CanvasBase = class extends import_pixi2.Container {
   /**
-   * This method return the memory of the canvas element.
+   * Check if a DisplayObject is on the canvas.
+   * @param pixiElement The DisplayObject to be checked.
+   * @returns If the DisplayObject is on the canvas.
    */
-  get memory() {
-    throw new Error("[Pixi'VM] The method CanvasBase.memory must be overridden");
+  static canvasElementIsOnCanvas(pixiElement) {
+    return _GameWindowManager.app.stage.children.includes(pixiElement);
   }
   /**
-   * This method set the memory of the canvas element.
+   * Remove all canvas elements from the canvas.
+   * And remove all tickers that are not connected to any canvas element.
    */
-  set memory(_value) {
-    throw new Error("[Pixi'VM] The method CanvasBase.memory must be overridden");
+  static removeCanvasElements() {
+    _GameWindowManager.app.stage.removeChildren();
+    _GameWindowManager._children = {};
+    _GameWindowManager.childrenTagsOrder = [];
+    _GameWindowManager.removeTickers();
   }
-};
-
-// src/classes/canvas/CanvasContainer.ts
-var import_pixi3 = require("pixi.js");
-
-// src/decorators/CharacterDecorator.ts
-var registeredCharacters = {};
-function saveCharacter(character) {
-  if (Array.isArray(character)) {
-    character.forEach((c) => saveCharacter(c));
-    return;
+  /**
+   * Edit the tag of a canvas element.
+   * @param oldTag The old tag of the canvas element.
+   * @param newTag The new tag of the canvas element.
+   */
+  static editTagCanvasElement(oldTag, newTag) {
+    if (_GameWindowManager._children[oldTag]) {
+      _GameWindowManager._children[newTag] = _GameWindowManager._children[oldTag];
+      delete _GameWindowManager._children[oldTag];
+    }
   }
-  if (registeredCharacters[character.id]) {
-    console.warn(`Character tag ${character.id} already exists, it will be overwritten`);
+  /** Edit Tickers Methods */
+  /**
+   * Currently tickers that are running.
+   */
+  static get currentTickers() {
+    return _GameWindowManager._currentTickers;
   }
-  registeredCharacters[character.id] = character;
-}
-function getCharacterByTag(tag) {
-  try {
-    let character = registeredCharacters[tag];
-    if (!character) {
-      console.error(`Character ${tag} not found`);
-      return;
-    }
-    return character;
-  } catch (e) {
-    console.error(e);
-    return;
+  /**
+   * The steps of the tickers
+   */
+  static get currentTickersSteps() {
+    return _GameWindowManager._currentTickersSteps;
   }
-}
-
-// src/decorators/EventDecorator.ts
-var registeredEvents = {};
-function eventDecorator(name) {
-  return function(target) {
-    if (!name) {
-      name = target.name;
-    }
-    if (registeredEvents[name]) {
-      console.warn(`Event ${name} already exists, it will be overwritten`);
-    }
-    registeredEvents[name] = target;
-  };
-}
-function getEventTypeByClassName(eventName) {
-  try {
-    let eventType = registeredEvents[eventName];
-    if (!eventType) {
-      console.error(`Event ${eventName} not found`);
-      return;
+  /**
+   * Run a ticker.
+   * @param canvasEslementTag The tag of the canvas element that will use the ticker.
+   * @param ticker The ticker class to be run.
+   * @param args The arguments to be used in the ticker.
+   * @param duration The time to be used in the ticker. This number is in milliseconds. If it is undefined, the ticker will run forever.
+   * @param priority The priority to be used in the ticker.
+   * @returns 
+   * @example
+   * ```typescript
+   * GameWindowManager.addTicker("alien", new TickerRotate({ speed: 0.2 }))
+   * ```
+   */
+  static addTicker(canvasElementTag, ticker) {
+    let tickerName = ticker.constructor.name;
+    if (typeof canvasElementTag === "string") {
+      canvasElementTag = [canvasElementTag];
     }
-    new eventType();
-    return eventType;
-  } catch (e) {
-    console.error(e);
-    return;
-  }
-}
-function getEventInstanceByClassName(eventName) {
-  try {
-    let eventType = registeredEvents[eventName];
-    if (!eventType) {
-      console.error(`Event ${eventName} not found`);
+    let t = geTickerInstanceByClassName(tickerName, ticker.args, ticker.duration, ticker.priority);
+    if (!t) {
+      console.error(`[Pixi'VN] Ticker ${tickerName} not found`);
       return;
     }
-    let event = new eventType();
-    return event;
-  } catch (e) {
-    console.error(e);
-    return;
-  }
-}
-
-// src/classes/canvas/CanvasContainer.ts
-var CanvasContainer = class extends import_pixi3.Container {
-  get memory() {
-    let memory = getMemoryContainer(this);
-    this.children.forEach((child) => {
-      memory.elements.push(exportCanvasElement(child));
-    });
-    return memory;
+    _GameWindowManager.removeAssociationBetweenTickerCanvasElement(canvasElementTag, ticker);
+    let tickerHistory = {
+      fn: () => {
+      },
+      className: tickerName,
+      args: ticker.args,
+      canvasElementTags: canvasElementTag,
+      priority: ticker.priority,
+      duration: ticker.duration
+    };
+    _GameWindowManager.pushTicker(tickerHistory, t);
+    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
+    if (ticker.duration) {
+      let timeout = setTimeout(() => {
+        _GameWindowManager.removeTickerTimeoutInfo(timeout);
+        _GameWindowManager.nextTickerStep(canvasElementTag);
+      }, ticker.duration);
+      _GameWindowManager.addTickerTimeoutInfo(canvasElementTag, tickerName, timeout.toString());
+    }
   }
-  set memory(value) {
-    setMemoryContainer(this, value);
-    value.elements.forEach((child) => {
-      this.addChild(importCanvasElement(child));
+  static pushTicker(tickerData, ticker) {
+    _GameWindowManager.removeAssociationBetweenTickerCanvasElement(tickerData.canvasElementTags, tickerData);
+    _GameWindowManager._currentTickers.push(tickerData);
+    tickerData.fn = (t) => {
+      ticker == null ? void 0 : ticker.fn(t, tickerData.args, tickerData.canvasElementTags);
+    };
+    _GameWindowManager.app.ticker.add(tickerData.fn, void 0, tickerData.priority);
+  }
+  /**
+   * Run a sequence of tickers.
+   * @param tag The tag of canvas element that will use the tickers.
+   * @param steps The steps of the tickers.
+   * @returns
+   * @example
+   * ```typescript
+   * GameWindowManager.addTickersSteps("alien", [
+   *     new TickerRotate({ speed: 0.1, clockwise: true }, 2000),
+   *     Pause(500),
+   *     new TickerRotate({ speed: 0.2, clockwise: false }, 2000),
+   *     Repeat,
+   * ])
+   * ```
+   */
+  static addTickersSteps(tag, steps) {
+    if (steps.length == 0) {
+      console.warn("[Pixi'VN] The steps of the tickers is empty");
+      return;
+    }
+    let alredyExists = _GameWindowManager._currentTickersSteps[tag] !== void 0;
+    _GameWindowManager._currentTickersSteps[tag] = {
+      currentStepNumber: 0,
+      steps: steps.map((s) => {
+        if (s === Repeat) {
+          return s;
+        }
+        if (!s.duration) {
+          console.warn("[Pixi'VN] Duration is not defined, so it will be set to 1000");
+          s.duration = 1e3;
+        }
+        if (s.hasOwnProperty("type") && s.type === PauseValueType) {
+          return s;
+        }
+        let tickerName = s.constructor.name;
+        return {
+          ticker: tickerName,
+          args: s.args,
+          duration: s.duration
+        };
+      })
+    };
+    if (!alredyExists) {
+      _GameWindowManager.runTickersSteps(tag);
+    }
+  }
+  static runTickersSteps(tag) {
+    let step = _GameWindowManager._currentTickersSteps[tag].steps[_GameWindowManager._currentTickersSteps[tag].currentStepNumber];
+    if (step === Repeat) {
+      step = _GameWindowManager._currentTickersSteps[tag].steps[0];
+      _GameWindowManager._currentTickersSteps[tag].currentStepNumber = 0;
+      if (step === Repeat) {
+        console.error("[Pixi'VN] TikersSteps has a RepeatType in the first step");
+        return;
+      }
+    }
+    if (step.hasOwnProperty("type") && step.type === PauseValueType) {
+      let timeout = setTimeout(() => {
+        _GameWindowManager.removeTickerTimeoutInfo(timeout);
+        _GameWindowManager.nextTickerStep(tag);
+      }, step.duration);
+      _GameWindowManager.addTickerTimeoutInfo(tag, "steps", timeout.toString());
+      return;
+    }
+    let ticker = geTickerInstanceByClassName(step.ticker, step.args, step.duration, step.priority);
+    if (!ticker) {
+      console.error(`[Pixi'VN] Ticker ${step.ticker} not found`);
+      return;
+    }
+    _GameWindowManager.addTicker(tag, ticker);
+  }
+  static nextTickerStep(tag) {
+    if (typeof tag === "string") {
+      tag = [tag];
+    }
+    tag.forEach((tag2) => {
+      if (_GameWindowManager._currentTickersSteps[tag2]) {
+        let steps = _GameWindowManager._currentTickersSteps[tag2];
+        if (steps.currentStepNumber + 1 < steps.steps.length) {
+          steps.currentStepNumber++;
+          _GameWindowManager._currentTickersSteps[tag2] = steps;
+          _GameWindowManager.runTickersSteps(tag2);
+        } else {
+          delete _GameWindowManager._currentTickersSteps[tag2];
+        }
+      }
     });
   }
-};
-CanvasContainer = __decorateClass([
-  canvasElementDecorator()
-], CanvasContainer);
-function getMemoryContainer(element) {
-  return {
-    className: "CanvasContainer",
-    elements: [],
-    width: element.width,
-    height: element.height,
-    isRenderGroup: element.isRenderGroup,
-    blendMode: element.blendMode,
-    tint: element.tint,
-    alpha: element.alpha,
-    angle: element.angle,
-    renderable: element.renderable,
-    rotation: element.rotation,
-    scale: { x: element.scale.x, y: element.scale.y },
-    pivot: { x: element.pivot.x, y: element.pivot.y },
-    position: { x: element.position.x, y: element.position.y },
-    skew: { x: element.skew.x, y: element.skew.y },
-    visible: element.visible,
-    culled: element.culled,
-    x: element.x,
-    y: element.y,
-    boundsArea: element.boundsArea,
-    cursor: element.cursor,
-    eventMode: element.eventMode,
-    interactive: element.interactive,
-    interactiveChildren: element.interactiveChildren,
-    hitArea: element.hitArea
-  };
-}
-function setMemoryContainer(element, memory) {
-  memory.width && (element.width = memory.width);
-  memory.height && (element.height = memory.height);
-  memory.isRenderGroup && (element.isRenderGroup = memory.isRenderGroup);
-  memory.blendMode && (element.blendMode = memory.blendMode);
-  memory.tint && (element.tint = memory.tint);
-  memory.alpha && (element.alpha = memory.alpha);
-  memory.angle && (element.angle = memory.angle);
-  memory.renderable && (element.renderable = memory.renderable);
-  memory.rotation && (element.rotation = memory.rotation);
-  if (memory.scale) {
-    if (typeof memory.scale === "number") {
-      element.scale.set(memory.scale, memory.scale);
+  /**
+   * Remove a connection between a canvas element and a ticker.
+   * And remove the ticker if there is no canvas element connected to it.
+   * @param tag The tag of the canvas element that will use the ticker.
+   * @param ticker The ticker class to be removed.
+   * @example
+   * ```typescript
+   * GameWindowManager.removeAssociationBetweenTickerCanvasElement("alien", TickerRotate)
+   * ```
+   */
+  static removeAssociationBetweenTickerCanvasElement(tag, ticker) {
+    let tickerName;
+    if (ticker instanceof TickerBase) {
+      tickerName = ticker.constructor.name;
     } else {
-      element.scale.set(memory.scale.x, memory.scale.y);
+      tickerName = ticker.name;
+    }
+    if (typeof tag === "string") {
+      tag = [tag];
+    }
+    _GameWindowManager._currentTickers = _GameWindowManager._currentTickers.map((t) => {
+      if (t.className === tickerName) {
+        t.canvasElementTags = t.canvasElementTags.filter((e) => !tag.includes(e));
+      }
+      return t;
+    });
+    for (let timeout in _GameWindowManager.currentTickersTimeouts) {
+      let t = _GameWindowManager.currentTickersTimeouts[timeout].tags.filter((e) => !tag.includes(e));
+      if (t.length == 0) {
+        _GameWindowManager.removeTickerTimeoutInfo(timeout);
+      } else {
+        _GameWindowManager.currentTickersTimeouts[timeout].tags = t;
+      }
     }
+    _GameWindowManager.removeTickersWithoutAssociatedCanvasElement();
   }
-  if (memory.pivot) {
-    if (typeof memory.pivot === "number") {
-      element.pivot.set(memory.pivot, memory.pivot);
-    } else {
-      element.pivot.set(memory.pivot.x, memory.pivot.y);
+  /**
+   * Remove all tickers that are not connected to any existing canvas element.
+   */
+  static removeTickersWithoutAssociatedCanvasElement() {
+    let currentTickers = _GameWindowManager._currentTickers.map((t) => {
+      t.canvasElementTags = t.canvasElementTags.filter((e) => _GameWindowManager._children[e]);
+      return t;
+    });
+    currentTickers.filter((t) => t.canvasElementTags.length === 0).forEach((t) => {
+      _GameWindowManager.app.ticker.remove(t.fn);
+    });
+    currentTickers = currentTickers.filter((t) => t.canvasElementTags.length > 0);
+    _GameWindowManager._currentTickers = currentTickers;
+    for (let tag in _GameWindowManager._currentTickersSteps) {
+      if (_GameWindowManager._children[tag] === void 0) {
+        delete _GameWindowManager._currentTickersSteps[tag];
+      }
     }
   }
-  memory.position && element.position.set(memory.position.x, memory.position.y);
-  memory.skew && element.skew.set(memory.skew.x, memory.skew.y);
-  memory.visible && (element.visible = memory.visible);
-  memory.culled && (element.culled = memory.culled);
-  memory.x && (element.x = memory.x);
-  memory.y && (element.y = memory.y);
-  memory.boundsArea && (element.boundsArea = memory.boundsArea);
-  memory.cursor && (element.cursor = memory.cursor);
-  memory.eventMode && (element.eventMode = memory.eventMode);
-  memory.interactive && (element.interactive = memory.interactive);
-  memory.interactiveChildren && (element.interactiveChildren = memory.interactiveChildren);
-  memory.hitArea && (element.hitArea = memory.hitArea);
-}
-
-// src/classes/canvas/CanvasImage.ts
-var import_pixi6 = require("pixi.js");
-
-// src/functions/TextureUtility.ts
-var import_pixi4 = require("pixi.js");
-function getTexture(imageUrl) {
-  return __async(this, null, function* () {
-    if (import_pixi4.Assets.cache.has(imageUrl)) {
-      return import_pixi4.Assets.get(imageUrl);
+  static addTickerTimeoutInfo(tags, ticker, timeout) {
+    if (typeof tags === "string") {
+      tags = [tags];
     }
-    return import_pixi4.Assets.load(imageUrl).then((texture) => {
-      if (!texture) {
-        console.error("[Pixi'VM] Texture not found", imageUrl);
+    _GameWindowManager.currentTickersTimeouts[timeout] = {
+      tags,
+      ticker
+    };
+  }
+  static removeTickerTimeoutInfo(timeout) {
+    if (typeof timeout !== "string") {
+      timeout = timeout.toString();
+    }
+    if (_GameWindowManager.currentTickersTimeouts[timeout]) {
+      delete _GameWindowManager.currentTickersTimeouts[timeout];
+    }
+  }
+  /**
+   * Remove all tickers from the canvas.
+   */
+  static removeTickers() {
+    _GameWindowManager._currentTickersSteps = {};
+    _GameWindowManager._currentTickers.forEach((t) => {
+      _GameWindowManager.app.ticker.remove(t.fn);
+    });
+    _GameWindowManager._currentTickers = [];
+    for (let timeout in _GameWindowManager.currentTickersTimeouts) {
+      _GameWindowManager.removeTickerTimeoutInfo(timeout);
+    }
+  }
+  /**
+   * Clear the canvas and the tickers.
+   */
+  static clear() {
+    _GameWindowManager.removeCanvasElements();
+  }
+  /* Export and Import Methods */
+  /**
+   * Export the canvas and the tickers to a JSON string.
+   * @returns The JSON string.
+   */
+  static exportJson() {
+    return JSON.stringify(this.export());
+  }
+  /**
+   * Export the canvas and the tickers to an object.
+   * @returns The object.
+   */
+  static export() {
+    let currentElements = {};
+    for (let tag in _GameWindowManager._children) {
+      currentElements[tag] = exportCanvasElement(_GameWindowManager._children[tag]);
+    }
+    return {
+      currentTickers: createExportableElement(_GameWindowManager._currentTickers),
+      currentElements: createExportableElement(currentElements),
+      childrenTagsOrder: createExportableElement(_GameWindowManager.childrenTagsOrder)
+    };
+  }
+  /**
+   * Import the canvas and the tickers from a JSON string.
+   * @param dataString The JSON string.
+   */
+  static importJson(dataString) {
+    _GameWindowManager.import(JSON.parse(dataString));
+  }
+  /**
+   * Import the canvas and the tickers from an object.
+   * @param data The object.
+   */
+  static import(data) {
+    _GameWindowManager.clear();
+    try {
+      if (data.hasOwnProperty("childrenTagsOrder") && data.hasOwnProperty("currentElements")) {
+        let currentElements = data["currentElements"];
+        let childrenTagsOrder = data["childrenTagsOrder"];
+        childrenTagsOrder.forEach((tag) => {
+          if (currentElements[tag]) {
+            let element = importCanvasElement(currentElements[tag]);
+            _GameWindowManager.addCanvasElement(tag, element);
+            _GameWindowManager.childrenTagsOrder.push(tag);
+          }
+        });
+      } else {
+        console.error("[Pixi'VN] The data does not have the properties childrenTagsOrder and currentElements");
         return;
       }
-      if (!(texture instanceof import_pixi4.Texture)) {
-        console.error("[Pixi'VM] File not is a image", imageUrl);
-        return;
+      if (data.hasOwnProperty("currentTickers")) {
+        let currentTickers = data["currentTickers"];
+        currentTickers.forEach((t) => {
+          let tags = t.canvasElementTags;
+          let ticker = geTickerInstanceByClassName(t.className, t.args, t.duration, t.priority);
+          if (ticker) {
+            _GameWindowManager.addTicker(tags, ticker);
+          } else {
+            console.error(`[Pixi'VN] Ticker ${t.className} not found`);
+          }
+        });
       }
-      return texture;
-    }).catch((e) => {
-      console.error("[Pixi'VM] Error loading image", e);
-      return;
-    });
-  });
-}
-function getTextStyle(style) {
-  let fill = style.fill;
-  if (fill instanceof Object) {
-    console.warn("[Pixi'VM] CanvasText.style.fill is a FillGradient or FillPattern, this is not supported yet.", fill);
-    fill = "#00FF00";
+    } catch (e) {
+      console.error("[Pixi'VN] Error importing data", e);
+    }
   }
-  return {
-    align: style.align,
-    breakWords: style.breakWords,
-    dropShadow: style.dropShadow,
-    fill,
-    fontFamily: style.fontFamily,
-    fontSize: style.fontSize,
-    fontStyle: style.fontStyle,
-    fontVariant: style.fontVariant,
-    fontWeight: style.fontWeight,
-    leading: style.leading,
-    letterSpacing: style.letterSpacing,
-    lineHeight: style.lineHeight,
-    padding: style.padding,
-    stroke: style.stroke,
-    textBaseline: style.textBaseline,
-    trim: style.trim,
-    whiteSpace: style.whiteSpace,
-    wordWrap: style.wordWrap,
-    wordWrapWidth: style.wordWrapWidth
-  };
-}
+};
+_GameWindowManager._app = void 0;
+_GameWindowManager._isInitialized = false;
+_GameWindowManager._children = {};
+/**
+ * The order of the children tags.
+ */
+_GameWindowManager.childrenTagsOrder = [];
+_GameWindowManager._currentTickers = [];
+_GameWindowManager._currentTickersSteps = {};
+_GameWindowManager.currentTickersTimeouts = {};
+var GameWindowManager = _GameWindowManager;
 
-// src/classes/canvas/CanvasSprite.ts
-var import_pixi5 = require("pixi.js");
-var CanvasSprite = class extends import_pixi5.Sprite {
+// src/managers/StepManager.ts
+var _GameStepManager = class _GameStepManager {
   constructor() {
-    super(...arguments);
-    this._onEvents = {};
   }
-  get memory() {
-    return getMemorySprite(this);
+  static get stepsHistory() {
+    return _GameStepManager._stepsHistory;
   }
-  set memory(value) {
-    setMemorySprite(this, value);
+  /**
+   * lastStepIndex is the last step index that occurred during the progression of the steps. **Not is the length of the stepsHistory - 1.**
+   */
+  static get lastStepIndex() {
+    return _GameStepManager._lastStepIndex;
   }
-  get onEvents() {
-    return this._onEvents;
+  /**
+   * Increase the last step index that occurred during the progression of the steps.
+   */
+  static increaseLastStepIndex() {
+    _GameStepManager._lastStepIndex++;
+  }
+  static get openedLabels() {
+    return _GameStepManager._openedLabels;
   }
   /**
-   * is same function as on(), but it keeps in memory the children.
-   * @param event The event type, e.g., 'click', 'mousedown', 'mouseup', 'pointerdown', etc.
-   * @param eventClass The class that extends CanvasEvent.
-   * @returns 
-   * @example
-   * ```typescript
-   * \@eventDecorator()
-   * export class EventTest extends CanvasEvent<CanvasSprite> {
-   *     override fn(event: CanvasEventNamesType, sprite: CanvasSprite): void {
-   *         if (event === 'pointerdown') {
-   *             sprite.scale.x *= 1.25;
-   *             sprite.scale.y *= 1.25;
-   *         }
-   *     }
-   * }
-   * ```
-   * 
-   * ```typescript
-   * let sprite = addImage("alien", 'https://pixijs.com/assets/eggHead.png')
-   * await sprite.load()
-   *
-   * sprite.eventMode = 'static';
-   * sprite.cursor = 'pointer';
-   * sprite.onEvent('pointerdown', EventTest);
-   *
-   * GameWindowManager.addCanvasElement("bunny", sprite);
-   * ```
+   * currentLabel is the current label that occurred during the progression of the steps.
    */
-  onEvent(event, eventClass) {
-    let className = eventClass.name;
-    let instance = getEventInstanceByClassName(className);
-    this._onEvents[event] = className;
-    if (instance) {
-      super.on(event, () => {
-        instance.fn(event, this);
+  static get currentLabel() {
+    if (_GameStepManager._openedLabels.length > 0) {
+      let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
+      return item.label;
+    }
+    return void 0;
+  }
+  /**
+   * is the current step index of the current label that occurred during the progression of the steps.
+   */
+  static get currentLabelStepIndex() {
+    if (_GameStepManager._openedLabels.length > 0) {
+      let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
+      return item.currentStepIndex;
+    }
+    return null;
+  }
+  /**
+   * lastHistoryStep is the last history step that occurred during the progression of the steps.
+   */
+  static get lastHistoryStep() {
+    if (_GameStepManager._stepsHistory.length > 0) {
+      return _GameStepManager._stepsHistory[_GameStepManager._stepsHistory.length - 1];
+    }
+    return null;
+  }
+  static get originalStepData() {
+    if (!_GameStepManager._originalStepData) {
+      return {
+        path: "",
+        storage: {},
+        canvas: {
+          childrenTagsOrder: [],
+          currentElements: {},
+          currentTickers: []
+        },
+        labelIndex: -1,
+        openedLabels: []
+      };
+    }
+    return createExportableElement(_GameStepManager._originalStepData);
+  }
+  static set originalStepData(value) {
+    _GameStepManager._originalStepData = createExportableElement(value);
+  }
+  /* Edit History Methods */
+  /**
+   * Add a label to the history.
+   * @param label The label to add to the history.
+   */
+  static addStepHistory(step) {
+    let stepHistory = getStepSha1(step);
+    let historyStep = {
+      path: window.location.pathname,
+      storage: GameStorageManager.export(),
+      canvas: GameWindowManager.export(),
+      labelIndex: _GameStepManager.currentLabelStepIndex || 0,
+      openedLabels: createExportableElement(_GameStepManager._openedLabels)
+    };
+    if (_GameStepManager.originalStepData) {
+      if (_GameStepManager.originalStepData.openedLabels.length === historyStep.openedLabels.length) {
+        try {
+          let lastStepDataOpenedLabelsString = JSON.stringify(_GameStepManager.originalStepData.openedLabels);
+          let historyStepOpenedLabelsString = JSON.stringify(historyStep.openedLabels);
+          if (lastStepDataOpenedLabelsString === historyStepOpenedLabelsString) {
+            return;
+          }
+        } catch (e) {
+          console.error("[Pixi'VN] Error comparing openedLabels", e);
+        }
+      }
+    }
+    let data = (0, import_deep_diff.diff)(_GameStepManager.originalStepData, historyStep);
+    if (data) {
+      let dialoge = void 0;
+      let requiredChoices = void 0;
+      if (GameStorageManager.getVariable(GameStorageManager.keysSystem.LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY) === _GameStepManager.lastStepIndex) {
+        dialoge = getDialogue();
+      }
+      if (GameStorageManager.getVariable(GameStorageManager.keysSystem.LAST_MENU_OPTIONS_ADDED_IN_STEP_MEMORY_KEY) === _GameStepManager.lastStepIndex) {
+        requiredChoices = GameStorageManager.getVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY);
+      }
+      _GameStepManager._stepsHistory.push({
+        diff: data,
+        currentLabel: _GameStepManager.currentLabel,
+        dialoge,
+        choices: requiredChoices,
+        stepSha1: stepHistory,
+        index: _GameStepManager.lastStepIndex
       });
+      _GameStepManager.originalStepData = historyStep;
     }
-    return this;
+    _GameStepManager.increaseLastStepIndex();
   }
   /**
-   * on() does not keep in memory the event class, use onEvent() instead
-   * @deprecated
-   * @private
-   * @param event 
-   * @param fn 
-   * @param context 
+   * Add a label to the history.
+   * @param label The label to add to the history.
    */
-  on(event, fn, context) {
-    return super.on(event, fn, context);
-  }
-  static from(source, skipCache) {
-    let sprite = import_pixi5.Sprite.from(source, skipCache);
-    let mySprite = new CanvasSprite();
-    mySprite.texture = sprite.texture;
-    return mySprite;
+  static pushNewLabel(label) {
+    let currentLabel = getLabelInstanceByClassName(label);
+    if (!currentLabel) {
+      throw new Error("[Pixi'VN] Label not found");
+    }
+    _GameStepManager._openedLabels.push({
+      label,
+      currentStepIndex: 0
+    });
   }
-};
-CanvasSprite = __decorateClass([
-  canvasElementDecorator()
-], CanvasSprite);
-function getMemorySprite(element) {
-  let temp = getMemoryContainer(element);
-  return __spreadProps(__spreadValues({}, temp), {
-    className: "CanvasSprite",
-    textureImage: getTextureMemory(element.texture),
-    anchor: { x: element.anchor.x, y: element.anchor.y },
-    roundPixels: element.roundPixels,
-    onEvents: element.onEvents
-  });
-}
-function setMemorySprite(element, memory) {
-  setMemoryContainer(element, memory);
-  getTexture(memory.textureImage.image).then((texture) => {
-    if (texture) {
-      element.texture = texture;
+  /**
+   * Close the current label and add it to the history.
+   * @returns 
+   */
+  static closeCurrentLabel() {
+    if (!_GameStepManager.currentLabel) {
+      console.warn("[Pixi'VN] No label to close");
+      return;
     }
-  });
-  if (memory.anchor) {
-    if (typeof memory.anchor === "number") {
-      element.anchor.set(memory.anchor, memory.anchor);
-    } else {
-      element.anchor.set(memory.anchor.x, memory.anchor.y);
+    let currentLabel = getLabelInstanceByClassName(_GameStepManager.currentLabel);
+    if (!currentLabel) {
+      console.error("[Pixi'VN] Label not found");
+      return;
     }
+    _GameStepManager._openedLabels.pop();
   }
-  memory.roundPixels && (element.roundPixels = memory.roundPixels);
-  for (let event in memory.onEvents) {
-    let className = memory.onEvents[event];
-    let instance = getEventTypeByClassName(className);
-    if (instance) {
-      element.onEvent(event, instance);
+  /**
+   * Close all labels and add them to the history.
+   */
+  static closeAllLabels() {
+    while (_GameStepManager._openedLabels.length > 0) {
+      _GameStepManager.closeCurrentLabel();
     }
   }
-}
-
-// src/classes/canvas/CanvasImage.ts
-var CanvasImage = class extends CanvasSprite {
-  constructor() {
-    super(...arguments);
-    this.imageLink = "";
-  }
-  get memory() {
-    return __spreadProps(__spreadValues({}, getMemorySprite(this)), {
-      className: "CanvasImage",
-      textureImage: { image: this.imageLink }
+  /**
+   * Increase the current step index of the current label.
+   */
+  static increaseCurrentStepIndex() {
+    let item = _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1];
+    _GameStepManager._openedLabels[_GameStepManager._openedLabels.length - 1] = __spreadProps(__spreadValues({}, item), {
+      currentStepIndex: item.currentStepIndex + 1
     });
   }
-  set memory(memory) {
-    setMemorySprite(this, memory);
-  }
-  static from(source, skipCache) {
-    let sprite = import_pixi6.Sprite.from(source, skipCache);
-    let mySprite = new CanvasImage();
-    mySprite.texture = sprite.texture;
-    return mySprite;
+  /* Run Methods */
+  /**
+   * Execute the next step and add it to the history.
+   * @returns
+   * @example
+   * ```typescript
+   *     function nextOnClick() {
+   *     setLoading(true)
+   *     GameStepManager.runNextStep()
+   *         .then(() => {
+   *             setUpdate((p) => p + 1)
+   *             setLoading(false)
+   *         })
+   *         .catch((e) => {
+   *             setLoading(false)
+   *             console.error(e)
+   *         })
+   * }
+   * ```
+   */
+  static runNextStep() {
+    return __async(this, null, function* () {
+      if (_GameStepManager._openedLabels.length === 0) {
+        console.warn("[Pixi'VN] There are no labels to run");
+        return;
+      }
+      _GameStepManager.increaseCurrentStepIndex();
+      return yield _GameStepManager.runCurrentStep();
+    });
   }
   /**
-   * Load the image in the canvas.
-   * @returns a promise that resolves when the image is loaded.
+   * Execute the current step and add it to the history.
+   * @returns 
    */
-  load() {
+  static runCurrentStep() {
     return __async(this, null, function* () {
-      return getTexture(this.imageLink).then((texture) => {
-        if (texture) {
-          this.texture = texture;
+      if (_GameStepManager.currentLabel) {
+        let lasteStepsLength = _GameStepManager.currentLabelStepIndex;
+        if (lasteStepsLength === null) {
+          console.error("[Pixi'VN] currentLabelStepIndex is null");
+          return;
         }
-      }).catch((e) => {
-        console.error("[Pixi'VM] Error into CanvasImage.load()", e);
-      });
+        let currentLabel = getLabelInstanceByClassName(_GameStepManager.currentLabel);
+        if (!currentLabel) {
+          console.error("[Pixi'VN] Label not found");
+          return;
+        }
+        let n = currentLabel.steps.length;
+        if (n > lasteStepsLength) {
+          let nextStep = currentLabel.steps[lasteStepsLength];
+          yield nextStep();
+          _GameStepManager.addStepHistory(nextStep);
+        } else if (n === lasteStepsLength) {
+          _GameStepManager.closeCurrentLabel();
+          yield _GameStepManager.runNextStep();
+        } else {
+          console.warn("[Pixi'VN] There are no steps to run");
+        }
+      }
     });
   }
-};
-CanvasImage = __decorateClass([
-  canvasElementDecorator()
-], CanvasImage);
-
-// src/classes/canvas/CanvasText.ts
-var import_pixi7 = require("pixi.js");
-var CanvasText = class extends import_pixi7.Text {
-  constructor() {
-    super(...arguments);
-    this._onEvents = {};
-  }
-  get memory() {
-    return getMemoryText(this);
-  }
-  set memory(value) {
-    setMemoryText(this, value);
+  /**
+   * Execute the label and add it to the history.
+   * Is a call function in Ren'Py.
+   * @param label The label to execute.
+   * @returns
+   * @example
+   * ```typescript
+   * GameStepManager.callLabel(StartLabel)
+   * ```
+   */
+  static callLabel(label) {
+    return __async(this, null, function* () {
+      try {
+        if (label instanceof Label) {
+          label = label.constructor;
+        }
+        let labelName = label.name;
+        _GameStepManager.pushNewLabel(labelName);
+      } catch (e) {
+        console.error("[Pixi'VN] Error calling label", e);
+        return;
+      }
+      return yield _GameStepManager.runCurrentStep();
+    });
   }
-  get onEvents() {
-    return this._onEvents;
+  /**
+   * Execute the label, close all labels and add them to the history.
+   * Is a jump function in Ren'Py.
+   * @param label 
+   * @returns
+   * @example
+   * ```typescript
+   * GameStepManager.jumpLabel(StartLabel)
+   * ```
+   */
+  static jumpLabel(label) {
+    return __async(this, null, function* () {
+      _GameStepManager.closeAllLabels();
+      try {
+        if (label instanceof Label) {
+          label = label.constructor;
+        }
+        let labelName = label.name;
+        _GameStepManager.pushNewLabel(labelName);
+      } catch (e) {
+        console.error("[Pixi'VN] Error jumping label", e);
+        return;
+      }
+      return yield _GameStepManager.runCurrentStep();
+    });
   }
+  /* After Update Methods */
+  // /**
+  //  * After the update or code edit, some steps or labels may no longer match.
+  //  * - In case of step mismatch, the game will be updated to the last matching step.
+  //  * - In case of label mismatch, the game gives an error.
+  //  * @returns 
+  //  */
+  // private static afterUpdate() {
+  //     // TODO: implement
+  //     if (!GameStepManager.currentLabel) {
+  //         // TODO: implement
+  //         return
+  //     }
+  //     let currentLabel = getLabelInstanceByClassName(GameStepManager.currentLabel)
+  //     if (!currentLabel) {
+  //         console.error("Label not found")
+  //         return
+  //     }
+  //     let oldSteps = GameStepManager.stepsAfterLastHistoryLabel
+  //     let currentStepIndex = currentLabel.getCorrespondingStepsNumber(oldSteps)
+  //     let stepToRemove = oldSteps.length - currentStepIndex
+  //     GameStepManager.removeLastHistoryNodes(stepToRemove)
+  //     GameStepManager.loadLastStep()
+  // }
+  // private static loadLastStep() {
+  //     // TODO: implement
+  // }
+  // /**
+  //  * Remove a number of items from the last of the history.
+  //  * @param itemNumber The number of items to remove from the last of the history.
+  //  */
+  // private static removeLastHistoryNodes(itemNumber: number) {
+  //     // TODO: implement
+  //     for (let i = 0; i < itemNumber; i++) {
+  //         GameStepManager._stepsHistory.pop()
+  //     }
+  // }
+  // /**
+  //  * stepsAfterLastHistoryLabel is a list of steps that occurred after the last history label.
+  //  */
+  // private static get stepsAfterLastHistoryLabel(): StepHistoryDataType[] {
+  //     let length = GameStepManager._stepsHistory.length
+  //     let steps: StepHistoryDataType[] = []
+  //     for (let i = length - 1; i >= 0; i--) {
+  //         let element = GameStepManager._stepsHistory[i]
+  //         if (typeof element === "object" && "stepSha1" in element) {
+  //             steps.push(element.stepSha1)
+  //         }
+  //         else {
+  //             break
+  //         }
+  //     }
+  //     steps = steps.reverse()
+  //     return steps
+  // }
+  /* Go Back & Refresh Methods */
   /**
-   * is same function as on(), but it keeps in memory the children.
-   * @param event The event type, e.g., 'click', 'mousedown', 'mouseup', 'pointerdown', etc.
-   * @param eventClass The class that extends CanvasEvent.
+   * Go back to the last step and add it to the history.
+   * @param navigate The navigate function.
+   * @param steps The number of steps to go back.
    * @returns 
    * @example
    * ```typescript
-   * \@eventDecorator()
-   * export class EventTest extends CanvasEvent<CanvasText> {
-   *     override fn(event: CanvasEventNamesType, text: CanvasText): void {
-   *         if (event === 'pointerdown') {
-   *             text.scale.x *= 1.25;
-   *             text.scale.y *= 1.25;
-   *         }
-   *     }
+   * export function goBack(navigate: (path: string) => void, afterBack?: () => void) {
+   *     GameStepManager.goBack(navigate)
+   *     afterBack && afterBack()
    * }
    * ```
-   * 
-   * ```typescript
-   * const text = new CanvasText();
-   * text.text = "Hello World"
-   *
-   * text.eventMode = 'static';
-   * text.cursor = 'pointer';
-   * text.onEvent('pointerdown', EventTest);
-   *
-   * GameWindowManager.addCanvasElement("text", text);
-   * ```
    */
-  onEvent(event, eventClass) {
-    let className = eventClass.name;
-    let instance = getEventInstanceByClassName(className);
-    this._onEvents[event] = className;
-    if (instance) {
-      super.on(event, () => {
-        instance.fn(event, this);
-      });
+  static goBack(navigate, steps = 1) {
+    if (steps <= 0) {
+      console.warn("[Pixi'VN] Steps must be greater than 0");
+      return;
+    }
+    if (_GameStepManager._stepsHistory.length <= 1) {
+      console.warn("[Pixi'VN] No steps to go back");
+      return;
+    }
+    let restoredStep = _GameStepManager.goBackInternal(steps, _GameStepManager.originalStepData);
+    if (restoredStep) {
+      _GameStepManager._originalStepData = restoredStep;
+      _GameStepManager._openedLabels = createExportableElement(restoredStep.openedLabels);
+      GameStorageManager.import(createExportableElement(restoredStep.storage));
+      GameWindowManager.import(createExportableElement(restoredStep.canvas));
+      navigate(restoredStep.path);
+    } else {
+      console.error("[Pixi'VN] Error going back");
+    }
+  }
+  static goBackInternal(steps, restoredStep) {
+    if (steps <= 0) {
+      return restoredStep;
+    }
+    if (_GameStepManager._stepsHistory.length == 0) {
+      return restoredStep;
+    }
+    let lastHistoryStep = _GameStepManager.lastHistoryStep;
+    if (lastHistoryStep) {
+      try {
+        let result = restoreDeepDiffChanges(restoredStep, lastHistoryStep.diff);
+        _GameStepManager._lastStepIndex = lastHistoryStep.index;
+        _GameStepManager._stepsHistory.pop();
+        return _GameStepManager.goBackInternal(steps - 1, result);
+      } catch (e) {
+        console.error("[Pixi'VN] Error applying diff", e);
+        return restoredStep;
+      }
+    } else {
+      return restoredStep;
     }
-    return this;
   }
   /**
-   * on() does not keep in memory the event class, use onEvent() instead
-   * @deprecated
-   * @private
-   * @param event 
-   * @param fn 
-   * @param context 
+   * Add a label to the history.
    */
-  on(event, fn, context) {
-    return super.on(event, fn, context);
+  static clear() {
+    _GameStepManager._stepsHistory = [];
+    _GameStepManager._openedLabels = [];
   }
-};
-CanvasText = __decorateClass([
-  canvasElementDecorator()
-], CanvasText);
-function getMemoryText(element) {
-  let temp = getMemoryContainer(element);
-  return __spreadProps(__spreadValues({}, temp), {
-    className: "CanvasText",
-    anchor: { x: element.anchor.x, y: element.anchor.y },
-    text: element.text,
-    resolution: element.resolution,
-    style: getTextStyle(element.style),
-    roundPixels: element.roundPixels,
-    onEvents: element.onEvents
-  });
-}
-function setMemoryText(element, memory) {
-  setMemoryContainer(element, memory);
-  if (memory.anchor) {
-    if (typeof memory.anchor === "number") {
-      element.anchor.set(memory.anchor, memory.anchor);
-    } else {
-      element.anchor.set(memory.anchor.x, memory.anchor.y);
-    }
+  /* Export and Import Methods */
+  /**
+   * Export the history to a JSON string.
+   * @returns The history in a JSON string.
+   */
+  static exportJson() {
+    return JSON.stringify(this.export());
   }
-  memory.text && (element.text = memory.text);
-  memory.resolution && (element.resolution = memory.resolution);
-  memory.style && (element.style = memory.style);
-  memory.roundPixels && (element.roundPixels = memory.roundPixels);
-  for (let event in memory.onEvents) {
-    let className = memory.onEvents[event];
-    let instance = getEventTypeByClassName(className);
-    if (instance) {
-      element.onEvent(event, instance);
-    }
+  /**
+   * Export the history to an object.
+   * @returns The history in an object.
+   */
+  static export() {
+    return {
+      stepsHistory: _GameStepManager._stepsHistory,
+      openedLabels: _GameStepManager._openedLabels,
+      lastStepIndex: _GameStepManager._lastStepIndex,
+      originalStepData: _GameStepManager._originalStepData
+    };
   }
-}
-
-// src/classes/ticker/TickerFadeAlpha.ts
-var import_pixi8 = require("pixi.js");
-var TickerFadeAlpha = class extends TickerBase {
   /**
-   * The method that will be called every frame to fade the alpha of the canvas element of the canvas.
-   * @param delta The delta time
-   * @param args The arguments that are passed to the ticker
-   * @param tags The tags of the canvas element that are connected to this ticker
+   * Import the history from a JSON string.
+   * @param dataString The history in a JSON string.
    */
-  fn(t, args, tags) {
-    let type = args.type === void 0 ? "hide" : args.type;
-    let speed = args.speed === void 0 ? 0.1 : args.speed;
-    let limit = args.limit === void 0 ? type === "hide" ? 0 : 1 : args.limit;
-    let removeElementAfter = args.tagToRemoveAfter || [];
-    if (typeof removeElementAfter === "string") {
-      removeElementAfter = [removeElementAfter];
+  static importJson(dataString) {
+    _GameStepManager.import(JSON.parse(dataString));
+  }
+  /**
+   * Import the history from an object.
+   * @param data The history in an object.
+   */
+  static import(data) {
+    _GameStepManager.clear();
+    try {
+      if (data.hasOwnProperty("stepsHistory")) {
+        _GameStepManager._stepsHistory = data["stepsHistory"];
+      } else {
+        console.warn("[Pixi'VN] No stepsHistory data found");
+      }
+      if (data.hasOwnProperty("openedLabels")) {
+        _GameStepManager._openedLabels = data["openedLabels"];
+      } else {
+        console.warn("[Pixi'VN] No openedLabels data found");
+      }
+      if (data.hasOwnProperty("lastStepIndex")) {
+        _GameStepManager._lastStepIndex = data["lastStepIndex"];
+      } else {
+        console.warn("[Pixi'VN] No lastStepIndex data found");
+      }
+      if (data.hasOwnProperty("originalStepData")) {
+        _GameStepManager._originalStepData = data["originalStepData"];
+      } else {
+        console.warn("[Pixi'VN] No originalStepData data found");
+      }
+    } catch (e) {
+      console.error("[Pixi'VN] Error importing data", e);
     }
-    if (type === "hide" && limit < 0) {
-      limit = 0;
+  }
+};
+/**
+ * stepHistory is a list of label events and steps that occurred during the progression of the steps.
+ */
+_GameStepManager._stepsHistory = [];
+_GameStepManager._lastStepIndex = 0;
+_GameStepManager._openedLabels = [];
+_GameStepManager._originalStepData = void 0;
+var GameStepManager = _GameStepManager;
+
+// src/classes/StoredClassModel.ts
+var StoredClassModel = class {
+  constructor(id) {
+    this.id = id;
+  }
+  get nameClass() {
+    return this.constructor.name + "Storage";
+  }
+  updateStorageProperty(key, value) {
+    let storage = GameStorageManager.getVariable(this.nameClass);
+    if (!storage) {
+      storage = {};
     }
-    if (type === "show" && limit > 1) {
-      limit = 1;
+    storage[this.id] = __spreadProps(__spreadValues({}, storage[this.id]), { [key]: value });
+    GameStorageManager.setVariable(this.nameClass, storage);
+  }
+  getStorageProperty(key) {
+    let storage = GameStorageManager.getVariable(this.nameClass);
+    if (!storage) {
+      return void 0;
     }
-    tags.filter((tag) => {
-      var _a;
-      let element = GameWindowManager.getCanvasElement(tag);
-      if (args.startOnlyIfHaveTexture) {
-        if (element && element instanceof import_pixi8.Sprite && ((_a = element.texture) == null ? void 0 : _a.label) == "EMPTY") {
-          return false;
-        }
-      }
-      return true;
-    }).forEach((tag) => {
-      let element = GameWindowManager.getCanvasElement(tag);
-      if (element && element instanceof import_pixi8.Container) {
-        if (type === "show" && element.alpha < limit) {
-          element.alpha += speed * t.deltaTime;
-        } else if (type === "hide" && element.alpha > limit) {
-          element.alpha -= speed * t.deltaTime;
-        } else {
-          element.alpha = limit;
-          GameWindowManager.removeAssociationBetweenTickerCanvasElement(tag, this);
-          GameWindowManager.removeCanvasElement(removeElementAfter);
-        }
-      }
-    });
+    if (storage[this.id].hasOwnProperty(key)) {
+      return storage[this.id][key];
+    }
+    return void 0;
+  }
+};
+
+// src/classes/CharacterModelBase.ts
+var CharacterModelBase2 = class extends StoredClassModel {
+  constructor(id, props) {
+    super(GameStorageManager.keysSystem.CHARACTER_PREKEY + id);
+    this.defaultName = "";
+    this.defaultName = props.name;
+    this.defaultSurname = props.surname;
+    this.defaultAge = props.age;
+    this._icon = props.icon;
+    this._color = props.color;
+  }
+  get name() {
+    return this.getStorageProperty("name") || this.defaultName;
+  }
+  set name(value) {
+    this.updateStorageProperty("name", value);
+  }
+  get surname() {
+    return this.getStorageProperty("surname") || this.defaultSurname;
+  }
+  set surname(value) {
+    this.updateStorageProperty("surname", value);
+  }
+  get age() {
+    return this.getStorageProperty("age") || this.defaultAge;
+  }
+  set age(value) {
+    this.updateStorageProperty("age", value);
+  }
+  get icon() {
+    return this._icon;
+  }
+  get color() {
+    return this._color;
   }
 };
-TickerFadeAlpha = __decorateClass([
-  tickerDecorator()
-], TickerFadeAlpha);
 
-// src/classes/ticker/TickerRotate.ts
-var import_pixi9 = require("pixi.js");
+// src/enums/LabelRunModeEnum.ts
+var LabelRunModeEnum = /* @__PURE__ */ ((LabelRunModeEnum2) => {
+  LabelRunModeEnum2["OpenByCall"] = "openbycall";
+  LabelRunModeEnum2["OpenByJump"] = "openbyjump";
+  return LabelRunModeEnum2;
+})(LabelRunModeEnum || {});
 
-// src/functions/TickerUtility.ts
-function updateTickerProgression(args, propertyName, progression) {
-  if (args.hasOwnProperty(propertyName) && typeof args[propertyName] !== "number") {
-    return;
+// src/classes/ChoiceMenuOptionLabel.ts
+var ChoiceMenuOptionLabel = class {
+  /**
+   * @param text Text to be displayed in the menu
+   * @param label Label to be opened when the option is selected
+   * @param type Type of the label to be opened
+   */
+  constructor(text, label, type = "openbycall" /* OpenByCall */) {
+    this.text = text;
+    this.label = label;
+    this.type = type;
   }
-  if (args[propertyName] !== void 0 && progression && args[propertyName] !== progression.limit) {
-    if (progression.type === "linear") {
-      args[propertyName] += progression.amt;
-      if (progression.limit !== void 0) {
-        if (args[propertyName] > progression.limit && progression.amt > 0) {
-          args[propertyName] = progression.limit;
-        } else if (args[propertyName] < progression.limit && progression.amt < 0) {
-          args[propertyName] = progression.limit;
-        }
-      }
-    } else if (progression.type === "exponential") {
-      args[propertyName] += args[propertyName] * progression.percentage;
-      if (progression.limit !== void 0) {
-        if (args[propertyName] > progression.limit && progression.percentage > 0) {
-          args[propertyName] = progression.limit;
-        } else if (args[propertyName] < progression.limit && progression.percentage < 0) {
-          args[propertyName] = progression.limit;
-        }
-      }
-    }
+};
+
+// src/classes/DialogueModelBase.ts
+var DialogueModelBase = class {
+  constructor(text, characterId) {
+    /**
+     * The text of the dialogue.
+     */
+    this.text = "";
+    this.text = text;
+    this.characterId = characterId;
   }
-}
+};
 
-// src/classes/ticker/TickerRotate.ts
-var TickerRotate = class extends TickerBase {
+// src/classes/Label.ts
+var Label = class {
   /**
-   * The method that will be called every frame to rotate the canvas element of the canvas.
-   * @param delta The delta time
-   * @param args The arguments that are passed to the ticker
-   * @param tags The tags of the canvas element that are connected to this ticker
+   * Get the steps of the label.
+   * This class should be extended and the steps method should be overridden.
+   * Every time you update this list will also be updated when the other game versions load.
    */
-  fn(t, args, tags) {
-    let speed = args.speed === void 0 ? 0.1 : args.speed;
-    let clockwise = args.clockwise === void 0 ? true : args.clockwise;
-    tags.filter((tag) => {
-      var _a;
-      let element = GameWindowManager.getCanvasElement(tag);
-      if (args.startOnlyIfHaveTexture) {
-        if (element && element instanceof import_pixi9.Sprite && ((_a = element.texture) == null ? void 0 : _a.label) == "EMPTY") {
-          return false;
-        }
-      }
-      return true;
-    }).forEach((tag) => {
-      let element = GameWindowManager.getCanvasElement(tag);
-      if (element && element instanceof import_pixi9.Container) {
-        if (clockwise)
-          element.rotation += speed * t.deltaTime;
-        else
-          element.rotation -= speed * t.deltaTime;
-      }
-    });
-    if (args.speedProgression)
-      updateTickerProgression(args, "speed", args.speedProgression);
+  get steps() {
+    throw new Error("[Pixi'VN] The method Label.steps must be overridden");
   }
-};
-TickerRotate = __decorateClass([
-  tickerDecorator()
-], TickerRotate);
-
-// src/functions/DialogueUtility.ts
-function setDialogue(props) {
-  let text = "";
-  let characterTag = void 0;
-  if (typeof props === "string") {
-    text = props;
-  } else {
-    text = props.text;
-    if (props.character) {
-      if (typeof props.character === "string") {
-        characterTag = props.character;
-      } else {
-        characterTag = props.character.id;
-      }
+  /**
+   * Get the corresponding steps number
+   * @param externalSteps
+   * @returns Numer of corresponding steps, for example, if externalSteps is [ABC, DEF, GHI] and the steps of the label is [ABC, GHT], the result will be 1
+   */
+  getCorrespondingStepsNumber(externalSteps) {
+    if (externalSteps.length === 0) {
+      return 0;
     }
-  }
-  let dialogue = new DialogueModelBase(text, characterTag);
-  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY, dialogue);
-  GameStorageManager.setVariable(GameStorageManager.keysSystem.LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY, GameStepManager.lastStepIndex);
-}
-function getDialogue() {
-  return GameStorageManager.getVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY);
-}
-function clearDialogue() {
-  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY, void 0);
-}
-function setMenuOptions(options) {
-  let value = options.map((option) => {
-    return __spreadProps(__spreadValues({}, option), {
-      label: option.label.name
-    });
-  });
-  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY, value);
-}
-function getMenuOptions() {
-  let d = GameStorageManager.getVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY);
-  if (d) {
-    let options = [];
-    d.forEach((option) => {
-      let label = getLabelTypeByClassName(option.label);
-      if (label) {
-        options.push(__spreadProps(__spreadValues({}, option), {
-          label
-        }));
+    let res = 0;
+    externalSteps.forEach((step, index) => {
+      if (checkIfStepsIsEqual(step, this.steps[index])) {
+        res = index;
       }
     });
-    return options;
+    return res;
   }
-  return void 0;
-}
-function clearMenuOptions() {
-  GameStorageManager.setVariable(GameStorageManager.keysSystem.CURRENT_MENU_OPTIONS_MEMORY_KEY, void 0);
-}
-function getDialogueHistory() {
-  let list = GameStepManager.stepsHistory.map((step, index) => {
-    if (step.storage.storage[GameStorageManager.keysSystem.LAST_DIALOGUE_ADDED_IN_STEP_MEMORY_KEY] !== index)
-      return void 0;
-    return step.storage.storage[GameStorageManager.keysSystem.CURRENT_DIALOGUE_MEMORY_KEY];
-  });
-  return list.filter((d) => d !== void 0);
-}
-
-// src/functions/GameUtility.ts
-function clearAllGameDatas() {
-  GameStorageManager.clear();
-  GameWindowManager.clear();
-  GameStepManager.clear();
-}
-
-// src/functions/ImageUtility.ts
-function addImage(tag, imageUrl) {
-  let image = new CanvasImage();
-  image.imageLink = imageUrl;
-  GameWindowManager.addCanvasElement(tag, image);
-  return image;
-}
-function showCanvasImages(canvasImages) {
-  return __async(this, null, function* () {
-    if (!Array.isArray(canvasImages)) {
-      return [canvasImages];
-    }
-    let promises = Array(canvasImages.length);
-    for (let i = 0; i < canvasImages.length; i++) {
-      promises[i] = getTexture(canvasImages[i].imageLink);
-    }
-    return Promise.all(promises).then((textures) => {
-      return textures.map((texture, index) => {
-        if (texture) {
-          canvasImages[index].texture = texture;
-          return canvasImages[index];
-        }
-        canvasImages[index].load();
-        return canvasImages[index];
-      });
-    });
-  });
-}
-function removeCanvasElement(tag) {
-  GameWindowManager.removeCanvasElement(tag);
-}
-function showImageWithDisolveEffect(tag, imageUrl, speed, priority) {
-  return __async(this, null, function* () {
-    if (!GameWindowManager.getCanvasElement(tag)) {
-      let image2 = addImage(tag, imageUrl);
-      image2.alpha = 0;
-      let effect2 = new TickerFadeAlpha({
-        speed,
-        type: "show",
-        startOnlyIfHaveTexture: true
-      }, 1e4, priority);
-      GameWindowManager.addTicker(tag, effect2);
-      return image2.load();
-    }
-    let specialTag = tag + "_temp_disolve";
-    let effect = new TickerFadeAlpha({
-      speed,
-      type: "show",
-      tagToRemoveAfter: specialTag,
-      startOnlyIfHaveTexture: true
-    }, 1e4, priority);
-    GameWindowManager.editTagCanvasElement(tag, specialTag);
-    let image = addImage(tag, imageUrl);
-    image.alpha = 0;
-    GameWindowManager.addTicker(tag, effect);
-    return image.load();
-  });
-}
-
-// src/constants.ts
-var PIXIVM_VERSION = "0.1.0";
-
-// src/functions/SavesUtility.ts
-function getSaveData() {
-  return {
-    version: PIXIVM_VERSION,
-    stepData: GameStepManager.export(),
-    storageData: GameStorageManager.export(),
-    canvasData: GameWindowManager.export(),
-    path: window.location.pathname
-  };
-}
-function getSaveJson() {
-  const saveData = getSaveData();
-  return JSON.stringify(saveData);
-}
-function loadSave(data, navigate) {
-  GameStepManager.import(data.stepData);
-  GameStorageManager.import(data.storageData);
-  GameWindowManager.import(data.canvasData);
-  navigate(data.path);
-}
-function loadSaveJsonString(dataString, navigate) {
-  loadSave(JSON.parse(dataString), navigate);
-}
+};
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   CanvasBase,
@@ -2252,13 +2378,13 @@ function loadSaveJsonString(dataString, navigate) {
   CanvasSprite,
   CanvasText,
   CharacterModelBase,
+  ChoiceMenuOptionLabel,
   DialogueModelBase,
   GameStepManager,
   GameStorageManager,
   GameWindowManager,
   Label,
   LabelRunModeEnum,
-  MenuOptionLabel,
   Pause,
   PauseValueType,
   Repeat,
@@ -2269,25 +2395,25 @@ function loadSaveJsonString(dataString, navigate) {
   addImage,
   canvasElementDecorator,
   clearAllGameDatas,
+  clearChoiceMenuOptions,
   clearDialogue,
-  clearMenuOptions,
   eventDecorator,
-  getCharacterByTag,
+  getCharacterById,
+  getChoiceMenuOptions,
   getDialogue,
   getDialogueHistory,
-  getMenuOptions,
   getSaveData,
   getSaveJson,
   getTexture,
   labelDecorator,
-  loadSave,
-  loadSaveJsonString,
+  loadSaveData,
+  loadSaveJson,
   removeCanvasElement,
   saveCharacter,
+  setChoiceMenuOptions,
   setDialogue,
-  setMenuOptions,
   showCanvasImages,
-  showImageWithDisolveEffect,
+  showImageWithDissolveTransition,
   tickerDecorator
 });
 //# sourceMappingURL=index.js.map