@edifice.io/react 2.5.18-develop-b2school.20260504100711 → 2.5.18-develop-enabling.20260504105750

package/dist/modules/multimedia/ImageEditor/effects/crop.js

@@ -8,17 +8,25 @@ function drawBackground(application, {
   spriteName
 }) {
   removeBackground(application);
-  const sprite = application.stage.getChildByName(spriteName);
-  if (sprite == null) return;
-  const spriteBounds = sprite.getBounds(), stageTexture = application.renderer.generateTexture(application.stage).clone(), clonedStage = new PIXI.Sprite(stageTexture);
+  const sprite = application.stage.getChildByLabel(spriteName);
+  if (!sprite) return;
+  const spriteBounds = sprite.getBounds(), stageTexture = application.renderer.generateTexture(application.stage), clonedStage = new PIXI.Sprite(stageTexture);
   clonedStage.height = spriteBounds.height, clonedStage.width = spriteBounds.width, clonedStage.position = new PIXI.Point(0, 0);
-  const background = new PIXI.Graphics();
-  background.beginFill(16777215, 0.5), background.drawRect(0, 0, spriteBounds.width, spriteBounds.height), background.endFill(), background.name = CROP_BACKGROUND_NAME, background.position = new PIXI.Point(spriteBounds.x, spriteBounds.y);
+  const background = new PIXI.Container();
+  background.label = CROP_BACKGROUND_NAME, background.position = new PIXI.Point(spriteBounds.x, spriteBounds.y);
+  const backdrop = new PIXI.Graphics();
+  backdrop.rect(0, 0, spriteBounds.width, spriteBounds.height), backdrop.fill({
+    color: 16777215,
+    alpha: 0.5
+  });
   const rectMask = new PIXI.Graphics();
-  rectMask.beginFill(0, 1), rectMask.drawRect(0, 0, spriteBounds.width - 2 * PADDING, spriteBounds.height - 2 * PADDING), rectMask.endFill(), rectMask.position = new PIXI.Point(PADDING, PADDING), rectMask.name = CROP_MASK_NAME, clonedStage.mask = rectMask, application.stage.addChild(background), background.addChild(rectMask), background.addChild(clonedStage);
+  rectMask.rect(0, 0, spriteBounds.width - 2 * PADDING, spriteBounds.height - 2 * PADDING), rectMask.fill({
+    color: 0,
+    alpha: 1
+  }), rectMask.position = new PIXI.Point(PADDING, PADDING), rectMask.label = CROP_MASK_NAME, clonedStage.mask = rectMask, application.stage.addChild(background), background.addChild(backdrop), background.addChild(rectMask), background.addChild(clonedStage);
 }
 function removeBackground(application) {
-  const child = application.stage.getChildByName(CROP_BACKGROUND_NAME, !0);
+  const child = application.stage.getChildByLabel(CROP_BACKGROUND_NAME, !0);
   child == null || child.removeFromParent();
 }
 function computeCornerPosition(cornerType, bounds) {
@@ -54,10 +62,10 @@ function computeCornerPosition(cornerType, bounds) {
   }
 }
 function refreshCorners(application) {
-  const mask = application.stage.getChildByName(CROP_MASK_NAME, !0);
-  mask != null && CORNERS.forEach((cornerType) => {
-    const corner = application.stage.getChildByName(getCornerName(cornerType), !0);
-    if (corner == null) return;
+  const mask = application.stage.getChildByLabel(CROP_MASK_NAME, !0);
+  mask && CORNERS.forEach((cornerType) => {
+    const corner = application.stage.getChildByLabel(getCornerName(cornerType), !0);
+    if (!corner) return;
     const position = computeCornerPosition(cornerType, {
       height: mask.height,
       width: mask.width,
@@ -70,10 +78,10 @@ function refreshCorners(application) {
 function drawCorner(application, cornerType, {
   spriteName
 }) {
-  const previous = application.stage.getChildByName(getCornerName(cornerType), !0), scale = getApplicationScale(application);
+  const previous = application.stage.getChildByLabel(getCornerName(cornerType), !0), scale = getApplicationScale(application);
   previous == null || previous.removeFromParent();
-  const background = application.stage.getChildByName(CROP_BACKGROUND_NAME, !0), mask = application.stage.getChildByName(CROP_MASK_NAME, !0), sprite = application.stage.getChildByName(spriteName);
-  if (sprite == null || background === null || background === void 0 || mask === void 0 || mask === null)
+  const background = application.stage.getChildByLabel(CROP_BACKGROUND_NAME, !0), mask = application.stage.getChildByLabel(CROP_MASK_NAME, !0);
+  if (!application.stage.getChildByLabel(spriteName) || !background || !mask)
     return;
   const position = computeCornerPosition(cornerType, {
     height: mask.height,
@@ -81,13 +89,17 @@ function drawCorner(application, cornerType, {
     x: mask.x,
     y: mask.y
   }), corner = new PIXI.Graphics();
-  corner.beginFill(4960213, 1), corner.arc(0, 0, POINT_RADIUS / scale, position.start, position.end), corner.lineTo(0, 0), corner.endFill(), corner.position = new PIXI.Point(position.x, position.y), corner.name = getCornerName(cornerType), corner.interactive = !0;
+  corner.arc(0, 0, POINT_RADIUS / scale, position.start, position.end), corner.lineTo(0, 0), corner.fill({
+    color: 4960213,
+    alpha: 1
+  }), corner.position = new PIXI.Point(position.x, position.y), corner.label = getCornerName(cornerType), corner.interactive = !0;
   let enable = !1;
-  application.stage.on("pointermove", (event) => {
-    if (enable === !1) return;
+  const handlePointerMove = (event) => {
+    if (!enable) return;
     const localPosition = background.toLocal(event.global);
     corner.position.x = localPosition.x, corner.position.y = localPosition.y, moveMask(application, cornerType, localPosition);
-  });
+  };
+  application.stage.on("pointermove", handlePointerMove);
   const handlePointerDown = () => {
     enable = !0;
   };
@@ -96,12 +108,12 @@ function drawCorner(application, cornerType, {
     enable = !1;
   };
   globalThis.addEventListener("pointerup", handlePointerUp), corner.once("destroyed", () => {
-    corner.off("pointerdown"), globalThis.removeEventListener("pointerup", handlePointerUp);
+    corner.off("pointerdown"), application.stage.off("pointermove", handlePointerMove), globalThis.removeEventListener("pointerup", handlePointerUp);
   }), background.addChild(corner);
 }
 function moveMask(application, cornerType, position) {
-  const mask = application.stage.getChildByName(CROP_MASK_NAME, !0);
-  if (mask == null) return;
+  const mask = application.stage.getChildByLabel(CROP_MASK_NAME, !0);
+  if (!mask) return;
   const right = mask.position.x + mask.width, bottom = mask.position.y + mask.height;
   switch (cornerType) {
     case "TOP_LEFT": {
@@ -142,11 +154,15 @@ function stop(application) {
   removeBackground(application), application.stage.off("pointermove"), application.render();
 }
 function save(application) {
-  const mask = application.stage.getChildByName(CROP_MASK_NAME, !0);
-  if (mask == null) return;
-  stop(application);
-  const stageTexture = application.renderer.generateTexture(application.stage).clone(), clonedStage = new PIXI.Sprite(stageTexture), maskBounds = mask.getBounds(), bounds = new PIXI.Rectangle(Math.floor(maskBounds.x), Math.floor(maskBounds.y), Math.floor(maskBounds.width), Math.floor(maskBounds.height)), cropped = new PIXI.Texture(clonedStage.texture.baseTexture, bounds);
-  return new PIXI.Sprite(cropped);
+  const mask = application.stage.getChildByLabel(CROP_MASK_NAME, !0);
+  if (!mask) return;
+  const background = application.stage.getChildByLabel(CROP_BACKGROUND_NAME, !0), offsetX = (background == null ? void 0 : background.x) ?? 0, offsetY = (background == null ? void 0 : background.y) ?? 0, frame = new PIXI.Rectangle(Math.floor(offsetX + mask.x), Math.floor(offsetY + mask.y), Math.floor(mask.width), Math.floor(mask.height));
+  background && (background.visible = !1);
+  const croppedTexture = application.renderer.generateTexture({
+    target: application.stage,
+    frame
+  });
+  return removeBackground(application), application.stage.off("pointermove"), new PIXI.Sprite(croppedTexture);
 }
 export {
   save,

package/dist/modules/multimedia/ImageEditor/effects/misc.d.ts

@@ -1,11 +1,8 @@
 import * as PIXI from 'pixi.js';
 export declare const DEFAULT_SPRITE_NAME = "image";
 /**
- * A structure that define all setting of an image
- * - positon
- * - scale
- * - size
- * - size of the stage
+ * A structure that defines all settings of an image:
+ * position, scale, size, and size of the stage
  */
 export interface ImageSettings {
     stage: {
@@ -39,13 +36,12 @@ export interface ImageSettings {
     };
 }
 /**
- *  This function update the image content using Blob datasource
+ * Update the image content using a Blob datasource
  *
  * @param application the PIXI.Application context
  * @param param.spriteName the name of the sprite in the context
- * @param param.imgDatasource the img data could be one of: string url, HTMLImageElement, PIXI.Sprite
- * @param param.stageSize?: { width: number; height: number };
- * @param param.spriteSize?: { width: number; height: number };
+ * @param param.imgDatasource the Blob data to load as image
+ * @param param.settings optional image settings to restore position/scale/rotation
  */
 export declare function updateImageFromBlob(application: PIXI.Application, { spriteName, imgDatasource, settings, }: {
     spriteName: string;
@@ -53,13 +49,12 @@ export declare function updateImageFromBlob(application: PIXI.Application, { spr
     settings?: ImageSettings;
 }): Promise<PIXI.Sprite | null>;
 /**
- *  This function update the image content for the sprite in the PIXI.Application context
+ * Update the image content for the sprite in the PIXI.Application context
  *
  * @param application the PIXI.Application context
  * @param param.spriteName the name of the sprite in the context
- * @param param.imgDatasource the img data could be one of: string url, HTMLImageElement, PIXI.Sprite
- * @param param.spriteSize
- * @param param.stageSize
+ * @param param.imgDatasource the image source: a URL string, HTMLImageElement, or PIXI.Sprite
+ * @param param.settings optional image settings to restore position/scale/rotation
  */
 export declare function updateImage(application: PIXI.Application, { spriteName, imgDatasource, settings, }: {
     spriteName: string;
@@ -104,10 +99,9 @@ export declare function saveAsBlob(application: PIXI.Application): Promise<Blob>
  */
 export declare function saveAsDataURL(application: PIXI.Application): string | undefined;
 /**
- * Calculates the scale percentage for a PIXI.Sprite or the application view based on the parent container's dimensions.
+ * Calculates the scale ratio between the CSS display size and the actual canvas size.
  * @param application - The PIXI.Application instance.
- * @param sprite - The PIXI.Sprite instance (optional).
- * @returns The scale percentage.
+ * @returns The scale ratio (CSS width / canvas width).
  */
 export declare function getApplicationScale(application: PIXI.Application): number;
 export declare function toBlob(application: PIXI.Application): Promise<Blob>;

package/dist/modules/multimedia/ImageEditor/effects/misc.js

@@ -1,4 +1,5 @@
 import * as PIXI from "pixi.js";
+import { BLUR_LAYER_NAME } from "./constants.js";
 const MIN_HEIGHT = 100, MIN_WIDTH = 100, MODAL_VERTICAL_PADDING = 450, MODAL_HORIZONTAL_PADDING = 64, DEFAULT_QUALITY = 0.5, DEFAULT_SPRITE_NAME = "image";
 function updateImageFromBlob(application, {
   spriteName,
@@ -6,15 +7,17 @@ function updateImageFromBlob(application, {
   settings
 }) {
   const imageUrl = URL.createObjectURL(imgDatasource), image = new Image();
-  return image.src = imageUrl, new Promise((resolve) => {
+  return image.src = imageUrl, new Promise((resolve, reject) => {
     image.onload = async () => {
-      await updateImage(application, {
+      URL.revokeObjectURL(imageUrl), await updateImage(application, {
         spriteName,
         imgDatasource: image,
         settings
       });
-      const newSprite = application == null ? void 0 : application.stage.getChildByName(spriteName, !0);
+      const newSprite = application == null ? void 0 : application.stage.getChildByLabel(spriteName, !0);
       resolve(newSprite);
+    }, image.onerror = () => {
+      URL.revokeObjectURL(imageUrl), reject(new Error("Failed to load image from Blob"));
     };
   });
 }
@@ -25,10 +28,22 @@ async function updateImage(application, {
 }) {
   if (application === void 0 || application.stage === null)
     return;
-  const previous = application.stage.getChildByName(spriteName, !0);
+  const previous = application.stage.getChildByLabel(spriteName, !0);
   previous == null || previous.removeFromParent();
-  const texture = imgDatasource instanceof HTMLImageElement ? PIXI.Texture.from(imgDatasource) : imgDatasource instanceof PIXI.Sprite ? imgDatasource : await PIXI.Texture.fromURL(imgDatasource), sprite = texture instanceof PIXI.Sprite ? texture : PIXI.Sprite.from(texture, {});
-  if (sprite.interactive = !0, sprite.name = spriteName, settings) {
+  const blurLayer = application.stage.getChildByLabel(BLUR_LAYER_NAME);
+  blurLayer == null || blurLayer.removeFromParent();
+  let sprite;
+  if (imgDatasource instanceof PIXI.Sprite)
+    sprite = imgDatasource;
+  else if (imgDatasource instanceof HTMLImageElement)
+    sprite = new PIXI.Sprite(PIXI.Texture.from(imgDatasource));
+  else {
+    const img = new Image();
+    img.crossOrigin = "anonymous", img.src = imgDatasource, await new Promise((resolve, reject) => {
+      img.complete ? resolve() : (img.onload = () => resolve(), img.onerror = reject);
+    }), sprite = new PIXI.Sprite(PIXI.Texture.from(img));
+  }
+  if (sprite.interactive = !0, sprite.label = spriteName, settings) {
     const {
       sprite: {
         anchor,
@@ -48,7 +63,7 @@ async function updateImage(application, {
 }
 function autoResize(application, sprite) {
   var _a;
-  const parent = application.view.parentNode, maxMobileWidth = window.innerWidth - MODAL_HORIZONTAL_PADDING, parentWidth = Math.max((parent == null ? void 0 : parent.offsetWidth) ?? 0, MIN_WIDTH), newSize = constraintSize({
+  const parent = application.canvas.parentNode, maxMobileWidth = window.innerWidth - MODAL_HORIZONTAL_PADDING, parentWidth = Math.max((parent == null ? void 0 : parent.offsetWidth) ?? 0, MIN_WIDTH), newSize = constraintSize({
     width: sprite.width,
     height: sprite.height
   }, {
@@ -64,7 +79,7 @@ function autoResize(application, sprite) {
     height: newHeight,
     width: newWidth
   } = newSize;
-  (_a = application.view) != null && _a.style && (application.view.style.width = `${newWidth}px`, application.view.style.height = `${newHeight}px`);
+  (_a = application.canvas) != null && _a.style && (application.canvas.style.width = `${newWidth}px`, application.canvas.style.height = `${newHeight}px`);
 }
 function constraintSize(size, constraints) {
   const {
@@ -83,22 +98,22 @@ function constraintSize(size, constraints) {
 function saveAsBlob(application) {
   return new Promise((resolve, reject) => {
     var _a;
-    (_a = application == null ? void 0 : application.view) != null && _a.toBlob ? application.view.toBlob((blob) => {
+    (_a = application == null ? void 0 : application.canvas) != null && _a.toBlob ? application.canvas.toBlob((blob) => {
       blob ? resolve(blob) : reject("EXTRACT_FAILED");
     }, "image/jpeg", DEFAULT_QUALITY) : reject("EXTRACT_FAILED");
   });
 }
 function saveAsDataURL(application) {
   var _a, _b;
-  return (_b = (_a = application.view).toDataURL) == null ? void 0 : _b.call(_a);
+  return (_b = (_a = application.canvas).toDataURL) == null ? void 0 : _b.call(_a);
 }
 function getApplicationScale(application) {
-  return application.view.getBoundingClientRect ? application.view.getBoundingClientRect().width / application.view.width : 1;
+  return application.canvas.getBoundingClientRect ? application.canvas.getBoundingClientRect().width / application.canvas.width : 1;
 }
 function toBlob(application) {
   return new Promise((resolve, reject) => {
     var _a, _b;
-    (_b = (_a = application.view).toBlob) == null || _b.call(_a, (blob) => {
+    (_b = (_a = application.canvas).toBlob) == null || _b.call(_a, (blob) => {
       blob ? resolve(blob) : reject("EXTRACT_FAIL");
     }, "image/png", 1);
   });

package/dist/modules/multimedia/ImageEditor/effects/resize.d.ts

@@ -7,19 +7,15 @@ import * as PIXI from 'pixi.js';
  */
 export declare function start(application: PIXI.Application, spriteName: string): void;
 /**
- * If {saveChanges} is true remove all graphical controls then resize the sprite
- * If {saveChanges} is false remove all graphical controls and keep original size
+ * Remove all graphical controls and mouse event listeners
  *
  * @param application the PIXI.Application context
- * @param param.saveChanges true if we should save the resize
- * @param param.spriteName the name of the sprite representing the original image
  */
 export declare function stop(application: PIXI.Application): void;
 /**
+ * Apply the resize and return the result as a PIXI.Sprite
  *
  * @param application the PIXI.Application context
- * @param spriteName  the name of the sprite representing the image
- * @param size the target size of the image {width, height}
- * @returns a PIXI.Sprite with a image resized or undefined if not found
+ * @returns a PIXI.Sprite with the resized image or undefined if no resize was applied
  */
 export declare function save(application: PIXI.Application): PIXI.Sprite | undefined;

package/dist/modules/multimedia/ImageEditor/effects/resize.js

@@ -42,8 +42,8 @@ function resizeContainer(application, {
   position,
   spriteName
 }) {
-  const sprite = application.stage.getChildByName(spriteName, !0);
-  if (sprite == null) return;
+  const sprite = application.stage.getChildByLabel(spriteName, !0);
+  if (!sprite) return;
   const isRotated = sprite.rotation % Math.PI !== 0, spriteWidth = isRotated ? sprite.height : sprite.width, spriteHeight = isRotated ? sprite.width : sprite.height;
   switch (cornerType) {
     case "TOP_LEFT": {
@@ -68,20 +68,23 @@ function resizeContainer(application, {
   }
 }
 function removeCorner(application, cornerType) {
-  const previous = application.stage.getChildByName(getCornerName(cornerType), !0);
+  const previous = application.stage.getChildByLabel(getCornerName(cornerType), !0);
   previous == null || previous.removeFromParent();
 }
 function drawCorner(application, cornerType, {
   spriteName
 }) {
   removeCorner(application, cornerType);
-  const sprite = application.stage.getChildByName(spriteName, !0), container = application.stage.getChildByName(CONTROL_NAME, !0);
-  if (sprite == null || container === null || container === void 0) return;
+  const sprite = application.stage.getChildByLabel(spriteName, !0), container = application.stage.getChildByLabel(CONTROL_NAME, !0);
+  if (!sprite || !container) return;
   const position = computeCornerPosition(cornerType, container), corner = new PIXI.Graphics();
-  corner.beginFill(4960213, 1), corner.arc(0, 0, POINT_RADIUS, position.start, position.end), corner.lineTo(0, 0), corner.endFill(), corner.position = new PIXI.Point(position.x, position.y), corner.name = getCornerName(cornerType), corner.interactive = !0;
+  corner.arc(0, 0, POINT_RADIUS, position.start, position.end), corner.lineTo(0, 0), corner.fill({
+    color: 4960213,
+    alpha: 1
+  }), corner.position = new PIXI.Point(position.x, position.y), corner.label = getCornerName(cornerType), corner.interactive = !0;
   let enable = !1;
-  application.stage.on("pointermove", (event) => {
-    if (enable === !1) return;
+  const handlePointerMove = (event) => {
+    if (!enable) return;
     const localPosition = application.stage.toLocal(event.global);
     resizeContainer(application, {
       cornerType,
@@ -89,31 +92,37 @@ function drawCorner(application, cornerType, {
       container,
       spriteName
     });
-  });
-  const handlePointerUp = () => {
-    enable = !1;
   };
-  globalThis.addEventListener("pointerup", handlePointerUp), corner.once("destroyed", () => {
-    corner.off("pointerdown"), globalThis.removeEventListener("pointerup", handlePointerUp);
-  });
+  application.stage.on("pointermove", handlePointerMove);
   const handlePointerDown = () => {
     enable = !0;
   };
-  corner.on("pointerdown", handlePointerDown), container.addChild(corner);
+  corner.on("pointerdown", handlePointerDown);
+  const handlePointerUp = () => {
+    enable = !1;
+  };
+  globalThis.addEventListener("pointerup", handlePointerUp), corner.once("destroyed", () => {
+    corner.off("pointerdown"), application.stage.off("pointermove", handlePointerMove), globalThis.removeEventListener("pointerup", handlePointerUp);
+  }), container.addChild(corner);
 }
 function drawContainer(application, spriteName) {
   removeContainer(application);
-  const sprite = application.stage.getChildByName(spriteName, !0);
-  if (sprite == null) return;
+  const sprite = application.stage.getChildByLabel(spriteName, !0);
+  if (!sprite) return;
   const stageTexture = application.renderer.generateTexture(application.stage), clonedStage = new PIXI.Sprite(stageTexture);
   application.stage.children.forEach((child) => {
     child.alpha = 0;
   });
-  const container = new PIXI.Graphics();
-  container.drawRect(0, 0, sprite.width, sprite.height), container.name = CONTROL_NAME, container.interactive = !0, container.interactiveChildren = !0, application.stage.interactive = !0, application.stage.interactiveChildren = !0, application.stage.addChild(container), container.addChild(clonedStage);
+  const container = new PIXI.Container();
+  container.label = CONTROL_NAME, container.interactive = !0, container.interactiveChildren = !0;
+  const bounds = new PIXI.Graphics();
+  bounds.rect(0, 0, sprite.width, sprite.height), bounds.fill({
+    color: 0,
+    alpha: 0
+  }), application.stage.interactive = !0, application.stage.interactiveChildren = !0, application.stage.addChild(container), container.addChild(bounds), container.addChild(clonedStage);
 }
 function removeContainer(application) {
-  const container = application.stage.getChildByName(CONTROL_NAME, !0);
+  const container = application.stage.getChildByLabel(CONTROL_NAME, !0);
   container == null || container.removeFromParent(), application.stage.children.forEach((child) => {
     child.alpha = 1;
   });
@@ -140,12 +149,12 @@ function stop(application) {
 }
 function save(application) {
   var _a;
-  const container = (_a = application == null ? void 0 : application.stage) == null ? void 0 : _a.getChildByName(CONTROL_NAME, !0), size = container ? {
+  const container = (_a = application == null ? void 0 : application.stage) == null ? void 0 : _a.getChildByLabel(CONTROL_NAME, !0), size = container ? {
     height: container.height,
     width: container.width
   } : void 0;
   if (removeControl(application), size) {
-    const stageTexture = application.renderer.generateTexture(application.stage).clone(), clonedStage = new PIXI.Sprite(stageTexture);
+    const stageTexture = application.renderer.generateTexture(application.stage), clonedStage = new PIXI.Sprite(stageTexture);
     return clonedStage.width = size.width, clonedStage.height = size.height, clonedStage;
   } else
     return;

package/dist/modules/multimedia/ImageEditor/effects/rotate.js

@@ -1,8 +1,7 @@
 import { toBlob, updateImageFromBlob, createImageSettings, resizeStage } from "./misc.js";
 async function rotate(application, spriteName) {
-  const sprite = application == null ? void 0 : application.stage.getChildByName(spriteName, !0);
+  const sprite = application == null ? void 0 : application.stage.getChildByLabel(spriteName, !0);
   if (application && sprite) {
-    if (!application) return;
     const blobBefore = await toBlob(application), mergedSprite = await updateImageFromBlob(application, {
       imgDatasource: blobBefore,
       spriteName,
@@ -14,7 +13,7 @@ async function rotate(application, spriteName) {
     if (!mergedSprite)
       return;
     let backupOldMaxHeight, backupOldVisibility;
-    const canvas = application.view;
+    const canvas = application.canvas;
     canvas.style && (backupOldMaxHeight = canvas.style.maxHeight ?? "", backupOldVisibility = canvas.style.visibility ?? "", canvas.style.maxHeight = `${canvas.clientHeight}px`, canvas.style.visibility = "hidden"), mergedSprite.rotation += Math.PI / 2, resizeStage({
       application,
       sprite: mergedSprite,

package/dist/modules/multimedia/ImageEditor/hooks/useHistoryTool.js

@@ -11,49 +11,48 @@ const DEFAULT_MAX_HISTORY = 20, useHistoryTool = ({
     setHistory([]);
   }, [application]);
   const restore = async () => {
-    const imgData = history.pop();
-    imgData && (onRestore(await imgData.backup, imgData), setHistory(history.filter((current) => current !== imgData)));
-  }, listSize = (arr) => (arr.length > maxSize && arr.splice(0, arr.length - maxSize), arr), historize = async (callback) => {
-    {
-      if (!application)
-        return;
-      const sprite = application.stage.getChildByName(spriteName, !0);
-      if (sprite == null)
-        return;
-      const promise = toBlob(application), state = {
-        backup: promise,
-        sprite: {
-          rotation: sprite.rotation,
-          size: {
-            width: sprite.width,
-            height: sprite.height
-          },
-          position: {
-            x: sprite.position.x,
-            y: sprite.position.y
-          },
-          scale: {
-            x: sprite.scale.x,
-            y: sprite.scale.y
-          },
-          anchor: {
-            x: sprite.anchor.x,
-            y: sprite.anchor.y
-          }
+    if (history.length === 0) return;
+    const imgData = history[history.length - 1];
+    onRestore(await imgData.backup, imgData), setHistory(history.slice(0, -1));
+  }, trimHistory = (arr) => arr.length > maxSize ? arr.slice(arr.length - maxSize) : arr, historize = async (callback) => {
+    if (!application)
+      return;
+    const sprite = application.stage.getChildByLabel(spriteName, !0);
+    if (!sprite)
+      return;
+    const promise = toBlob(application), state = {
+      backup: promise,
+      sprite: {
+        rotation: sprite.rotation,
+        size: {
+          width: sprite.width,
+          height: sprite.height
         },
-        stage: {
-          size: {
-            width: application.stage.width,
-            height: application.stage.height
-          },
-          scale: {
-            x: application.stage.scale.x,
-            y: application.stage.scale.y
-          }
+        position: {
+          x: sprite.position.x,
+          y: sprite.position.y
+        },
+        scale: {
+          x: sprite.scale.x,
+          y: sprite.scale.y
+        },
+        anchor: {
+          x: sprite.anchor.x,
+          y: sprite.anchor.y
+        }
+      },
+      stage: {
+        size: {
+          width: application.stage.width,
+          height: application.stage.height
+        },
+        scale: {
+          x: application.stage.scale.x,
+          y: application.stage.scale.y
         }
-      };
-      return setHistory([...listSize(history), state]), await promise, callback.call(callback);
-    }
+      }
+    };
+    return setHistory(trimHistory([...history, state])), await promise, callback.call(callback);
   };
   return {
     historyCount: history.length,

package/dist/modules/multimedia/ImageEditor/hooks/useImageEditor.d.ts

@@ -14,7 +14,7 @@ export default function useImageEditor({ imageSrc, spriteName, }: {
     spriteName?: string;
 }): {
     historyCount: number;
-    setApplication: import('react').Dispatch<import('react').SetStateAction<PIXI.Application<PIXI.ICanvas> | undefined>>;
+    setApplication: import('react').Dispatch<import('react').SetStateAction<PIXI.Application<PIXI.Renderer> | undefined>>;
     restore: () => Promise<void>;
     stopCrop: (save: boolean) => void;
     stopBlur: () => void;

package/dist/modules/multimedia/ImageEditor/hooks/useImageEditor.js

@@ -1,8 +1,7 @@
 import { useState, useEffect } from "react";
-import "@pixi/mixin-get-child-by-name";
 import useHistoryTool from "./useHistoryTool.js";
 import useImageEffects from "./useImageEffects.js";
-import { updateImage, DEFAULT_SPRITE_NAME, saveAsBlob, saveAsDataURL, updateImageFromBlob } from "../effects/misc.js";
+import { updateImage, DEFAULT_SPRITE_NAME, saveAsBlob, saveAsDataURL, autoResize, updateImageFromBlob } from "../effects/misc.js";
 function useImageEditor({
   imageSrc,
   spriteName = DEFAULT_SPRITE_NAME
@@ -47,7 +46,14 @@ function useImageEditor({
       spriteName,
       imgDatasource: imageSrc
     }).finally(() => setLoading(!1)));
-  }, [application, imageSrc, spriteName]), {
+  }, [application, imageSrc, spriteName]), useEffect(() => {
+    if (!application) return;
+    const handleResize = () => {
+      const sprite = application.stage.getChildByLabel(spriteName, !0);
+      sprite && autoResize(application, sprite);
+    };
+    return window.addEventListener("resize", handleResize), () => window.removeEventListener("resize", handleResize);
+  }, [application, spriteName]), {
     historyCount,
     setApplication,
     restore,

package/dist/modules/multimedia/ImageEditor/hooks/useImageEffects.js

@@ -20,7 +20,10 @@ function useImageEffects({
       if (application) {
         if (save$12) {
           const result = save(application);
-          result && onSave(result);
+          if (result) {
+            onSave(result);
+            return;
+          }
         }
         stop(application);
       }

package/dist/modules/multimedia/LinkerCard/LinkerCard._.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { Meta, StoryObj } from '@storybook/react-vite';
 import { default as LinkerCard } from './LinkerCard';
 declare const meta: Meta<typeof LinkerCard>;
 export default meta;

package/dist/modules/multimedia/MediaLibrary/MediaLibrary.js

@@ -220,6 +220,7 @@ const orderedTabs = [
     ] })
   ] }) });
 });
+Object.assign(MediaLibrary, InnerTabs);
 export {
   MediaLibrary as default
 };

package/dist/modules/multimedia/UploadCard/UploadCard._.d.ts

@@ -1,4 +1,4 @@
-import { Meta, StoryObj } from '@storybook/react';
+import { Meta, StoryObj } from '@storybook/react-vite';
 import { default as UploadCard } from './UploadCard';
 declare const meta: Meta<typeof UploadCard>;
 export default meta;

package/dist/modules/multimedia/UploadFiles/UploadFiles.js

@@ -1,10 +1,10 @@
 import { jsxs, Fragment, jsx } from "react/jsx-runtime";
 import { customSize } from "@edifice.io/utilities";
-import { useRef, useEffect } from "react";
+import { useRef, useEffect, Suspense, lazy } from "react";
 import useUploadFiles from "../../../hooks/useUploadFiles/useUploadFiles.js";
 import UploadCard from "../UploadCard/UploadCard.js";
-import ImageEditor from "../ImageEditor/components/ImageEditor.js";
-const UploadFiles = ({
+import LoadingScreen from "../../../components/LoadingScreen/LoadingScreen.js";
+const ImageEditor = /* @__PURE__ */ lazy(async () => await import("../ImageEditor/components/ImageEditor.js")), UploadFiles = ({
   onFilesChange,
   visibility = "protected"
 }) => {
@@ -48,7 +48,7 @@ const UploadFiles = ({
       const resource = uploadedFiles.find((uploadedFile) => uploadedFile.name === file.name);
       return /* @__PURE__ */ jsx(UploadCard, { status: getUploadStatus(file), item: renderItem(file), onEdit: () => setEditingImage(resource), onRetry: () => uploadFile(file), onDelete: () => handleRemoveFile(file) }, file.name);
     }),
-    editingImage && /* @__PURE__ */ jsx(ImageEditor, { altText: editingImage.alt, legend: editingImage.title, image: getUrl(editingImage, !0), isOpen: !!editingImage, onCancel: () => setEditingImage(void 0), onSave: updateImage, onError: console.error })
+    editingImage && /* @__PURE__ */ jsx(Suspense, { fallback: /* @__PURE__ */ jsx(LoadingScreen, { position: !1 }), children: /* @__PURE__ */ jsx(ImageEditor, { altText: editingImage.alt, legend: editingImage.title, image: getUrl(editingImage, !0), isOpen: !!editingImage, onCancel: () => setEditingImage(void 0), onSave: updateImage, onError: console.error }) })
   ] });
 };
 export {

package/dist/providers/EdificeClientProvider/EdificeClientProvider.context.d.ts

@@ -1,6 +1,6 @@
 import { ReactNode } from 'react';
 import { App, IGetConf, IGetSession, IUserDescription, IUserInfo, IWebApp, UserProfile } from '@edifice.io/client';
-import { UseQueryResult } from '../../../node_modules/@tanstack/react-query';
+import { UseQueryResult } from '@tanstack/react-query';
 export interface EdificeClientParams {
     alternativeApp?: boolean;
     app: App;

package/dist/utilities/react-query/react-query-utils.d.ts

@@ -1,4 +1,4 @@
-import { InvalidateQueryFilters, QueryClient } from '../../../node_modules/@tanstack/react-query';
+import { InvalidateQueryFilters, QueryClient } from '@tanstack/react-query';
 /**
  * Invalidates queries and resets infinite query data to only contain the first page.
  *