2 files changed, 30 insertions, 12 deletions
diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
index 905c69bb8..55ad543ca 100644
--- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx
+++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx
@@ -66,6 +66,7 @@ import { RichTextRules } from './RichTextRules';
 import { schema } from './schema_rts';
 import { Property } from 'csstype';
 import { LabelBox } from '../LabelBox';
+import { StickerPalette } from '../../smartdraw/StickerPalette';
 // import * as applyDevTools from 'prosemirror-dev-tools';
 
 export interface FormattedTextBoxProps extends FieldViewProps {
@@ -989,6 +990,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
                 },
                 icon: this.Document._layout_autoHeight ? 'lock' : 'unlock',
             });
+        optionItems.push({
+            description: this.Document.savedAsSticker ? 'Sticker Saved!' : 'Save to Stickers',
+            event: action(undoable(async () => await StickerPalette.addToPalette(this.Document), 'save to palette')),
+            icon: this.Document.savedAsSticker ? 'clipboard-check' : 'file-arrow-down',
+        });
         !options && cm.addItem({ description: 'Options...', subitems: optionItems, icon: 'eye' });
         const help = cm.findByDescription('Help...');
         const helpItems = help?.subitems ?? [];
@@ -1274,9 +1280,9 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FormattedTextB
         );
         this._disposers.componentHeights = reaction(
             // set the document height when one of the component heights changes and layout_autoHeight is on
-            () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, layoutAutoHeight: this.layout_autoHeight, marginsHeight: this.layout_autoHeightMargins, tagsHeight: this.tagsHeight }),
-            ({ sidebarHeight, textHeight, layoutAutoHeight, marginsHeight, tagsHeight }) => {
-                const newHeight = this.contentScaling * (tagsHeight + marginsHeight + Math.max(sidebarHeight, textHeight));
+            () => ({ sidebarHeight: this.sidebarHeight, textHeight: this.textHeight, layoutAutoHeight: this.layout_autoHeight, marginsHeight: this.layout_autoHeightMargins }),
+            ({ sidebarHeight, textHeight, layoutAutoHeight, marginsHeight }) => {
+                const newHeight = this.contentScaling * (marginsHeight + Math.max(sidebarHeight, textHeight));
                 if (
                     (!Array.from(FormattedTextBox._globalHighlights).includes('Bold Text') || this._props.isSelected()) && //
                     layoutAutoHeight &&
diff --git a/src/client/views/nodes/imageEditor/ImageEditor.tsx b/src/client/views/nodes/imageEditor/ImageEditor.tsx
index c8fe5adc3..5c7e09645 100644
--- a/src/client/views/nodes/imageEditor/ImageEditor.tsx
+++ b/src/client/views/nodes/imageEditor/ImageEditor.tsx
@@ -142,6 +142,7 @@ const ImageEditor = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addDoc
         ctx.clearRect(0, 0, canvasSize, canvasSize);
         undoStack.current = [];
         redoStack.current = [];
+        cutPts.current.length = 0;
         ImageUtility.drawImgToCanvas(currImg.current, canvasRef, canvasDims.width, canvasDims.height);
     };
 
@@ -366,20 +367,21 @@ const ImageEditor = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addDoc
         const canvasOriginalImg = ImageUtility.getCanvasImg(img);
         if (!canvasOriginalImg) return;
         // NOTE: cutting two diff shapes can be made possible by having the user press a button to set a new shape!
+        const currPts = [...cutPts.current];
         if (currCutType !== BrushMode.LINE_OUT) handleReset(); // gets rid of the visible brush strokes (mostly needed for line_in) unless it's erasing (which depends on the brush strokes)
         let minX = img.width;
         let maxX = 0;
         let minY = img.height;
         let maxY = 0;
-        if (cutPts.current.length) {
+        if (currPts.length) {
             ctx.beginPath();
-            ctx.moveTo(cutPts.current[0].x, cutPts.current[0].y);
-            for (let i = 0; i < cutPts.current.length; i++) {
-                ctx.lineTo(cutPts.current[i].x, cutPts.current[i].y);
-                minX = Math.min(cutPts.current[i].x, minX);
-                minY = Math.min(cutPts.current[i].y, minY);
-                maxX = Math.max(cutPts.current[i].x, maxX);
-                maxY = Math.max(cutPts.current[i].y, maxY);
+            ctx.moveTo(currPts[0].x, currPts[0].y);
+            for (let i = 0; i < currPts.length; i++) {
+                ctx.lineTo(currPts[i].x, currPts[i].y);
+                minX = Math.min(currPts[i].x, minX);
+                minY = Math.min(currPts[i].y, minY);
+                maxX = Math.max(currPts[i].x, maxX);
+                maxY = Math.max(currPts[i].y, maxY);
             }
             switch (currCutType) {
                 case BrushMode.IN:
@@ -453,7 +455,17 @@ const ImageEditor = ({ imageEditorOpen, imageEditorSource, imageRootDoc, addDoc
         croppedCanvas.height = maxY - minY;
         croppedCtx.globalCompositeOperation = 'source-over';
         croppedCtx.clearRect(0, 0, croppedCanvas.width, croppedCanvas.height);
-        croppedCtx.drawImage(image, -minX, -minY);
+        croppedCtx.drawImage(
+            image,
+            minX,
+            minY,
+            maxX - minX,
+            maxY - minY, // Source image crop area
+            0,
+            0,
+            maxX - minX,
+            maxY - minY // Destination area on the canvas
+        );
         const croppedURL = croppedCanvas.toDataURL();
         const croppedImage = new Image();
         croppedImage.src = croppedURL;