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

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

@@ -1,18 +1,20 @@
 import * as PIXI from 'pixi.js';
 /**
- * This function start the blur controler
+ * This function starts the blur controller:
  * - drawing cursor
  * - listening mouse move to move cursor
- * - listening
+ * - listening pointer events to apply blur
  *
- * @param application
- * @param param1
+ * @param application The PIXI.Application context
+ * @param spriteName The name of the sprite identifying the original image
  */
 export declare function start(application: PIXI.Application, { spriteName }: {
     spriteName: string;
 }): void;
 /**
- * This function remove cursor and all mouse event listeners
+ * This function removes cursor and all mouse event listeners.
+ * The blur layer is kept on stage so it gets captured by toBlob/generateTexture
+ * when the image is saved or another operation is applied.
  *
  * @param application the PIXI.Application context
  */

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

@@ -1,45 +1,53 @@
 import * as PIXI from "pixi.js";
 import { aggregate } from "../utilities/aggregate.js";
+import { BLUR_LAYER_NAME } from "./constants.js";
 import { getApplicationScale } from "./misc.js";
 const BRUSH_SIZE = 20, DEBOUNCE = 50, CURSOR_NAME = "BRUSH_CURSOR";
+function getOrCreateBlurLayer(application) {
+  let layer = application.stage.getChildByLabel(BLUR_LAYER_NAME);
+  return layer || (layer = new PIXI.Container(), layer.label = BLUR_LAYER_NAME, application.stage.addChild(layer)), layer;
+}
 function drawBrush(points, scale) {
   const container = new PIXI.Graphics();
   for (const point of points)
-    point && (container.beginFill(16777215, 1), container.drawCircle(point.x, point.y, BRUSH_SIZE / scale), container.lineStyle(0), container.endFill());
+    point && (container.circle(point.x, point.y, BRUSH_SIZE / scale), container.fill({
+      color: 16777215,
+      alpha: 1
+    }));
   return container;
 }
 function drawBlurListener(application, {
   spriteName
 }) {
   return aggregate(DEBOUNCE, (event) => application.stage.toLocal(event.global), (points) => {
-    const child = application.stage.getChildByName(spriteName), scale = getApplicationScale(application);
-    if (child == null) return;
-    const newSprite = new PIXI.Sprite(child.texture);
-    newSprite.filters = [
-      new PIXI.BlurFilter(
-        8,
-        // PIXI Default value for strength of the blur effect
-        4,
-        // Quality of the blur effect depending on the scale (4 is the PIXI default value)
-        Math.min(scale, 1)
-      )
-      // Resolution of the blur effect depending on the scale
-    ], newSprite.width = child.width, newSprite.height = child.height, newSprite.scale = new PIXI.Point(1, 1), newSprite.anchor = child.anchor, newSprite.mask = drawBrush(points, scale), child.addChild(newSprite);
+    const child = application.stage.getChildByLabel(spriteName), scale = getApplicationScale(application);
+    if (!child) return;
+    const sprite = child, newSprite = new PIXI.Sprite(sprite.texture);
+    newSprite.filters = [new PIXI.BlurFilter({
+      strength: 8,
+      quality: Math.min(Math.round(4 * scale), 4),
+      resolution: Math.min(scale, 1)
+    })], newSprite.width = sprite.width, newSprite.height = sprite.height, newSprite.scale = new PIXI.Point(1, 1), newSprite.anchor = sprite.anchor;
+    const blurLayer = getOrCreateBlurLayer(application), brushMask = drawBrush(points, scale);
+    blurLayer.addChild(brushMask), newSprite.mask = brushMask, blurLayer.addChild(newSprite);
   });
 }
 function drawCursor(application) {
   removeCursor(application);
   const scale = getApplicationScale(application), circle = new PIXI.Graphics();
-  return circle.lineStyle(Math.max(1, 1 / scale), 16711680), circle.drawCircle(0, 0, BRUSH_SIZE / scale), circle.endFill(), circle.name = CURSOR_NAME, application.stage.addChild(circle), circle;
+  return circle.circle(0, 0, BRUSH_SIZE / scale), circle.stroke({
+    width: Math.max(1, 1 / scale),
+    color: 16711680
+  }), circle.label = CURSOR_NAME, application.stage.addChild(circle), circle;
 }
 function removeCursor(application) {
-  const child = application.stage.getChildByName(CURSOR_NAME);
+  const child = application.stage.getChildByLabel(CURSOR_NAME);
   child && child.removeFromParent();
 }
 function moveCursorListener(application) {
   return (event) => {
     if (!application) return;
-    const point = application.stage.toLocal(event.global), child = application.stage.getChildByName(CURSOR_NAME, !0);
+    const point = application.stage.toLocal(event.global), child = application.stage.getChildByLabel(CURSOR_NAME, !0);
     child && (child.position.x = point.x, child.position.y = point.y);
   };
 }
@@ -53,7 +61,7 @@ function start(application, {
     spriteName
   });
   application.stage.on("pointerdown", () => {
-    application.stage.on("pointermove", blurListener);
+    application.stage.off("pointermove", blurListener), application.stage.on("pointermove", blurListener);
   });
   const stopListening = () => {
     var _a;

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

@@ -0,0 +1,2 @@
+/** Label used for the blur layer Container in the stage */
+export declare const BLUR_LAYER_NAME = "BLUR_LAYER";

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

@@ -0,0 +1,4 @@
+const BLUR_LAYER_NAME = "BLUR_LAYER";
+export {
+  BLUR_LAYER_NAME
+};

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

@@ -7,7 +7,7 @@ export type CornerType = 'TOP_LEFT' | 'TOP_RIGHT' | 'BOTTOM_LEFT' | 'BOTTOM_RIGH
  * - A mask applied to the original image
  *
  * @param application The PIXI.Application context
- * @param {spriteName:string} {spriteName} The sprite name identifying the original image
+ * @param spriteName The sprite name identifying the original image
  */
 export declare function start(application: PIXI.Application, { spriteName }: {
     spriteName: string;
@@ -19,10 +19,9 @@ export declare function start(application: PIXI.Application, { spriteName }: {
  */
 export declare function stop(application: PIXI.Application): void;
 /**
- * This function apply a crop to the imageSrc and return the result as a PIXI.Sprite object
+ * This function applies a crop and returns the result as a PIXI.Sprite object
  *
- * @param application
- * @param imageSrc a string URI of the image to crop
- * @returns a PIXI.Sprite with a imageSrc cropped or undefined if the image has not been cropped
+ * @param application The PIXI.Application context
+ * @returns a PIXI.Sprite with the cropped image or undefined if no crop area was defined
  */
 export declare function save(application: PIXI.Application): PIXI.Sprite | undefined;

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,