crop

microsoft · Aug 11, 2023 · dec835d · dec835d
1 parent a8a9592
commit dec835d
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 4 deletions.
diff --git a/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/constants/constants.ts b/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/constants/constants.ts
@@ -14,11 +14,14 @@ export const ROTATION: Record<string, number> = {
     ne: 180,
     se: 270,
 };
+export const Xs: DNDDirectionX[] = ['w', '', 'e'];
+export const Ys: DnDDirectionY[] = ['s', '', 'n'];
+
 export const ROTATE_WIDTH = 1;
 export const ROTATE_HANDLE_TOP = ROTATE_GAP + RESIZE_HANDLE_MARGIN;
 export const CROP_HANDLE_SIZE = 22;
 export const CROP_HANDLE_WIDTH = 7;
-export const Xs: DNDDirectionX[] = ['w', '', 'e'];
-export const Ys: DnDDirectionY[] = ['s', '', 'n'];
+export const Xs_CROP: DNDDirectionX[] = ['w', 'e'];
+export const Ys_CROP: DnDDirectionY[] = ['s', 'n'];
 
 export const MIN_HEIGHT_WIDTH = 3 * RESIZE_HANDLE_SIZE + 2 * RESIZE_HANDLE_MARGIN;
diff --git a/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/imageEditors/Cropper.ts b/packages/roosterjs-editor-plugins/lib/plugins/ImageEdit/imageEditors/Cropper.ts
@@ -1,10 +1,16 @@
 import DragAndDropContext, { DNDDirectionX, DnDDirectionY } from '../types/DragAndDropContext';
 import DragAndDropHandler from '../../../pluginUtils/DragAndDropHandler';
 import { CreateElementData } from 'roosterjs-editor-types';
-import { CROP_HANDLE_SIZE, CROP_HANDLE_WIDTH, ROTATION, Xs, Ys } from '../constants/constants';
 import { CropInfo } from '../types/ImageEditInfo';
 import { ImageEditElementClass } from '../types/ImageEditElementClass';
 import { rotateCoordinate } from './Resizer';
+import {
+    CROP_HANDLE_SIZE,
+    CROP_HANDLE_WIDTH,
+    ROTATION,
+    Xs_CROP,
+    Ys_CROP,
+} from '../constants/constants';
 
 /**
  * @internal
@@ -96,7 +102,9 @@ export function getCropHTML(): CreateElementData[] {
         children: [],
     };
     if (containerHTML) {
-        Xs.forEach(x => Ys.forEach(y => containerHTML.children?.push(getCropHTMLInternal(x, y))));
+        Xs_CROP.forEach(x =>
+            Ys_CROP.forEach(y => containerHTML.children?.push(getCropHTMLInternal(x, y)))
+        );
     }
     return [containerHTML, overlayHTML, overlayHTML, overlayHTML, overlayHTML];
 }