roosterjs-content-model-plugins 9.43.0 → 9.45.0

package/lib-amd/imageEdit/utils/doubleCheckResize.d.ts

@@ -1,12 +1,12 @@
-import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
-/**
- * @internal
- * Double check if the changed size can satisfy current width of container.
- * When resize an image and preserve ratio, its size can be limited by the size of container.
- * So we need to check the actual size and calculate the size again
- * @param editInfo Edit info of the image
- * @param preserveRatio Whether w/h ratio need to be preserved
- * @param actualWidth Actual width of the image after resize
- * @param actualHeight Actual height of the image after resize
- */
-export declare function doubleCheckResize(editInfo: ImageMetadataFormat, preserveRatio: boolean, actualWidth: number, actualHeight: number): void;
+import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ * Double check if the changed size can satisfy current width of container.
+ * When resize an image and preserve ratio, its size can be limited by the size of container.
+ * So we need to check the actual size and calculate the size again
+ * @param editInfo Edit info of the image
+ * @param preserveRatio Whether w/h ratio need to be preserved
+ * @param actualWidth Actual width of the image after resize
+ * @param actualHeight Actual height of the image after resize
+ */
+export declare function doubleCheckResize(editInfo: ImageMetadataFormat, preserveRatio: boolean, actualWidth: number, actualHeight: number): void;

package/lib-amd/imageEdit/utils/doubleCheckResize.js

@@ -1,38 +1,38 @@
-define(["require", "exports"], function (require, exports) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.doubleCheckResize = void 0;
-    /**
-     * @internal
-     * Double check if the changed size can satisfy current width of container.
-     * When resize an image and preserve ratio, its size can be limited by the size of container.
-     * So we need to check the actual size and calculate the size again
-     * @param editInfo Edit info of the image
-     * @param preserveRatio Whether w/h ratio need to be preserved
-     * @param actualWidth Actual width of the image after resize
-     * @param actualHeight Actual height of the image after resize
-     */
-    function doubleCheckResize(editInfo, preserveRatio, actualWidth, actualHeight) {
-        var widthPx = editInfo.widthPx, heightPx = editInfo.heightPx;
-        if (widthPx == undefined || heightPx == undefined) {
-            return;
-        }
-        var ratio = heightPx > 0 ? widthPx / heightPx : 0;
-        actualWidth = Math.floor(actualWidth);
-        actualHeight = Math.floor(actualHeight);
-        widthPx = Math.floor(widthPx);
-        heightPx = Math.floor(heightPx);
-        editInfo.widthPx = actualWidth;
-        editInfo.heightPx = actualHeight;
-        if (preserveRatio && ratio > 0 && (widthPx !== actualWidth || heightPx !== actualHeight)) {
-            if (actualWidth < widthPx) {
-                editInfo.heightPx = actualWidth / ratio;
-            }
-            else {
-                editInfo.widthPx = actualHeight * ratio;
-            }
-        }
-    }
-    exports.doubleCheckResize = doubleCheckResize;
-});
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.doubleCheckResize = void 0;
+    /**
+     * @internal
+     * Double check if the changed size can satisfy current width of container.
+     * When resize an image and preserve ratio, its size can be limited by the size of container.
+     * So we need to check the actual size and calculate the size again
+     * @param editInfo Edit info of the image
+     * @param preserveRatio Whether w/h ratio need to be preserved
+     * @param actualWidth Actual width of the image after resize
+     * @param actualHeight Actual height of the image after resize
+     */
+    function doubleCheckResize(editInfo, preserveRatio, actualWidth, actualHeight) {
+        var widthPx = editInfo.widthPx, heightPx = editInfo.heightPx;
+        if (widthPx == undefined || heightPx == undefined) {
+            return;
+        }
+        var ratio = heightPx > 0 ? widthPx / heightPx : 0;
+        actualWidth = Math.floor(actualWidth);
+        actualHeight = Math.floor(actualHeight);
+        widthPx = Math.floor(widthPx);
+        heightPx = Math.floor(heightPx);
+        editInfo.widthPx = actualWidth;
+        editInfo.heightPx = actualHeight;
+        if (preserveRatio && ratio > 0 && (widthPx !== actualWidth || heightPx !== actualHeight)) {
+            if (actualWidth < widthPx) {
+                editInfo.heightPx = actualWidth / ratio;
+            }
+            else {
+                editInfo.widthPx = actualHeight * ratio;
+            }
+        }
+    }
+    exports.doubleCheckResize = doubleCheckResize;
+});
 //# sourceMappingURL=doubleCheckResize.js.map

package/lib-amd/imageEdit/utils/doubleCheckResize.js.map

