@yorab/react-paint 0.15.0 → 0.16.0

package/dist/canvas/components/Canvas.d.ts

@@ -11,6 +11,7 @@ type DrawerType = {
     settings: UtilsSettings;
     isEditMode: boolean;
     shapes: ShapeEntity[];
+    duplicateShapes: (shapesToDuplicate: ShapeEntity[]) => void;
     saveShapes: () => void;
     addShapes: (newShape: ShapeEntity[]) => void;
     updateSingleShape: (updatedShape: ShapeEntity[], withSave?: boolean) => void;

package/dist/canvas/constants/shapes.d.ts

@@ -6,3 +6,5 @@ export declare const SELECTION_ANCHOR_SIZE = 14;
 export declare const SELECTION_ROTATED_ANCHOR_POSITION = 16;
 export declare const SELECTION_RESIZE_ANCHOR_POSITIONS: Point[];
 export declare const ShapeTypeArray: readonly ["brush", "rect", "square", "line", "polygon", "circle", "curve", "ellipse", "picture", "text", "triangle", "group"];
+export declare const SHAPES_WITH_ROTATION: string[];
+export declare const SHAPES_KEEPING_RATIO: string[];

package/dist/canvas/hooks/useDrawableCanvas.d.ts

@@ -14,6 +14,7 @@ type UseCanvasType = {
     setActiveTool: React.Dispatch<React.SetStateAction<ToolsType>>;
     refreshHoveredShape: (e: MouseEvent | TouchEvent, ctx: CanvasRenderingContext2D, cursorPosition: Point, isInsideMask: boolean) => void;
     refreshSelectedShapes: (ctx: CanvasRenderingContext2D, cursorPosition: Point, settings: UtilsSettings) => void;
+    duplicateShapes: (shapesToDuplicate: ShapeEntity[]) => void;
     canvasOffsetStartData: {
         start: Point;
         originalOffset: Point;
@@ -38,7 +39,7 @@ type UseCanvasType = {
     settings: UtilsSettings;
     isSpacePressed: boolean;
 };
-declare const useDrawableCanvas: ({ addShapes, drawCanvasRef, setActiveTool, refreshHoveredShape, shapes, selectionMode, activeTool, isInsideComponent, setCanvasOffset, selectedShape, canvasOffsetStartData, refreshSelectedShapes, setSelectedShape, setSelectionFrame, setCanvasOffsetStartData, updateSingleShape, saveShapes, setSelectionMode, setCanvasMoveAcceleration, settings, isShiftPressed, isAltPressed, withFrameSelection, isSpacePressed }: UseCanvasType) => {
+declare const useDrawableCanvas: ({ addShapes, drawCanvasRef, setActiveTool, refreshHoveredShape, shapes, selectionMode, activeTool, isInsideComponent, setCanvasOffset, selectedShape, canvasOffsetStartData, refreshSelectedShapes, setSelectedShape, setSelectionFrame, setCanvasOffsetStartData, updateSingleShape, duplicateShapes, saveShapes, setSelectionMode, setCanvasMoveAcceleration, settings, isShiftPressed, isAltPressed, withFrameSelection, isSpacePressed }: UseCanvasType) => {
     hoverMode: HoverModeData;
 };
 export default useDrawableCanvas;

package/dist/canvas/hooks/useReactPaint.d.ts

@@ -65,6 +65,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -88,6 +90,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -302,6 +306,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -325,6 +331,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -493,6 +501,7 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             path?: Path2D | undefined;
             type: "group";
         }) | undefined;
+        saveShapes: () => void;
         removeShape: (shapes: ShapeEntity[]) => void;
         updateShape: (updatedShapes: ShapeEntity[], withSave?: boolean) => void;
         backwardShape: () => void;
@@ -570,6 +579,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -593,6 +604,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -800,6 +813,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -823,6 +838,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1034,6 +1051,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -1057,6 +1076,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1265,6 +1286,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -1288,6 +1311,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1494,6 +1519,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -1517,6 +1544,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1723,6 +1752,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             src: string;
         } & {
             img: HTMLImageElement;
+            flipX?: boolean;
+            flipY?: boolean;
             type: "picture";
         } & {
             img: HTMLImageElement;
@@ -1746,6 +1777,8 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
             value: string[];
             fontSize: number;
         } & {
+            flipX?: boolean;
+            flipY?: boolean;
             type: "text";
         } & {
             selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1922,6 +1955,7 @@ declare const useReactPaint: ({ width, height, shapes: defaultShapes, mode, disa
         refreshHoveredShape: (e: MouseEvent | TouchEvent, ctx: CanvasRenderingContext2D, cursorPosition: Point, isInsideMask: boolean) => void;
         removeShape: (shapes: ShapeEntity[]) => void;
         updateShape: (updatedShapes: ShapeEntity[], withSave?: boolean) => void;
+        duplicateShapes: (shapesToDuplicate: ShapeEntity[]) => void;
         backwardShape: () => void;
         forwardShape: () => void;
         saveShapes: () => void;

package/dist/canvas/hooks/useShapes.d.ts

@@ -42,6 +42,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -65,6 +67,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -272,6 +276,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -295,6 +301,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -502,6 +510,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -525,6 +535,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -703,6 +715,7 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
     } | undefined>>;
     refreshSelectedShapes: (ctx: CanvasRenderingContext2D, cursorPosition: Point) => void;
     addShapes: (newShapes: ShapeEntity[]) => void;
+    duplicateShapes: (shapesToDuplicate: ShapeEntity[]) => void;
     addPictureShape: (fileOrUrl: File | string, maxWidth?: number, maxHeight?: number) => Promise<ShapeEntity<"picture">>;
     moveShapes: (startPositionShapeId: string, endPositionShapeId: string) => void;
     saveShapes: () => void;
@@ -745,6 +758,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -768,6 +783,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -974,6 +991,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -997,6 +1016,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
@@ -1203,6 +1224,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         src: string;
     } & {
         img: HTMLImageElement;
+        flipX?: boolean;
+        flipY?: boolean;
         type: "picture";
     } & {
         img: HTMLImageElement;
@@ -1226,6 +1249,8 @@ declare const useShapes: (settings: UtilsSettings, width: number, height: number
         value: string[];
         fontSize: number;
     } & {
+        flipX?: boolean;
+        flipY?: boolean;
         type: "text";
     } & {
         selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;

package/dist/canvas/utils/file.d.ts

@@ -52,6 +52,8 @@ export declare const decodeImportedData: (shapesForJson: ExportedDrawableShape[]
     src: string;
 } & {
     img: HTMLImageElement;
+    flipX?: boolean;
+    flipY?: boolean;
     type: "picture";
 } & {
     img: HTMLImageElement;
@@ -75,6 +77,8 @@ export declare const decodeImportedData: (shapesForJson: ExportedDrawableShape[]
     value: string[];
     fontSize: number;
 } & {
+    flipX?: boolean;
+    flipY?: boolean;
     type: "text";
 } & {
     selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;

package/dist/canvas/utils/selection/groupSelection.d.ts

@@ -1,3 +1,4 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
-import type { ShapeEntity } from './../../../common/types/Shapes';
-export declare const drawSelectionGroup: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"group">, selectionColor: string, selectionWidth: number, settings: UtilsSettings, withAnchors: boolean) => void;
+import type { SelectionModeData } from './../../../common/types/Mode';
+import type { Point, ShapeEntity } from './../../../common/types/Shapes';
+export declare const drawSelectionGroup: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"group">, selectionColor: string, selectionWidth: number, selectionMode: SelectionModeData<number | Point>, settings: UtilsSettings, withAnchors: boolean) => void;

package/dist/canvas/utils/selection/rectSelection.d.ts

@@ -5,7 +5,7 @@ export declare const createRecSelectionPath: (path: Path2D | undefined, computed
     borders: Rect;
     outerBorders: Rect;
     center: Point;
-}, settings: UtilsSettings, isGroup?: boolean) => SelectionDefaultType;
+}, settings: UtilsSettings) => SelectionDefaultType;
 export declare const drawBoundingBox: (ctx: CanvasRenderingContext2D, shape: SelectionType, selectionWidth: number, settings: UtilsSettings) => void;
 export declare const drawSelectionRect: (ctx: CanvasRenderingContext2D, shape: ShapeEntity & {
     selection?: SelectionDefaultType | undefined;
@@ -15,4 +15,6 @@ export declare const resizeRectSelection: (cursorPosition: Point, originalShape:
     borderHeight: number;
     borderY: number;
     borderWidth: number;
+    isXinverted: boolean;
+    isYinverted: boolean;
 };

package/dist/canvas/utils/shapes/brush.d.ts

@@ -1,7 +1,9 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
+import { type GroupResizeContext } from './group';
+export declare const getBrushBorder: (brush: DrawableShape<"brush">, { selectionPadding }: Pick<UtilsSettings, "selectionPadding">) => Rect;
 export declare const getComputedBrush: (brush: DrawableShape<"brush">, settings: UtilsSettings) => {
     borders: Rect;
     outerBorders: Rect;
@@ -17,7 +19,9 @@ export declare const createBrush: (shape: {
     settings: ToolsSettingsType<"brush">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;
 export declare const drawBrush: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"brush">) => void;
-export declare const translateBrush: (cursorPosition: Point, originalShape: ShapeEntity<"brush">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"brush">;
 export declare const resizeBrush: (cursorPosition: Point, originalShape: ShapeEntity<"brush">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean, resizeFromCenter: boolean) => ShapeEntity<"brush">;
+export declare const resizeBrushInGroup: (shape: ShapeEntity<"brush">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"brush">;
 export declare const addNewPointToShape: (shape: ShapeEntity<"brush">, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;
 export declare const addNewPointGroupToShape: (shape: ShapeEntity<"brush">, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;

package/dist/canvas/utils/shapes/circle.d.ts

@@ -1,7 +1,8 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
+import { type GroupResizeContext } from './group';
 export declare const getComputedCircle: (circle: DrawableShape<"circle">, settings: UtilsSettings) => {
     borders: Rect;
     outerBorders: Rect;
@@ -17,5 +18,7 @@ export declare const createCircle: (shape: {
     settings: ToolsSettingsType<"circle">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"circle">;
 export declare const drawCircle: (ctx: CanvasRenderingContext2D, circle: ShapeEntity<"circle">) => void;
-export declare const translateCircle: (cursorPosition: Point, originalShape: ShapeEntity<"circle">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"circle">;
 export declare const resizeCircle: (cursorPosition: Point, originalShape: ShapeEntity<"circle">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => ShapeEntity<"circle">;
+export declare const resizeCircleInGroup: (shape: ShapeEntity<"circle">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"circle">;

package/dist/canvas/utils/shapes/curve.d.ts

@@ -18,6 +18,5 @@ export declare const createCurve: (shape: {
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"curve">;
 export declare const resizeCurve: (cursorPosition: Point, originalShape: ShapeEntity<"curve">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"curve">;
 export declare const drawCurve: (ctx: CanvasRenderingContext2D, curve: ShapeEntity<"curve">) => void;
-export declare const translateCurve: (cursorPosition: Point, originalShape: ShapeEntity<"curve">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"curve">;
 export declare const addCurveLine: (shape: ShapeEntity<"curve">, lineIndex: number, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"curve">;
 export declare const addCurvePoint: (shape: ShapeEntity<"curve">, cursorPosition: Point, settings: UtilsSettings, temporary?: boolean) => ShapeEntity<"curve">;

package/dist/canvas/utils/shapes/ellipse.d.ts

@@ -1,7 +1,8 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
+import { type GroupResizeContext } from './group';
 export declare const getComputedEllipse: (ellipse: DrawableShape<"ellipse">, settings: UtilsSettings) => {
     borders: Rect;
     outerBorders: Rect;
@@ -17,5 +18,7 @@ export declare const createEllipse: (shape: {
     settings: ToolsSettingsType<"ellipse">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"ellipse">;
 export declare const drawEllipse: (ctx: CanvasRenderingContext2D, ellipse: ShapeEntity<"ellipse">) => void;
-export declare const translateEllipse: (cursorPosition: Point, originalShape: ShapeEntity<"ellipse">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"ellipse">;
 export declare const resizeEllipse: (cursorPosition: Point, originalShape: ShapeEntity<"ellipse">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => ShapeEntity<"ellipse">;
+export declare const resizeEllipseInGroup: (shape: ShapeEntity<"ellipse">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"ellipse">;

package/dist/canvas/utils/shapes/group.d.ts

@@ -0,0 +1,33 @@
+import type { UtilsSettings } from './../../../canvas/constants/app';
+import type { SelectionModeResize } from './../../../common/types/Mode';
+import type { Point, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
+/** Shared context when resizing shapes inside a group */
+export type GroupResizeContext = {
+    newBorderX: number;
+    newBorderY: number;
+    newBorderWidth: number;
+    newBorderHeight: number;
+    widthMultiplier: number;
+    heightMultiplier: number;
+    isXinverted: boolean;
+    isYinverted: boolean;
+    groupCenter: Point;
+    rotation: number;
+    settings: UtilsSettings;
+    originalBorders: {
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    };
+};
+export declare const getGroupResizeContext: (cursorPosition: Point, group: SelectionType & {
+    type: "group";
+}, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean, isAltPressed: boolean) => GroupResizeContext;
+export declare const getShapePositionInNewBorder: (shape: ShapeEntity, group: SelectionType & {
+    type: "group";
+}, ctx: GroupResizeContext) => {
+    x: number;
+    y: number;
+};
+export declare const getPositionWithoutGroupRotation: (ctx: GroupResizeContext, positionInBorderX: number, positionInBorderY: number, sizeInBorderW: number, sizeInBorderH: number) => Point;

package/dist/canvas/utils/shapes/index.d.ts

@@ -1,5 +1,5 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
-import type { HoverModeData, SelectionModeData } from './../../../common/types/Mode';
+import type { HoverModeData, SelectionModeData, SelectionModeResize } from './../../../common/types/Mode';
 import type { DrawableShape, Point, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
 import type { CustomTool } from './../../../common/types/tools';
 export declare const createShape: (ctx: CanvasRenderingContext2D, shape: Exclude<CustomTool, {
@@ -7,16 +7,9 @@ export declare const createShape: (ctx: CanvasRenderingContext2D, shape: Exclude
 }>, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity | undefined;
 export declare const isInView: (shape: ShapeEntity, settings: UtilsSettings) => boolean;
 export declare const drawShape: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, settings: UtilsSettings) => void;
-export declare const rotateShape: <T extends DrawableShape>(shape: T, cursorPosition: Point, originalShape: T, originalCursorPosition: Point, shapeCenter: Point, settings: UtilsSettings, isShiftPressed: boolean) => T & {
-    computed: {
-        borders: import("./../../../common/types/Shapes").Rect;
-        outerBorders: import("./../../../common/types/Shapes").Rect;
-        center: Point;
-        boundingBox: import("./../../../common/types/Shapes").Rect;
-    } | undefined;
-};
-export declare const resizeShape: <T extends ShapeEntity>(ctx: CanvasRenderingContext2D, shape: T, cursorPosition: Point, originalShape: T, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => T;
-export declare const translateShape: (cursorPosition: Point, originalShape: ShapeEntity, originalCursorPosition: Point, settings: UtilsSettings, isShiftPressed: boolean) => ShapeEntity;
+export declare const rotateShape: <T extends ShapeEntity>(shape: T, rotationToApply: number, selectionCenter: Point) => T;
+export declare const resizeShape: <T extends ShapeEntity>(ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: T, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => T;
+export declare const resizeShapes: (ctx: CanvasRenderingContext2D, cursorPosition: Point, originalShape: SelectionType, selectionMode: SelectionModeResize<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => ShapeEntity[];
 export declare const translateShapes: (cursorPosition: Point, originalShape: SelectionType, originalCursorPosition: Point, settings: UtilsSettings, isShiftPressed: boolean) => ShapeEntity[];
 export declare const refreshShape: (shape: DrawableShape & {
     id: string;
@@ -27,13 +20,14 @@ export declare const getShapeComputedData: (shape: DrawableShape, settings: Util
     center: Point;
     boundingBox: import("./../../../common/types/Shapes").Rect;
 } | undefined;
-export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, hoverMode, withAnchors }: {
+export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, hoverMode, selectionMode, withAnchors }: {
     ctx: CanvasRenderingContext2D;
     shape: SelectionType;
     settings: UtilsSettings;
     selectionWidth: number;
     selectionColor: string;
     hoverMode: HoverModeData;
+    selectionMode: SelectionModeData<number | Point>;
     withAnchors?: boolean;
 }) => void;
 export declare const drawSelectionFrame: ({ ctx, selectionFrame, settings }: {

package/dist/canvas/utils/shapes/line.d.ts

@@ -1,7 +1,8 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity, StyleShape, Triangle } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity, StyleShape, Triangle } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
+import { type GroupResizeContext } from './group';
 export declare const getComputedLine: (line: DrawableShape<"line">, settings: UtilsSettings) => {
     borders: Rect;
     outerBorders: Rect;
@@ -18,5 +19,7 @@ export declare const createLine: (shape: {
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"line">;
 export declare const buildTriangleOnLine: (center: Point, rotation: number, lineStyle: StyleShape) => Triangle;
 export declare const drawLine: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"line">) => void;
-export declare const translateLine: (cursorPosition: Point, originalShape: ShapeEntity<"line">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"line">;
 export declare const resizeLine: (cursorPosition: Point, originalShape: ShapeEntity<"line">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"line">;
+export declare const resizeLinePolygonCurveInGroup: (shape: ShapeEntity<"line" | "polygon" | "curve">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"line" | "polygon" | "curve">;

package/dist/canvas/utils/shapes/path.d.ts

@@ -1,5 +1,5 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
-import type { Circle, DrawableShape, Line, Point, Rect, StyleShape } from './../../../common/types/Shapes';
+import type { Circle, DrawableShape, Line, Point, Rect } from './../../../common/types/Shapes';
 export declare const createRecPath: (rect: Rect) => Path2D;
 export declare const createCirclePath: (shape: Circle) => Path2D;
 export declare const createEllipsePath: (ellipse: DrawableShape<"ellipse">) => Path2D;
@@ -20,7 +20,7 @@ export declare const catmullRomToBezier: (p0: Point, p1: Point, p2: Point, p3: P
 export declare const createCurvePath: (curve: DrawableShape<"curve">) => Path2D | undefined;
 export declare const createPolygonPath: (polygon: DrawableShape<"polygon"> | DrawableShape<"curve">) => Path2D | undefined;
 export declare const createTrianglePath: (triangle: DrawableShape<"triangle">) => Path2D;
-export declare const getComputedShapeInfos: <T extends DrawableShape, U extends Pick<UtilsSettings, "selectionPadding">>(shape: T, getBorder: (shape: T, settings: U) => Rect, settings: U, getOuterBorder?: (border: Rect, style: StyleShape | undefined) => Rect) => {
+export declare const getComputedShapeInfos: <T extends DrawableShape, U extends Pick<UtilsSettings, "selectionPadding">>(shape: T, getBorder: (shape: T, settings: U) => Rect, settings: U, getOuterBorder?: (shape: T, borders: Rect, settings: U) => Rect) => {
     borders: Rect;
     outerBorders: Rect;
     center: Point;

package/dist/canvas/utils/shapes/picture.d.ts

@@ -1,6 +1,7 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
+import { type GroupResizeContext } from './group';
 export declare const getComputedPicture: (picture: DrawableShape<"picture">, settings: UtilsSettings) => {
     borders: import("./../../../common/types/Shapes").Rect;
     outerBorders: import("./../../../common/types/Shapes").Rect;
@@ -12,5 +13,7 @@ export declare const refreshPicture: <T extends DrawableShape<"picture">>(shape:
 }, settings: UtilsSettings) => ShapeEntity<"picture">;
 export declare const createPicture: (fileOrUrl: File | string, maxPictureWidth: number, maxPictureHeight: number, settings: UtilsSettings) => Promise<ShapeEntity<"picture">>;
 export declare const drawPicture: (ctx: CanvasRenderingContext2D, picture: ShapeEntity<"picture">) => void;
-export declare const translatePicture: (cursorPosition: Point, originalShape: ShapeEntity<"picture">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"picture">;
 export declare const resizePicture: (cursorPosition: Point, originalShape: ShapeEntity<"picture">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => ShapeEntity<"picture">;
+export declare const resizePictureInGroup: (shape: ShapeEntity<"picture">, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<"picture">;

package/dist/canvas/utils/shapes/polygon.d.ts

@@ -18,7 +18,6 @@ export declare const createPolygon: (shape: {
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"polygon">;
 export declare const drawPolygon: (ctx: CanvasRenderingContext2D, polygon: ShapeEntity<"polygon">) => void;
 export declare const getPolygonBorder: (polygon: Polygon, settings: Pick<UtilsSettings, "selectionPadding">) => Rect;
-export declare const translatePolygon: (cursorPosition: Point, originalShape: ShapeEntity<"polygon">, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ShapeEntity<"polygon">;
 export declare const resizePolygon: (cursorPosition: Point, originalShape: ShapeEntity<"polygon">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => ShapeEntity<"polygon">;
 export declare const addPolygonLine: (shape: ShapeEntity<"polygon">, lineIndex: number, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"polygon">;
 export declare const addPolygonPoint: (shape: ShapeEntity<"polygon">, cursorPosition: Point, settings: UtilsSettings, temporary?: boolean) => ShapeEntity<"polygon">;

package/dist/canvas/utils/shapes/rectangle.d.ts

@@ -1,7 +1,8 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
+import { type GroupResizeContext } from './group';
 type rectish = 'rect' | 'square';
 export declare const getComputedRect: (rect: DrawableShape<rectish>, settings: UtilsSettings) => {
     borders: Rect;
@@ -11,55 +12,17 @@ export declare const getComputedRect: (rect: DrawableShape<rectish>, settings: U
 };
 export declare const refreshRect: <T extends rectish>(rect: DrawableShape<T> & {
     id: string;
-}, settings: UtilsSettings, isGroup?: boolean) => ShapeEntity<T>;
+}, settings: UtilsSettings) => ShapeEntity<T>;
 export declare const createRectangle: <T extends rectish>(shape: {
     id: string;
     type: T;
     settings: ToolsSettingsType<T>;
-}, cursorPosition: Point, settings: UtilsSettings, isGroup?: boolean, width?: number, height?: number) => ShapeEntity<T>;
+}, cursorPosition: Point, settings: UtilsSettings, width?: number, height?: number) => ShapeEntity<T>;
 export declare const drawRect: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<rectish>) => void;
 export declare const getRectBorder: (rect: Rect, settings: Pick<UtilsSettings, "selectionPadding">) => Rect;
 export declare const getRectOppositeAnchorAbsolutePosition: <T extends DrawableShape & Rect>(anchor: Point, center: Point, shape: T, [negW, negH]?: [boolean, boolean]) => Point;
-export declare const translateRect: <T extends rectish>(cursorPosition: Point, originalShape: ShapeEntity<T>, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => ({
-    id: string;
-    computed: {
-        borders: Rect;
-        outerBorders: Rect;
-        center: Point;
-        boundingBox: Rect;
-    };
-} & {
-    rotation?: number;
-    toolId?: string;
-    visible?: boolean;
-    locked?: boolean;
-    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
-} & Rect & {
-    type: "rect";
-} & {
-    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
-    path?: Path2D | undefined;
-    type: "rect";
-}) | ({
-    id: string;
-    computed: {
-        borders: Rect;
-        outerBorders: Rect;
-        center: Point;
-        boundingBox: Rect;
-    };
-} & {
-    rotation?: number;
-    toolId?: string;
-    visible?: boolean;
-    locked?: boolean;
-    style?: import("./../../../common/types/Shapes").StyleShape | undefined;
-} & Rect & {
-    type: "square";
-} & {
-    selection?: import("./../../../common/types/Shapes").SelectionDefaultType | undefined;
-    path?: Path2D | undefined;
-    type: "square";
-});
 export declare const resizeRect: <T extends rectish>(cursorPosition: Point, originalShape: ShapeEntity<T>, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => ShapeEntity<T>;
+export declare const resizeRectInGroup: (shape: ShapeEntity<rectish>, group: SelectionType & {
+    type: "group";
+}, groupCtx: GroupResizeContext) => ShapeEntity<rectish>;
 export {};