@yorab/react-paint 0.13.1 → 0.15.0

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

@@ -13,6 +13,7 @@ declare const useZoom: ({ canvasSize, size, zoomEnabled, canvasElt }: UseZoomPro
     }>>;
     setCanvasOffset: (newOffset: Point) => void;
     setCanvasZoom: (action: "unzoom" | "zoom" | "default") => void;
+    resetZoom: () => void;
     canvasTransformation: {
         offset: Point;
         zoom: number;

package/dist/canvas/index.d.ts

@@ -6,9 +6,9 @@ type AppProps = {
     className?: string;
     style?: CSSProperties;
     options?: {
-        canvasBackgroundColor?: string;
-        canvasSelectionColor?: string;
-        canvasSelectionWidth?: number;
+        canvasBackgroundColor?: string | undefined;
+        canvasSelectionColor?: string | undefined;
+        canvasSelectionWidth?: number | undefined;
     };
 };
 declare const App: ({ options, className, style, canvasProps }: AppProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -8,5 +8,7 @@ export declare const updateCanvasContext: (ctx: CanvasRenderingContext2D, style?
     lineWidth?: number;
     lineDash?: number;
     lineCap?: CanvasLineCap;
+    shadowColor?: string;
+    shadowBlur?: number;
 }) => void;
 export declare const transformCanvas: (ctx: CanvasRenderingContext2D, settings: UtilsSettings, rotation?: number, translation?: Point) => void;

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

@@ -1,5 +1,5 @@
 import type { UtilsSettings } from './../../canvas/constants/app';
 import type { DrawableShape, ShapeEntity, StateData } from './../../common/types/Shapes';
-export declare const cleanShapesBeforeExport: (shapes: DrawableShape[]) => DrawableShape[];
-export declare const buildDataToExport: (shapes: DrawableShape[], width: number, height: number) => StateData;
+export declare const cleanShapesBeforeExport: (shapes: ShapeEntity[]) => DrawableShape[];
+export declare const buildDataToExport: (shapes: ShapeEntity[], width: number, height: number) => StateData;
 export declare const addDefaultAndTempShapeProps: (shape: DrawableShape, settings: UtilsSettings) => ShapeEntity;

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

@@ -1,5 +1,5 @@
 import type { UtilsSettings } from './../../canvas/constants/app';
-import type { DrawableShape, ExportedDrawableShape, ShapeEntity } from './../../common/types/Shapes';
+import type { DrawableShape, ExportedDrawableShape, Point, ShapeEntity } from './../../common/types/Shapes';
 export declare const addSizeAndConvertSvgToObjectUrl: (svgFileContent: string) => string;
 export declare const isSvg: (fileOrUrl: File | string) => boolean;
 export declare const fetchAndStringify: (url: string) => Promise<string>;
@@ -7,10 +7,239 @@ export declare const downloadFile: (content: string, fileName: string) => void;
 export declare const getBase64Image: (img: HTMLImageElement) => string;
 export declare const getStringifiedImage: (shape: DrawableShape<"picture">) => string;
 export declare const getCanvasImage: ({ shapes, settings, view }: {
-    shapes: DrawableShape[];
+    shapes: ShapeEntity[];
     settings: UtilsSettings;
     view: "fitToShapes" | "defaultView" | "currentZoom";
 }) => string;
-export declare const encodeShapesInString: (shapes: DrawableShape[], width: number, height: number) => string;
+export declare const encodeShapesInString: (shapes: ShapeEntity[], width: number, height: number) => string;
 export declare const decodeJson: (file: File) => Promise<unknown>;
-export declare const decodeImportedData: (shapesForJson: ExportedDrawableShape[], settings: UtilsSettings) => Promise<ShapeEntity[]>;
+export declare const decodeImportedData: (shapesForJson: ExportedDrawableShape[], settings: UtilsSettings) => Promise<(({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Line & {
+    type: "line";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionLinesType | undefined;
+    path?: Path2D | undefined;
+    arrows?: import("./../../common/types/Shapes").TriangleEntity[];
+    type: "line";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Rect & {
+    src: string;
+} & {
+    img: HTMLImageElement;
+    type: "picture";
+} & {
+    img: HTMLImageElement;
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    type: "picture";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Rect & {
+    value: string[];
+    fontSize: number;
+} & {
+    type: "text";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    type: "text";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Rect & {
+    type: "rect";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "rect";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Rect & {
+    type: "square";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "square";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Circle & {
+    type: "circle";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "circle";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Ellipse & {
+    type: "ellipse";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "ellipse";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Polygon & {
+    type: "polygon";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionLinesType | undefined;
+    path?: Path2D | undefined;
+    type: "polygon";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Curve & {
+    type: "curve";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionLinesType | undefined;
+    path?: Path2D | undefined;
+    type: "curve";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Brush & {
+    type: "brush";
+    scaleX?: number;
+    scaleY?: number;
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "brush";
+}) | ({
+    id: string;
+    computed: {
+        borders: import("./../../common/types/Shapes").Rect;
+        outerBorders: import("./../../common/types/Shapes").Rect;
+        center: Point;
+        boundingBox: import("./../../common/types/Shapes").Rect;
+    };
+} & {
+    rotation?: number;
+    toolId?: string;
+    visible?: boolean;
+    locked?: boolean;
+    style?: import("./../../common/types/Shapes").StyleShape | undefined;
+} & import("./../../common/types/Shapes").Rect & {
+    shapes: ShapeEntity[];
+    type: "group";
+} & {
+    selection?: import("./../../common/types/Shapes").SelectionDefaultType | undefined;
+    path?: Path2D | undefined;
+    type: "group";
+}))[]>;

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

@@ -1,7 +1,7 @@
 import type { UtilsSettings } from './../../canvas/constants/app';
 import type { CanvasSize } from './../../common/types/Canvas';
 import type { HoverModeData } from './../../common/types/Mode';
-import type { DrawableShape, Point, Rect } from './../../common/types/Shapes';
+import type { Point, Rect, SelectionType, ShapeEntity } from './../../common/types/Shapes';
 export declare const getCursorPosition: (e: MouseEvent | TouchEvent) => {
     clientX: number;
     clientY: number;
@@ -11,13 +11,13 @@ export declare const getCursorPositionInTransformedCanvas: (e: MouseEvent | Touc
 export declare const isTouchGesture: (e: MouseEvent | TouchEvent) => e is TouchEvent;
 export declare const getPointPositionAfterCanvasTransformation: (point: Point, shapeRotation: number, [originX, originY]: Point) => Point;
 export declare const getPointPositionBeforeCanvasTransformation: (point: Point, shapeRotation: number, [originX, originY]: Point) => Point;
-export declare const checkSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: DrawableShape, position: Point, settings: UtilsSettings, checkAnchors?: boolean, radius?: number) => false | HoverModeData;
-export declare const checkPolygonLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: DrawableShape<"polygon" | "curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
+export declare const checkSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: SelectionType, position: Point, settings: UtilsSettings, checkAnchors?: boolean, radius?: number) => false | HoverModeData;
+export declare const checkPolygonLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"polygon" | "curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
     lineIndex: number;
 };
-export declare const checkCurveLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: DrawableShape<"curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
+export declare const checkCurveLinesSelectionIntersection: (ctx: CanvasRenderingContext2D, shape: ShapeEntity<"curve">, position: Point, settings: UtilsSettings, radius?: number) => false | {
     lineIndex: number;
 };
-export declare const checkPositionIntersection: (ctx: CanvasRenderingContext2D, shape: DrawableShape, position: Point, settings: UtilsSettings) => false | HoverModeData;
+export declare const checkPositionIntersection: (ctx: CanvasRenderingContext2D, shape: SelectionType, position: Point, settings: UtilsSettings) => false | HoverModeData;
 export declare function getRectIntersection(rect1: Rect, rect2: Rect): Rect | undefined;
-export declare const checkSelectionFrameCollision: (ctx: CanvasRenderingContext2D, shape: DrawableShape, selectionFrame: [Point, Point], settings: UtilsSettings) => boolean;
+export declare const checkSelectionFrameCollision: (ctx: CanvasRenderingContext2D, shape: ShapeEntity, selectionFrame: [Point, Point], settings: UtilsSettings) => boolean;

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

@@ -0,0 +1,3 @@
+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;

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

@@ -1,13 +1,19 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
-import type { DrawableShape, Point, SelectionLinesType } from './../../../common/types/Shapes';
+import type { HoverModeData } from './../../../common/types/Mode';
+import type { DrawableShape, Point, Rect, SelectionLinesType, ShapeEntity } from './../../../common/types/Shapes';
 export declare const createLineSelectionPath: (path: Path2D | undefined, shape: DrawableShape<"line" | "polygon" | "curve"> & {
     points: readonly Point[];
+}, computed: {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
 }, settings: UtilsSettings) => SelectionLinesType;
-export declare const drawLineSelection: ({ ctx, shape, withAnchors, selectionWidth, selectionColor, settings }: {
+export declare const drawLineSelection: ({ ctx, shape, withAnchors, selectionWidth, selectionColor, hoverMode, settings }: {
     ctx: CanvasRenderingContext2D;
-    shape: DrawableShape<"line"> | DrawableShape<"polygon"> | DrawableShape<"curve">;
+    shape: ShapeEntity<"line"> | ShapeEntity<"polygon"> | ShapeEntity<"curve">;
     withAnchors: boolean;
     selectionWidth: number;
     selectionColor: string;
+    hoverMode: HoverModeData;
     settings: UtilsSettings;
 }) => void;

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

@@ -1,11 +1,16 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Point, SelectionDefaultType } from './../../../common/types/Shapes';
-export declare const createRecSelectionPath: (path: Path2D | undefined, rect: DrawableShape, settings: UtilsSettings) => SelectionDefaultType;
-export declare const drawSelectionRect: (ctx: CanvasRenderingContext2D, shape: DrawableShape & {
-    selection?: SelectionDefaultType;
+import type { Point, Rect, SelectionDefaultType, SelectionType, ShapeEntity } from './../../../common/types/Shapes';
+export declare const createRecSelectionPath: (path: Path2D | undefined, computed: {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+}, settings: UtilsSettings, isGroup?: boolean) => 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;
 }, selectionColor: string, selectionWidth: number, settings: UtilsSettings, withAnchors: boolean) => void;
-export declare const resizeRectSelection: (cursorPosition: Point, originalShape: DrawableShape, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => {
+export declare const resizeRectSelection: (cursorPosition: Point, originalShape: ShapeEntity, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => {
     borderX: number;
     borderHeight: number;
     borderY: number;

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

@@ -1,8 +1,15 @@
 import type { UtilsSettings } from './../../canvas/constants/app';
 import type { HoverModeData, SelectionModeData } from './../../common/types/Mode';
-import type { Point, ShapeEntity } from './../../common/types/Shapes';
-export declare const getNewSelectionData: (hoverMode: HoverModeData, selectedShape: ShapeEntity, cursorPosition: Point, settings: UtilsSettings) => SelectionModeData<Point | number> | undefined;
-export declare const selectShape: (ctx: CanvasRenderingContext2D, shapes: ShapeEntity[], cursorPosition: Point, settings: UtilsSettings, selectedShape: ShapeEntity | undefined, isTouchGesture: boolean, withFrameSelection: boolean) => {
+import type { Point, SelectionType, ShapeEntity } from './../../common/types/Shapes';
+import type { CustomTool } from './../../common/types/tools';
+export declare const getNewSelectionData: (hoverMode: HoverModeData, selectedShape: SelectionType, cursorPosition: Point) => SelectionModeData<Point | number> | undefined;
+export declare const selectShape: (ctx: CanvasRenderingContext2D, shapes: ShapeEntity[], cursorPosition: Point, settings: UtilsSettings, selectedShape: SelectionType | undefined, isTouchGesture: boolean, withFrameSelection: boolean, isGroupMode: boolean) => {
     mode: SelectionModeData<Point | number>;
-    shape: ShapeEntity | undefined;
+    shape: SelectionType | undefined;
 };
+export declare const buildShapesGroup: (shapes: ShapeEntity[], settings: UtilsSettings) => SelectionType | undefined;
+export declare const applyToSelectedShape: (applyToShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity, settings: UtilsSettings) => (selection: SelectionType | undefined) => SelectionType | undefined;
+export declare const getSelectedShapes: (selection: SelectionType | undefined) => ShapeEntity[];
+export declare const addToSelectedShapes: (selection: SelectionType | undefined, shapes: ShapeEntity[]) => ShapeEntity[];
+export declare const omitFromSelectedShapes: (selection: SelectionType | undefined, shape: ShapeEntity) => ShapeEntity[];
+export declare const getSelectedShapesTools: (selection: SelectionType | undefined, availableTools: CustomTool[]) => CustomTool | undefined;

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

@@ -2,19 +2,22 @@ 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 { ToolsSettingsType } from './../../../common/types/tools';
-export declare const refreshBrush: <T extends DrawableShape<"brush">>(brush: T, settings: UtilsSettings) => T;
+export declare const getComputedBrush: (brush: DrawableShape<"brush">, settings: UtilsSettings) => {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+    boundingBox: Rect;
+};
+export declare const refreshBrush: <T extends DrawableShape<"brush">>(brush: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"brush">;
 export declare const createBrush: (shape: {
     id: string;
     type: "brush";
     settings: ToolsSettingsType<"brush">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"brush">;
-export declare const drawBrush: (ctx: CanvasRenderingContext2D, shape: DrawableShape<"brush">) => void;
-export declare const getBrushBorder: (brush: DrawableShape<"brush">, { selectionPadding }: UtilsSettings) => Rect;
-export declare const translateBrush: <U extends DrawableShape<"brush">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => U & {
-    points: Point[][];
-};
-export declare const resizeBrush: (cursorPosition: Point, originalShape: DrawableShape<"brush">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio: boolean, resizeFromCenter: boolean) => DrawableShape<"brush">;
-export declare const addNewPointToShape: <T extends DrawableShape<"brush">>(shape: T, cursorPosition: Point, settings: UtilsSettings) => T & {
-    points: Point[][];
-};
-export declare const addNewPointGroupToShape: <T extends DrawableShape<"brush">>(shape: T, cursorPosition: Point, settings: UtilsSettings) => T;
+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 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,17 +1,21 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { Circle, DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
-export declare const refreshCircle: <T extends DrawableShape<"circle">>(shape: T, settings: UtilsSettings) => T;
+export declare const getComputedCircle: (circle: DrawableShape<"circle">, settings: UtilsSettings) => {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+    boundingBox: Rect;
+};
+export declare const refreshCircle: <T extends DrawableShape<"circle">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"circle">;
 export declare const createCircle: (shape: {
     id: string;
     type: "circle";
     settings: ToolsSettingsType<"circle">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"circle">;
-export declare const drawCircle: (ctx: CanvasRenderingContext2D, circle: DrawableShape<"circle">) => void;
-export declare const getCircleBorder: (circle: Circle, settings: UtilsSettings) => Rect;
-export declare const translateCircle: <U extends DrawableShape<"circle">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => U & {
-    x: number;
-    y: number;
-};
-export declare const resizeCircle: (cursorPosition: Point, originalShape: DrawableShape<"circle">, selectionMode: SelectionModeResize, settings: UtilsSettings, resizeFromCenter: boolean) => DrawableShape<"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">;

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

@@ -1,18 +1,23 @@
 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, Rect, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
-export declare const refreshCurve: <T extends DrawableShape<"curve">>(shape: T, settings: UtilsSettings) => T;
+export declare const getComputedCurve: (curve: DrawableShape<"curve">, settings: UtilsSettings) => {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+    boundingBox: Rect;
+};
+export declare const refreshCurve: <T extends DrawableShape<"curve">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"curve">;
 export declare const createCurve: (shape: {
     id: string;
     type: "curve";
     settings: ToolsSettingsType<"curve">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"curve">;
-export declare const resizeCurve: (cursorPosition: Point, originalShape: DrawableShape<"curve">, selectionMode: SelectionModeResize<number>, settings: UtilsSettings) => DrawableShape<"curve">;
-export declare const drawCurve: (ctx: CanvasRenderingContext2D, curve: DrawableShape<"curve">) => void;
-export declare const getCurveBorder: (polygon: import("./../../../common/types/Shapes").Polygon, settings: UtilsSettings) => import("./../../../common/types/Shapes").Rect;
-export declare const translateCurve: <U extends DrawableShape<"curve">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => U & {
-    points: [number, number][];
-};
-export declare const addCurveLine: <T extends DrawableShape<"curve">>(shape: T, lineIndex: number, cursorPosition: Point, settings: UtilsSettings) => T;
-export declare const addCurvePoint: <T extends DrawableShape<"curve">>(shape: T, cursorPosition: Point, settings: UtilsSettings, temporary?: boolean) => T;
+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,17 +1,21 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
 import type { SelectionModeResize } from './../../../common/types/Mode';
-import type { DrawableShape, Ellipse, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
 import type { ToolsSettingsType } from './../../../common/types/tools';
-export declare const refreshEllipse: <T extends DrawableShape<"ellipse">>(shape: T, settings: UtilsSettings) => T;
+export declare const getComputedEllipse: (ellipse: DrawableShape<"ellipse">, settings: UtilsSettings) => {
+    borders: Rect;
+    outerBorders: Rect;
+    center: Point;
+    boundingBox: Rect;
+};
+export declare const refreshEllipse: <T extends DrawableShape<"ellipse">>(shape: T & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity<"ellipse">;
 export declare const createEllipse: (shape: {
     id: string;
     type: "ellipse";
     settings: ToolsSettingsType<"ellipse">;
 }, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity<"ellipse">;
-export declare const drawEllipse: (ctx: CanvasRenderingContext2D, ellipse: DrawableShape<"ellipse">) => void;
-export declare const getEllipseBorder: (ellipse: Ellipse, settings: UtilsSettings) => Rect;
-export declare const translateEllipse: <U extends DrawableShape<"ellipse">>(cursorPosition: Point, originalShape: U, originalCursorPosition: Point, settings: UtilsSettings, singleAxis: boolean) => U & {
-    x: number;
-    y: number;
-};
-export declare const resizeEllipse: (cursorPosition: Point, originalShape: DrawableShape<"ellipse">, selectionMode: SelectionModeResize, settings: UtilsSettings, keepRatio?: boolean, resizeFromCenter?: boolean) => DrawableShape<"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">;

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

@@ -1,33 +1,47 @@
 import type { UtilsSettings } from './../../../canvas/constants/app';
-import type { SelectionModeData } from './../../../common/types/Mode';
-import type { DrawableShape, Point, Rect, ShapeEntity } from './../../../common/types/Shapes';
+import type { HoverModeData, SelectionModeData } 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, {
     type: "picture";
-}>, cursorPosition: Point, settings: UtilsSettings) => ShapeEntity;
-export declare const drawShape: (ctx: CanvasRenderingContext2D, shape: DrawableShape, settings: UtilsSettings) => void;
-export declare const getShapeInfos: (shape: DrawableShape, settings: UtilsSettings) => {
-    borders: Rect;
-    outerBorders: Rect;
-    center: Point;
-};
+}>, 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 & {
-    rotation: number;
+    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 DrawableShape>(ctx: CanvasRenderingContext2D, shape: T, cursorPosition: Point, originalShape: T, selectionMode: SelectionModeData<Point | number>, settings: UtilsSettings, isShiftPressed: boolean, isAltPressed: boolean) => T;
+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 refreshShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity;
-export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, withAnchors }: {
+export declare const translateShapes: (cursorPosition: Point, originalShape: SelectionType, originalCursorPosition: Point, settings: UtilsSettings, isShiftPressed: boolean) => ShapeEntity[];
+export declare const refreshShape: (shape: DrawableShape & {
+    id: string;
+}, settings: UtilsSettings) => ShapeEntity;
+export declare const getShapeComputedData: (shape: DrawableShape, settings: UtilsSettings) => {
+    borders: import("./../../../common/types/Shapes").Rect;
+    outerBorders: import("./../../../common/types/Shapes").Rect;
+    center: Point;
+    boundingBox: import("./../../../common/types/Shapes").Rect;
+} | undefined;
+export declare const drawShapeSelection: ({ ctx, shape, settings, selectionWidth, selectionColor, hoverMode, withAnchors }: {
     ctx: CanvasRenderingContext2D;
-    shape: DrawableShape;
+    shape: SelectionType;
     settings: UtilsSettings;
     selectionWidth: number;
     selectionColor: string;
+    hoverMode: HoverModeData;
     withAnchors?: boolean;
 }) => void;
 export declare const drawSelectionFrame: ({ ctx, selectionFrame, settings }: {
     ctx: CanvasRenderingContext2D;
-    selectionFrame: [Point, Point];
+    selectionFrame: {
+        oldSelection: SelectionType | undefined;
+        frame: [Point, Point];
+    };
     settings: UtilsSettings;
 }) => void;
-export declare const copyShape: (shape: ShapeEntity, settings: UtilsSettings) => ShapeEntity;
+export declare const copyShapes: (groupShape: SelectionType, settings: UtilsSettings) => ShapeEntity[];