@@ -1 +1 @@
-{"version":3,"file":"doubleCheckResize.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/doubleCheckResize.ts"],"names":[],"mappings":";;;;IAEA;;;;;;;;;OASG;IACH,SAAgB,iBAAiB,CAC7B,QAA6B,EAC7B,aAAsB,EACtB,WAAmB,EACnB,YAAoB;QAEd,IAAA,OAAO,GAAe,QAAQ,QAAvB,EAAE,QAAQ,GAAK,QAAQ,SAAb,CAAc;QACrC,IAAI,OAAO,IAAI,SAAS,IAAI,QAAQ,IAAI,SAAS,EAAE;YAC/C,OAAO;SACV;QACD,IAAM,KAAK,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QAEpD,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;QACtC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;QACxC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC9B,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAEhC,QAAQ,CAAC,OAAO,GAAG,WAAW,CAAC;QAC/B,QAAQ,CAAC,QAAQ,GAAG,YAAY,CAAC;QAEjC,IAAI,aAAa,IAAI,KAAK,GAAG,CAAC,IAAI,CAAC,OAAO,KAAK,WAAW,IAAI,QAAQ,KAAK,YAAY,CAAC,EAAE;YACtF,IAAI,WAAW,GAAG,OAAO,EAAE;gBACvB,QAAQ,CAAC,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC;aAC3C;iBAAM;gBACH,QAAQ,CAAC,OAAO,GAAG,YAAY,GAAG,KAAK,CAAC;aAC3C;SACJ;IACL,CAAC;IA3BD,8CA2BC","sourcesContent":["import type { ImageMetadataFormat } from 'roosterjs-content-model-types';\n\n/**\n * @internal\n * Double check if the changed size can satisfy current width of container.\n * When resize an image and preserve ratio, its size can be limited by the size of container.\n * So we need to check the actual size and calculate the size again\n * @param editInfo Edit info of the image\n * @param preserveRatio Whether w/h ratio need to be preserved\n * @param actualWidth Actual width of the image after resize\n * @param actualHeight Actual height of the image after resize\n */\nexport function doubleCheckResize(\n    editInfo: ImageMetadataFormat,\n    preserveRatio: boolean,\n    actualWidth: number,\n    actualHeight: number\n) {\n    let { widthPx, heightPx } = editInfo;\n    if (widthPx == undefined || heightPx == undefined) {\n        return;\n    }\n    const ratio = heightPx > 0 ? widthPx / heightPx : 0;\n\n    actualWidth = Math.floor(actualWidth);\n    actualHeight = Math.floor(actualHeight);\n    widthPx = Math.floor(widthPx);\n    heightPx = Math.floor(heightPx);\n\n    editInfo.widthPx = actualWidth;\n    editInfo.heightPx = actualHeight;\n\n    if (preserveRatio && ratio > 0 && (widthPx !== actualWidth || heightPx !== actualHeight)) {\n        if (actualWidth < widthPx) {\n            editInfo.heightPx = actualWidth / ratio;\n        } else {\n            editInfo.widthPx = actualHeight * ratio;\n        }\n    }\n}\n"]}
+{"version":3,"file":"doubleCheckResize.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/doubleCheckResize.ts"],"names":[],"mappings":";;;;IAEA;;;;;;;;;OASG;IACH,SAAgB,iBAAiB,CAC7B,QAA6B,EAC7B,aAAsB,EACtB,WAAmB,EACnB,YAAoB;QAEd,IAAA,OAAO,GAAe,QAAQ,QAAvB,EAAE,QAAQ,GAAK,QAAQ,SAAb,CAAc;QACrC,IAAI,OAAO,IAAI,SAAS,IAAI,QAAQ,IAAI,SAAS,EAAE;YAC/C,OAAO;SACV;QACD,IAAM,KAAK,GAAG,QAAQ,GAAG,CAAC,CAAC,CAAC,CAAC,OAAO,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC;QAEpD,WAAW,GAAG,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;QACtC,YAAY,GAAG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,CAAC;QACxC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;QAC9B,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;QAEhC,QAAQ,CAAC,OAAO,GAAG,WAAW,CAAC;QAC/B,QAAQ,CAAC,QAAQ,GAAG,YAAY,CAAC;QAEjC,IAAI,aAAa,IAAI,KAAK,GAAG,CAAC,IAAI,CAAC,OAAO,KAAK,WAAW,IAAI,QAAQ,KAAK,YAAY,CAAC,EAAE;YACtF,IAAI,WAAW,GAAG,OAAO,EAAE;gBACvB,QAAQ,CAAC,QAAQ,GAAG,WAAW,GAAG,KAAK,CAAC;aAC3C;iBAAM;gBACH,QAAQ,CAAC,OAAO,GAAG,YAAY,GAAG,KAAK,CAAC;aAC3C;SACJ;IACL,CAAC;IA3BD,8CA2BC","sourcesContent":["import type { ImageMetadataFormat } from 'roosterjs-content-model-types';\r\n\r\n/**\r\n * @internal\r\n * Double check if the changed size can satisfy current width of container.\r\n * When resize an image and preserve ratio, its size can be limited by the size of container.\r\n * So we need to check the actual size and calculate the size again\r\n * @param editInfo Edit info of the image\r\n * @param preserveRatio Whether w/h ratio need to be preserved\r\n * @param actualWidth Actual width of the image after resize\r\n * @param actualHeight Actual height of the image after resize\r\n */\r\nexport function doubleCheckResize(\r\n    editInfo: ImageMetadataFormat,\r\n    preserveRatio: boolean,\r\n    actualWidth: number,\r\n    actualHeight: number\r\n) {\r\n    let { widthPx, heightPx } = editInfo;\r\n    if (widthPx == undefined || heightPx == undefined) {\r\n        return;\r\n    }\r\n    const ratio = heightPx > 0 ? widthPx / heightPx : 0;\r\n\r\n    actualWidth = Math.floor(actualWidth);\r\n    actualHeight = Math.floor(actualHeight);\r\n    widthPx = Math.floor(widthPx);\r\n    heightPx = Math.floor(heightPx);\r\n\r\n    editInfo.widthPx = actualWidth;\r\n    editInfo.heightPx = actualHeight;\r\n\r\n    if (preserveRatio && ratio > 0 && (widthPx !== actualWidth || heightPx !== actualHeight)) {\r\n        if (actualWidth < widthPx) {\r\n            editInfo.heightPx = actualWidth / ratio;\r\n        } else {\r\n            editInfo.widthPx = actualHeight * ratio;\r\n        }\r\n    }\r\n}\r\n"]}

package/lib-amd/imageEdit/utils/filterInnerResizerHandles.d.ts

@@ -1,4 +1,4 @@
-/**
- * @internal
- */
-export declare function filterInnerResizerHandles(resizeHandles: HTMLDivElement[]): HTMLDivElement[];
+/**
+ * @internal
+ */
+export declare function filterInnerResizerHandles(resizeHandles: HTMLDivElement[]): HTMLDivElement[];

package/lib-amd/imageEdit/utils/filterInnerResizerHandles.js

@@ -1,21 +1,21 @@
-define(["require", "exports", "roosterjs-content-model-dom"], function (require, exports, roosterjs_content_model_dom_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.filterInnerResizerHandles = void 0;
-    /**
-     * @internal
-     */
-    function filterInnerResizerHandles(resizeHandles) {
-        return resizeHandles
-            .map(function (resizer) {
-            var resizeHandle = resizer.firstElementChild;
-            if ((0, roosterjs_content_model_dom_1.isNodeOfType)(resizeHandle, 'ELEMENT_NODE') &&
-                (0, roosterjs_content_model_dom_1.isElementOfType)(resizeHandle, 'div')) {
-                return resizeHandle;
-            }
-        })
-            .filter(function (handle) { return !!handle; });
-    }
-    exports.filterInnerResizerHandles = filterInnerResizerHandles;
-});
+define(["require", "exports", "roosterjs-content-model-dom"], function (require, exports, roosterjs_content_model_dom_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.filterInnerResizerHandles = void 0;
+    /**
+     * @internal
+     */
+    function filterInnerResizerHandles(resizeHandles) {
+        return resizeHandles
+            .map(function (resizer) {
+            var resizeHandle = resizer.firstElementChild;
+            if ((0, roosterjs_content_model_dom_1.isNodeOfType)(resizeHandle, 'ELEMENT_NODE') &&
+                (0, roosterjs_content_model_dom_1.isElementOfType)(resizeHandle, 'div')) {
+                return resizeHandle;
+            }
+        })
+            .filter(function (handle) { return !!handle; });
+    }
+    exports.filterInnerResizerHandles = filterInnerResizerHandles;
+});
 //# sourceMappingURL=filterInnerResizerHandles.js.map

package/lib-amd/imageEdit/utils/filterInnerResizerHandles.js.map

@@ -1 +1 @@
-{"version":3,"file":"filterInnerResizerHandles.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/filterInnerResizerHandles.ts"],"names":[],"mappings":";;;;IAEA;;OAEG;IACH,SAAgB,yBAAyB,CAAC,aAA+B;QACrE,OAAO,aAAa;aACf,GAAG,CAAC,UAAA,OAAO;YACR,IAAM,YAAY,GAAG,OAAO,CAAC,iBAAiB,CAAC;YAC/C,IACI,IAAA,0CAAY,EAAC,YAAY,EAAE,cAAc,CAAC;gBAC1C,IAAA,6CAAe,EAAC,YAAY,EAAE,KAAK,CAAC,EACtC;gBACE,OAAO,YAAY,CAAC;aACvB;QACL,CAAC,CAAC;aACD,MAAM,CAAC,UAAA,MAAM,IAAI,OAAA,CAAC,CAAC,MAAM,EAAR,CAAQ,CAAqB,CAAC;IACxD,CAAC;IAZD,8DAYC","sourcesContent":["import { isElementOfType, isNodeOfType } from 'roosterjs-content-model-dom';\n\n/**\n * @internal\n */\nexport function filterInnerResizerHandles(resizeHandles: HTMLDivElement[]) {\n    return resizeHandles\n        .map(resizer => {\n            const resizeHandle = resizer.firstElementChild;\n            if (\n                isNodeOfType(resizeHandle, 'ELEMENT_NODE') &&\n                isElementOfType(resizeHandle, 'div')\n            ) {\n                return resizeHandle;\n            }\n        })\n        .filter(handle => !!handle) as HTMLDivElement[];\n}\n"]}
+{"version":3,"file":"filterInnerResizerHandles.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/filterInnerResizerHandles.ts"],"names":[],"mappings":";;;;IAEA;;OAEG;IACH,SAAgB,yBAAyB,CAAC,aAA+B;QACrE,OAAO,aAAa;aACf,GAAG,CAAC,UAAA,OAAO;YACR,IAAM,YAAY,GAAG,OAAO,CAAC,iBAAiB,CAAC;YAC/C,IACI,IAAA,0CAAY,EAAC,YAAY,EAAE,cAAc,CAAC;gBAC1C,IAAA,6CAAe,EAAC,YAAY,EAAE,KAAK,CAAC,EACtC;gBACE,OAAO,YAAY,CAAC;aACvB;QACL,CAAC,CAAC;aACD,MAAM,CAAC,UAAA,MAAM,IAAI,OAAA,CAAC,CAAC,MAAM,EAAR,CAAQ,CAAqB,CAAC;IACxD,CAAC;IAZD,8DAYC","sourcesContent":["import { isElementOfType, isNodeOfType } from 'roosterjs-content-model-dom';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport function filterInnerResizerHandles(resizeHandles: HTMLDivElement[]) {\r\n    return resizeHandles\r\n        .map(resizer => {\r\n            const resizeHandle = resizer.firstElementChild;\r\n            if (\r\n                isNodeOfType(resizeHandle, 'ELEMENT_NODE') &&\r\n                isElementOfType(resizeHandle, 'div')\r\n            ) {\r\n                return resizeHandle;\r\n            }\r\n        })\r\n        .filter(handle => !!handle) as HTMLDivElement[];\r\n}\r\n"]}

package/lib-amd/imageEdit/utils/findEditingImage.d.ts

@@ -1,10 +1,10 @@
-import type { ReadonlyContentModelBlockGroup } from 'roosterjs-content-model-types';
-import type { ImageAndParagraph } from '../types/ImageAndParagraph';
-/**
- * @internal
- */
-export declare const EDITING_MARKER = "isEditing";
-/**
- * @internal
- */
-export declare function findEditingImage(group: ReadonlyContentModelBlockGroup, imageId?: string): ImageAndParagraph | null;
+import type { ReadonlyContentModelBlockGroup } from 'roosterjs-content-model-types';
+import type { ImageAndParagraph } from '../types/ImageAndParagraph';
+/**
+ * @internal
+ */
+export declare const EDITING_MARKER = "isEditing";
+/**
+ * @internal
+ */
+export declare function findEditingImage(group: ReadonlyContentModelBlockGroup, imageId?: string): ImageAndParagraph | null;

package/lib-amd/imageEdit/utils/findEditingImage.js

@@ -1,40 +1,40 @@
-define(["require", "exports", "tslib", "roosterjs-content-model-api"], function (require, exports, tslib_1, roosterjs_content_model_api_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.findEditingImage = exports.EDITING_MARKER = void 0;
-    /**
-     * @internal
-     */
-    exports.EDITING_MARKER = 'isEditing';
-    /**
-     * @internal
-     */
-    function findEditingImage(group, imageId) {
-        var imageAndParagraph = null;
-        (0, roosterjs_content_model_api_1.queryContentModelBlocks)(group, 'Paragraph', function (paragraph) {
-            var e_1, _a;
-            try {
-                for (var _b = (0, tslib_1.__values)(paragraph.segments), _c = _b.next(); !_c.done; _c = _b.next()) {
-                    var segment = _c.value;
-                    if (segment.segmentType == 'Image' &&
-                        ((imageId && segment.format.id == imageId) ||
-                            segment.format.imageState == exports.EDITING_MARKER)) {
-                        imageAndParagraph = { image: segment, paragraph: paragraph };
-                        return true;
-                    }
-                }
-            }
-            catch (e_1_1) { e_1 = { error: e_1_1 }; }
-            finally {
-                try {
-                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
-                }
-                finally { if (e_1) throw e_1.error; }
-            }
-            return false;
-        }, true /*findFirstOnly*/);
-        return imageAndParagraph;
-    }
-    exports.findEditingImage = findEditingImage;
-});
+define(["require", "exports", "tslib", "roosterjs-content-model-api"], function (require, exports, tslib_1, roosterjs_content_model_api_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.findEditingImage = exports.EDITING_MARKER = void 0;
+    /**
+     * @internal
+     */
+    exports.EDITING_MARKER = 'isEditing';
+    /**
+     * @internal
+     */
+    function findEditingImage(group, imageId) {
+        var imageAndParagraph = null;
+        (0, roosterjs_content_model_api_1.queryContentModelBlocks)(group, 'Paragraph', function (paragraph) {
+            var e_1, _a;
+            try {
+                for (var _b = (0, tslib_1.__values)(paragraph.segments), _c = _b.next(); !_c.done; _c = _b.next()) {
+                    var segment = _c.value;
+                    if (segment.segmentType == 'Image' &&
+                        ((imageId && segment.format.id == imageId) ||
+                            segment.format.imageState == exports.EDITING_MARKER)) {
+                        imageAndParagraph = { image: segment, paragraph: paragraph };
+                        return true;
+                    }
+                }
+            }
+            catch (e_1_1) { e_1 = { error: e_1_1 }; }
+            finally {
+                try {
+                    if (_c && !_c.done && (_a = _b.return)) _a.call(_b);
+                }
+                finally { if (e_1) throw e_1.error; }
+            }
+            return false;
+        }, true /*findFirstOnly*/);
+        return imageAndParagraph;
+    }
+    exports.findEditingImage = findEditingImage;
+});
 //# sourceMappingURL=findEditingImage.js.map

package/lib-amd/imageEdit/utils/findEditingImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"findEditingImage.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/findEditingImage.ts"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,cAAc,GAAG,WAAW,CAAC;IAE1C;;OAEG;IACH,SAAgB,gBAAgB,CAC5B,KAAqC,EACrC,OAAgB;QAEhB,IAAI,iBAAiB,GAA6B,IAAI,CAAC;QACvD,IAAA,qDAAuB,EACnB,KAAK,EACL,WAAW,EACX,UAAC,SAAwC;;;gBACrC,KAAsB,IAAA,KAAA,sBAAA,SAAS,CAAC,QAAQ,CAAA,gBAAA,4BAAE;oBAArC,IAAM,OAAO,WAAA;oBACd,IACI,OAAO,CAAC,WAAW,IAAI,OAAO;wBAC9B,CAAC,CAAC,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE,IAAI,OAAO,CAAC;4BACtC,OAAO,CAAC,MAAM,CAAC,UAAU,IAAI,sBAAc,CAAC,EAClD;wBACE,iBAAiB,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,WAAA,EAAE,CAAC;wBAClD,OAAO,IAAI,CAAC;qBACf;iBACJ;;;;;;;;;YACD,OAAO,KAAK,CAAC;QACjB,CAAC,EACD,IAAI,CAAC,iBAAiB,CACzB,CAAC;QAEF,OAAO,iBAAiB,CAAC;IAC7B,CAAC;IAzBD,4CAyBC","sourcesContent":["import { queryContentModelBlocks } from 'roosterjs-content-model-api';\nimport type {\n    ReadonlyContentModelBlockGroup,\n    ReadonlyContentModelParagraph,\n} from 'roosterjs-content-model-types';\nimport type { ImageAndParagraph } from '../types/ImageAndParagraph';\n\n/**\n * @internal\n */\nexport const EDITING_MARKER = 'isEditing';\n\n/**\n * @internal\n */\nexport function findEditingImage(\n    group: ReadonlyContentModelBlockGroup,\n    imageId?: string\n): ImageAndParagraph | null {\n    let imageAndParagraph: ImageAndParagraph | null = null;\n    queryContentModelBlocks<ReadonlyContentModelParagraph>(\n        group,\n        'Paragraph',\n        (paragraph: ReadonlyContentModelParagraph): paragraph is ReadonlyContentModelParagraph => {\n            for (const segment of paragraph.segments) {\n                if (\n                    segment.segmentType == 'Image' &&\n                    ((imageId && segment.format.id == imageId) ||\n                        segment.format.imageState == EDITING_MARKER)\n                ) {\n                    imageAndParagraph = { image: segment, paragraph };\n                    return true;\n                }\n            }\n            return false;\n        },\n        true /*findFirstOnly*/\n    );\n\n    return imageAndParagraph;\n}\n"]}
+{"version":3,"file":"findEditingImage.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/findEditingImage.ts"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,cAAc,GAAG,WAAW,CAAC;IAE1C;;OAEG;IACH,SAAgB,gBAAgB,CAC5B,KAAqC,EACrC,OAAgB;QAEhB,IAAI,iBAAiB,GAA6B,IAAI,CAAC;QACvD,IAAA,qDAAuB,EACnB,KAAK,EACL,WAAW,EACX,UAAC,SAAwC;;;gBACrC,KAAsB,IAAA,KAAA,sBAAA,SAAS,CAAC,QAAQ,CAAA,gBAAA,4BAAE;oBAArC,IAAM,OAAO,WAAA;oBACd,IACI,OAAO,CAAC,WAAW,IAAI,OAAO;wBAC9B,CAAC,CAAC,OAAO,IAAI,OAAO,CAAC,MAAM,CAAC,EAAE,IAAI,OAAO,CAAC;4BACtC,OAAO,CAAC,MAAM,CAAC,UAAU,IAAI,sBAAc,CAAC,EAClD;wBACE,iBAAiB,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,SAAS,WAAA,EAAE,CAAC;wBAClD,OAAO,IAAI,CAAC;qBACf;iBACJ;;;;;;;;;YACD,OAAO,KAAK,CAAC;QACjB,CAAC,EACD,IAAI,CAAC,iBAAiB,CACzB,CAAC;QAEF,OAAO,iBAAiB,CAAC;IAC7B,CAAC;IAzBD,4CAyBC","sourcesContent":["import { queryContentModelBlocks } from 'roosterjs-content-model-api';\r\nimport type {\r\n    ReadonlyContentModelBlockGroup,\r\n    ReadonlyContentModelParagraph,\r\n} from 'roosterjs-content-model-types';\r\nimport type { ImageAndParagraph } from '../types/ImageAndParagraph';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport const EDITING_MARKER = 'isEditing';\r\n\r\n/**\r\n * @internal\r\n */\r\nexport function findEditingImage(\r\n    group: ReadonlyContentModelBlockGroup,\r\n    imageId?: string\r\n): ImageAndParagraph | null {\r\n    let imageAndParagraph: ImageAndParagraph | null = null;\r\n    queryContentModelBlocks<ReadonlyContentModelParagraph>(\r\n        group,\r\n        'Paragraph',\r\n        (paragraph: ReadonlyContentModelParagraph): paragraph is ReadonlyContentModelParagraph => {\r\n            for (const segment of paragraph.segments) {\r\n                if (\r\n                    segment.segmentType == 'Image' &&\r\n                    ((imageId && segment.format.id == imageId) ||\r\n                        segment.format.imageState == EDITING_MARKER)\r\n                ) {\r\n                    imageAndParagraph = { image: segment, paragraph };\r\n                    return true;\r\n                }\r\n            }\r\n            return false;\r\n        },\r\n        true /*findFirstOnly*/\r\n    );\r\n\r\n    return imageAndParagraph;\r\n}\r\n"]}

package/lib-amd/imageEdit/utils/generateDataURL.d.ts

@@ -1,13 +1,13 @@
-import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
-/**
- * @internal
- * Generate new dataURL from an image and edit info
- * @param image The image to generate data URL from. It is supposed to have original src loaded
- * @param editInfo Edit info of the image
- * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.
- * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.
- * It is possible to throw exception since the original image may not be able to read its content from
- * the code, so better check canRegenerateImage() of the image first.
- * @throws Exception when fail to generate dataURL from canvas
- */
-export declare function generateDataURL(image: HTMLImageElement, editInfo: ImageMetadataFormat): string;
+import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
+/**
+ * @internal
+ * Generate new dataURL from an image and edit info
+ * @param image The image to generate data URL from. It is supposed to have original src loaded
+ * @param editInfo Edit info of the image
+ * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.
+ * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.
+ * It is possible to throw exception since the original image may not be able to read its content from
+ * the code, so better check canRegenerateImage() of the image first.
+ * @throws Exception when fail to generate dataURL from canvas
+ */
+export declare function generateDataURL(image: HTMLImageElement, editInfo: ImageMetadataFormat): string;

package/lib-amd/imageEdit/utils/generateDataURL.js

@@ -1,51 +1,58 @@
-define(["require", "exports", "./generateImageSize"], function (require, exports, generateImageSize_1) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.generateDataURL = void 0;
-    /**
-     * @internal
-     * Generate new dataURL from an image and edit info
-     * @param image The image to generate data URL from. It is supposed to have original src loaded
-     * @param editInfo Edit info of the image
-     * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.
-     * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.
-     * It is possible to throw exception since the original image may not be able to read its content from
-     * the code, so better check canRegenerateImage() of the image first.
-     * @throws Exception when fail to generate dataURL from canvas
-     */
-    function generateDataURL(image, editInfo) {
-        var generatedImageSize = (0, generateImageSize_1.getGeneratedImageSize)(editInfo);
-        if (!generatedImageSize) {
-            return '';
-        }
-        var angleRad = editInfo.angleRad, widthPx = editInfo.widthPx, heightPx = editInfo.heightPx, bottomPercent = editInfo.bottomPercent, leftPercent = editInfo.leftPercent, rightPercent = editInfo.rightPercent, topPercent = editInfo.topPercent, naturalWidth = editInfo.naturalWidth, naturalHeight = editInfo.naturalHeight;
-        var angle = angleRad || 0;
-        var left = leftPercent || 0;
-        var right = rightPercent || 0;
-        var top = topPercent || 0;
-        var bottom = bottomPercent || 0;
-        var nHeight = naturalHeight || image.naturalHeight;
-        var nWidth = naturalWidth || image.naturalHeight;
-        var width = widthPx || image.clientWidth;
-        var height = heightPx || image.clientHeight;
-        var imageWidth = nWidth * (1 - left - right);
-        var imageHeight = nHeight * (1 - top - bottom);
-        // Adjust the canvas size and scaling for high display resolution
-        var devicePixelRatio = window.devicePixelRatio || 1;
-        var canvas = document.createElement('canvas');
-        var targetWidth = generatedImageSize.targetWidth, targetHeight = generatedImageSize.targetHeight;
-        canvas.width = targetWidth * devicePixelRatio;
-        canvas.height = targetHeight * devicePixelRatio;
-        var context = canvas.getContext('2d');
-        if (context) {
-            context.scale(devicePixelRatio, devicePixelRatio);
-            context.translate(targetWidth / 2, targetHeight / 2);
-            context.rotate(angle);
-            context.scale(editInfo.flippedHorizontal ? -1 : 1, editInfo.flippedVertical ? -1 : 1);
-            context.drawImage(image, nWidth * left, nHeight * top, imageWidth, imageHeight, -width / 2, -height / 2, width, height);
-        }
-        return canvas.toDataURL('image/png', 1.0);
-    }
-    exports.generateDataURL = generateDataURL;
-});
+define(["require", "exports", "./generateImageSize"], function (require, exports, generateImageSize_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.generateDataURL = void 0;
+    /**
+     * @internal
+     * Generate new dataURL from an image and edit info
+     * @param image The image to generate data URL from. It is supposed to have original src loaded
+     * @param editInfo Edit info of the image
+     * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.
+     * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.
+     * It is possible to throw exception since the original image may not be able to read its content from
+     * the code, so better check canRegenerateImage() of the image first.
+     * @throws Exception when fail to generate dataURL from canvas
+     */
+    function generateDataURL(image, editInfo) {
+        var generatedImageSize = (0, generateImageSize_1.getGeneratedImageSize)(editInfo);
+        if (!generatedImageSize) {
+            return '';
+        }
+        var angleRad = editInfo.angleRad, widthPx = editInfo.widthPx, heightPx = editInfo.heightPx, bottomPercent = editInfo.bottomPercent, leftPercent = editInfo.leftPercent, rightPercent = editInfo.rightPercent, topPercent = editInfo.topPercent, naturalWidth = editInfo.naturalWidth, naturalHeight = editInfo.naturalHeight;
+        var angle = angleRad || 0;
+        var left = leftPercent || 0;
+        var right = rightPercent || 0;
+        var top = topPercent || 0;
+        var bottom = bottomPercent || 0;
+        var nHeight = naturalHeight || image.naturalHeight;
+        var nWidth = naturalWidth || image.naturalHeight;
+        var width = widthPx || image.clientWidth;
+        var height = heightPx || image.clientHeight;
+        var imageWidth = nWidth * (1 - left - right);
+        var imageHeight = nHeight * (1 - top - bottom);
+        var doc = image.ownerDocument;
+        var win = doc.defaultView;
+        // Adjust the canvas size and scaling for high display resolution
+        var devicePixelRatio = (win === null || win === void 0 ? void 0 : win.devicePixelRatio) || 1;
+        var canvas = doc.createElement('canvas');
+        var targetWidth = generatedImageSize.targetWidth, targetHeight = generatedImageSize.targetHeight;
+        canvas.width = targetWidth * devicePixelRatio;
+        canvas.height = targetHeight * devicePixelRatio;
+        var context = canvas.getContext('2d');
+        try {
+            if (context) {
+                context.scale(devicePixelRatio, devicePixelRatio);
+                context.translate(targetWidth / 2, targetHeight / 2);
+                context.rotate(angle);
+                context.scale(editInfo.flippedHorizontal ? -1 : 1, editInfo.flippedVertical ? -1 : 1);
+                context.drawImage(image, nWidth * left, nHeight * top, imageWidth, imageHeight, -width / 2, -height / 2, width, height);
+            }
+            return canvas.toDataURL('image/png', 1.0);
+        }
+        catch (_a) {
+            return image.src;
+        }
+    }
+    exports.generateDataURL = generateDataURL;
+});
 //# sourceMappingURL=generateDataURL.js.map

package/lib-amd/imageEdit/utils/generateDataURL.js.map

@@ -1 +1 @@
-{"version":3,"file":"generateDataURL.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/generateDataURL.ts"],"names":[],"mappings":";;;;IAGA;;;;;;;;;;OAUG;IACH,SAAgB,eAAe,CAAC,KAAuB,EAAE,QAA6B;QAClF,IAAM,kBAAkB,GAAG,IAAA,yCAAqB,EAAC,QAAQ,CAAC,CAAC;QAC3D,IAAI,CAAC,kBAAkB,EAAE;YACrB,OAAO,EAAE,CAAC;SACb;QAGG,IAAA,QAAQ,GASR,QAAQ,SATA,EACR,OAAO,GAQP,QAAQ,QARD,EACP,QAAQ,GAOR,QAAQ,SAPA,EACR,aAAa,GAMb,QAAQ,cANK,EACb,WAAW,GAKX,QAAQ,YALG,EACX,YAAY,GAIZ,QAAQ,aAJI,EACZ,UAAU,GAGV,QAAQ,WAHE,EACV,YAAY,GAEZ,QAAQ,aAFI,EACZ,aAAa,GACb,QAAQ,cADK,CACJ;QACb,IAAM,KAAK,GAAG,QAAQ,IAAI,CAAC,CAAC;QAC5B,IAAM,IAAI,GAAG,WAAW,IAAI,CAAC,CAAC;QAC9B,IAAM,KAAK,GAAG,YAAY,IAAI,CAAC,CAAC;QAChC,IAAM,GAAG,GAAG,UAAU,IAAI,CAAC,CAAC;QAC5B,IAAM,MAAM,GAAG,aAAa,IAAI,CAAC,CAAC;QAClC,IAAM,OAAO,GAAG,aAAa,IAAI,KAAK,CAAC,aAAa,CAAC;QACrD,IAAM,MAAM,GAAG,YAAY,IAAI,KAAK,CAAC,aAAa,CAAC;QACnD,IAAM,KAAK,GAAG,OAAO,IAAI,KAAK,CAAC,WAAW,CAAC;QAC3C,IAAM,MAAM,GAAG,QAAQ,IAAI,KAAK,CAAC,YAAY,CAAC;QAE9C,IAAM,UAAU,GAAG,MAAM,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC,CAAC;QAC/C,IAAM,WAAW,GAAG,OAAO,GAAG,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,CAAC;QAEjD,iEAAiE;QACjE,IAAM,gBAAgB,GAAG,MAAM,CAAC,gBAAgB,IAAI,CAAC,CAAC;QACtD,IAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACxC,IAAA,WAAW,GAAmB,kBAAkB,YAArC,EAAE,YAAY,GAAK,kBAAkB,aAAvB,CAAwB;QACzD,MAAM,CAAC,KAAK,GAAG,WAAW,GAAG,gBAAgB,CAAC;QAC9C,MAAM,CAAC,MAAM,GAAG,YAAY,GAAG,gBAAgB,CAAC;QAEhD,IAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QACxC,IAAI,OAAO,EAAE;YACT,OAAO,CAAC,KAAK,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,CAAC;YAClD,OAAO,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC;YACrD,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YACtB,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;YACtF,OAAO,CAAC,SAAS,CACb,KAAK,EACL,MAAM,GAAG,IAAI,EACb,OAAO,GAAG,GAAG,EACb,UAAU,EACV,WAAW,EACX,CAAC,KAAK,GAAG,CAAC,EACV,CAAC,MAAM,GAAG,CAAC,EACX,KAAK,EACL,MAAM,CACT,CAAC;SACL;QAED,OAAO,MAAM,CAAC,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;IAC9C,CAAC;IAzDD,0CAyDC","sourcesContent":["import { getGeneratedImageSize } from './generateImageSize';\nimport type { ImageMetadataFormat } from 'roosterjs-content-model-types';\n\n/**\n * @internal\n * Generate new dataURL from an image and edit info\n * @param image The image to generate data URL from. It is supposed to have original src loaded\n * @param editInfo Edit info of the image\n * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.\n * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.\n * It is possible to throw exception since the original image may not be able to read its content from\n * the code, so better check canRegenerateImage() of the image first.\n * @throws Exception when fail to generate dataURL from canvas\n */\nexport function generateDataURL(image: HTMLImageElement, editInfo: ImageMetadataFormat): string {\n    const generatedImageSize = getGeneratedImageSize(editInfo);\n    if (!generatedImageSize) {\n        return '';\n    }\n\n    const {\n        angleRad,\n        widthPx,\n        heightPx,\n        bottomPercent,\n        leftPercent,\n        rightPercent,\n        topPercent,\n        naturalWidth,\n        naturalHeight,\n    } = editInfo;\n    const angle = angleRad || 0;\n    const left = leftPercent || 0;\n    const right = rightPercent || 0;\n    const top = topPercent || 0;\n    const bottom = bottomPercent || 0;\n    const nHeight = naturalHeight || image.naturalHeight;\n    const nWidth = naturalWidth || image.naturalHeight;\n    const width = widthPx || image.clientWidth;\n    const height = heightPx || image.clientHeight;\n\n    const imageWidth = nWidth * (1 - left - right);\n    const imageHeight = nHeight * (1 - top - bottom);\n\n    // Adjust the canvas size and scaling for high display resolution\n    const devicePixelRatio = window.devicePixelRatio || 1;\n    const canvas = document.createElement('canvas');\n    const { targetWidth, targetHeight } = generatedImageSize;\n    canvas.width = targetWidth * devicePixelRatio;\n    canvas.height = targetHeight * devicePixelRatio;\n\n    const context = canvas.getContext('2d');\n    if (context) {\n        context.scale(devicePixelRatio, devicePixelRatio);\n        context.translate(targetWidth / 2, targetHeight / 2);\n        context.rotate(angle);\n        context.scale(editInfo.flippedHorizontal ? -1 : 1, editInfo.flippedVertical ? -1 : 1);\n        context.drawImage(\n            image,\n            nWidth * left,\n            nHeight * top,\n            imageWidth,\n            imageHeight,\n            -width / 2,\n            -height / 2,\n            width,\n            height\n        );\n    }\n\n    return canvas.toDataURL('image/png', 1.0);\n}\n"]}
+{"version":3,"file":"generateDataURL.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/generateDataURL.ts"],"names":[],"mappings":";;;;IAGA;;;;;;;;;;OAUG;IACH,SAAgB,eAAe,CAAC,KAAuB,EAAE,QAA6B;QAClF,IAAM,kBAAkB,GAAG,IAAA,yCAAqB,EAAC,QAAQ,CAAC,CAAC;QAC3D,IAAI,CAAC,kBAAkB,EAAE;YACrB,OAAO,EAAE,CAAC;SACb;QAGG,IAAA,QAAQ,GASR,QAAQ,SATA,EACR,OAAO,GAQP,QAAQ,QARD,EACP,QAAQ,GAOR,QAAQ,SAPA,EACR,aAAa,GAMb,QAAQ,cANK,EACb,WAAW,GAKX,QAAQ,YALG,EACX,YAAY,GAIZ,QAAQ,aAJI,EACZ,UAAU,GAGV,QAAQ,WAHE,EACV,YAAY,GAEZ,QAAQ,aAFI,EACZ,aAAa,GACb,QAAQ,cADK,CACJ;QACb,IAAM,KAAK,GAAG,QAAQ,IAAI,CAAC,CAAC;QAC5B,IAAM,IAAI,GAAG,WAAW,IAAI,CAAC,CAAC;QAC9B,IAAM,KAAK,GAAG,YAAY,IAAI,CAAC,CAAC;QAChC,IAAM,GAAG,GAAG,UAAU,IAAI,CAAC,CAAC;QAC5B,IAAM,MAAM,GAAG,aAAa,IAAI,CAAC,CAAC;QAClC,IAAM,OAAO,GAAG,aAAa,IAAI,KAAK,CAAC,aAAa,CAAC;QACrD,IAAM,MAAM,GAAG,YAAY,IAAI,KAAK,CAAC,aAAa,CAAC;QACnD,IAAM,KAAK,GAAG,OAAO,IAAI,KAAK,CAAC,WAAW,CAAC;QAC3C,IAAM,MAAM,GAAG,QAAQ,IAAI,KAAK,CAAC,YAAY,CAAC;QAE9C,IAAM,UAAU,GAAG,MAAM,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC,CAAC;QAC/C,IAAM,WAAW,GAAG,OAAO,GAAG,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,CAAC;QACjD,IAAM,GAAG,GAAG,KAAK,CAAC,aAAa,CAAC;QAChC,IAAM,GAAG,GAAG,GAAG,CAAC,WAAW,CAAC;QAE5B,iEAAiE;QACjE,IAAM,gBAAgB,GAAG,CAAA,GAAG,aAAH,GAAG,uBAAH,GAAG,CAAE,gBAAgB,KAAI,CAAC,CAAC;QACpD,IAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;QACnC,IAAA,WAAW,GAAmB,kBAAkB,YAArC,EAAE,YAAY,GAAK,kBAAkB,aAAvB,CAAwB;QACzD,MAAM,CAAC,KAAK,GAAG,WAAW,GAAG,gBAAgB,CAAC;QAC9C,MAAM,CAAC,MAAM,GAAG,YAAY,GAAG,gBAAgB,CAAC;QAEhD,IAAM,OAAO,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;QAExC,IAAI;YACA,IAAI,OAAO,EAAE;gBACT,OAAO,CAAC,KAAK,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,CAAC;gBAClD,OAAO,CAAC,SAAS,CAAC,WAAW,GAAG,CAAC,EAAE,YAAY,GAAG,CAAC,CAAC,CAAC;gBACrD,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;gBACtB,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;gBACtF,OAAO,CAAC,SAAS,CACb,KAAK,EACL,MAAM,GAAG,IAAI,EACb,OAAO,GAAG,GAAG,EACb,UAAU,EACV,WAAW,EACX,CAAC,KAAK,GAAG,CAAC,EACV,CAAC,MAAM,GAAG,CAAC,EACX,KAAK,EACL,MAAM,CACT,CAAC;aACL;YACD,OAAO,MAAM,CAAC,SAAS,CAAC,WAAW,EAAE,GAAG,CAAC,CAAC;SAC7C;QAAC,WAAM;YACJ,OAAO,KAAK,CAAC,GAAG,CAAC;SACpB;IACL,CAAC;IA/DD,0CA+DC","sourcesContent":["import { getGeneratedImageSize } from './generateImageSize';\r\nimport type { ImageMetadataFormat } from 'roosterjs-content-model-types';\r\n\r\n/**\r\n * @internal\r\n * Generate new dataURL from an image and edit info\r\n * @param image The image to generate data URL from. It is supposed to have original src loaded\r\n * @param editInfo Edit info of the image\r\n * @returns A BASE64 encoded string with image prefix that represents the content of the generated image.\r\n * If there are rotate/crop/resize info in the edit info, the generated image will also reflect the result.\r\n * It is possible to throw exception since the original image may not be able to read its content from\r\n * the code, so better check canRegenerateImage() of the image first.\r\n * @throws Exception when fail to generate dataURL from canvas\r\n */\r\nexport function generateDataURL(image: HTMLImageElement, editInfo: ImageMetadataFormat): string {\r\n    const generatedImageSize = getGeneratedImageSize(editInfo);\r\n    if (!generatedImageSize) {\r\n        return '';\r\n    }\r\n\r\n    const {\r\n        angleRad,\r\n        widthPx,\r\n        heightPx,\r\n        bottomPercent,\r\n        leftPercent,\r\n        rightPercent,\r\n        topPercent,\r\n        naturalWidth,\r\n        naturalHeight,\r\n    } = editInfo;\r\n    const angle = angleRad || 0;\r\n    const left = leftPercent || 0;\r\n    const right = rightPercent || 0;\r\n    const top = topPercent || 0;\r\n    const bottom = bottomPercent || 0;\r\n    const nHeight = naturalHeight || image.naturalHeight;\r\n    const nWidth = naturalWidth || image.naturalHeight;\r\n    const width = widthPx || image.clientWidth;\r\n    const height = heightPx || image.clientHeight;\r\n\r\n    const imageWidth = nWidth * (1 - left - right);\r\n    const imageHeight = nHeight * (1 - top - bottom);\r\n    const doc = image.ownerDocument;\r\n    const win = doc.defaultView;\r\n\r\n    // Adjust the canvas size and scaling for high display resolution\r\n    const devicePixelRatio = win?.devicePixelRatio || 1;\r\n    const canvas = doc.createElement('canvas');\r\n    const { targetWidth, targetHeight } = generatedImageSize;\r\n    canvas.width = targetWidth * devicePixelRatio;\r\n    canvas.height = targetHeight * devicePixelRatio;\r\n\r\n    const context = canvas.getContext('2d');\r\n\r\n    try {\r\n        if (context) {\r\n            context.scale(devicePixelRatio, devicePixelRatio);\r\n            context.translate(targetWidth / 2, targetHeight / 2);\r\n            context.rotate(angle);\r\n            context.scale(editInfo.flippedHorizontal ? -1 : 1, editInfo.flippedVertical ? -1 : 1);\r\n            context.drawImage(\r\n                image,\r\n                nWidth * left,\r\n                nHeight * top,\r\n                imageWidth,\r\n                imageHeight,\r\n                -width / 2,\r\n                -height / 2,\r\n                width,\r\n                height\r\n            );\r\n        }\r\n        return canvas.toDataURL('image/png', 1.0);\r\n    } catch {\r\n        return image.src;\r\n    }\r\n}\r\n"]}

package/lib-amd/imageEdit/utils/generateImageSize.d.ts

@@ -1,15 +1,15 @@
-import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
-import type { GeneratedImageSize } from '../types/GeneratedImageSize';
-/**
- * @internal
- * Calculate the target size of an image.
- * For image that is not rotated, target size is the same with resizing/cropping size.
- * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle
- * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size
- * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px
- * @param editInfo The edit info to calculate size from
- * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size
- * after crop
- * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image
- */
-export declare function getGeneratedImageSize(editInfo: ImageMetadataFormat, beforeCrop?: boolean): GeneratedImageSize | undefined;
+import type { ImageMetadataFormat } from 'roosterjs-content-model-types';
+import type { GeneratedImageSize } from '../types/GeneratedImageSize';
+/**
+ * @internal
+ * Calculate the target size of an image.
+ * For image that is not rotated, target size is the same with resizing/cropping size.
+ * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle
+ * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size
+ * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px
+ * @param editInfo The edit info to calculate size from
+ * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size
+ * after crop
+ * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image
+ */
+export declare function getGeneratedImageSize(editInfo: ImageMetadataFormat, beforeCrop?: boolean): GeneratedImageSize | undefined;

package/lib-amd/imageEdit/utils/generateImageSize.js

@@ -1,48 +1,48 @@
-define(["require", "exports"], function (require, exports) {
-    "use strict";
-    Object.defineProperty(exports, "__esModule", { value: true });
-    exports.getGeneratedImageSize = void 0;
-    /**
-     * @internal
-     * Calculate the target size of an image.
-     * For image that is not rotated, target size is the same with resizing/cropping size.
-     * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle
-     * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size
-     * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px
-     * @param editInfo The edit info to calculate size from
-     * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size
-     * after crop
-     * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image
-     */
-    function getGeneratedImageSize(editInfo, beforeCrop) {
-        var width = editInfo.widthPx, height = editInfo.heightPx, angleRad = editInfo.angleRad, left = editInfo.leftPercent, right = editInfo.rightPercent, top = editInfo.topPercent, bottom = editInfo.bottomPercent;
-        if (height == undefined ||
-            width == undefined ||
-            left == undefined ||
-            right == undefined ||
-            top == undefined ||
-            bottom == undefined) {
-            return;
-        }
-        var angle = angleRad !== null && angleRad !== void 0 ? angleRad : 0;
-        // Original image size before crop and rotate
-        var originalWidth = width / (1 - left - right);
-        var originalHeight = height / (1 - top - bottom);
-        // Visible size
-        var visibleWidth = beforeCrop ? originalWidth : width;
-        var visibleHeight = beforeCrop ? originalHeight : height;
-        // Target size after crop and rotate
-        var targetWidth = Math.abs(visibleWidth * Math.cos(angle)) + Math.abs(visibleHeight * Math.sin(angle));
-        var targetHeight = Math.abs(visibleWidth * Math.sin(angle)) + Math.abs(visibleHeight * Math.cos(angle));
-        return {
-            targetWidth: targetWidth,
-            targetHeight: targetHeight,
-            originalWidth: originalWidth,
-            originalHeight: originalHeight,
-            visibleWidth: visibleWidth,
-            visibleHeight: visibleHeight,
-        };
-    }
-    exports.getGeneratedImageSize = getGeneratedImageSize;
-});
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.getGeneratedImageSize = void 0;
+    /**
+     * @internal
+     * Calculate the target size of an image.
+     * For image that is not rotated, target size is the same with resizing/cropping size.
+     * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle
+     * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size
+     * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px
+     * @param editInfo The edit info to calculate size from
+     * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size
+     * after crop
+     * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image
+     */
+    function getGeneratedImageSize(editInfo, beforeCrop) {
+        var width = editInfo.widthPx, height = editInfo.heightPx, angleRad = editInfo.angleRad, left = editInfo.leftPercent, right = editInfo.rightPercent, top = editInfo.topPercent, bottom = editInfo.bottomPercent;
+        if (height == undefined ||
+            width == undefined ||
+            left == undefined ||
+            right == undefined ||
+            top == undefined ||
+            bottom == undefined) {
+            return;
+        }
+        var angle = angleRad !== null && angleRad !== void 0 ? angleRad : 0;
+        // Original image size before crop and rotate
+        var originalWidth = width / (1 - left - right);
+        var originalHeight = height / (1 - top - bottom);
+        // Visible size
+        var visibleWidth = beforeCrop ? originalWidth : width;
+        var visibleHeight = beforeCrop ? originalHeight : height;
+        // Target size after crop and rotate
+        var targetWidth = Math.abs(visibleWidth * Math.cos(angle)) + Math.abs(visibleHeight * Math.sin(angle));
+        var targetHeight = Math.abs(visibleWidth * Math.sin(angle)) + Math.abs(visibleHeight * Math.cos(angle));
+        return {
+            targetWidth: targetWidth,
+            targetHeight: targetHeight,
+            originalWidth: originalWidth,
+            originalHeight: originalHeight,
+            visibleWidth: visibleWidth,
+            visibleHeight: visibleHeight,
+        };
+    }
+    exports.getGeneratedImageSize = getGeneratedImageSize;
+});
 //# sourceMappingURL=generateImageSize.js.map

package/lib-amd/imageEdit/utils/generateImageSize.js.map

@@ -1 +1 @@
-{"version":3,"file":"generateImageSize.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/generateImageSize.ts"],"names":[],"mappings":";;;;IAGA;;;;;;;;;;;OAWG;IACH,SAAgB,qBAAqB,CACjC,QAA6B,EAC7B,UAAoB;QAGhB,IAAS,KAAK,GAOd,QAAQ,QAPM,EACJ,MAAM,GAMhB,QAAQ,SANQ,EAChB,QAAQ,GAKR,QAAQ,SALA,EACK,IAAI,GAIjB,QAAQ,YAJS,EACH,KAAK,GAGnB,QAAQ,aAHW,EACP,GAAG,GAEf,QAAQ,WAFO,EACA,MAAM,GACrB,QAAQ,cADa,CACZ;QAEb,IACI,MAAM,IAAI,SAAS;YACnB,KAAK,IAAI,SAAS;YAClB,IAAI,IAAI,SAAS;YACjB,KAAK,IAAI,SAAS;YAClB,GAAG,IAAI,SAAS;YAChB,MAAM,IAAI,SAAS,EACrB;YACE,OAAO;SACV;QAED,IAAM,KAAK,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,CAAC;QAE5B,6CAA6C;QAC7C,IAAM,aAAa,GAAG,KAAK,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC,CAAC;QACjD,IAAM,cAAc,GAAG,MAAM,GAAG,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,CAAC;QAEnD,eAAe;QACf,IAAM,YAAY,GAAG,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC;QACxD,IAAM,aAAa,GAAG,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;QAE3D,oCAAoC;QACpC,IAAM,WAAW,GACb,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;QACzF,IAAM,YAAY,GACd,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;QAEzF,OAAO;YACH,WAAW,aAAA;YACX,YAAY,cAAA;YACZ,aAAa,eAAA;YACb,cAAc,gBAAA;YACd,YAAY,cAAA;YACZ,aAAa,eAAA;SAChB,CAAC;IACN,CAAC;IAjDD,sDAiDC","sourcesContent":["import type { ImageMetadataFormat } from 'roosterjs-content-model-types';\nimport type { GeneratedImageSize } from '../types/GeneratedImageSize';\n\n/**\n * @internal\n * Calculate the target size of an image.\n * For image that is not rotated, target size is the same with resizing/cropping size.\n * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle\n * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size\n * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px\n * @param editInfo The edit info to calculate size from\n * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size\n * after crop\n * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image\n */\nexport function getGeneratedImageSize(\n    editInfo: ImageMetadataFormat,\n    beforeCrop?: boolean\n): GeneratedImageSize | undefined {\n    const {\n        widthPx: width,\n        heightPx: height,\n        angleRad,\n        leftPercent: left,\n        rightPercent: right,\n        topPercent: top,\n        bottomPercent: bottom,\n    } = editInfo;\n\n    if (\n        height == undefined ||\n        width == undefined ||\n        left == undefined ||\n        right == undefined ||\n        top == undefined ||\n        bottom == undefined\n    ) {\n        return;\n    }\n\n    const angle = angleRad ?? 0;\n\n    // Original image size before crop and rotate\n    const originalWidth = width / (1 - left - right);\n    const originalHeight = height / (1 - top - bottom);\n\n    // Visible size\n    const visibleWidth = beforeCrop ? originalWidth : width;\n    const visibleHeight = beforeCrop ? originalHeight : height;\n\n    // Target size after crop and rotate\n    const targetWidth =\n        Math.abs(visibleWidth * Math.cos(angle)) + Math.abs(visibleHeight * Math.sin(angle));\n    const targetHeight =\n        Math.abs(visibleWidth * Math.sin(angle)) + Math.abs(visibleHeight * Math.cos(angle));\n\n    return {\n        targetWidth,\n        targetHeight,\n        originalWidth,\n        originalHeight,\n        visibleWidth,\n        visibleHeight,\n    };\n}\n"]}
+{"version":3,"file":"generateImageSize.js","sourceRoot":"","sources":["../../../../../packages/roosterjs-content-model-plugins/lib/imageEdit/utils/generateImageSize.ts"],"names":[],"mappings":";;;;IAGA;;;;;;;;;;;OAWG;IACH,SAAgB,qBAAqB,CACjC,QAA6B,EAC7B,UAAoB;QAGhB,IAAS,KAAK,GAOd,QAAQ,QAPM,EACJ,MAAM,GAMhB,QAAQ,SANQ,EAChB,QAAQ,GAKR,QAAQ,SALA,EACK,IAAI,GAIjB,QAAQ,YAJS,EACH,KAAK,GAGnB,QAAQ,aAHW,EACP,GAAG,GAEf,QAAQ,WAFO,EACA,MAAM,GACrB,QAAQ,cADa,CACZ;QAEb,IACI,MAAM,IAAI,SAAS;YACnB,KAAK,IAAI,SAAS;YAClB,IAAI,IAAI,SAAS;YACjB,KAAK,IAAI,SAAS;YAClB,GAAG,IAAI,SAAS;YAChB,MAAM,IAAI,SAAS,EACrB;YACE,OAAO;SACV;QAED,IAAM,KAAK,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,CAAC,CAAC;QAE5B,6CAA6C;QAC7C,IAAM,aAAa,GAAG,KAAK,GAAG,CAAC,CAAC,GAAG,IAAI,GAAG,KAAK,CAAC,CAAC;QACjD,IAAM,cAAc,GAAG,MAAM,GAAG,CAAC,CAAC,GAAG,GAAG,GAAG,MAAM,CAAC,CAAC;QAEnD,eAAe;QACf,IAAM,YAAY,GAAG,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC;QACxD,IAAM,aAAa,GAAG,UAAU,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,MAAM,CAAC;QAE3D,oCAAoC;QACpC,IAAM,WAAW,GACb,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;QACzF,IAAM,YAAY,GACd,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC;QAEzF,OAAO;YACH,WAAW,aAAA;YACX,YAAY,cAAA;YACZ,aAAa,eAAA;YACb,cAAc,gBAAA;YACd,YAAY,cAAA;YACZ,aAAa,eAAA;SAChB,CAAC;IACN,CAAC;IAjDD,sDAiDC","sourcesContent":["import type { ImageMetadataFormat } from 'roosterjs-content-model-types';\r\nimport type { GeneratedImageSize } from '../types/GeneratedImageSize';\r\n\r\n/**\r\n * @internal\r\n * Calculate the target size of an image.\r\n * For image that is not rotated, target size is the same with resizing/cropping size.\r\n * For image that is rotated, target size is calculated from resizing/cropping size and its rotate angle\r\n * Say an image is resized to 100w*100h, cropped 25% on each side, then rotated 45deg, so that cropped size\r\n * will be (both height and width) 100*(1-0.25-0,25) = 50px, then final image size will be 50*sqrt(2) = 71px\r\n * @param editInfo The edit info to calculate size from\r\n * @param beforeCrop True to calculate the full size of original image before crop, false to calculate the size\r\n * after crop\r\n * @returns A GeneratedImageSize object which contains original, visible and target target width and height of the image\r\n */\r\nexport function getGeneratedImageSize(\r\n    editInfo: ImageMetadataFormat,\r\n    beforeCrop?: boolean\r\n): GeneratedImageSize | undefined {\r\n    const {\r\n        widthPx: width,\r\n        heightPx: height,\r\n        angleRad,\r\n        leftPercent: left,\r\n        rightPercent: right,\r\n        topPercent: top,\r\n        bottomPercent: bottom,\r\n    } = editInfo;\r\n\r\n    if (\r\n        height == undefined ||\r\n        width == undefined ||\r\n        left == undefined ||\r\n        right == undefined ||\r\n        top == undefined ||\r\n        bottom == undefined\r\n    ) {\r\n        return;\r\n    }\r\n\r\n    const angle = angleRad ?? 0;\r\n\r\n    // Original image size before crop and rotate\r\n    const originalWidth = width / (1 - left - right);\r\n    const originalHeight = height / (1 - top - bottom);\r\n\r\n    // Visible size\r\n    const visibleWidth = beforeCrop ? originalWidth : width;\r\n    const visibleHeight = beforeCrop ? originalHeight : height;\r\n\r\n    // Target size after crop and rotate\r\n    const targetWidth =\r\n        Math.abs(visibleWidth * Math.cos(angle)) + Math.abs(visibleHeight * Math.sin(angle));\r\n    const targetHeight =\r\n        Math.abs(visibleWidth * Math.sin(angle)) + Math.abs(visibleHeight * Math.cos(angle));\r\n\r\n    return {\r\n        targetWidth,\r\n        targetHeight,\r\n        originalWidth,\r\n        originalHeight,\r\n        visibleWidth,\r\n        visibleHeight,\r\n    };\r\n}\r\n"]}